create maintenance

Step/wwwroot/src/components/maintenance.ts

@@ -1,6 +1,6 @@
 import Vue from "vue";
 import Component from "vue-class-component";
-import {MaintenanceProgress, ModalHelper} from "src/modules/base-components";
+import {MaintenanceProgress, ModalHelper, CreateMaintenance} from "src/modules/base-components";
 import {maintenanceCard} from "src/modules/base-components/cards";
 import { MaintenanceService } from "../services/maintenanceService";
 import { store, AppModel } from "src/store";
@@ -81,14 +81,17 @@ export default class Maintenance extends Vue {
         }
     }
 
-    public test(){
+    public createMaintenance(){
+        ModalHelper.ShowModal(CreateMaintenance);
+    }
+
+    public selectMaintenance(m){
         if(this.selectedMaintenance){
             this.selectedMaintenance = null;
             this.enableMaintenance = true;
         }
         else{
-            
-            this.selectedMaintenance = 1;
+            this.selectedMaintenance = m;
             this.enableMaintenance = false;
         }
     }

Step/wwwroot/src/components/maintenance.vue

@@ -33,16 +33,16 @@
                     </tr>
                   </thead>
                   <tbody class="scrollable">
-                    <tr v-for="m in maintenances" :key="m.id" :class="{selected: selectedMaintenance == 1}" @click="test()">
+                    <tr v-for="m in maintenances" :key="m.id" :class="{selected: selectedMaintenance == m}" @click="selectMaintenance(m)">
                       <td colspan="1">{{getTitleMaintenance(m.createdByCms, m.id, m.title)}}</td>
-                      <td colspan="1"><maintenance-progress :class="{selected: selectedMaintenance == 1}" :progress="m.percentageOfCompletion"></maintenance-progress></td>
+                      <td colspan="1"><maintenance-progress :class="{selected: selectedMaintenance == m}" :progress="m.percentageOfCompletion"></maintenance-progress></td>
                       <td colspan="1">{{expirationDate(m.type, m.missingDays)}}</td>
                       <td colspan="1">{{getState(m.percentageOfCompletion)}}</td>
                     </tr>
                   </tbody>
                   <tfoot>
                     <tr>
-                      <td colspan="4"><div class="group-label-button">{{'maintenance_label_create_intervention' | localize("Crea un intervento di manutenzione")}}<button class="btn"><i class="fa fa-plus"></i></button></div></td>
+                      <td colspan="4"><div class="group-label-button">{{'maintenance_label_create_intervention' | localize("Crea un intervento di manutenzione")}}<button class="btn" @click="createMaintenance()"><i class="fa fa-plus"></i></button></div></td>
                     </tr>
                   </tfoot>
                 </table>

Step/wwwroot/src/modules/base-components/index.js

@@ -13,6 +13,7 @@ import card from "./cards/card.vue";
 import ConfirmModal from "./modal-confirm.vue";
 import MaintenanceProgress from "./maintenance-progress.vue";
 import LoadDepot from "./load-depot.vue";
+import CreateMaintenance from "../create-maintenance.vue";
 
 
 export {
@@ -30,5 +31,6 @@ export {
     AccordionMaintenance,
     ConfirmModal,
     MaintenanceProgress,
-    LoadDepot
+    LoadDepot,
+    CreateMaintenance
 };

Step/wwwroot/src/modules/create-maintenance.vue

@@ -1,48 +1,82 @@
 <template>
   <modal type="create-maintenance" :title="'create_maintenance_lbl_title' | localize('Creazione intervento di manutenzione')">
-    <button class="close" slot="header-buttons"><i class="fa fa-remove"></i></button>
+    <button class="close" slot="header-buttons" @click="close()"><i class="fa fa-remove"></i></button>
     <div class="typology">
         <label class="typology_lbl">{{'create_maintenance_lbl_typology' | localize("Tipologia")}}</label>
         <div class="radiobutton">
-            <input type="radio" id="datefixed" name="radio-group" v-model="test" value="datefixed"><label for="datefixed">Data Fissa</label>
-            <input type="radio" id="time" name="radio-group" v-model="test" value="time"><label for="time">Temporale</label>
+            <input type="radio" id="datefixed" name="radio-group" v-model="newMaintenance.type" value="EXP_DATE"><label for="datefixed">Data Fissa</label>
+            <input type="radio" id="time" name="radio-group" v-model="newMaintenance.type" value="TIME_INTERVAL"><label for="time">Temporale</label>
         </div>
     </div>
         <div class="title">
             <label class="title_lbl">{{'create_maintenance_lbl_title' | localize("Titolo")}}</label>
-            <input type="text">
+            <input type="text" v-model="newMaintenance.title">
         </div>
         <div class="description">
             <label class="description_lbl">{{'create_maintenance_lbl_description' | localize("Descrizione")}}</label>
-            <textarea></textarea>
+            <textarea v-model="newMaintenance.description"></textarea>
         </div>
-        <div class="time" v-if="test == 'datefixed'">
+        <div class="time" v-if="newMaintenance.type == 'EXP_DATE'">
             <div class="date">
                 <label class="date_lbl">{{'create_maintenance_lbl_date' | localize("Data")}}</label>
-                <input type="date">
+                <input type="date" v-model="newMaintenance.date">
             </div>
             <div class="end_time">
                 <label class="end_time_lbl">{{'create_maintenance_lbl_end_time' | localize("Ora fine")}}</label>
-                <input type="time">
+                <input type="time" v-model="newMaintenance.time">
             </div>
         </div>
-        <div class="repeat" v-if="test == 'time'">
+        <div class="repeat" v-if="newMaintenance.type == 'TIME_INTERVAL'">
             <label class="repeat_lbl">{{'create_maintenance_lbl_repeat' | localize("Ripeti ogni")}}</label>
             <div class="repeat_input">
-                <input type="text">
-                <select>
-                    <option>{{'create_maintenance_repeat_hour' | localize("ore")}}</option>
-                    <option>{{'create_maintenance_repeat_day' | localize("giorni")}}</option>
-                    <option>{{'create_maintenance_repeat_months' | localize("mesi")}}</option>
+                <input type="text" v-model="newMaintenance.interval">
+                <select v-model="newMaintenance.unitOfMeasure">
+                    <option value="mm">{{'create_maintenance_repeat_minutes' | localize("minuti")}}</option>
+                    <option value="H">{{'create_maintenance_repeat_hour' | localize("ore")}}</option>
+                    <option value="D">{{'create_maintenance_repeat_day' | localize("giorni")}}</option>
+                    <option value="M">{{'create_maintenance_repeat_months' | localize("mesi")}}</option>
                 </select>
             </div>
         </div>
     <footer>
       <div class="pull-right">
-        <button class="btn">{{'create_maintenance_btn_cancel' | localize("Annulla")}}</button>
-        <button class="btn btn-success">{{'create_maintenance_btn_confirm' | localize("Conferma")}}</button>
+        <button class="btn" @click="close()">{{'create_maintenance_btn_cancel' | localize("Annulla")}}</button>
+        <button class="btn btn-success" @click="save(newMaintenance)">{{'create_maintenance_btn_confirm' | localize("Conferma")}}</button>
       </div>
     </footer>
   </modal>
 </template>
-<script src="./create-maintenance.ts" lang="ts"></script>
+<script>
+import Modal from "src/modules/base-components/modal.vue";
+import { ModalHelper } from "../modules/base-components/ModalHelper.ts";
+import { Factory, MessageService } from '../_base';
+import { MaintenanceService } from "../services/maintenanceService";
+import moment from "moment";
+export default {
+  components: { modal: Modal },
+//   props: {
+//     datafixed: {default:"datafixed"}
+//   },
+  data: function(){
+      return {
+          newMaintenance: {type: "EXP_DATE"}
+      }
+  },
+  methods:{
+    close(){
+        Factory.Get(MessageService).deleteChannel("esc_pressed");
+        ModalHelper.HideModal();
+    },
+    async save(maintenance){
+        debugger
+        if(maintenance.type == "EXP_DATE"){
+            let dateTime = moment(maintenance.date + ' ' + maintenance.time);
+            maintenance.deadline = dateTime.toISOString();
+        }
+        await new MaintenanceService().SetMaintenance(maintenance);
+        this.close();
+    }
+  }
+};
+</script>
+<!--<script src="./create-maintenance.ts" lang="ts"></script>-->

Step/wwwroot/src/services/maintenanceService.ts

@@ -9,4 +9,9 @@ export class MaintenanceService extends baseRestService {
       let result = await this.Get<server.Maintenance[]>(this.BASE_URL + "maintenances");
       maintenanceActions.updateMaintenances(store, result);
   }
+  async SetMaintenance(model){
+    debugger
+    let result = await this.Post<server.Maintenance>(this.BASE_URL + "maintenance", model, true);
+    maintenanceActions.updateMaintenance(store, result);
+  }
 }

Step/wwwroot/src/store/maintenance.store.ts

@@ -14,7 +14,7 @@ export const maintenanceStore = {
   } as MaintenanceStoreModel,
   mutations: {
     UpdateMaintenance(store, model: server.Maintenance) {
-        
+        debugger
         store._maintenances.set(model.id, model);
         store.maintenances = Array.from(store._maintenances.values());
       },