starred ?

Thermo.Active/wwwroot/assets/styles/base/paddle.less

@@ -159,6 +159,12 @@
   }
 }
 
+.starred-softkey {
+  &.active {
+    box-shadow: inset 0px 0px 0px 3px #1791ff;
+  }
+}
+
 .box-softkeys-prefered-footer {
   height: 65px;
   background-color: #002680;

Thermo.Active/wwwroot/assets/styles/style.css

@@ -4881,6 +4881,9 @@ article .box .body {
 .softkey.active {
   box-shadow: inset 0px 0px 0px 3px #1791ff;
 }
+.starred-softkey.active {
+  box-shadow: inset 0px 0px 0px 3px #1791ff;
+}
 .box-softkeys-prefered-footer {
   height: 65px;
   display: flex;

Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/processo.ts

@@ -1,25 +1,29 @@
 import Vue from 'vue';
 import Component from 'vue-class-component';
-import { Prop } from 'vue-property-decorator';
 import { messageService } from "@/_base/messageService";
-import { Modal, ModalHelper } from "@/components/modals";
-import gantt from "./gantt/gantt.vue";
-import { moduleService } from '@/services/moduleService';
+import { Modal as modal, ModalHelper } from "@/components/modals";
 import { CONFIGURATION } from '@/config';
-import zoom from "./gantt/zoomLevel.vue";
 import { store } from '@/store';
+import { dataService } from '@/services/dataService';
+import gantt from "./gantt/gantt.vue";
+import zoom from "./gantt/zoomLevel.vue";
+import softKey from "./softkey.vue";
+import { Hub } from '@/services';
 
 @Component({
   components: {
-    modal: Modal, gantt, zoom
+    modal, gantt, zoom, softKey
   }
 })
 export default class Processo extends Vue {
 
-  @Prop({ default: 25 })
-  actual: number;
-  @Prop({ default: 145 })
-  tot: number;
+  get actual(): number {
+    return store.state.prod.panel.numDone;
+  };
+
+  get tot(): number {
+    return store.state.prod.panel.numTarget;
+  };
 
   get blocks(): server.Modblock[] {
     return store.state.modules.blocks;
@@ -29,6 +33,8 @@ export default class Processo extends Vue {
 
   zoomStep = 1.2;
 
+  starred: { id: number }[] = []
+
   get gaugeData() {
     return store.state.machineStatus.gaugeData;
   }
@@ -40,11 +46,34 @@ export default class Processo extends Vue {
   showAllBlocks: boolean = false;
 
   async mounted() {
-
     let c = await CONFIGURATION;
     this.showAllBlocks = c.allUIVisible;
-
-
+    this.starred = await dataService.GetStarredSoftKeysConfiguration();
   }
 
+  confirmationDelegate = null;
+  waitingForSftkConfirm = false;
+  softKeyChanged(id, confirm) {
+    if (!confirm)
+      Hub.Current.sendUserSoftKey(id);
+    else {
+      this.confirmationDelegate = () => {
+        Hub.Current.sendUserSoftKey(id);
+      };
+      this.waitingForSftkConfirm = true;
+    }
+  }
+
+  sendKeyCancel() {
+    this.confirmationDelegate = null;
+  }
+  sendKeyConfirm() {
+    if (this.confirmationDelegate)
+      this.confirmationDelegate();
+    this.confirmationDelegate = null;
+  }
+
+  getSoftKeyStatus(id) {
+    return this.$store.getters.getSoftKeyStatus(id);
+  }
 }

Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/processo.vue

@@ -5,30 +5,19 @@
 			:title="'processo_lbl_title' | localize('Attività attuale (es. attesa spostamento assi)')"
 		>
 			<div class="tab-header" slot="header-buttons">
-				<button>
-					<img src="assets/icons/png/star.png" />
-					<span>Opzioni di lavorazione</span>
-				</button>
-				<button>
-					<img src="assets/icons/png/star.png" />
-					<span>Pirometro</span>
-				</button>
-				<button>
-					<img src="assets/icons/png/star.png" />
-					<span>Attivazione riscaldi</span>
-				</button>
-				<button>
-					<img src="assets/icons/png/star.png" />
-					<span>Riscaldo +10 secondi</span>
-				</button>
-				<button>
-					<img src="assets/icons/png/star.png" />
-					<span>Risclado -10 secondi</span>
-				</button>
-				<button>
-					<img src="assets/icons/png/star.png" />
-					<span>Label pulsante opzionale</span>
-				</button>
+				<template v-for="(b,idx) in starred">
+					<soft-key
+						v-if="getSoftKeyStatus(b.id) && getSoftKeyStatus(b.id).visible"
+						:id="b.id"
+						:key="idx"
+						:title="'softkey_' + b.id | localize('softkey_' + b.id)"
+						:type="b.type"
+						v-model="getSoftKeyStatus(b.id).value"
+						:active="getSoftKeyStatus(b.id).active"
+						@click="softKeyChanged(b.id, b.operatorConfirmationNeeded)"
+						@checkChanged="softKeyChanged(b.id, b.operatorConfirmationNeeded)"
+					></soft-key>
+				</template>
 				<label>{{actual}}/{{tot}}</label>
 			</div>
 			<gantt

Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/softkey.ts

@@ -0,0 +1,26 @@
+import Vue from "vue";
+import Component from "vue-class-component";
+import { Prop } from "vue-property-decorator";
+
+@Component({})
+export default class SoftKey extends Vue {
+
+  @Prop({ default: "" })
+  title: string;
+
+  @Prop({ default: 0 })
+  type: number;
+
+  @Prop({ default: false })
+  value: boolean;
+
+  @Prop({ default: false })
+  active: boolean;
+
+  @Prop({ default: null })
+  id: number;
+
+  doclick() {
+    this.$emit('click');
+  }
+}

Thermo.Active/wwwroot/src/app_modules_thermo/processo/components/softkey.vue

@@ -0,0 +1,7 @@
+<template>
+	<button class="starred-softkey" @click="doclick()" :class="{ active: active }">
+		<img src="assets/icons/png/star.png" />
+		<span>{{title}}</span>
+	</button>
+</template>
+<script src="./softkey.ts" lang="ts"/>

Thermo.Active/wwwroot/src/services/dataService.ts

@@ -14,6 +14,11 @@ export class DataService extends baseRestService {
     machineInfoActions.updateMachineInfo(store, { softKeys: result })
   }
 
+  async GetStarredSoftKeysConfiguration(): Promise<{ id: number }[]> {
+    let result = await this.Get<{ id: number }[]>((await this.BASE_URL()) + "/api/starred_softkey/get");
+    return result;
+  }
+
   async AddUserSoftkeyFavorite(model: number) {
     machineInfoActions.addSoftKeysFavorites(store, model);
     let result = await this.Put<number[]>((await this.BASE_URL()) + "/api/user_softkey/favorite", machineInfoStore.state.softkeysFavorites, true);