Last Commit

src/App.businesslogic.ts

@@ -109,4 +109,4 @@ appInfo.machines = [
     mach3,
     mach3
 ]
-appModelActions.Setup(store,appInfo);  
+//appModelActions.Setup(store,appInfo);  

src/App.ts

@@ -4,6 +4,7 @@ import { Watch } from "vue-property-decorator";
 import Header from "./components/base/app-header.vue";
 import Footer from "./components/base/app-footer.vue";
 import Setup from "./components/base/app-setup.vue";
+import { store,AppModelActionsInterface } from "./store/app.store";
 
 import 'jquery';
 import 'popper.js';
@@ -14,7 +15,7 @@ import '@fortawesome/fontawesome-free/css/all.css';
 import './assets/style/style.css';
 import { Service } from "./service";
 
-import { AppModel,appModelActions  } from "./store/app.store";
+import { AppModel,appModelActions} from "./store/app.store";
 
 @Component({
   name: "app",
@@ -54,12 +55,16 @@ export default class app extends Vue {
   loadingOk(){    
     this.loadingConfigurationRunning = false;
     this.loadingConfigurationError = false;  
-    this.intervalHandle = setInterval(this.loadMachineStatus,1000);
+    this.loadMachineStatus(); 
+    this.intervalHandle = setInterval(this.loadMachineStatus,(store.state as AppModel).serverRequestTime);
+  }
+
+  requestError(err){
+    appModelActions.SetErrorDuringRequest(store,true);  
   }
 
   loadMachineStatus(){
-    //this._service.getMachineStatus();
-    console.log("Test");
+    this._service.getMachineStatus().then().catch(this.requestError);
   }
   
 };

src/assets/style/style.css

@@ -37,6 +37,15 @@
   display: flex;
   justify-content: space-between;
 }
+.footer .container .logo {
+  width: 260px;
+}
+.footer .container .error {
+  color: #ec0f0f;
+  margin-left: 1em;
+  font-size: 1.4em;
+  cursor: pointer;
+}
 .footer .logo-company {
   max-height: 85%;
 }

src/components/base/app-footer.ts

@@ -1,6 +1,7 @@
 import Vue from "vue";
 import Component from "vue-class-component";
-import { store,AppModel  } from "../../store/app.store";
+import { store,AppModel, appModelActions  } from "../../store/app.store";
+import moment from "moment";
 
 @Component({ name: "app-footer", components: { } })
 export default class AppFooter extends Vue {
@@ -19,4 +20,24 @@ export default class AppFooter extends Vue {
     return (store.state as AppModel).copyright;
   }
 
+  private get errorOnRequest(){
+    return (store.state as AppModel).errorServerRequest;
+  }
+  private get serverRequestTime(){
+    return "TRefresh: " + (store.state as AppModel).serverRequestTime;
+  }
+
+  private get lastRequestTime(){
+    let d = (store.state as AppModel).lastServerRequest;
+    if(d)
+      return moment().format('HH:mm:ss');
+    else
+      return null;
+  }
+  
+  private resetError(){
+    appModelActions.SetErrorDuringRequest(store,false);
+  }
+
+
 };

src/components/base/app-footer.vue

@@ -2,10 +2,8 @@
   <footer class="footer">
     <div class="container">
       <span>{{appName}}</span>
-      <span>
-        {{appCopyright}}
-        <img src="../../assets/images/logoSteamware.png" class="logo-company">
-      </span>
+      <span @dblclick="resetError" :title="serverRequestTime"><i class="far fa-clock"></i> {{lastRequestTime}} <i class="fas fa-exclamation-triangle error" v-if="errorOnRequest"></i></span>
+      <span class="logo">{{appCopyright}}<img src="../../assets/images/logoSteamware.png" class="logo-company"></span>
     </div>
   </footer>
 </template>

src/less/footer.less

@@ -19,6 +19,16 @@
     margin-left: auto;
     display: flex;
     justify-content: space-between;
+
+    .logo{
+      width: 260px;
+    }
+    .error{
+      color: rgb(236, 15, 15);
+      margin-left: 1em;
+      font-size: 1.4em;
+      cursor: pointer;
+    }
   }
   .logo-company{
     max-height: 85%;

src/service/index.ts

@@ -14,8 +14,9 @@ export class Service extends baseRestService {
 
   async getMachineStatus() {
     let result = await this.Get(this.DEVELOP_SERVER + "/MSE/Machines") as Array<machineModel>;
+    appModelActions.Setup(store,{lastServerRequest : new Date()});   
     if(result)
-      appModelActions.Setup(store,{machines:result});   
+      appModelActions.UpdateMachines(store,result);   
   }
 
 }

src/store/app.store.ts

@@ -43,11 +43,16 @@ export interface AppModel {
   machines?: Array<machineModel>;
   zoom: number;
   animTickTime: number;
+  serverRequestTime: number;
+  lastServerRequest: Date;
+  errorServerRequest: Boolean;
 }
 
 // Avaiable Actions for this Store as Interface
 export interface AppModelActionsInterface {
   Setup(context, appModel);
+  UpdateMachines(context, machines);
+  SetErrorDuringRequest(context, errorValue);
 }
 
 export interface MachineGetters{
@@ -65,7 +70,10 @@ const _store = {
     machines: [],
     zoom: 100,
     animTickTime: 1000,
+    serverRequestTime: 60000,
     _machines: new Map<string, machineModel>(),
+    lastServerRequest: null,
+    errorServerRequest:false
   } as AppModel,
 
   getters: {
@@ -76,13 +84,48 @@ const _store = {
       for (const key in appModel) {
         store[key] = appModel[key]
       }
+    }, 
+    setErrorDuringRequest(store, errorValue:Boolean) {
+      store.errorServerRequest = errorValue;
+    },       
+    updateMachines(store, machines:Array<machineModel>) {
+      let changed = false;
+      for (const key in machines) {
+        const element = machines[key];
+
+        //Fix Errors in Swagger
+        element.lastUpdate = new Date(element.lastUpdate);
+        element.dataInizioODL = new Date(element.dataInizioODL);
+        
+        //Set only changes
+        let elInStore = store._machines.get(element.idxMacchina);
+        if(elInStore){
+          if(elInStore.semaforo != element.semaforo || elInStore.lastUpdate != element.lastUpdate){
+            changed = true;
+            store._machines.set(element.idxMacchina,element);
+          }
+        }
+        else{
+          changed = true;
+          store._machines.set(element.idxMacchina,element);
+        }
+          store._machines.set(element.idxMacchina,element);
+      }
+      if(changed)
+        store.machines = Array.from(store._machines.values());
     }
   },
 
   actions: {
     Setup(context,appModel) {
       context.commit("setup", appModel);
-    }
+    },
+    UpdateMachines(context,machines) {
+      context.commit("updateMachines", machines);
+    },
+    SetErrorDuringRequest(context, errorValue) {
+      context.commit("setErrorDuringRequest", errorValue);
+    },   
   } as AppModelActionsInterface
 };