ayanova/src/views/inv-part-stock-levels.vue

@@ -16,38 +16,68 @@
               data-cy="selectedPartId"
             ></gz-pick-list>
           </v-col>
-          <v-col cols="12" sm="6" v-if="!formState.readOnly">
+          <v-col cols="12">
-            <v-textarea
+            <gz-pick-list
-              outlined
+              v-model="selectedPartWarehouseId"
-              v-model="newSerial"
+              :ayaType="ayaTypes().PartWarhouse"
-              :label="$ay.t('Add')"
+              :showEditIcon="true"
-              clearable
+              :label="$ay.t('PartWarehouse')"
-              :rows="$vuetify.breakpoint.xs ? 3 : 10"
+              ref="selectedPartWarehouseId"
-              ref="newSerial"
+              data-cy="selectedPartWarehouseId"
-              data-cy="newSerial"
+              @input="addItem()"
-              append-outer-icon="$ayiPlus"
+            ></gz-pick-list>
-              @click:append-outer="addItem()"
-            ></v-textarea>
           </v-col>
+
           <v-col cols="12" sm="6" class="mt-n5">
-            <v-simple-table>
+            <v-simple-table class="my-6">
               <template v-slot:default>
                 <thead>
                   <tr>
-                    <th>{{ $ay.t("PartSerialNumbersAvailable") }}</th>
+                    <th class="text-left">
-                    <th />
+                      {{ $ay.t("PartList") }}
+                    </th>
+                    <th class="text-left">
+                      {{ $ay.t("WorkOrderItemPartQuantity") }}
+                    </th>
                   </tr>
                 </thead>
 
                 <tbody>
-                  <tr v-for="(item, index) in sortedList()" :key="index">
+                  <!-- Note the use of partid which is unique plus quantity, without that quantity Vue doesn't update the display of quantity if it's changed by the quanittyChanged method -->
+                  <tr
+                    v-for="item in sortedList()"
+                    :key="
+                      item.partWarehouseId.toString() +
+                        item.minimumQuantity.toString()
+                    "
+                  >
                     <td>
-                      {{ item }}
+                      {{ item.partDisplay }}
+                      <template v-if="$vuetify.breakpoint.xs">
+                        <div class="my-3">
+                          <v-icon class="ml-2" @click="openItem(item)">
+                            $ayiEdit
+                          </v-icon>
+                          <v-icon class="ml-6" @click="removeItem(item)">
+                            $ayiTrashAlt
+                          </v-icon>
+                        </div>
+                      </template>
+                      <template v-else>
+                        <v-icon class="ml-2" @click="openItem(item)">
+                          $ayiEdit
+                        </v-icon>
+                        <v-icon class="ml-6" @click="removeItem(item)">
+                          $ayiTrashAlt
+                        </v-icon>
+                      </template>
                     </td>
                     <td>
-                      <v-icon class="ml-6" @click="removeItem(index)">
+                      <gz-decimal
-                        $ayiTrashAlt
+                        v-model="item.minimumQuantity"
-                      </v-icon>
+                        :readonly="formState.readOnly"
+                        @input="quantityChanged(item)"
+                      ></gz-decimal>
                     </td>
                   </tr>
                 </tbody>
@@ -126,10 +156,7 @@ export default {
   data() {
     return {
       formCustomTemplateKey: FORM_CUSTOM_TEMPLATE_KEY,
-      obj: {
+      obj: [],
-        id: 0,
-        name: null
-      },
       formState: {
         ready: false,
         dirty: false,
@@ -143,7 +170,8 @@ export default {
       rights: window.$gz.role.defaultRightsObject(),
       ayaType: window.$gz.type.Part,
       selectedPartId: Number(this.$route.params.recordid),
-      newSerial: null
+      selectedPartWarehouseId: null,
+      minimumQuantity: 1
     };
   },
 
@@ -166,57 +194,86 @@ export default {
   },
   methods: {
     sortedList: function() {
-      if (this.obj == null || this.obj.length == 0) {
+      function compare(a, b) {
-        return [];
+        if (a.partDisplay < b.partDisplay) return -1;
+        if (a.partDisplay > b.partDisplay) return 1;
+        return 0;
       }
 
-      return this.obj.slice().sort();
+      return this.obj.items.slice().sort(compare);
     },
-    removeItem: function(index) {
+    addItem: function() {
-      this.obj.splice(index, 1);
+      let vm = this;
-      this.formState.dirty = true;
+      let selectedPartWarehouse = vm.$refs.partWarehouseId.getFullSelectionValue();
+      if (selectedPartWarehouse == null || selectedPartWarehouse.Id == null) {
+        return;
+      }
+      let index = vm.obj.items.findIndex(
+        z => z.partWarehouseId == selectedPartWarehouse.Id
+      );
+      if (index != -1) {
+        //already in the list
+        return;
+      }
+
+      vm.obj.items.push({
+        partId: vm.$route.params.recordid,
+        partWarehouseId: selectedPartWarehouse.Id,
+        partWareHouseDisplay: selected.name,
+        quantity: 1
+      });
+
+      vm.formState.dirty = true;
+    },
+    removeItem: function(item) {
+      let vm = this;
+      let index = vm.obj.items.findIndex(
+        z => z.partWarehouseId == item.partWarehouseId
+      );
+      if (index == -1) {
+        return;
+      }
+      vm.obj.items.splice(index, 1);
+      vm.formState.dirty = true;
+    },
+    // openItem: function(item) {
+    //   window.$gz.eventBus.$emit("openobject", {
+    //     type: window.$gz.type.Part,
+    //     id: item.partId
+    //   });
+    // },
+    quantityChanged: function(item) {
+      let vm = this;
+      if (item.minimumQuantity == null || item.minimumQuantity < 1) {
+        let index = vm.obj.items.findIndex(
+          z => z.partWarehouseId == item.partWarehouseId
+        );
+        if (index == -1) {
+          return;
+        }
+        item.minimumQuantity = 1;
+      }
+      vm.formState.dirty = true;
     },
     canSave: function() {
       return this.formState.valid && this.formState.dirty;
     },
-    addItem: function() {
-      if (this.newSerial == null || this.newSerial == "") {
-        return;
-      }
-      //add to list, may be in various formats so handle that
-      let splitted = this.newSerial.split(/[\s,]+/).filter(Boolean);
-      splitted = [...splitted, ...this.obj];
-      let uniqueItems = [...new Set(splitted)];
-      uniqueItems.sort();
-      this.obj = uniqueItems;
-      this.formState.dirty = true;
-      this.newSerial = null;
-    },
     ayaTypes: function() {
       return window.$gz.type;
     },
     form() {
       return window.$gz.form;
     },
-    // fieldValueChanged(ref) {
+    async getDataFromApi() {
-    //   if (
-    //     this.formState.ready &&
-    //     !this.formState.loading &&
-    //     !this.formState.readOnly
-    //   ) {
-    //     window.$gz.form.fieldValueChanged(this, ref);
-    //   }
-    // },
-    async getDataFromApi(recordId) {
       let vm = this;
       window.$gz.form.setFormState({
         vm: vm,
         loading: true
       });
-      if (!recordId) {
+      if (!vm.$route.params.recordid) {
         throw new Error(FORM_KEY + "::getDataFromApi -> Missing recordID!");
       }
-      let url = `part/serials/${recordId}`;
+      let url = `part/stock-levels/${vm.$route.params.recordid}`;
       try {
         window.$gz.form.deleteAllErrorBoxErrors(vm);
 
@@ -261,8 +318,7 @@ export default {
           vm: vm,
           loading: true
         });
-        // let url = `part/serials/${vm.$route.params.recordid}`;
+        let url = `part/stock-levels/${vm.$route.params.recordid}`;
-        let url = `part/serials/${vm.$route.params.recordid}`;
         //clear any errors vm might be around from previous submit
         window.$gz.form.deleteAllErrorBoxErrors(vm);
 
@@ -272,27 +328,8 @@ export default {
           vm.formState.serverError = res.error;
           window.$gz.form.setErrorBoxErrors(vm);
         } else {
-          vm.obj = res.data; //updated list of serials from server
+          vm.obj = res.data; //updated list of stock levels from server
-          //PRETTY SURE DON"T NEED ANY OF THIS
-          //   //Logic for detecting if a post or put: if id then it was a post, if no id then it was a put
-          //   if (res.data.id) {
-          //     //POST - whole new object returned
-          //     vm.obj = res.data;
-          //     //Change URL to new record
-          //     //NOTE: will not cause a page re-render, almost nothing does unless forced with a KEY property or using router.GO()
 
-          //     this.$router.push({
-          //       name: "project-edit",
-          //       params: {
-          //         recordid: res.data.id,
-          //         obj: res.data // Pass data object to new form
-          //       }
-          //     });
-          //   } else {
-          //     //PUT - only concurrency token is returned (**warning, if server changes object other fields then this needs to act more like POST above but is more efficient this way**)
-          //     //Handle "put" of an existing record (UPDATE)
-          //     vm.obj.concurrency = res.data.concurrency;
-          //   }
           //Update the form status
           window.$gz.form.setFormState({
             vm: vm,
@@ -344,14 +381,9 @@ function generateMenu(vm) {
     isMain: false,
     readOnly: vm.formState.readOnly,
     icon: null,
-    title: "PartSerialNumbersAvailable",
+    title: "PartStockingLevels",
-    helpUrl: "form-inv-part-serials",
+    helpUrl: "form-inv-part-stock-levels",
-    formData: {
+    formData: {},
-      // ayaType: window.$gz.type.Par,
-      // recordId: vm.$route.params.recordid,
-      //  formCustomTemplateKey: FORM_CUSTOM_TEMPLATE_KEY,
-      // recordName: vm.obj.name
-    },
     menuItems: []
   };
 
@@ -375,7 +407,6 @@ let JUST_DELETED = false;
 //
 async function initForm(vm) {
   await fetchTranslatedText(vm);
-  //await window.$gz.formCustomTemplate.get(FORM_CUSTOM_TEMPLATE_KEY);
 }
 
 //////////////////////////////////////////////////////////
@@ -383,8 +414,6 @@ async function initForm(vm) {
 // Ensures UI translated text is available
 //
 async function fetchTranslatedText(vm) {
-  await window.$gz.translation.cacheTranslations([
+  await window.$gz.translation.cacheTranslations(["PartStockingLevels"]);
-    "PartSerialNumbersAvailable"
-  ]);
 }
 </script>