re-factor / cleanup

ayanova/src/components/work-order-item-part-requests.vue

@@ -44,10 +44,10 @@
         <!-- ############################################################### -->
         <v-col cols="12" class="mb-10">
           <v-data-table
+            v-model="selectedRow"
             :headers="headerList"
             :items="itemList"
             item-key="index"
-            v-model="selectedRow"
             class="elevation-1"
             disable-pagination
             disable-filtering
@@ -56,9 +56,9 @@
             data-cy="partRequestsTable"
             dense
             :item-class="itemRowClasses"
-            @click:row="handleRowClick"
             :show-select="$vuetify.breakpoint.xs"
             single-select
+            @click:row="handleRowClick"
           >
             <template v-slot:[`item.purchaseOrderOnOrderViz`]="{ item }">
               <v-simple-checkbox
@@ -79,8 +79,8 @@
         <v-btn
           v-if="canDelete && isDeleted"
           large
-          @click="unDeleteItem"
           color="primary"
+          @click="unDeleteItem"
           >{{ $ay.t("Undelete")
           }}<v-icon right large>$ayiTrashRestoreAlt</v-icon></v-btn
         >
@@ -90,15 +90,6 @@
 </template>
 <script>
 export default {
-  created() {
-    this.setDefaultView();
-  },
-  data() {
-    return {
-      activeItemIndex: null,
-      selectedRow: []
-    };
-  },
   props: {
     value: {
       default: null,
@@ -117,95 +108,11 @@ export default {
       type: Number
     }
   },
-  watch: {
-    activeWoItemIndex(val, oldVal) {
-      if (val != oldVal) {
-        this.setDefaultView();
-      }
-    },
-    gotoIndex(val, oldVal) {
-      if (val != oldVal) {
-        this.selectedRow = [{ index: val }];
-        this.activeItemIndex = val;
-        this.$nextTick(() => {
-          const el = this.$refs.partrequesttopform;
-          if (el) {
-            el.scrollIntoView({ behavior: "smooth" });
-          }
-        });
-      }
-    }
-  },
-  methods: {
-    openPO(item) {
-      if (
-        item != null &&
-        item.purchaseOrderIdViz != null &&
-        item.purchaseOrderIdViz != 0
-      ) {
-        window.$gz.eventBus.$emit("openobject", {
-          type: window.$gz.type.PurchaseOrder,
-          id: item.purchaseOrderIdViz
-        });
-      }
-    },
-    unDeleteItem() {
-      this.value.items[this.activeWoItemIndex].partRequests[
-        this.activeItemIndex
-      ].deleted = false;
-      this.setDefaultView();
-    },
-    deleteItem() {
-      this.value.items[this.activeWoItemIndex].partRequests[
-        this.activeItemIndex
-      ].deleted = true;
-      this.setDefaultView();
-      this.$emit("change");
-    },
-    deleteAllItem() {
-      this.value.items[this.activeWoItemIndex].partRequests.forEach(
-        z => (z.deleted = true)
-      );
-      this.setDefaultView();
-      this.$emit("change");
-    },
-    setDefaultView: function() {
-      //if only one record left then display it otherwise just let the datatable show what the user can click on
-      if (this.value.items[this.activeWoItemIndex].partRequests.length == 1) {
-        this.selectedRow = [{ index: 0 }];
-        this.activeItemIndex = 0;
-      } else {
-        this.selectedRow = [];
-        this.activeItemIndex = null; //select nothing in essence resetting a child selects and this one too clearing form
-      }
-    },
-    handleRowClick: function(item) {
-      this.activeItemIndex = item.index;
-      this.selectedRow = [{ index: item.index }];
-    },
-    form() {
-      return window.$gz.form;
-    },
-    itemRowClasses: function(item) {
-      let ret = "";
-      const isDeleted =
-        this.value.items[this.activeWoItemIndex].partRequests[item.index]
-          .deleted === true;
-
-      const hasError = this.form().childRowHasError(
-        this,
-        `Items[${this.activeWoItemIndex}].PartRequests[${item.index}].`
-      );
-
-      if (isDeleted) {
-        ret += this.form().tableRowDeletedClass();
-      }
-      if (hasError) {
-        ret += this.form().tableRowErrorClass();
-      }
-      return ret;
-    }
-    //---
+  data() {
+    return {
+      activeItemIndex: null,
+      selectedRow: []
+    };
   },
   computed: {
     isDeleted: function() {
@@ -386,6 +293,99 @@ export default {
     }
 
     //----
+  },
+  watch: {
+    activeWoItemIndex(val, oldVal) {
+      if (val != oldVal) {
+        this.setDefaultView();
+      }
+    },
+    gotoIndex(val, oldVal) {
+      if (val != oldVal) {
+        this.selectedRow = [{ index: val }];
+        this.activeItemIndex = val;
+        this.$nextTick(() => {
+          const el = this.$refs.partrequesttopform;
+          if (el) {
+            el.scrollIntoView({ behavior: "smooth" });
+          }
+        });
+      }
+    }
+  },
+  created() {
+    this.setDefaultView();
+  },
+  methods: {
+    openPO(item) {
+      if (
+        item != null &&
+        item.purchaseOrderIdViz != null &&
+        item.purchaseOrderIdViz != 0
+      ) {
+        window.$gz.eventBus.$emit("openobject", {
+          type: window.$gz.type.PurchaseOrder,
+          id: item.purchaseOrderIdViz
+        });
+      }
+    },
+    unDeleteItem() {
+      this.value.items[this.activeWoItemIndex].partRequests[
+        this.activeItemIndex
+      ].deleted = false;
+      this.setDefaultView();
+    },
+    deleteItem() {
+      this.value.items[this.activeWoItemIndex].partRequests[
+        this.activeItemIndex
+      ].deleted = true;
+      this.setDefaultView();
+      this.$emit("change");
+    },
+    deleteAllItem() {
+      this.value.items[this.activeWoItemIndex].partRequests.forEach(
+        z => (z.deleted = true)
+      );
+      this.setDefaultView();
+      this.$emit("change");
+    },
+    setDefaultView: function() {
+      //if only one record left then display it otherwise just let the datatable show what the user can click on
+      if (this.value.items[this.activeWoItemIndex].partRequests.length == 1) {
+        this.selectedRow = [{ index: 0 }];
+        this.activeItemIndex = 0;
+      } else {
+        this.selectedRow = [];
+        this.activeItemIndex = null; //select nothing in essence resetting a child selects and this one too clearing form
+      }
+    },
+    handleRowClick: function(item) {
+      this.activeItemIndex = item.index;
+      this.selectedRow = [{ index: item.index }];
+    },
+    form() {
+      return window.$gz.form;
+    },
+    itemRowClasses: function(item) {
+      let ret = "";
+      const isDeleted =
+        this.value.items[this.activeWoItemIndex].partRequests[item.index]
+          .deleted === true;
+
+      const hasError = this.form().childRowHasError(
+        this,
+        `Items[${this.activeWoItemIndex}].PartRequests[${item.index}].`
+      );
+
+      if (isDeleted) {
+        ret += this.form().tableRowDeletedClass();
+      }
+      if (hasError) {
+        ret += this.form().tableRowErrorClass();
+      }
+      return ret;
+    }
+    //---
   }
 };
 </script>