@logwire/logwire-wms-pda-ui 1.1.19 → 1.2.0

package/src/components/page/inbound/receive/receive-case/LwInboundReceiveCaseExecutePage.vue

@@ -0,0 +1,312 @@
+<!--
+  整箱收货
+  @author dhc
+  @date 2022-07-06
+-->
+<template>
+  <div>
+    <lw-nav-bar :title="$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.kbmbivvl', '整箱收货')"/>
+    <div v-if="asn" class="lw-global-page-box">
+      <div>
+        <asn-info :data="asn" shrinkable radius/>
+      </div>
+      <div class="lw-global-model-box" style="margin-top: 10px;">
+        <lw-input v-model="caseNum.value" :title="$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.ezcaseei', '箱号')" :get-focus.sync="caseNum.focus" @confirm="addCase"/>
+      </div>
+      <div class="lw-global-model-box lw-global-flex-between case-nums">
+        <div>{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.zueoponq', '扫描结果')}}</div>
+        <div class="lw-global-flex-between">
+          <div>{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.mxfwsuxq', '箱数: ')}}<span>{{ numStatistics.skuCount }}</span></div>
+          <div>{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.eamyskqy', '数量: ')}}<span>{{ numStatistics.qty }}</span></div>
+        </div>
+      </div>
+      <template v-for="c in cases">
+        <div class="lw-global-model-box" :key="c.caseNum">
+          <div>
+            <div class="lw-global-flex-between">
+              <div>{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.ejccqqkk', '箱号: ')}}<span>{{ c.caseNum }}</span></div>
+              <div>
+                <lw-tag v-if="c.fastReceive">{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.clpdfnjk', '快速收货')}}</lw-tag>
+                <van-icon class="btn-shrink" :class="{inverted: c.isShrink}" name="arrow-up"
+                          @click.stop="c.isShrink = !c.isShrink"/>
+              </div>
+            </div>
+            <div class="lw-global-sh" style="margin: 10px 0"></div>
+            <div class="lw-global-flex-between">
+              <div>{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.cytznwxn', '品种数: ')}}<span>{{ c.skuCount }}</span></div>
+              <div>{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.jkvbswog', '数量: ')}}<span>{{ c.qty }}</span></div>
+              <div>
+                <lw-button mini @click="removeCase(c)">{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.gkjijylo', '移除')}}</lw-button>
+              </div>
+            </div>
+          </div>
+
+          <div v-show="!c.isShrink">
+            <van-divider contentPosition="center" textColor="#1989fa">{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.kpwjkeap', '商品列表')}}</van-divider>
+            <div v-for="sku of c.skuList" :key="sku.id">
+              <asn-sku-info :data="sku">
+                <template #extend>
+                  <div style="margin: 10px 0;">
+                    <div>{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.glkfqpfz', '数量')}}<b style="color: red; font-size: 1.1em;">{{ ' ' + sku.qty }}</b></div>
+                    <div>
+                      <lw-button color="orange" @click="showAbnormalPop(sku)">{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.tkyllqtp', '收货异常')}}</lw-button>
+                    </div>
+                  </div>
+                </template>
+              </asn-sku-info>
+              <lw-lot-module :ref="'lot_' + sku.sku.code" :query="sku.lotQuery"/>
+            </div>
+          </div>
+        </div>
+      </template>
+      <div class="lw-global-model-box">
+        <lw-input v-model="receiveLoc.value" :title="$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.xjfjcsgo', '收货库位')" required :get-focus.sync="receiveLoc.focus"/>
+        <lw-input v-model="receiveLpn.value" :title="$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.zhacwngt', '收货托盘')" required :get-focus.sync="receiveLpn.focus"/>
+      </div>
+    </div>
+    <lw-bottom-bar>
+      <lw-button plain @click="$router.back()">{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.mvangcdg', '重新扫描箱号')}}</lw-button>
+      <lw-button @click="submit">{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.frgsbxyo', '确认收货')}}</lw-button>
+    </lw-bottom-bar>
+    <!-- 异常弹框 -->
+    <lw-popup
+      :title="$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.zgilmwhu', '收货异常')"
+      class="abnormal-popup-bg"
+      v-model="showAbnormal">
+
+      <lw-receive-abnormal-module
+        v-if="currentSku"
+        ref="abnormal"
+        :multiple="false"
+        :sku-disabled="true"
+        :show-bottom-bar="false"
+        :original-lpn="false"
+        :original-case-num="false"
+        :asn-no="asn.asnNo"
+        :sku-code="currentSku.sku.code"
+        :qty="currentSku.qty"
+      />
+
+      <template #button>
+        <lw-button @click="submitAbnormal">{{$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.wwbrznds', '上报异常')}}</lw-button>
+      </template>
+    </lw-popup>
+  </div>
+</template>
+
+<script>
+import {
+  getInboundAsn, getInboundFoundAsnWholeCaseNumDetail,
+  submitAsnAbnormalReceive, submitAsnFastReceiveForWholeCaseNum,
+} from '../../../../../api/inbound/receive'
+import AsnInfo from '../../components/AsnInfo.vue'
+import AsnSkuInfo from '../../components/AsnSkuInfo.vue'
+
+export default {
+  name: 'LwInboundReceiveCaseExecutePage',
+  components: { AsnSkuInfo, AsnInfo },
+  data () {
+    return {
+      asn: null,
+      cases: [],
+      caseNum: {
+        value: '',
+        focus: true,
+      },
+      receiveLoc: {
+        value: '',
+        focus: false,
+      },
+      receiveLpn: {
+        value: '',
+        focus: false,
+      },
+      currentSku: null,
+      showAbnormal: false,
+    }
+  },
+  computed: {
+    numStatistics () {
+      return this.cases.map(i => ({
+        skuCount: i.skuCount,
+        qty: i.qty
+      })).reduce((a, b) => ({ skuCount: a.skuCount + b.skuCount, qty: a.qty + b.qty }), ({ skuCount: 0, qty: 0 }))
+    },
+  },
+  created () {
+    const { asnId, caseNum } = this.$route.query
+    if (!asnId) {
+      return this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.ttthaies', '错误的到货通知单号'))
+    }
+    if (!caseNum) {
+      return this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.sgkzzkbm', '错误的箱号'))
+    }
+    this.loadAsn(asnId, caseNum)
+  },
+  methods: {
+    initCase (data) {
+      const old = this.cases.find(i => i.caseNum === data.caseNum)
+      if (old) {
+        return this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.nwgdvekh', '箱号已存在'))
+      }
+      if (data && data.skuList) {
+        data.isShrink = true
+        for (let sku of data.skuList) {
+          sku.lotEl = 'lot_' + sku.sku.code
+          sku.lotQuery = {
+            warehouseId: this.asn.warehouseId,
+            ownerId: sku.ownerId,
+            skuId: sku.id,
+            type: 1,
+            lotType: 'inventory',
+            header: this.asn.map,
+            line: sku.map,
+          }
+        }
+        this.cases.push(data)
+        this.caseNum.value = ''
+
+        if(!this.receiveLoc.value){
+          const index = this.cases.findIndex(l=>l.receiveLocationCode)
+          if(index>=0){
+            this.receiveLoc.value = this.cases[index].receiveLocationCode
+          }
+        }
+      } else {
+        return this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.qaerzklp', '没有可用的商品信息'))
+      }
+    },
+    loadAsn (asnId, caseNum = null) {
+      getInboundAsn(asnId).then(res => {
+        this.asn = res
+        if (caseNum) {
+          getInboundFoundAsnWholeCaseNumDetail(asnId, caseNum).then(this.initCase)
+        }
+      })
+    },
+    addCase () {
+      if (this.caseNum.value) {
+        const old = this.cases.find(i => i.caseNum === this.caseNum.value)
+        if (old) {
+          return this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.nwgdvekh', '箱号已存在'))
+        }
+        getInboundFoundAsnWholeCaseNumDetail(this.asn.id, this.caseNum.value).then(this.initCase)
+      }
+    },
+    submit () {
+      if (this.cases.length === 0) {
+        this.caseNum.focus = true
+        return this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.beevnrig', '请扫描箱号'))
+      }
+      if (!this.receiveLoc.value) {
+        this.receiveLoc.focus = true
+        return this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.xymgmnid', '收货库位不能为空'))
+      }
+      if (!this.receiveLpn.value) {
+        this.receiveLpn.focus = true
+        return this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.qdxoqyqo', '收货托盘不能为空'))
+      }
+      const items = []
+      for (let c of this.cases) {
+        for (let i of c.skuList) {
+          const lotData = this.$refs[i.lotEl][0].getData()
+          if (!lotData.success) {
+            return
+          }
+          items.push({
+            caseNum: c.caseNum,
+            skuId: i.sku.id,
+            lotAttributes: lotData.data
+          })
+        }
+      }
+      const data = {
+        asnId: this.asn.id,
+        locationCode: this.receiveLoc.value,
+        lpn: this.receiveLpn.value,
+        printDeviceId: null,
+        printTemplate: null,
+        warehouseId: this.asn.warehouseId,
+        lines: items,
+      }
+      submitAsnFastReceiveForWholeCaseNum(data).then(() => {
+        this.$lwToast.success(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.ivymtjgb', '操作成功'))
+        setTimeout(() => {
+          this.$router.back()
+        }, 1000)
+      })
+    },
+    removeCase (c) {
+      this.$lwDialog.confirm({ title: this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.mblhcrvk', '确认移除箱{caseNum}吗？', {caseNum: c.caseNum}) }).then(() => {
+        const idx = this.cases.indexOf(c)
+        if (idx > -1) {
+          this.cases.splice(idx, 1)
+        }
+      }).catch(() => {})
+    },
+    showAbnormalPop (lpnSku) {
+      const lotData = this.$refs[lpnSku.lotEl][0].getData()
+      if (lotData.success) {
+        this.currentSku = lpnSku
+        this.showAbnormal = true
+      }
+    },
+    submitAbnormal () {
+      const { success, data } = this.$refs.abnormal.getAllAbnormalData()
+      if (!success) return
+
+      submitAsnAbnormalReceive({
+        asnId: this.asn.id,
+        ownerId: this.asn.ownerId,
+        abnType: data.abnType,
+        abnSubType: data.abnSubType,
+        order: data.order,
+        lines: [
+          {
+            ...data.lines[0],
+            originalLpn: this.currentSku.lpn,
+            originalCaseNum: this.currentSku.caseNum,
+          }
+        ],
+      }).then(() => {
+        this.showAbnormal = false
+        this.currentSku = null
+        this.$lwToast.success(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.dxihbntd', '异常上报成功'))
+        this.loadAsn(this.asn.id)
+      })
+    }
+  },
+}
+</script>
+
+<style lang="less" scoped>
+
+@import "../../../../../assets/css/var.less";
+
+.abnormal-popup-bg {
+  background: @pageColor;
+}
+
+.btn-shrink {
+  margin-left: 10px;
+  padding: 5px;
+
+  &.inverted {
+    transform: rotate(180deg);
+  }
+}
+
+.case-nums {
+  color: white;
+  background: #f45858;
+
+  & > div:nth-child(2) {
+    flex: 1;
+    margin-left: 50px;
+
+    span {
+      font-weight: bold;
+    }
+  }
+}
+</style>

package/src/components/page/inbound/receive/receive-case/LwInboundReceiveCaseScanPage.vue

@@ -0,0 +1,80 @@
+<!--
+  整箱收货扫描
+  @author dhc
+  @date 2022-07-06
+-->
+<template>
+  <div>
+    <lw-nav-bar :title="$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.fjwojpib', '整箱收货')"/>
+    <div v-if="asn">
+      <div class="lw-global-page-box">
+        <div>
+          <asn-info :data="asn"/>
+        </div>
+      </div>
+      <div class="lw-global-page-box">
+        <div class="lw-global-model-box">
+          <lw-input :title="$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.fsycjztc', '箱号')" required v-model="caseNum.value" :get-focus.sync="caseNum.focus" @confirm="toReceive"/>
+        </div>
+      </div>
+    </div>
+    <div v-else>
+      <lw-not-data/>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getInboundAsnByAsnNo } from '../../../../../api/inbound/receive'
+import AsnInfo from '../../components/AsnInfo.vue'
+
+export default {
+  name: 'LwInboundReceiveCaseScanPage',
+  components: { AsnInfo },
+  data () {
+    return {
+      asn: null,
+      caseNum: {
+        value: '',
+        focus: true,
+      },
+      asnSku: null,
+    }
+  },
+  created () {
+    const asnNo = this.$route.query.asnNo
+    if (!asnNo) {
+      return this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.lmjopjwb', '未指定到货通知单号'))
+    }
+    this.getAsnByAsnNo(asnNo)
+  },
+  methods: {
+    getAsnByAsnNo (asnNo) {
+      getInboundAsnByAsnNo(asnNo).then(data => {
+        if (data) {
+          this.asn = data
+          return
+        }
+        this.$lwShowErrorMsg(this.$lwLanguage.get('wms_project.pda.components.page.inbound.receive.receive_case.vixiteue', '错误的到货通知单号'))
+      })
+    },
+    toReceive () {
+      if (!this.asn) {
+        return
+      }
+      if (this.caseNum.value) {
+        this.$router.push({
+          path: '/inbound/receive/case/execute',
+          query: { asnId: this.asn.id, asnNo: this.asn.asnNo, caseNum: this.caseNum.value },
+        })
+      } else {
+        this.lpn.focus = true
+      }
+    },
+  },
+}
+</script>
+
+<style scoped>
+
+</style>

package/src/components/page/inbound/receive/receive-case/index.js

@@ -0,0 +1,16 @@
+import LwInboundReceiveCaseScanPage from './LwInboundReceiveCaseScanPage.vue'
+import LwInboundReceiveCaseExecutePage from './LwInboundReceiveCaseExecutePage.vue'
+
+const pages = [
+  LwInboundReceiveCaseScanPage,
+  LwInboundReceiveCaseExecutePage,
+]
+
+pages.forEach(page => page.install = Vue => Vue.component(page.name, page))
+
+export {
+  LwInboundReceiveCaseScanPage,
+  LwInboundReceiveCaseExecutePage,
+}
+
+export default pages