fix modal"estrazione"

This commit is contained in:
Damiano
2020-04-16 15:18:43 +02:00
parent b868b5251c
commit 627c269baa
6 changed files with 53 additions and 144 deletions
@@ -5,48 +5,18 @@
@modal: modal;
.@{modal}.estrazione-info {
margin-top: 100px;
width: 1370px;
width: 1820px;
height: 785px;
header {
background-color: @color-white;
color: @color-darkish-blue;
font-weight: 600;
font-size: 24px;
text-align: left;
padding: 0px 23px;
}
.sep{
height: 606px;
}
.divSx{
margin-left: 20px;
}
.scosdiv{
margin-top: 20px;
margin-bottom: 20px;
}
.specific {
justify-content: flex-end;
.box{
background-color: #e5f3ff;
}
.EP{
width: 287px;
}
.EstrP{
width: 287px;
height: 65px;
}
.ES{
width: 294px;
}
.EstrS{
width: 294px;
height: 65px;
}
.schedaE{
border: solid #30916b;
background-color: #b2e6d2;
}
.divEstr{
margin-top: 20px;
display: flex;
}
}
+5 -40
View File
@@ -4663,49 +4663,14 @@ img {
background-image: linear-gradient(to bottom, #1756ad, #002680);
}
.modal.estrazione-info {
margin-top: 100px;
width: 1370px;
width: 1820px;
height: 785px;
}
.modal.estrazione-info header {
background-color: #fff;
color: #002680;
font-weight: 600;
font-size: 24px;
text-align: left;
padding: 0px 23px;
.modal.estrazione-info .specific {
justify-content: flex-end;
}
.modal.estrazione-info .sep {
height: 606px;
}
.modal.estrazione-info .divSx {
margin-left: 20px;
}
.modal.estrazione-info .scosdiv {
margin-top: 20px;
margin-bottom: 20px;
}
.EP {
width: 287px;
}
.EstrP {
width: 287px;
height: 65px;
}
.ES {
width: 294px;
}
.EstrS {
width: 294px;
height: 65px;
}
.schedaE {
border: solid #30916b;
background-color: #b2e6d2;
}
.divEstr {
margin-top: 20px;
display: flex;
.modal.estrazione-info .specific .box {
background-color: #e5f3ff;
}
.popup {
width: 288px;
@@ -2,6 +2,6 @@
"env": "development",
"api": {
"enabled": true,
"apiServerUrl": "http://seriate.steamware.net:9000"
"apiServerUrl": "http://localhost:9000"
}
}
@@ -1,27 +1,28 @@
<template>
<div class="divEstr">
<div class="divSx">
<div class="datiP">
<div class="ritardo">
<img class="clessidra" src="assets/icons/png/clessidra.png"><label class="Ritardo">Ritardo</label>
</div>
<section>
<aside class ="scrollable">
<div class="input-area">
<img src="assets/icons/png/clessidra.png">
<label>Ritardo</label>
<div class="rect">
<label class="mock">{{mockR}}s</label>
{{mockR}}s
</div>
</div>
<slider :min="0" :max="10" v-model="mockR" :left="'0s'" :middle="'5s'" :right="'10s'"></slider>
<div class="datiP scosdiv">
<label class="lab">Tipo</label>
<select class="selTipi">
<option class="opzione" value="Normale">Normale</option>
<option class="opzione" value="Senza cornice">Senza cornice</option>
<option class="opzione" value="Assistita">Assistita</option>
<slider :min="0" :max="10" v-model="mockR" unit-of-measure="s"></slider>
<div class="input-area">
<label>Tipo</label>
<select>
<option value="Normale">Normale</option>
<option value="Senza cornice">Senza cornice</option>
<option value="Assistita">Assistita</option>
</select>
</div>
<scheda class="schedaE"></scheda>
</div>
<div class="sep"></div>
</div>
</aside>
<div class="specific">
<scheda></scheda>
</div>
</section>
</template>
<script lang="ts" src="./estrazione-principale.ts"></script>
@@ -9,18 +9,7 @@ import EstrazionePrincipale from "./base-components/estrazione-principale.vue";
@Component({components: { modal: Modal,stepfooter:StepFooter,estrprincipale:EstrazionePrincipale}})
export default class ShowEstrazioneInfo extends Vue{
activeEP:boolean=true;
activeES:boolean=false;
ActiveEP(){
this.activeEP=true;
this.activeES=false;
};
ActiveES(){
this.activeEP=false;
this.activeES=true;
};
show:string="principale";
annulla(){
ModalHelper.HideModal();
@@ -1,39 +1,23 @@
<template>
<section>
<div class="speficic">
<div class="setup">
<modal type="estrazione-info">
<div class="schede" slot="header-buttons">
<div class="selectorbtn">
<div class="selector EP" v-if="activeEP"></div>
<button class :class="{'active': show =='activeEP'}" @click="ActiveEP()"></button>
<label>Estrazione principale</label>
</div>
<div class="selectorbtn">
<div class="selector ES" v-if="activeES"></div>
<!--da chiedere-->
<button :class="{'active': show=='activeES'}" @click="ActiveES()"></button>
<label>Estrazione secondaria</label>
</div>
</div>
<div class="divheader HE" slot="header-buttons">
<button class="modal-close" @click="close()">
<!--da chiedere-->
<i class="fa fa-remove"></i>
</button>
</div>
<estrprincipale v-if="activeEP"></estrprincipale>
<footer class="divFooter">
<button class="annulla confirm" @click="annulla()">
<label class="Annulla">Annulla</label>
</button>
<button class="conferma confirm" @click="conferma()">
<label class="Conferma">Conferma</label>
</button>
</footer>
<div class="tab-header" slot="header-buttons">
<button :class="{'active':show == 'principale'}" @click="show='principale'">Estrazione principale</button>
<button :class="{'active':show == 'secondaria'}" @click="show='secondaria'">Estrazione secondaria</button>
</div>
<div slot="header-buttons">
<button class="modal-close" @click="close()">
<i class="fa fa-remove"></i>
</button>
</div>
<estrprincipale v-if="show=='principale'"></estrprincipale>
<footer>
<button class="btn" @click="annulla()">Annulla</button>
<button class="btn btn-success" @click="conferma()">Conferma</button>
</footer>
</modal>
<stepfooter class="Step"></stepfooter>
</div>
</section>
</template>
<script lang="ts" src="./show-estrazione-info.ts"></script>