diff --git a/Thermo.Active/wwwroot/assets/icons/png/ritardo.png b/Thermo.Active/wwwroot/assets/icons/png/ritardo.png
new file mode 100644
index 00000000..c52af4e1
Binary files /dev/null and b/Thermo.Active/wwwroot/assets/icons/png/ritardo.png differ
diff --git a/Thermo.Active/wwwroot/assets/icons/png/ritardo@2x.png b/Thermo.Active/wwwroot/assets/icons/png/ritardo@2x.png
new file mode 100644
index 00000000..f2b9efdc
Binary files /dev/null and b/Thermo.Active/wwwroot/assets/icons/png/ritardo@2x.png differ
diff --git a/Thermo.Active/wwwroot/assets/icons/png/ritardo@3x.png b/Thermo.Active/wwwroot/assets/icons/png/ritardo@3x.png
new file mode 100644
index 00000000..c899c7c1
Binary files /dev/null and b/Thermo.Active/wwwroot/assets/icons/png/ritardo@3x.png differ
diff --git a/Thermo.Active/wwwroot/assets/styles/base/gantt-component.less b/Thermo.Active/wwwroot/assets/styles/base/gantt-component.less
new file mode 100644
index 00000000..21dfbf7a
--- /dev/null
+++ b/Thermo.Active/wwwroot/assets/styles/base/gantt-component.less
@@ -0,0 +1,2 @@
+// out: false, sourceMap: false, main: ../style.less
+
diff --git a/Thermo.Active/wwwroot/assets/styles/base/layout.less b/Thermo.Active/wwwroot/assets/styles/base/layout.less
index f35c03ac..4a817938 100644
--- a/Thermo.Active/wwwroot/assets/styles/base/layout.less
+++ b/Thermo.Active/wwwroot/assets/styles/base/layout.less
@@ -3,6 +3,7 @@
 @import "colors.less";
 @import "modals.less";
 @import "dashboard-gauge.less";
+@import "gantt-component.less";
 @import "piece.less";
 @import "dashboard.less";
 @import "riscaldi.less";
diff --git a/Thermo.Active/wwwroot/assets/styles/base/preriscaldo-dashboard.less b/Thermo.Active/wwwroot/assets/styles/base/preriscaldo-dashboard.less
index d1227d12..74bc2862 100644
--- a/Thermo.Active/wwwroot/assets/styles/base/preriscaldo-dashboard.less
+++ b/Thermo.Active/wwwroot/assets/styles/base/preriscaldo-dashboard.less
@@ -3,164 +3,65 @@
 @import "colors.less";
 @import "fonts.less";
 
-.preriscaldodashboard{
-    height: 100%;
-    width: 100%;
-    background-image: url("../../assets/icons/png/bg.png");
-    position: fixed;
-    z-index: 1001;
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-start;
+.pre_heat{
+    grid-template-rows   : 144px auto auto auto;
+    grid-template-columns: repeat(6,16.7%);
 
-    .header{
-        width: 100%;
-        display: flex;
-      
-    
-        .ribbon-container{
-            height: 80px;
-            z-index: 900;
+    small{
+        font-family: "Work Sans";
+        font-weight: 500;
+        line-height: 1.96;
+        text-align: center;
+        color: #4b4b4b;
+
+        &:first-of-type{
+            grid-row: 2;
+            grid-column-start: 1;
+            grid-column-end: -1;
+            font-size: 67px;
         }
-    
-        .box-date{
-            display: flex;
-            width: 100%;
-            justify-content: center;
-            
-            div{
-                flex-shrink: 0;
-                font-size: 47px;
-                text-align: right;
-                font-weight: 500;
-            }
-    
-            time {
-                flex-shrink: 0;
-                transition: color 200ms ease-in-out;
-                margin-left: 28px;
-                display: flex;
-                font-size: 120px;
-            }
-    
-        }
-    
-        .header-buttons{
-            display: inline-block;
-    
-            .box-close-dashboard{
-                height: 70px;
-                text-align: right;
-    
-                button.modal-close{
-                    background-color: #4B4B4B;
-                    margin: 23px;
-                }
-            }
-    
-    
-                .user-info {
-                    margin-top: 10px;
-                    display: flex;
-                    font-size: 25px;
-                    color: @color-input-light;
-                    flex-grow: 1;
-                    justify-content: flex-end;
-                    margin-right: 21px;
-    
-                    button.profile {
-                        width: 48px;
-                        height: 48px;
-                        background-image: url("../profile.png");
-                        color: #000;
-                        background-size: cover;
-                        border: none;
-                        background-color: transparent;
-                
-                        &.colorWhite {
-                            color: #FFF;
-                        }
-                    }
-    
-                    div{
-                        align-self: center;
-                        margin-right: 10px;
-                        font-size: 18px;
-                    }
-                }
-            
+
+        &:last-of-type{
+            grid-row: 3;
+            grid-column-start: 1;
+            grid-column-end: -1;
+            font-size: 26px;
+            text-transform: uppercase;
         }
+
     }
 
-    section{
-        height: 100%;
+    .preriscaldo_time{
+        grid-row: 4;
+        grid-column-start: 2;
+        grid-column-end: 6;
         display: flex;
-        flex-direction: column;
         justify-content: space-evenly;
-
-        label{
-
-            &:first-of-type{
-                font-size: 67px;
-                font-weight: 500;
-                font-stretch: normal;
-                font-style: normal;
-                line-height: 0.76;
-                letter-spacing: normal;
-                text-align: center;
-                color: #4b4b4b;
-            }
-
-            &:last-of-type{
-                font-size: 26px;
-                font-weight: 500;
-                font-stretch: normal;
-                font-style: normal;
-                line-height: 1.96;
-                letter-spacing: normal;
-                text-align: center;
-                color: #4b4b4b;
-            }
-
-        }
+        align-items: center;
 
         div{
             display: flex;
-            flex-direction: row;
-            justify-content: center;
-
-            div{
-                margin: 0px 70px;
-                display: flex;
-                flex-direction: column;
-
-                label{
-
-                    &:first-of-type{
-                        font-size: 250px;
-                        font-weight: 200;
-                        font-stretch: normal;
-                        font-style: normal;
-                        line-height: normal;
-                        letter-spacing: normal;
-                        text-align: center;
-                        color: #4b4b4b;
-                    }
-        
-                    &:last-of-type{
-                        font-size: 50px;
-                        font-weight: 500;
-                        font-stretch: normal;
-                        font-style: normal;
-                        line-height: normal;
-                        letter-spacing: normal;
-                        text-align: center;
-                        color: #4b4b4b;
-                    }
+            flex-flow: column;
 
+            label{
+                font-family: "Work Sans";
+                font-weight: 200;
+                font-weight: 400;
+                text-align: center;
+                color: #4b4b4b;
+                
+                &:first-of-type{
+                    font-size: 250px;
                 }
 
-            }                   
+                &:last-of-type{
+                    font-size: 50px;
+                }
+
+            }
+
         }
+
     }
+
 }
diff --git a/Thermo.Active/wwwroot/assets/styles/style.css b/Thermo.Active/wwwroot/assets/styles/style.css
index e255a7be..3b2d3ca0 100644
--- a/Thermo.Active/wwwroot/assets/styles/style.css
+++ b/Thermo.Active/wwwroot/assets/styles/style.css
@@ -4658,134 +4658,54 @@ article .box .body {
   grid-column: 0.8;
   grid-row: 0.5;
 }
-.preriscaldodashboard {
-  height: 100%;
-  width: 100%;
-  background-image: url("../../assets/icons/png/bg.png");
-  position: fixed;
-  z-index: 1001;
-  display: flex;
-  flex-direction: column;
-  justify-content: flex-start;
+.pre_heat {
+  grid-template-rows: 144px auto auto auto;
+  grid-template-columns: repeat(6, 16.7%);
 }
-.preriscaldodashboard .header {
-  width: 100%;
-  display: flex;
-}
-.preriscaldodashboard .header .ribbon-container {
-  height: 80px;
-  z-index: 900;
-}
-.preriscaldodashboard .header .box-date {
-  display: flex;
-  width: 100%;
-  justify-content: center;
-}
-.preriscaldodashboard .header .box-date div {
-  flex-shrink: 0;
-  font-size: 47px;
-  text-align: right;
+.pre_heat small {
+  font-family: "Work Sans";
   font-weight: 500;
-}
-.preriscaldodashboard .header .box-date time {
-  flex-shrink: 0;
-  transition: color 200ms ease-in-out;
-  margin-left: 28px;
-  display: flex;
-  font-size: 120px;
-}
-.preriscaldodashboard .header .header-buttons {
-  display: inline-block;
-}
-.preriscaldodashboard .header .header-buttons .box-close-dashboard {
-  height: 70px;
-  text-align: right;
-}
-.preriscaldodashboard .header .header-buttons .box-close-dashboard button.modal-close {
-  background-color: #4B4B4B;
-  margin: 23px;
-}
-.preriscaldodashboard .header .header-buttons .user-info {
-  margin-top: 10px;
-  display: flex;
-  font-size: 25px;
-  color: #4b4b4b;
-  flex-grow: 1;
-  justify-content: flex-end;
-  margin-right: 21px;
-}
-.preriscaldodashboard .header .header-buttons .user-info button.profile {
-  width: 48px;
-  height: 48px;
-  background-image: url("../profile.png");
-  color: #000;
-  background-size: cover;
-  border: none;
-  background-color: transparent;
-}
-.preriscaldodashboard .header .header-buttons .user-info button.profile.colorWhite {
-  color: #FFF;
-}
-.preriscaldodashboard .header .header-buttons .user-info div {
-  align-self: center;
-  margin-right: 10px;
-  font-size: 18px;
-}
-.preriscaldodashboard section {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-evenly;
-}
-.preriscaldodashboard section label:first-of-type {
-  font-size: 67px;
-  font-weight: 500;
-  font-stretch: normal;
-  font-style: normal;
-  line-height: 0.76;
-  letter-spacing: normal;
-  text-align: center;
-  color: #4b4b4b;
-}
-.preriscaldodashboard section label:last-of-type {
-  font-size: 26px;
-  font-weight: 500;
-  font-stretch: normal;
-  font-style: normal;
   line-height: 1.96;
-  letter-spacing: normal;
   text-align: center;
   color: #4b4b4b;
 }
-.preriscaldodashboard section div {
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
+.pre_heat small:first-of-type {
+  grid-row: 2;
+  grid-column-start: 1;
+  grid-column-end: -1;
+  font-size: 67px;
 }
-.preriscaldodashboard section div div {
-  margin: 0px 70px;
-  display: flex;
-  flex-direction: column;
+.pre_heat small:last-of-type {
+  grid-row: 3;
+  grid-column-start: 1;
+  grid-column-end: -1;
+  font-size: 26px;
+  text-transform: uppercase;
 }
-.preriscaldodashboard section div div label:first-of-type {
-  font-size: 250px;
+.pre_heat .preriscaldo_time {
+  grid-row: 4;
+  grid-column-start: 2;
+  grid-column-end: 6;
+  display: flex;
+  justify-content: space-evenly;
+  align-items: center;
+}
+.pre_heat .preriscaldo_time div {
+  display: flex;
+  flex-flow: column;
+}
+.pre_heat .preriscaldo_time div label {
+  font-family: "Work Sans";
   font-weight: 200;
-  font-stretch: normal;
-  font-style: normal;
-  line-height: normal;
-  letter-spacing: normal;
+  font-weight: 400;
   text-align: center;
   color: #4b4b4b;
 }
-.preriscaldodashboard section div div label:last-of-type {
+.pre_heat .preriscaldo_time div label:first-of-type {
+  font-size: 250px;
+}
+.pre_heat .preriscaldo_time div label:last-of-type {
   font-size: 50px;
-  font-weight: 500;
-  font-stretch: normal;
-  font-style: normal;
-  line-height: normal;
-  letter-spacing: normal;
-  text-align: center;
-  color: #4b4b4b;
 }
 .container #app nav {
   position: absolute;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/clock.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/clock.ts
similarity index 100%
rename from Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/clock.ts
rename to Thermo.Active/wwwroot/src/app_modules_thermo/components/clock.ts
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/clock.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/components/clock.vue
similarity index 100%
rename from Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/base-components/clock.vue
rename to Thermo.Active/wwwroot/src/app_modules_thermo/components/clock.vue
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/components/index.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/components/index.ts
index a06c587c..96798ace 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/components/index.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/components/index.ts
@@ -2,11 +2,13 @@ import numeric from "./numeric.vue";
 import slider from "./slider.vue";
 import Vue from "vue";
 import keyboard from "./keyboard.vue";
+import clock from "./clock.vue";
 
 export default {
   numeric,
   slider,
-  keyboard
+  keyboard,
+  clock
 }
 
 Vue.directive('focusOn', {
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts
index 43b707f0..b014177a 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/dashboard/dashboard.ts
@@ -8,7 +8,6 @@ import { AppModel, appModelActions } from '@/store';
 import { getColorFromName, isDarkColor } from "@/_base/utils";
 import ArchInterface from "../components/arch-interface/arch-interface.vue";
 import gauge from "./base-components/gauge.vue";
-import clock from "./base-components/clock.vue";
 import Piece from "./base-components/piece.vue";
 
 @Component({
@@ -16,7 +15,7 @@ import Piece from "./base-components/piece.vue";
     appRibbon: AppRibbon,
     archInterface: ArchInterface,
     alarmList,
-    gauge, clock,
+    gauge,
     piece:Piece
   }
 })
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/preriscaldo-dashboard/preriscaldo-dashboard.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/preriscaldo-dashboard/preriscaldo-dashboard.ts
index 1a9b3821..68c49fce 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/preriscaldo-dashboard/preriscaldo-dashboard.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/preriscaldo-dashboard/preriscaldo-dashboard.ts
@@ -2,50 +2,30 @@ import Vue from 'vue';
 import Component from 'vue-class-component';
 import {Prop} from 'vue-property-decorator';
 import { messageService } from '@/_base';
-import { ModalHelper } from '@/components/modals';
 import AppRibbon from "@/components/app-ribbon.vue";
 import { alarmList } from "@/app_modules/alarms";
 import moment from "moment";
 import { AppModel, appModelActions } from '@/store';
 import { getColorFromName,isDarkColor } from "@/_base/utils";
-import ArchInterface from "../components/arch-interface/arch-interface.vue";
-import { LocalizationService, localizationService } from "@/services/localizationService";
 
 @Component({
     components: {
       appRibbon: AppRibbon,
-      archInterface: ArchInterface,
-      alarmList,
+      alarmList
     }
   })
 export default class PreriscaldoDashboard extends Vue{
 
     @Prop({default:2})
-    day:number;
+    days:number;
     @Prop({default:13})
-    hour:number;
+    hours:number;
     @Prop({default:27})
-    minute:number;
+    minutes:number;
     @Prop({default:13})
-    second:number;
+    seconds:number;
 
     $store: any;
-
-    public minutes: string = "";
-    public hours: string = "";
-    public Time: string = "";
-    public date: string = "";
-    public mid: string = "";
-    public dayIt: string = moment(new Date()).locale(this.$store.state.localization.currentLanguage).format('dddd DD');
-    public monthIt: string = moment(new Date()).locale(this.$store.state.localization.currentLanguage).format('MMMM');
-  
-    created(){
-      this.updateTime();
-      // Ora aggiornata ogni 10 secondi
-      window.setInterval(() => {
-        this.updateTime();
-      }, 10000);
-    }
   
   
     // User
@@ -66,42 +46,6 @@ export default class PreriscaldoDashboard extends Vue{
       return isDarkColor(color);
     }
   
-    // Clock
-  
-    private updateTime() {
-      this.mid = "";
-      let date = moment(new Date()).format('LT');
-  
-      let hours: any = date.split(":")[0];
-      let minutesGrez = date.split(":")[1].split(" ");
-  
-      //Check if is AM/PM
-      let minutes = "";
-      if(minutesGrez.length>1)
-        minutes = minutesGrez[0] + " " + minutesGrez[1];
-      else{
-        minutes = ("00" + minutesGrez[0]).slice(-2)
-        hours = ("00" + hours).slice(-2)
-      }
-  
-      // time non italian
-      if (this.$store.state.localization.currentLanguage != 'it'){
-        hours = (hours+24)%24;
-        this.mid = "AM";
-        if (hours==0){
-          hours=12;
-        }
-        else if (hours>12){
-          hours=hours%12;
-          this.mid = "PM";
-        }
-      }
-  
-      this.$set(this, "minutes", minutes);
-      this.$set(this, "hours", hours);
-      this.$set(this, "date", moment(new Date()).format('L'));
-    }
-  
     // Ribbon
   
     public get ribbonStatus(): ribbonStatusEnum {
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/preriscaldo-dashboard/preriscaldo-dashboard.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/preriscaldo-dashboard/preriscaldo-dashboard.vue
index 6b8faf39..617e5f2c 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/preriscaldo-dashboard/preriscaldo-dashboard.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/preriscaldo-dashboard/preriscaldo-dashboard.vue
@@ -1,85 +1,106 @@
 <template>
-    <div class="preriscaldodashboard">
-            <div class="header">
-            <app-ribbon
-                :status="{'alarm': ribbonStatus == 3, 'working': ribbonStatus == 1, 'warning': ribbonStatus == 2}"
-       
-
-                :has-service="serviceRequired"
-            >
-                <i class="fa fa-check" slot="icon" v-if="ribbonStatus == 0" :title="'header_tooltip_nc_idle' | localize('Nc in Idle state')"></i>
-                <i class="fa fa-play" slot="icon" v-if="ribbonStatus == 1" :title="'header_tooltip_nc_running' | localize('Nc in Running state')"></i>
-                <i class="fa fa-exclamation" slot="icon" v-if="ribbonStatus >1" :title="'header_tooltip_nc_error' | localize('Open/Close alarm list')"></i>
-                <div slot="content" class="content" v-if="ribbonStatus>1" :title="'header_tooltip_nc_error' | localize('Open/Close alarm list')">
-
-                    <strong v-if="!showDetails">{{alarmTitle | localize(alarmTitle,alarmCount)}}</strong>
-                    <strong v-if="showDetails && alarms[0].title">{{alarms[0].title}}</strong>
-                    <strong v-if="showDetails && !alarms[0].title">{{'alarm_'+ alarms[0].id | localize('alarm_'+ alarms[0].id)}}</strong>
-                    <div v-if="showDetails">
-                    <span class="processes">{{alarms[0].source}}</span>
-                    <span class="processes" v-if="alarms[0].source === 'PLC' && alarms[0].process.length>0">
-                            <span v-for="p in alarms[0].process" :key="p" >{{ p }} </span>
-                    </span>
-                    <span class="processes" v-if="alarms[0].source !== 'PLC' && alarms[0].process">{{ alarms[0].process }}</span>
-                    </div>
-                     
-                </div>
-                <div slot="service" class="content" v-if="serviceRequired">
-                    <strong>{{'header_maintainance_request' | localize('Effettuare manutenzione')}}</strong>
-                    <span>{{'header_maintainance_request_explanation' | localize('C\'è una procedura da effettuare')}}</span>
-                </div>
-            </app-ribbon>
-
-            <!-- <alarm-list></alarm-list> -->
-
-            <div class="box-date">
-                <div>{{dayIt}}<br>{{monthIt}}</div>
-                <time>
-                    <span>{{hours}}:{{minutes}} {{mid}}</span>
-                </time>
-            </div>
-
-            <div class="header-buttons">
-                <div class="box-close-dashboard">
-                    <button class="modal-close" @click="close()">
-                        <i class="fa fa-remove"></i>
-                    </button>
-                </div>
-
-                <div class="user-info">
-                    <div>
-                        <span>{{currentUser.firstName}} <br> {{currentUser.lastName}}</span>
-                    </div>
-                    <button class="profile dark-blue" v-if="currentUser" @click="sendMessage('show-user-info')" :title="'header_tooltip_btn_usrinfo' | localize('Show User Info')" :class="{'colorWhite':isDarkColor(getColor(currentUser.lastName,currentUser.firstName))}">
-                    </button>
-                    <button class="profile dark-blue colorWhite" v-else  @click="sendMessage('show-user-info')" :title="'header_tooltip_btn_usrinfo' | localize('Show User Info')">
-                    </button> 
-                </div>
-            </div>
+  <div class="pre_heat dashboard">
+    <header>
+      <app-ribbon
+        :status="{'alarm': ribbonStatus == 3, 'working': ribbonStatus == 1, 'warning': ribbonStatus == 2}"
+        :has-service="serviceRequired"
+      >
+        <i
+          class="fa fa-check"
+          slot="icon"
+          v-if="ribbonStatus == 0"
+          :title="'header_tooltip_nc_idle' | localize('Nc in Idle state')"
+        ></i>
+        <i
+          class="fa fa-play"
+          slot="icon"
+          v-if="ribbonStatus == 1"
+          :title="'header_tooltip_nc_running' | localize('Nc in Running state')"
+        ></i>
+        <i
+          class="fa fa-exclamation"
+          slot="icon"
+          v-if="ribbonStatus >1"
+          :title="'header_tooltip_nc_error' | localize('Open/Close alarm list')"
+        ></i>
+        <div
+          slot="content"
+          class="content"
+          v-if="ribbonStatus>1"
+          :title="'header_tooltip_nc_error' | localize('Open/Close alarm list')"
+        >
+          <strong v-if="!showDetails">{{alarmTitle | localize(alarmTitle,alarmCount)}}</strong>
+          <strong v-if="showDetails && alarms[0].title">{{alarms[0].title}}</strong>
+          <strong
+            v-if="showDetails && !alarms[0].title"
+          >{{'alarm_'+ alarms[0].id | localize('alarm_'+ alarms[0].id)}}</strong>
+          <div v-if="showDetails">
+            <span class="processes">{{alarms[0].source}}</span>
+            <span class="processes" v-if="alarms[0].source === 'PLC' && alarms[0].process.length>0">
+              <span v-for="p in alarms[0].process" :key="p">{{ p }}</span>
+            </span>
+            <span
+              class="processes"
+              v-if="alarms[0].source !== 'PLC' && alarms[0].process"
+            >{{ alarms[0].process }}</span>
+          </div>
         </div>
-        <section>
-            <label>Avvio programmato riscaldi e termoregolatori</label>
-            <label>PROSSIMO AVVIO</label>
-            <div>
-                <div>
-                    <label>{{day}}</label>
-                    <label>giorni</label>
-                </div>
-                <div>
-                    <label>{{hour}}</label>
-                    <label>ore</label>
-                </div>
-                <div>
-                    <label>{{minute}}</label>
-                    <label>minuti</label>
-                </div>
-                <div>
-                    <label>{{second}}</label>
-                    <label>secondi</label>
-                </div>
-            </div>
-        </section>
+        <div slot="service" class="content" v-if="serviceRequired">
+          <strong>{{'header_maintainance_request' | localize('Effettuare manutenzione')}}</strong>
+          <span>{{'header_maintainance_request_explanation' | localize('C\'è una procedura da effettuare')}}</span>
+        </div>
+      </app-ribbon>
+
+      <clock></clock>
+
+      <div class="header-buttons">
+        <button class="modal-close" @click="close()">
+          <i class="fa fa-remove"></i>
+        </button>
+
+        <div class="user-info">
+          <div class="name">
+            {{currentUser.firstName}}
+            <br />
+            {{currentUser.lastName}}
+          </div>
+          <button
+            class="profile dark-blue"
+            v-if="currentUser"
+            @click="sendMessage('show-user-info')"
+            :title="'header_tooltip_btn_usrinfo' | localize('Show User Info')"
+            :class="{'colorWhite':isDarkColor(getColor(currentUser.lastName,currentUser.firstName))}"
+          ></button>
+          <button
+            class="profile dark-blue colorWhite"
+            v-else
+            @click="sendMessage('show-user-info')"
+            :title="'header_tooltip_btn_usrinfo' | localize('Show User Info')"
+          ></button>
+        </div>
+      </div>
+    </header>
+    <small>{{'programmed_start' | localize('Avvio programmato riscaldi e termoregolatori')}}</small>
+    <small>{{'next_start' | localize('prossimo avvio')}}</small>
+    <div class="preriscaldo_time">
+      <div>
+        <label>{{days}}</label>
+        <label>{{'days' | localize('giorni')}}</label>
+      </div>
+      <div>
+        <label>{{hours}}</label>
+        <label>{{'hours' | localize('ore')}}</label>
+      </div>
+      <div>
+        <label>{{minutes}}</label>
+        <label>{{'minutes' | localize('minuti')}}</label>
+      </div>
+      <div>
+        <label>{{seconds}}</label>
+        <label>{{'seconds' | localize('secondi')}}</label>
+      </div>
     </div>
+  </div>
 </template>
 
 <script lang="ts" src="./preriscaldo-dashboard"></script>
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/base-components/gantt-component.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/base-components/gantt-component.ts
new file mode 100644
index 00000000..29dc6517
--- /dev/null
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/base-components/gantt-component.ts
@@ -0,0 +1,22 @@
+import Vue from 'vue';
+import Component from 'vue-class-component';
+import { Prop } from 'vue-property-decorator';
+
+@Component({})
+export default class GanttComponent extends Vue{
+
+    @Prop({default:0})
+    estimated_delay:number;
+    @Prop({default:0})
+    estimated_duration:number;
+    @Prop({default:"null"})
+    tag:string;
+    @Prop({default:"#57636b"})
+    color:string;
+    @Prop({default:"#c0c7cc"})
+    overlapping_color:string;
+
+    visible:boolean=true;
+    
+
+}
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/base-components/gantt-component.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/base-components/gantt-component.vue
new file mode 100644
index 00000000..1bfeb2fb
--- /dev/null
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/base-components/gantt-component.vue
@@ -0,0 +1,74 @@
+<template>
+  <div class="gantt_component">
+    <svg>
+      <rect x="0" y="0" width="100%" height="100%" rx="15" :fill="color" />
+      <rect x="0" y="10%" width="100%" height="60%" rx="6" :fill="overlapping_color" />
+      <g v-if="visible">
+      <foreignObject
+					width="45"
+					height="60%"
+					x="0"
+					y="10%"
+				>
+          <img src="assets/icons/png/clessidra.png">
+				</foreignObject>
+        <foreignObject
+					width="45"
+					height="30%"
+					x="0"
+					y="70%"
+				>
+          <label>{{estimated_delay}}s</label>
+				</foreignObject>
+      </g>
+      <g v-if="visible">
+      <foreignObject
+					width="45"
+					height="60%"
+					x="40%"
+					y="10%"
+				>
+          <label>{{tag}}</label>
+				</foreignObject>
+        <foreignObject
+					width="45"
+					height="30%"
+					x="40%"
+					y="70%"
+				>
+          <label>{{estimated_duration}}s</label>
+				</foreignObject>
+      </g>
+      <g v-if="visible">
+      <foreignObject
+					width="80"
+					height="60%"
+					x="75%"
+					y="10%"
+				>
+          <label>{{tag}}</label>
+				</foreignObject>
+        <foreignObject
+					width="80"
+					height="30%"
+					x="75%"
+					y="70%"
+				>
+          <label>{{estimated_duration}}s</label>
+				</foreignObject>
+      </g>
+    </svg>
+  </div>
+</template>
+<style scoped>
+.gantt_component {
+    height: 70px;
+    width : 500px;
+}
+
+svg {
+    height: 100%;
+    width : 100%;
+}
+</style>
+<script lang="ts" src="./gantt-component.ts"></script>
\ No newline at end of file
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/ciclo/components/show-ciclo-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/ciclo/components/show-ciclo-info.ts
index 129d4ec5..ac09ab61 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/ciclo/components/show-ciclo-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/ciclo/components/show-ciclo-info.ts
@@ -15,7 +15,7 @@ import { recipeService } from "@/services/recipeService";
 export default class ShowCicloInfo extends Vue {
 
   recipe: Recipe.IRecipe = this.$store.getters.getCurrent();
-  show: string = "caricatore";
+  show: number = 0;
 
   @Prop()
   deferred: Deferred<boolean>;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/ciclo/components/show-ciclo-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/ciclo/components/show-ciclo-info.vue
index 2a6bc2ba..b1e6dcc4 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/ciclo/components/show-ciclo-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/ciclo/components/show-ciclo-info.vue
@@ -2,16 +2,16 @@
 	<div class="setup">
 		<modal type="ciclo-info">
 			<div class="tab-header" slot="header-buttons">
-				<button :class="{'active':show=='formatura'}" @click="show='formatura'">Ciclo di formatura</button>
-				<button :class="{'active':show=='caricatore'}" @click="show='caricatore'">Caricatore</button>
+				<button :class="{'active':show==0}" @click="show=0">Ciclo di formatura</button>
+				<button :class="{'active':show==1}" @click="show=1">Caricatore</button>
 			</div>
 			<div slot="header-buttons">
 				<button class="modal-close" @click="close()">
 					<i class="fa fa-remove"></i>
 				</button>
 			</div>
-			<caricatore v-if="show=='caricatore'" :recipe="recipe"></caricatore>
-			<cicloformatura v-if="show=='formatura'" :recipe="recipe"></cicloformatura>
+			<cicloformatura v-if="show==0" :recipe="recipe"></cicloformatura>
+			<caricatore v-if="show==1" :recipe="recipe"></caricatore>
 			<footer>
 				<button class="btn" @click="annulla()">Annulla</button>
 				<button class="btn btn-success" @click="conferma()">Conferma</button>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/show-controstampo-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/show-controstampo-info.ts
index 36ac594b..f3708063 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/show-controstampo-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/show-controstampo-info.ts
@@ -26,7 +26,7 @@ import { recipeService } from "@/services/recipeService";
 export default class ShowControstampoInfo extends Vue {
 
   recipe: Recipe.IRecipe = this.$store.getters.getCurrent();
-  show: string = "CC";
+  show: number = 0;
 
   @Prop()
   deferred: Deferred<boolean>;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/show-controstampo-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/show-controstampo-info.vue
index 8c013a88..97ff0e63 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/show-controstampo-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/controstampo_setup/components/show-controstampo-info.vue
@@ -2,20 +2,20 @@
 	<div class="setup">
 		<modal type="controstamposetup-info">
 			<div class="tab-header" slot="header-buttons">
-				<button :class="{'active':show == 'CC'}" @click="show='CC'">Ciclo controstampo</button>
-				<button :class="{'active':show == 'AC'}" @click="show='AC'">Aria controstampo</button>
-				<button :class="{'active':show == 'VC'}" @click="show='VC'">Vuoto controstampo</button>
-				<button :class="{'active':show == 'EC'}" @click="show='EC'">Estrazione controstampo</button>
+				<button :class="{'active':show == 0}" @click="show=0">Ciclo controstampo</button>
+				<button :class="{'active':show == 1}" @click="show=1">Aria controstampo</button>
+				<button :class="{'active':show == 2}" @click="show=2">Vuoto controstampo</button>
+				<button :class="{'active':show == 3}" @click="show=3">Estrazione controstampo</button>
 			</div>
 			<div slot="header-buttons">
 				<button class="modal-close" @click="close()">
 					<i class="fa fa-remove"></i>
 				</button>
 			</div>
-			<ciclocontrostampo v-if="show=='CC'" :recipe="recipe"></ciclocontrostampo>
-			<ariacontrostampo v-if="show=='AC'" :recipe="recipe"></ariacontrostampo>
-			<vuotocontrostampo v-if="show=='VC'" :recipe="recipe"></vuotocontrostampo>
-			<estrazionecontrostampo v-if="show=='EC'" :recipe="recipe"></estrazionecontrostampo>
+			<ciclocontrostampo v-if="show==0" :recipe="recipe"></ciclocontrostampo>
+			<ariacontrostampo v-if="show==1" :recipe="recipe"></ariacontrostampo>
+			<vuotocontrostampo v-if="show==2" :recipe="recipe"></vuotocontrostampo>
+			<estrazionecontrostampo v-if="show==3" :recipe="recipe"></estrazionecontrostampo>
 			<footer>
 				<button class="btn" @click="annulla()">Annulla</button>
 				<button class="btn btn-success" @click="conferma()">Conferma</button>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/estrazione/components/show-estrazione-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/estrazione/components/show-estrazione-info.ts
index a7fbb693..13bdcaec 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/estrazione/components/show-estrazione-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/estrazione/components/show-estrazione-info.ts
@@ -23,7 +23,7 @@ import { recipeService } from "@/services/recipeService";
 export default class ShowEstrazioneInfo extends Vue {
 
   recipe: Recipe.IRecipe = this.$store.getters.getCurrent();
-  show: string = "principale";
+  show: number = 0;
 
   @Prop()
   deferred: Deferred<boolean>;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/estrazione/components/show-estrazione-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/estrazione/components/show-estrazione-info.vue
index b058c242..3d41df1a 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/estrazione/components/show-estrazione-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/estrazione/components/show-estrazione-info.vue
@@ -3,12 +3,12 @@
 		<modal type="estrazione-info">
 			<div class="tab-header" slot="header-buttons">
 				<button
-					:class="{'active':show == 'principale'}"
-					@click="show='principale'"
+					:class="{'active':show == 0}"
+					@click="show=0"
 				>Estrazione principale</button>
 				<button
-					:class="{'active':show == 'secondaria'}"
-					@click="show='secondaria'"
+					:class="{'active':show == 1}"
+					@click="show=1"
 				>Estrazione secondaria</button>
 			</div>
 			<div slot="header-buttons">
@@ -16,8 +16,8 @@
 					<i class="fa fa-remove"></i>
 				</button>
 			</div>
-			<estrprincipale v-if="show=='principale'" :recipe="recipe"></estrprincipale>
-			<estrsecondaria v-if="show=='secondaria'" :recipe="recipe"></estrsecondaria>
+			<estrprincipale v-if="show==0" :recipe="recipe"></estrprincipale>
+			<estrsecondaria v-if="show==1" :recipe="recipe"></estrsecondaria>
 			<footer>
 				<button class="btn" @click="annulla()">Annulla</button>
 				<button class="btn btn-success" @click="conferma()">Conferma</button>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/base-components/setupSottosquadra.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/base-components/setupSottosquadra.vue
index 8a93aa8b..4790c16e 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/base-components/setupSottosquadra.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/base-components/setupSottosquadra.vue
@@ -1,9 +1,9 @@
 <template>
 	<div class="option-row" @click="$emit('click')">
 		<label>{{numSottoSq}}</label>
-		<template v-if="modalita.status.visible">
+		<!-- <template v-if="modalita.status.visible">
 			<select class="form-control" v-model="modalita"></select>
-		</template>
+		</template> va inserito il valore della select di modalità -->
 		<template v-if="quota.status.visible">
 			<label>{{quota.setpointHMI}} mm</label>
 		</template>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/sottosquadra-controstampo.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/sottosquadra-controstampo.vue
index cfe44822..724fcebe 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/sottosquadra-controstampo.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/sottosquadra-controstampo.vue
@@ -6,7 +6,7 @@
 				v-for="i in 10"
 				:key="i"
 				@click="selectedItem=i"
-				:numTermo="i"
+				:numSottoSq="i"
 				:modalita="recipe[`options_undercutupperplate_${i}_mode`]"
 				:quota="recipe[`options_undercutupperplate_${i}_position`]"
 				:ritardoAtt="recipe[`options_undercutupperplate_${i}_delay_acti`]"
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/sottosquadra-stampo.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/sottosquadra-stampo.vue
index 19630db6..ced5e882 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/sottosquadra-stampo.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/components/sottosquadra-stampo.vue
@@ -6,7 +6,7 @@
 				v-for="i in 10"
 				:key="i"
 				@click="selectedItem=i"
-				:numTermo="i"
+				:numSottoSq="i"
 				:modalita="recipe[`options_undercutmould_${i}_mode`]"
 				:quota="recipe[`options_undercutmould_${i}_position`]"
 				:ritardoAtt="recipe[`options_undercutmould_${i}_delay_acti`]"
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/show-opzioni-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/show-opzioni-info.ts
index f9785d8c..c9b183b7 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/show-opzioni-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/show-opzioni-info.ts
@@ -24,7 +24,7 @@ import { recipeService } from "@/services/recipeService";
 export default class ShowOpzioniInfo extends Vue {
 
   get recipe(): Recipe.IRecipe { return this.$store.getters.getCurrent(); }
-  showOpzioni: string = "TR";
+  showOpzioni: number = 0;
 
   @Prop()
   deferred: Deferred<boolean>;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/show-opzioni-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/show-opzioni-info.vue
index e64c63bd..7afabe5a 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/show-opzioni-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/opzioni/show-opzioni-info.vue
@@ -8,17 +8,17 @@
 			</div>
 			<section>
 				<aside class="scrollable auto">
-					<button :class="{'active':showOpzioni == 'TR'}" @click="showOpzioni='TR'">Termoregolatori</button>
-					<button :class="{'active':showOpzioni == 'SS'}" @click="showOpzioni='SS'">Sottosquadra stampo</button>
+					<button :class="{'active':showOpzioni == 0}" @click="showOpzioni=0">Termoregolatori</button>
+					<button :class="{'active':showOpzioni == 1}" @click="showOpzioni=1">Sottosquadra stampo</button>
 					<button
-						:class="{'active':showOpzioni == 'SC'}"
-						@click="showOpzioni='SC'"
+						:class="{'active':showOpzioni == 2}"
+						@click="showOpzioni=2"
 					>Sottosquadra controstampo</button>
 				</aside>
 				<hr />
-				<sottosquadracontrostampo v-if="showOpzioni=='SC'" :recipe="recipe"></sottosquadracontrostampo>
-				<sottosquadrastampo v-if="showOpzioni=='SS'" :recipe="recipe"></sottosquadrastampo>
-				<termoregolatori v-if="showOpzioni=='TR'" :recipe="recipe"></termoregolatori>
+				<termoregolatori v-if="showOpzioni==0" :recipe="recipe"></termoregolatori>
+				<sottosquadrastampo v-if="showOpzioni==1" :recipe="recipe"></sottosquadrastampo>
+				<sottosquadracontrostampo v-if="showOpzioni==2" :recipe="recipe"></sottosquadracontrostampo>
 			</section>
 			<footer>
 				<button class="btn" @click="annulla()">Annulla</button>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/pirometro/components/show-pirometro-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/pirometro/components/show-pirometro-info.ts
index ee71a28e..387f1a53 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/pirometro/components/show-pirometro-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/pirometro/components/show-pirometro-info.ts
@@ -16,7 +16,7 @@ import { recipeService } from "@/services/recipeService";
 export default class ShowPirometroInfo extends Vue {
 
   recipe: Recipe.IRecipe = this.$store.getters.getCurrent();
-  show: string = 'termo-superiore';
+  show: number = 0;
 
   @Prop()
   deferred: Deferred<boolean>;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/pirometro/components/show-pirometro-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/pirometro/components/show-pirometro-info.vue
index 652baf22..c3ee8f15 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/pirometro/components/show-pirometro-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/pirometro/components/show-pirometro-info.vue
@@ -2,14 +2,14 @@
 	<div class="setup">
 		<modal type="pirometro-info">
 			<div class="tab-header" slot="header-buttons">
-				<button :class="{'active':show=='pirometro'}" @click="show='pirometro'">Pirometro</button>
+				<button :class="{'active':show==0}" @click="show=0">Pirometro</button>
 				<button
-					:class="{'active':show=='termo-superiore'}"
-					@click="show='termo-superiore'"
+					:class="{'active':show==1}"
+					@click="show=1"
 				>Termoregolazione riscaldo superiore</button>
 				<button
-					:class="{'active':show=='termo-inferiore'}"
-					@click="show='termo-inferiore'"
+					:class="{'active':show==2}"
+					@click="show=2"
 				>Termoregolazione riscaldo inferiore</button>
 			</div>
 			<div slot="header-buttons">
@@ -17,9 +17,9 @@
 					<i class="fa fa-remove"></i>
 				</button>
 			</div>
-			<pirometro v-if="show=='pirometro'" :recipe="recipe"></pirometro>
-			<termosuperiore v-if="show=='termo-superiore'" :recipe="recipe"></termosuperiore>
-			<termoinferiore v-if="show=='termo-inferiore'" :recipe="recipe"></termoinferiore>
+			<pirometro v-if="show==0" :recipe="recipe"></pirometro>
+			<termosuperiore v-if="show==1" :recipe="recipe"></termosuperiore>
+			<termoinferiore v-if="show==2" :recipe="recipe"></termoinferiore>
 			<footer>
 				<button class="btn" @click="annulla()">Annulla</button>
 				<button class="btn btn-success" @click="conferma()">Conferma</button>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/quote-velocita/components/show-quote-velocita-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/quote-velocita/components/show-quote-velocita-info.ts
index 49a2036b..c57afbe8 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/quote-velocita/components/show-quote-velocita-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/quote-velocita/components/show-quote-velocita-info.ts
@@ -24,7 +24,7 @@ import { recipeService } from "@/services/recipeService";
 export default class ShowQuoteVelocitaInfo extends Vue {
 
   recipe: Recipe.IRecipe = this.$store.getters.getCurrent();
-  show: string = "QS";
+  show: number = 0;
 
   @Prop()
   deferred: Deferred<boolean>;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/quote-velocita/components/show-quote-velocita-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/quote-velocita/components/show-quote-velocita-info.vue
index 6251d923..988158bc 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/quote-velocita/components/show-quote-velocita-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/quote-velocita/components/show-quote-velocita-info.vue
@@ -2,18 +2,18 @@
 	<div class="setup">
 		<modal type="quote-velocita-info">
 			<div class="tab-header" slot="header-buttons">
-				<button :class="{'active':show == 'QS'}" @click="show='QS'">Stampo</button>
-				<button :class="{'active':show == 'QC'}" @click="show='QC'">Cornice</button>
-				<button :class="{'active':show == 'QCS'}" @click="show='QCS'">Controstampo</button>
+				<button :class="{'active':show == 0}" @click="show=0">Stampo</button>
+				<button :class="{'active':show == 1}" @click="show=1">Cornice</button>
+				<button :class="{'active':show == 2}" @click="show=2">Controstampo</button>
 			</div>
 			<div slot="header-buttons">
 				<button class="modal-close" @click="close()">
 					<i class="fa fa-remove"></i>
 				</button>
 			</div>
-			<salita-stampo v-if="show=='QS'" :recipe="recipe"></salita-stampo>
-			<discesacornice v-if="show=='QC'" :recipe="recipe"></discesacornice>
-			<controstampo v-if="show=='QCS'" :recipe="recipe"></controstampo>
+			<salita-stampo v-if="show==0" :recipe="recipe"></salita-stampo>
+			<discesacornice v-if="show==1" :recipe="recipe"></discesacornice>
+			<controstampo v-if="show==2" :recipe="recipe"></controstampo>
 			<footer>
 				<button class="btn" @click="annulla()">Annulla</button>
 				<button class="btn btn-success" @click="conferma()">Conferma</button>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/raffreddamento/components/show-raffreddamento-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/raffreddamento/components/show-raffreddamento-info.ts
index 94fbc5e0..6dee5d9f 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/raffreddamento/components/show-raffreddamento-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/raffreddamento/components/show-raffreddamento-info.ts
@@ -31,7 +31,7 @@ export default class Raffreddamento extends Vue {
   deferred: Deferred<boolean>;
 
   recipe: Recipe.IRecipe = this.$store.getters.getCurrent();
-  show: string = "ventilatori";
+  show: number = 0;
 
   annulla() {
     ModalHelper.HideModal();
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/raffreddamento/components/show-raffreddamento-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/raffreddamento/components/show-raffreddamento-info.vue
index bf6c0084..c0fac553 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/raffreddamento/components/show-raffreddamento-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/raffreddamento/components/show-raffreddamento-info.vue
@@ -2,22 +2,22 @@
 	<div class="setup">
 		<modal type="raffreddamento-info">
 			<div class="tab-header" slot="header-buttons">
-				<button :class="{'active':show == 'ventilatori'}" @click="show='ventilatori'">Ventilatori</button>
-				<button :class="{'active':show == 'pirometro'}" @click="show='pirometro'">Pirometro</button>
-				<button :class="{'active':show == 'nebulizzatori'}" @click="show='nebulizzatori'">Nebulizzatori</button>
-				<button :class="{'active':show == 'telescopi'}" @click="show='telescopi'">Telescopi</button>
-				<button :class="{'active':show == 'otturatori'}" @click="show='otturatori'">Otturatori</button>
+				<button :class="{'active':show == 0}" @click="show=0">Ventilatori</button>
+				<button :class="{'active':show == 1}" @click="show=1">Pirometro</button>
+				<button :class="{'active':show == 2}" @click="show=2">Nebulizzatori</button>
+				<button :class="{'active':show == 3}" @click="show=3">Telescopi</button>
+				<button :class="{'active':show == 4}" @click="show=4">Otturatori</button>
 			</div>
 			<div slot="header-buttons">
 				<button class="modal-close" @click="close()">
 					<i class="fa fa-remove"></i>
 				</button>
 			</div>
-			<ventilatori v-if="show=='ventilatori'" :recipe="recipe"></ventilatori>
-			<pirometro v-if="show=='pirometro'" :recipe="recipe"></pirometro>
-			<nebulizzatori v-if="show=='nebulizzatori'" :recipe="recipe"></nebulizzatori>			
-			<telescopi v-if="show=='telescopi'" :recipe="recipe"></telescopi>
-			<otturatori v-if="show=='otturatori'" :recipe="recipe"></otturatori>
+			<ventilatori v-if="show==0" :recipe="recipe"></ventilatori>
+			<pirometro v-if="show==1" :recipe="recipe"></pirometro>
+			<nebulizzatori v-if="show==2" :recipe="recipe"></nebulizzatori>			
+			<telescopi v-if="show==3" :recipe="recipe"></telescopi>
+			<otturatori v-if="show==4" :recipe="recipe"></otturatori>
 			<footer>
 				<button class="btn" @click="annulla()">Annulla</button>
 				<button class="btn btn-success" @click="conferma()">Conferma</button>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/riscaldi/components/show-riscaldi-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/riscaldi/components/show-riscaldi-info.ts
index 1a3f92c1..59bcf534 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/riscaldi/components/show-riscaldi-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/riscaldi/components/show-riscaldi-info.ts
@@ -16,7 +16,7 @@ import { recipeService } from "@/services/recipeService";
 export default class ShowRiscaldamentoSuperioreInfo extends Vue {
 
   recipe: Recipe.IRecipe = this.$store.getters.getCurrent();
-  show: string = "activeRS";
+  show: number = 0;
 
   @Prop()
   deferred: Deferred<boolean>;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/riscaldi/components/show-riscaldi-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/riscaldi/components/show-riscaldi-info.vue
index 11b3c8f6..00da8faa 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/riscaldi/components/show-riscaldi-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/riscaldi/components/show-riscaldi-info.vue
@@ -2,13 +2,13 @@
 	<div class="setup">
 		<modal type="riscaldi-info">
 			<div class="tab-header" slot="header-buttons">
-				<button :class="{'active':show == 'activeRI'}" @click="show = 'activeRI'">Riscaldi inferiori</button>
+				<button :class="{'active':show == 0}" @click="show = 0">Riscaldi inferiori</button>
 
-				<button :class="{'active':show == 'activeRS'}" @click="show = 'activeRS'">Riscaldi superiori</button>
+				<button :class="{'active':show == 1}" @click="show = 1">Riscaldi superiori</button>
 
 				<button
-					:class="{'active':show == 'activeSD'}"
-					@click="show = 'activeSD'"
+					:class="{'active':show == 2}"
+					@click="show = 2"
 				>Sostentamento/Decompressione</button>
 
 			</div>
@@ -17,9 +17,9 @@
 					<i class="fa fa-remove"></i>
 				</button>
 			</div>
-			<riscaldiinf v-if="show == 'activeRI'" :recipe="recipe"></riscaldiinf>
-			<riscaldisup v-if="show == 'activeRS'" :recipe="recipe"></riscaldisup>
-			<sostdecomp v-if="show == 'activeSD'" :recipe="recipe"></sostdecomp>
+			<riscaldiinf v-if="show == 0" :recipe="recipe"></riscaldiinf>
+			<riscaldisup v-if="show == 1" :recipe="recipe"></riscaldisup>
+			<sostdecomp v-if="show == 2" :recipe="recipe"></sostdecomp>
 			<footer>
 				<button class="btn" @click="annulla()">Annulla</button>
 				<button class="btn btn-success" @click="conferma()">Conferma</button>
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/vuoto/show-vuoto-info.ts b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/vuoto/show-vuoto-info.ts
index 5104e1f3..9f1506b7 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/vuoto/show-vuoto-info.ts
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/vuoto/show-vuoto-info.ts
@@ -27,7 +27,7 @@ import { recipeService } from "@/services/recipeService";
 export default class ShowVuotoInfo extends Vue {
 
   recipe: Recipe.IRecipe = this.$store.getters.getCurrent();
-  show: string = "principale";
+  show: number = 0;
 
   @Prop()
   deferred: Deferred<boolean>;
diff --git a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/vuoto/show-vuoto-info.vue b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/vuoto/show-vuoto-info.vue
index 17a3597d..2844d671 100644
--- a/Thermo.Active/wwwroot/src/app_modules_thermo/setup/vuoto/show-vuoto-info.vue
+++ b/Thermo.Active/wwwroot/src/app_modules_thermo/setup/vuoto/show-vuoto-info.vue
@@ -2,20 +2,20 @@
 	<div class="setup">
 		<modal type="vuoto-info">
 			<div class="tab-header" slot="header-buttons">
-				<button :class="{'active':show == 'principale'}" @click="show='principale'">Vuoto pricipale</button>
-				<button :class="{'active':show == 'diretto'}" @click="show='diretto'">Vuoto diretto</button>
-				<button :class="{'active':show == 'ausiliario'}" @click="show='ausiliario'">Vuoto ausiliario</button>
-				<button :class="{'active':show == 'prevuoto'}" @click="show='prevuoto'">Prevuoto</button>
+				<button :class="{'active':show == 0}" @click="show=0">Vuoto pricipale</button>
+				<button :class="{'active':show == 1}" @click="show=1">Vuoto diretto</button>
+				<button :class="{'active':show == 2}" @click="show=2">Vuoto ausiliario</button>
+				<button :class="{'active':show == 3}" @click="show=3">Prevuoto</button>
 			</div>
 			<div slot="header-buttons">
 				<button class="modal-close" @click="close()">
 					<i class="fa fa-remove"></i>
 				</button>
 			</div>
-			<vuotoprincipale v-if="show=='principale'" :recipe="recipe"></vuotoprincipale>
-			<vuotodiretto v-if="show=='diretto'" :recipe="recipe"></vuotodiretto>
-			<vuotoausiliario v-if="show=='ausiliario'" :recipe="recipe"></vuotoausiliario>
-			<prevuoto v-if="show=='prevuoto'" :recipe="recipe"></prevuoto>
+			<vuotoprincipale v-if="show==0" :recipe="recipe"></vuotoprincipale>
+			<vuotodiretto v-if="show==1" :recipe="recipe"></vuotodiretto>
+			<vuotoausiliario v-if="show==2" :recipe="recipe"></vuotoausiliario>
+			<prevuoto v-if="show==3" :recipe="recipe"></prevuoto>
 			<footer>
 				<button class="btn" @click="annulla()">Annulla</button>
 				<button class="btn btn-success" @click="conferma()">Conferma</button>