From 627c269baa377218cc2d772d7ea0e2a2daffe5f6 Mon Sep 17 00:00:00 2001
From: Damiano <mcdamiano93@virgilio.it>
Date: Thu, 16 Apr 2020 15:18:43 +0200
Subject: [PATCH] fix modal"estrazione"

---
 .../assets/styles/base/estrazione.less        | 54 +++++--------------
 Thermo.Active/wwwroot/assets/styles/style.css | 45 ++--------------
 Thermo.Active/wwwroot/config.development.json |  2 +-
 .../base-components/estrazione-principale.vue | 37 ++++++-------
 .../components/show-estrazione-info.ts        | 13 +----
 .../components/show-estrazione-info.vue       | 46 ++++++----------
 6 files changed, 53 insertions(+), 144 deletions(-)

diff --git a/Thermo.Active/wwwroot/assets/styles/base/estrazione.less b/Thermo.Active/wwwroot/assets/styles/base/estrazione.less
index af509802..b869d1b1 100644
--- a/Thermo.Active/wwwroot/assets/styles/base/estrazione.less
+++ b/Thermo.Active/wwwroot/assets/styles/base/estrazione.less
@@ -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;
+
+} 
+
+
+
+
+
 }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/assets/styles/style.css b/Thermo.Active/wwwroot/assets/styles/style.css
index 8d04901d..d0657853 100644
--- a/Thermo.Active/wwwroot/assets/styles/style.css
+++ b/Thermo.Active/wwwroot/assets/styles/style.css
@@ -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;
diff --git a/Thermo.Active/wwwroot/config.development.json b/Thermo.Active/wwwroot/config.development.json
index d7aee5c1..d47c9870 100644
--- a/Thermo.Active/wwwroot/config.development.json
+++ b/Thermo.Active/wwwroot/config.development.json
@@ -2,6 +2,6 @@
   "env": "development",
   "api": {
     "enabled": true,
-    "apiServerUrl": "http://seriate.steamware.net:9000"
+    "apiServerUrl": "http://localhost:9000"
   }
 }
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/base-components/estrazione-principale.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/base-components/estrazione-principale.vue
index 4c34283e..c864c6d5 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/base-components/estrazione-principale.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/base-components/estrazione-principale.vue
@@ -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>
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/show-estrazione-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/show-estrazione-info.ts
index 826500bf..4626fe0b 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/show-estrazione-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/show-estrazione-info.ts
@@ -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();
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/show-estrazione-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/show-estrazione-info.vue
index fe20e161..c70b9b0c 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/show-estrazione-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/estrazione/components/show-estrazione-info.vue
@@ -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>