mycomponents/page/container/record 文件迁移Vue2升级Vue3 8/2-10/25

src/pages/container/record/containerUnBindRecord.vue

@@ -56,111 +56,97 @@ import winScanContainer from '@/mycomponents/scan/winScanContainer.vue'
 import recordComDetailCard from '@/mycomponents/record/recordComDetailCard.vue'
 import comPalletRecord from '@/pages/container/coms/comPalletRecord.vue'
 
-export default {
-  components: {
-    winScanButton,
-    winScanPack,
-    comBlankView,
-    targetContainer,
-    recordComDetailCard,
-    winScanContainer,
-    comPalletRecord
-  },
-  data() {
-    return {
-      id: '',
-      scanCount: 0,
-      detailSource: [], // 绑定在页面上的数据源
-      businessTypeInfo: {},
-      fromLocationInfo: {},
-      containerCode: ''
-    }
-  },
-  onLoad(option) {
+import { ref, onMounted, nextTick } from 'vue';
+import { useStore } from 'vuex';
+import { onLoad,onNavigationBarButtonTap } from '@dcloudio/uni-app'
+
+const id = ref('');
+const scanCount = ref(0);
+const detailSource = ref([]);
+const businessTypeInfo = ref({});
+const fromLocationInfo = ref({});
+const containerCode = ref('');
+
+const scanPopup = ref(null);
+const scanContainer = ref(null);
+const comMessage = ref(null);
+
+const emit = defineEmits(['close', 'getResult']);
+
+onLoad((option) => {
   uni.setNavigationBarTitle({
     title: option.title
-    })
-  },
-  // 返回首页
-  onNavigationBarButtonTap(e) {
+  });
+})
+
+onNavigationBarButtonTap((e) => {
   if (e.index === 0) {
-      goHome()
+    goHome();
   }
-  },
-  // 拦截返回按钮事件
-  onBackPress(e) {},
+})
 
-  onPullDownRefresh() {},
+onMounted(() => {
+  showContainerPopup();
+});
 
-  mounted() {
-    this.showContainerPopup()
-  },
-  methods: {
-    getScanResult(result) {
+const getScanResult = (result) => {
   try {
-        const { packingNumber } = result.label
-        const { batch } = result.label
-        const { qty } = result.label
-        const { itemCode } = result.label
-        const detail = this.detailSource.find((r) => r.itemCode == itemCode)
+    const { packingNumber, batch, qty, itemCode } = result.label;
+    const detail = detailSource.value.find((r) => r.itemCode === itemCode);
     if (detail == undefined) {
-          this.showMessage(`物料号【${itemCode}】不在列表中`)
+      showMessage(`物料号【${itemCode}】不在列表中`);
     } else {
-          const itemDetail = detail.subList.find((r) => r.packingNumber == packingNumber && r.batch == batch)
+      const itemDetail = detail.subList.find((r) => r.packingNumber === packingNumber && r.batch === batch);
       if (itemDetail == undefined) {
-            this.showMessage(`箱码【${packingNumber}】,批次【${batch}】不在列表中`)
+        showMessage(`箱码【${packingNumber}】,批次【${batch}】不在列表中`);
       } else if (itemDetail.scaned) {
-            this.showMessage(`箱码【${packingNumber}】,批次【${batch}】已经扫描`)
+        showMessage(`箱码【${packingNumber}】,批次【${batch}】已经扫描`);
       } else {
-            itemDetail.scaned = true
-            itemDetail.record = this.createRecordInfo(itemDetail, result.label)
-            // this.calcHandleQty();
+        itemDetail.scaned = true;
+        itemDetail.record = createRecordInfo(itemDetail, result.label);
+        // calcHandleQty();
       }
     }
   } catch (e) {
-        this.showErrorMessage(e.message)
+    showErrorMessage(e.message);
   }
-    },
-
-    createRecordInfo(detail, label) {
-      const record = {}
-      detail.scaned = true
-      // let record = JSON.parse(JSON.stringify(detail));
-      // 克隆对象，深度克隆，防止双向绑定同一个变量
-      Object.assign(record, detail)
-      record.qty = Number(label.qty)
-      return record
-    },
-
-    calcHandleQty() {
-      calcHandleQty(this.detailSource)
-      this.scanPopupGetFocus()
-      this.$forceUpdate()
-    },
-
-    getDataSource(subList) {
-      const items = []
+};
+
+const createRecordInfo = (detail, label) => {
+  const record = {};
+  Object.assign(record, detail);
+  record.qty = Number(label.qty);
+  return record;
+};
+
+const calcHandleQty = () => {
+  calcHandleQty(detailSource.value);
+  scanPopupGetFocus();
+};
+
+const getDataSource = (subList) => {
+  const items = [];
   subList.forEach((detail) => {
-        let item = items.find((r) => r.itemCode == detail.itemCode)
+    let item = items.find((r) => r.itemCode === detail.itemCode);
     if (item == undefined) {
-          item = this.createItemInfo(detail)
-          const newDetail = this.createDetailInfo(detail) //
-          item.subList.push(newDetail)
-          items.push(item)
+      item = createItemInfo(detail);
+      const newDetail = createDetailInfo(detail);
+      item.subList.push(newDetail);
+      items.push(item);
     } else {
-          item.qty = calc.add(item.qty, detail.qty)
-          const newDetail = this.createDetailInfo(detail) //
-          item.subList.push(newDetail)
+      item.qty = calc.add(item.qty, detail.qty);
+      const newDetail = createDetailInfo(detail);
+      item.subList.push(newDetail);
     }
-      })
-      return items
-    },
+  });
+  return items;
+};
 
-    removeItem(index, item) {
-      this.detailSource.splice(index, 1)
-    },
+const removeItem = (index) => {
+  detailSource.value.splice(index, 1);
+};
 
-    createItemInfo(res) {
+const createItemInfo = (res) => {
   const item = {
     itemCode: res.itemCode,
     itemName: res.itemName,
@@ -170,182 +156,181 @@ export default {
     handleQty: 0,
     uom: res.uom,
     subList: []
-      }
-      return item
-    },
-
-    createDetailInfo(data) {
-      data.scaned = false
-      data.packingNumber = data.contentNumber
-      data.qty = Number(data.qty)
-      data.handleQty = 0
-      const detail = data
-      return detail
-    },
-
-    removePack() {
-      for (let i = 0; i < this.detailSource.length; i++) {
-        const item = this.detailSource[i]
-        if (item.subList.length == 0) {
-          this.detailSource.splice(i, 1)
+  };
+  return item;
+};
+
+const createDetailInfo = (data) => {
+  data.scaned = false;
+  data.packingNumber = data.contentNumber;
+  data.qty = Number(data.qty);
+  data.handleQty = 0;
+  return data;
+};
+
+const removePack = () => {
+  for (let i = 0; i < detailSource.value.length; i++) {
+    const item = detailSource.value[i];
+    if (item.subList.length === 0) {
+      detailSource.value.splice(i, 1);
     }
   }
-      this.updateData()
-    },
+  updateData();
+};
 
-    openScanPopup() {
-      if (this.containerCode == '') {
-        this.showContainerPopup()
-        return
+const openScanPopup = () => {
+  if (containerCode.value === '') {
+    showContainerPopup();
+    return;
   }
-      this.$refs.scanPopup.openScanPopup()
-    },
-    showContainerPopup() {
-      this.$nextTick(() => {
-        this.$refs.scanContainer.openScanPopup()
-      })
-    },
-    closeScanPopup() {
-      this.$refs.scanPopup.closeScanPopup()
-    },
-
-    scanPopupGetFocus() {
-      if (this.$refs.scanPopup != undefined) {
-        this.$refs.scanPopup.getfocus()
+  scanPopup.value.openScanPopup();
+};
+
+const showContainerPopup = () => {
+  nextTick(() => {
+    scanContainer.value.openScanPopup();
+  });
+};
+
+const closeScanPopup = () => {
+  scanPopup.value.closeScanPopup();
+};
+
+const scanPopupGetFocus = () => {
+  if (scanPopup.value != undefined) {
+    scanPopup.value.getfocus();
   }
-    },
+};
 
-    scanPopupLoseFocus() {
-      if (this.$refs.scanPopup != undefined) {
-        this.$refs.scanPopup.losefocus()
+const scanPopupLoseFocus = () => {
+  if (scanPopup.value != undefined) {
+    scanPopup.value.losefocus();
   }
-    },
+};
 
-    commit() {
+const commit = () => {
   uni.showLoading({
     title: '提交中...',
     mask: true
-      })
+  });
 
-      this.scanCount = getScanCount(this.detailSource[0].subList)
-      if (this.scanCount == 0) {
-        this.showErrorMessage('扫描数为0,请先扫描要解绑的箱码')
-        return
+  scanCount.value = getScanCount(detailSource.value[0].subList);
+  if (scanCount.value === 0) {
+    showErrorMessage('扫描数为0,请先扫描要解绑的箱码');
+    return;
   }
 
-      const params = this.getParams()
-      console.log(`提交${JSON.stringify(params)}`)
+  const params = getParams();
+  console.log(`提交${JSON.stringify(params)}`);
 
   containerUnBindRecordSubmit(params)
     .then((res) => {
-          uni.hideLoading()
+      uni.hideLoading();
       if (res.data) {
-            this.showCommitSuccessMessage(`提交成功\n生成器具绑定记录\n${res.data}`)
-            this.clear()
+        showCommitSuccessMessage(`提交成功\n生成器具绑定记录\n${res.data}`);
+        clear();
       } else {
-            this.showErrorMessage(`提交失败[${res.msg}]`)
+        showErrorMessage(`提交失败[${res.msg}]`);
       }
     })
     .catch((error) => {
-          uni.hideLoading()
-          this.showErrorMessage(error)
-        })
-    },
-
-    getParams() {
-      const subList = []
-      const creator = this.$store.state.user.id
+      uni.hideLoading();
+      showErrorMessage(error);
+    });
+};
+
+const getParams = () => {
+  const subList = [];
+  const creator = useStore().state.user.id;
   const params = {
-        number: this.containerCode,
+    number: containerCode.value,
     type: 'bind',
     status: 'USED',
     creator
-      }
+  };
 
-      this.detailSource.forEach((item) => {
+  detailSource.value.forEach((item) => {
     item.subList.forEach((detail) => {
       if (detail.scaned) {
-            detail.containerContentType = 'PACKAGE'
-            detail.contentNumber = detail.packingNumber
-
-            detail.itemCode = detail.itemCode
-            detail.batch = detail.batch
-            detail.inventoryStatus = detail.inventoryStatus
-            detail.qty = detail.handleQty
-            detail.package = null
-            subList.push(detail)
+        detail.containerContentType = 'PACKAGE';
+        detail.contentNumber = detail.packingNumber;
+        detail.itemCode = detail.itemCode;
+        detail.batch = detail.batch;
+        detail.inventoryStatus = detail.inventoryStatus;
+        detail.qty = detail.handleQty;
+        detail.package = null;
+        subList.push(detail);
       }
-        })
-      })
-      params.subList = subList
-      return params
-    },
-
-    showMessage(message) {
-      setTimeout((r) => {
-        this.scanPopupLoseFocus()
-        this.$refs.comMessage.showMessage(message, (res) => {
+    });
+  });
+  params.subList = subList;
+  return params;
+};
+
+const showMessage = (message) => {
+  setTimeout(() => {
+    scanPopupLoseFocus();
+    comMessage.value.showMessage(message, (res) => {
       if (res) {
-            this.scanPopupGetFocus()
+        scanPopupGetFocus();
       }
-        })
-      })
-    },
-
-    showErrorMessage(message) {
-      setTimeout((r) => {
-        this.scanPopupLoseFocus()
-        this.$refs.comMessage.showErrorMessage(message, (res) => {
+    });
+  });
+};
+
+const showErrorMessage = (message) => {
+  setTimeout(() => {
+    scanPopupLoseFocus();
+    comMessage.value.showErrorMessage(message, (res) => {
       if (res) {
-            this.scanPopupGetFocus()
+        scanPopupGetFocus();
       }
-        })
-      })
-    },
+    });
+  });
+};
 
-    showScanMessage(message) {
-      this.$refs.comMessage.showScanMessage(message)
-    },
+const showScanMessage = (message) => {
+  comMessage.value.showScanMessage(message);
+};
 
-    afterCloseMessage() {
-      this.scanPopupGetFocus()
-    },
+const afterCloseMessage = () => {
+  scanPopupGetFocus();
+};
 
-    closeScanMessage() {
-      this.scanPopupGetFocus()
-    },
+const closeScanMessage = () => {
+  scanPopupGetFocus();
+};
 
-    getContainer(containerInfo) {
-      this.containerCode = containerInfo.number
-      getContainerDetailByNumber(this.containerCode)
+const getContainer = (containerInfo) => {
+  containerCode.value = containerInfo.number;
+  getContainerDetailByNumber(containerCode.value)
     .then((res) => {
       if (res.data != null && res.data.subList.length > 0) {
-            this.detailSource = this.getDataSource(res.data.subList)
+        detailSource.value = getDataSource(res.data.subList);
       }
     })
     .catch((error) => {
-          this.showErrorMessage(error.message)
-        })
-    },
-
-    showCommitSuccessMessage(hint) {
-      this.$refs.comMessage.showSuccessMessage(hint, (res) => {
-        this.containerCode = ''
-      })
-    },
-
-    updateData() {
-      this.calcHandleQty()
-      for (let i = 0; i < this.detailSource.length; i++) {
-        const item = this.detailSource[i]
-        if (item.qty == 0) {
-          this.detailSource.splice(i, 1)
-        }
+      showErrorMessage(error.message);
+    });
+};
+
+const showCommitSuccessMessage = (hint) => {
+  comMessage.value.showSuccessMessage(hint, (res) => {
+    containerCode.value = '';
+  });
+};
+
+const updateData = () => {
+  calcHandleQty();
+  for (let i = 0; i < detailSource.value.length; i++) {
+    const item = detailSource.value[i];
+    if (item.qty === 0) {
+      detailSource.value.splice(i, 1);
     }
-    },
-    clear() {}
   }
-}
+};
+
+const clear = () => {};
 </script>
 
 <style scoped lang="scss"></style>