From bfd963f8d723cf3fd4c29bf0eb5d2e2941d45389 Mon Sep 17 00:00:00 2001
From: Alessio <alessiogiombetti@live.it>
Date: Mon, 4 May 2020 16:18:33 +0200
Subject: [PATCH] fix paddle

---
 .../wwwroot/assets/styles/base/paddle.less    | 238 ++++++++-------
 Thermo.Active/wwwroot/assets/styles/style.css | 286 ++++++++----------
 Thermo.Active/wwwroot/src/App.vue             |   9 +-
 .../components/paddle/sidebar.vue             |   2 +-
 .../components/paddle/switch-button.vue       |  14 +-
 .../app_modules_thermo/components/scheda.ts   |   9 +
 .../app_modules_thermo/components/scheda.vue  |   4 +-
 .../base-components/aria-controstampo.vue     |  12 +
 .../setup/imbutitura/show-imbutitura-info.vue |   4 +
 9 files changed, 286 insertions(+), 292 deletions(-)

diff --git a/Thermo.Active/wwwroot/assets/styles/base/paddle.less b/Thermo.Active/wwwroot/assets/styles/base/paddle.less
index 2499730e..d96d7bfd 100644
--- a/Thermo.Active/wwwroot/assets/styles/base/paddle.less
+++ b/Thermo.Active/wwwroot/assets/styles/base/paddle.less
@@ -6,88 +6,81 @@
 html {
     height: 100%;
     overflow:hidden;
-  }
+}
  
   body {
     border: 0; margin: 0; padding: 0;
     height: 100%;
   }
  
+    .hidden {
+        visibility: hidden;
+    }
  
-  .main-nav {
+  nav {
     position: absolute;
     top: 50%;
     right: 0;
-  }
+
+    .active button{
+        transform: translate(-761px, 0px);
+    }
+
+    div{
+
+        button {
+            position: relative;
+            height: 30px;
+            width: 32px;
+            display: block;
+            z-index: 9999;
+            border: 0;
+            border-radius: 0;
+            pointer-events: all;
+            background: #dddddd;
+            border-bottom-left-radius: 90px;
+            border-top-left-radius: 90px;
+            height: 90px;
+            width: 45px;
+
+            div{
+                display: grid;
+                grid-template-columns: repeat(2, 1fr);
+                grid-template-rows: 1fr 1fr;
+                align-items: center;
+                justify-items: center;
+                padding: 5px;
+
+                
+                div {
+                    width: 10px;
+                    height: 10px;
+                    border-radius: 10px;
+                    margin: 3px;
+                    background: #002680;
+
+                }
+
+            }
+
+        }
+
+    }
+}
+
  
+//   .slide-enter-active,
+//     .slide-leave-active
+//     {
+//         transition: left,right 0s ease-in-out;
+//     }
 
-    .text-head-sidebar{
-        margin: 10px auto;
-        font-size: 24px;
-        font-weight: 500;
-        font-stretch: normal;
-        font-style: normal;
-        line-height: normal;
-        letter-spacing: normal;
-        text-align: center;
-        color: #002680;
-    }
+//     .slide-enter,
+//     .slide-leave-to {
+//         transition: right,left 0s ease-in-out
+//     }
 
-    .text-box-paddle{
-        display: flex;
-        width: 268px;
-        height: 78px;
-        font-family: WorkSans;
-        font-size: 18px;
-        font-weight: 500;
-        font-stretch: normal;
-        font-style: normal;
-        line-height: normal;
-        letter-spacing: normal;
-        color: #ffffff;
-        margin: 10px;
-    
-
-        label{
-            width: 117px;
-            margin: 10px;
-        }
-
-    }
-
-    .text-box-paddle.text-soft{
-        label{
-                width: 100%;
-                align-self: center;
-        }
-    }
-
-    .box-sidebar-panel{
-        display: grid;
-        grid-template-columns: repeat(2, 1fr);
-        align-items: center;
-        justify-items: center;
-    }
-
-    .sidebar-panel-nav{
-        width: 286px;
-        height: 100px;
-        border-radius: 2px;
-        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
-        background-color: #808e96;
-        margin: 10px 30px;
-    }
-
-  .slide-enter-active,
-    .slide-leave-active
-    {
-        transition: left,right 0s ease-in-out;
-    }
-
-    .slide-enter,
-    .slide-leave-to {
-        transition: right,left 0s ease-in-out
-    }
+.sidebar{
 
     .sidebar-backdrop {
         width: 100vw;
@@ -112,58 +105,73 @@ html {
         border-radius: 4px;
         box-shadow: 2px 10px 15px 0 rgba(0, 0, 0, 0.5);
         background-color: #dddddd;
-    }
 
-    .hidden {
-        visibility: hidden;
-    }
+        .text-head-sidebar{
+            margin: 10px auto;
+            font-size: 24px;
+            font-weight: 500;
+            font-stretch: normal;
+            font-style: normal;
+            line-height: normal;
+            letter-spacing: normal;
+            text-align: center;
+            color: #002680;
+        }
 
-    button {
-        cursor: pointer;
-    }
+        .box-sidebar-panel{
+            display: grid;
+            grid-template-columns: repeat(2, 1fr);
+            align-items: center;
+            justify-items: center;
 
-    .switch-button {
-        position: relative;
-        height: 30px;
-        width: 32px;
-        display: block;
-        z-index: 9999;
-        border: 0;
-        border-radius: 0;
-        pointer-events: all;
-        background: #dddddd;
-        border-bottom-left-radius: 90px;
-        border-top-left-radius: 90px;
-        height: 90px;
-        width: 45px;
-    }
+            .sidebar-panel-nav{
+                width: 286px;
+                height: 100px;
+                border-radius: 2px;
+                box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
+                background-color: #808e96;
+                margin: 10px 30px;
 
-    .circle-button {
-        width: 10px;
-        height: 10px;
-        border-radius: 10px;
-        margin: 3px;
-        background: #002680;
+                .text-box-paddle{
+                    display: flex;
+                    width: 268px;
+                    height: 78px;
+                    font-family: WorkSans;
+                    font-size: 18px;
+                    font-weight: 500;
+                    font-stretch: normal;
+                    font-style: normal;
+                    line-height: normal;
+                    letter-spacing: normal;
+                    color: #ffffff;
+                    margin: 10px;
+            
+                    i{
+                        text-align: end;
+                        width: 50px;
+                        color: #bbbcbc;
+                    }
+            
+                    label{
+                        width: 117px;
+                        margin: 10px;
+                    }
+            
+                }
+            
+                .text-box-paddle.text-soft{
+                    label{
+                        width: 100%;
+                        align-self: center;
+                    }
+                }
+
+            }
+
+        }
 
     }
 
-
-    .switch-paddle.active .switch-button {
-        transform: translate(-761px, 0px);
-    }
+}
 
 
-    .box-circle-paddle{
-        display: grid;
-        grid-template-columns: repeat(2, 1fr);
-        grid-template-rows: 1fr 1fr;
-        align-items: center;
-        justify-items: center;
-        padding: 5px;
-    }
-
-    .gear-box-paddle{
-        text-align: end;
-        width: 50px;
-        color: #bbbcbc;
-    }
diff --git a/Thermo.Active/wwwroot/assets/styles/style.css b/Thermo.Active/wwwroot/assets/styles/style.css
index c9931dc4..8873845a 100644
--- a/Thermo.Active/wwwroot/assets/styles/style.css
+++ b/Thermo.Active/wwwroot/assets/styles/style.css
@@ -4444,166 +4444,6 @@
   grid-column: 0.8;
   grid-row: 0.5;
 }
-
-html {
-  height: 100%;
-  overflow: hidden;
-}
-body {
-  border: 0;
-  margin: 0;
-  padding: 0;
-  height: 100%;
-}
-.main-nav {
-  position: absolute;
-  top: 50%;
-  right: 0;
-}
-.text-head-sidebar {
-  margin: 10px auto;
-  font-size: 24px;
-  font-weight: 500;
-  font-stretch: normal;
-  font-style: normal;
-  line-height: normal;
-  letter-spacing: normal;
-  text-align: center;
-  color: #002680;
-}
-.text-box-paddle {
-  display: flex;
-  width: 268px;
-  height: 78px;
-  font-family: WorkSans;
-  font-size: 18px;
-  font-weight: 500;
-  font-stretch: normal;
-  font-style: normal;
-  line-height: normal;
-  letter-spacing: normal;
-  color: #ffffff;
-  margin: 10px;
-}
-.text-box-paddle label {
-  width: 117px;
-  margin: 10px;
-}
-.text-box-paddle.text-soft label {
-  width: 100%;
-  align-self: center;
-}
-.box-sidebar-panel {
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  align-items: center;
-  justify-items: center;
-}
-.sidebar-panel-nav {
-  width: 286px;
-  height: 100px;
-  border-radius: 2px;
-  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
-  background-color: #808e96;
-  margin: 10px 30px;
-}
-.slide-enter-active,
-.slide-leave-active {
-  transition: left, right 0s ease-in-out;
-}
-.slide-enter,
-.slide-leave-to {
-  transition: right, left 0s ease-in-out;
-}
-.sidebar-backdrop {
-  width: 100vw;
-  height: 100vh;
-  position: fixed;
-  top: 0;
-  left: 0;
-  cursor: pointer;
-}
-.sidebar-panel {
-  overflow-y: auto;
-  background-color: #130f40;
-  position: fixed;
-  right: 0;
-  top: 141px;
-  height: 100vh;
-  z-index: 900;
-  padding: 3rem 20px 2rem 20px;
-  width: 721px;
-  height: 920px;
-  border-radius: 4px;
-  box-shadow: 2px 10px 15px 0 rgba(0, 0, 0, 0.5);
-  background-color: #dddddd;
-}
-.hidden {
-  visibility: hidden;
-}
-button {
-  cursor: pointer;
-}
-.switch-button {
-  position: relative;
-  height: 30px;
-  width: 32px;
-  display: block;
-  z-index: 9999;
-  border: 0;
-  border-radius: 0;
-  pointer-events: all;
-  background: #dddddd;
-  border-bottom-left-radius: 90px;
-  border-top-left-radius: 90px;
-  height: 90px;
-  width: 45px;
-}
-.circle-button {
-  width: 10px;
-  height: 10px;
-  border-radius: 10px;
-  margin: 3px;
-  background: #002680;
-}
-.switch-paddle.active .switch-button {
-  transform: translate(-761px, 0px);
-}
-.box-circle-paddle {
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  grid-template-rows: 1fr 1fr;
-  align-items: center;
-  justify-items: center;
-  padding: 5px;
-}
-.gear-box-paddle {
-  text-align: end;
-  width: 50px;
-  color: #bbbcbc;
-}
-.no-touchevents .burger-bar--2:hover {
-  transform: scaleX(1);
-}
-.burger-bar--3 {
-  transform: translateY(6px);
-}
-#burger.active .burger-button {
-  transform: rotate(-180deg);
-}
-#burger.active .burger-bar {
-  background-color: #fff;
-}
-#burger.active .burger-bar--1 {
-  transform: rotate(45deg);
-}
-#burger.active .burger-bar--2 {
-  opacity: 0;
-}
-#burger.active .burger-bar--3 {
-  transform: rotate(-45deg);
-}
-
 .circle-gantt {
   height: 70px;
 }
@@ -4662,6 +4502,132 @@ button {
   width: 20px;
   height: 20px;
 }
+html {
+  height: 100%;
+  overflow: hidden;
+}
+body {
+  border: 0;
+  margin: 0;
+  padding: 0;
+  height: 100%;
+}
+.hidden {
+  visibility: hidden;
+}
+nav {
+  position: absolute;
+  top: 50%;
+  right: 0;
+}
+nav .active button {
+  transform: translate(-761px, 0px);
+}
+nav div button {
+  position: relative;
+  height: 30px;
+  width: 32px;
+  display: block;
+  z-index: 9999;
+  border: 0;
+  border-radius: 0;
+  pointer-events: all;
+  background: #dddddd;
+  border-bottom-left-radius: 90px;
+  border-top-left-radius: 90px;
+  height: 90px;
+  width: 45px;
+}
+nav div button div {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  grid-template-rows: 1fr 1fr;
+  align-items: center;
+  justify-items: center;
+  padding: 5px;
+}
+nav div button div div {
+  width: 10px;
+  height: 10px;
+  border-radius: 10px;
+  margin: 3px;
+  background: #002680;
+}
+.sidebar .sidebar-backdrop {
+  width: 100vw;
+  height: 100vh;
+  position: fixed;
+  top: 0;
+  left: 0;
+  cursor: pointer;
+}
+.sidebar .sidebar-panel {
+  overflow-y: auto;
+  background-color: #130f40;
+  position: fixed;
+  right: 0;
+  top: 141px;
+  height: 100vh;
+  z-index: 900;
+  padding: 3rem 20px 2rem 20px;
+  width: 721px;
+  height: 920px;
+  border-radius: 4px;
+  box-shadow: 2px 10px 15px 0 rgba(0, 0, 0, 0.5);
+  background-color: #dddddd;
+}
+.sidebar .sidebar-panel .text-head-sidebar {
+  margin: 10px auto;
+  font-size: 24px;
+  font-weight: 500;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: normal;
+  letter-spacing: normal;
+  text-align: center;
+  color: #002680;
+}
+.sidebar .sidebar-panel .box-sidebar-panel {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  align-items: center;
+  justify-items: center;
+}
+.sidebar .sidebar-panel .box-sidebar-panel .sidebar-panel-nav {
+  width: 286px;
+  height: 100px;
+  border-radius: 2px;
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
+  background-color: #808e96;
+  margin: 10px 30px;
+}
+.sidebar .sidebar-panel .box-sidebar-panel .sidebar-panel-nav .text-box-paddle {
+  display: flex;
+  width: 268px;
+  height: 78px;
+  font-family: WorkSans;
+  font-size: 18px;
+  font-weight: 500;
+  font-stretch: normal;
+  font-style: normal;
+  line-height: normal;
+  letter-spacing: normal;
+  color: #ffffff;
+  margin: 10px;
+}
+.sidebar .sidebar-panel .box-sidebar-panel .sidebar-panel-nav .text-box-paddle i {
+  text-align: end;
+  width: 50px;
+  color: #bbbcbc;
+}
+.sidebar .sidebar-panel .box-sidebar-panel .sidebar-panel-nav .text-box-paddle label {
+  width: 117px;
+  margin: 10px;
+}
+.sidebar .sidebar-panel .box-sidebar-panel .sidebar-panel-nav .text-box-paddle.text-soft label {
+  width: 100%;
+  align-self: center;
+}
 .modal.estrazione-info {
   width: 560px;
   height: 411px;
diff --git a/Thermo.Active/wwwroot/src/App.vue b/Thermo.Active/wwwroot/src/App.vue
index 12f90cab..4a36198b 100644
--- a/Thermo.Active/wwwroot/src/App.vue
+++ b/Thermo.Active/wwwroot/src/App.vue
@@ -18,16 +18,11 @@
       </vue-gesture>
       </div>
 
-
-      <nav class="main-nav" :class="{'blur':(applyBlur || applyBlurNc)}">
+      <nav :class="{'blur':(applyBlur || applyBlurNc)}">
         <switch-button></switch-button>
       </nav>
 
-      <sidebar>
-
-        
-      </sidebar>
-
+      <sidebar></sidebar>
 
       <app-footer :class="{'blur':(applyBlur || applyBlurNc)}"></app-footer>
 
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
index ec75ba95..cb43b0f4 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/sidebar.vue
@@ -70,7 +70,7 @@
                 </div>
 
                 
-            </div>
+                </div>
 
             <!-- <i class="fa fa-cog gear-sidebar-paddle"></i> -->
 
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/switch-button.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/switch-button.vue
index 88ad7eda..59161c66 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/switch-button.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/paddle/switch-button.vue
@@ -1,12 +1,12 @@
 <template>
-    <div class="switch-paddle" :class="{ 'active' : isSwitchActive() }" @click="togglePaddle()">
+    <div :class="{ 'active' : isSwitchActive() }" @click="togglePaddle()">
         <slot>
-            <button type="button" class="switch-button" title="Menu">
-                <div class="box-circle-paddle">
-                    <div class="circle-button"></div>
-                    <div class="circle-button"></div>
-                    <div class="circle-button"></div>
-                    <div class="circle-button"></div>
+            <button title="Menu">
+                <div>
+                    <div></div>
+                    <div></div>
+                    <div></div>
+                    <div></div>
                 </div>
             </button>
         </slot>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/scheda.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/scheda.ts
index 4445e464..d79e9d0f 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/scheda.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/scheda.ts
@@ -10,6 +10,15 @@ export default class Scheda extends Vue{
     portata:number;
     @Prop({default:0})
     durata:number;
+    @Prop({default:0})
+    min_portata:number;
+    @Prop({default:0})
+    max_portata:number;
+    @Prop({default:0})
+    min_durata:number;
+    @Prop({default:0})
+    max_durata:number;
+
     
     mock_portata:number=this.portata;
     mock_durata:number=this.durata;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/scheda.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/scheda.vue
index 55746085..d08f31f0 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/scheda.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/scheda.vue
@@ -5,12 +5,12 @@
             <label>Portata</label>
 			<input class="rect" v-model="mock_portata">
         </div>        
-        <slider :min="0" :max="10" v-model="mock_portata"></slider>
+        <slider :min="min_portata" :max="max_portata" v-model="mock_portata"></slider>
         <div class="input-area">    
             <label class="Ritardo">Durata</label>
 			<input class="rect" v-model="mock_durata">
         </div>
-        <slider :min="0" :max="10" v-model="mock_durata"></slider>
+        <slider :min="min_durata" :max="max_durata" v-model="mock_durata"></slider>
         </div>
     </div>
 </template>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/base-components/aria-controstampo.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/base-components/aria-controstampo.vue
index e03a56e1..5c87df5d 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/base-components/aria-controstampo.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/base-components/aria-controstampo.vue
@@ -17,15 +17,27 @@
         <div class="specific">
             <scheda
                 :portata="recipe.upperplate_air_1_chart_setpointx.valueAct"
+                :min_portata="recipe.upperplate_air_1_chart_setpointx.range.min"
+                :max_portata="recipe.upperplate_air_1_chart_setpointx.range.max"
                 :durata="recipe.upperplate_air_1_chart_setpointy.valueAct"
+                :min_durata="recipe.upperplate_air_1_chart_setpointy.range.min"
+                :max_durata="recipe.upperplate_air_1_chart_setpointy.range.max"
             ></scheda>
             <scheda
                 :portata="recipe.upperplate_air_2_chart_setpointx.valueAct"
+                :min_portata="recipe.upperplate_air_2_chart_setpointx.range.min"
+                :max_portata="recipe.upperplate_air_2_chart_setpointx.range.max"
                 :durata="recipe.upperplate_air_2_chart_setpointy.valueAct"
+                :min_durata="recipe.upperplate_air_2_chart_setpointy.range.min"
+                :max_durata="recipe.upperplate_air_2_chart_setpointy.range.max"
             ></scheda>
             <scheda
                 :portata="recipe.upperplate_air_3_chart_setpointx.valueAct"
+                :min_portata="recipe.upperplate_air_3_chart_setpointx.range.min"
+                :max_portata="recipe.upperplate_air_3_chart_setpointx.range.max"
                 :durata="recipe.upperplate_air_3_chart_setpointy.valueAct"
+                :min_durata="recipe.upperplate_air_3_chart_setpointy.range.min"
+                :max_durata="recipe.upperplate_air_3_chart_setpointy.range.max"
             ></scheda>
         </div>
         <div class="specific">
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/imbutitura/show-imbutitura-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/imbutitura/show-imbutitura-info.vue
index 0bc41162..30c6423e 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/imbutitura/show-imbutitura-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/imbutitura/show-imbutitura-info.vue
@@ -65,7 +65,11 @@
             <div class="specific">
                 <scheda
                     :portata="recipe.drawing_1_chart_setpointx.valueAct"
+                    :min_portata="recipe.drawing_1_chart_setpointx.range.min"
+                    :max_portata="recipe.drawing_1_chart_setpointx.range.max"
                     :durata="recipe.drawing_1_chart_setpointy.valueAct"
+                    :min_durata="recipe.drawing_1_chart_setpointy.range.min"
+                    :max_durata="recipe.drawing_1_chart_setpointy.range.max"
                 ></scheda>
             </div>
         </section>