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

package/src/components/page/outbound/pick/box/index.vue

@@ -1,371 +1,380 @@
-<!--
-  出库拣选 - 按箱
-  @author: 张文
-  @date: 2022-06-16
--->
-<template>
-  <data-look-and-change
-    v-if="Object.keys(pickData).length"
-    ref="dataLookAndChange"
-    type="box"
-    :task-index="taskIndex"
-    :pick-data="pickData"
-    :pick-container="nowPickData.fromCase"
-    :lack-confirm-fn="lackConfirm"
-    :abn-confirm-fn="abnConfirm"
-    :get-data="getData"
-    @pickConfirm="pickConfirm"
-  >
-
-    <!-- 左右切换滚动到顶部的锚点 -->
-    <div id="tab-top"></div>
-    <div class="lw-global-tab-box">
-      <van-tabs
-        type="card"
-        animated
-        v-model="tabActive"
-        @change="goTop"
-      >
-
-        <van-tab
-          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ytzbefwn','正在拣选')"
-          name="ing"
-        >
-          <div class="lw-global-model-box">
-
-            <lw-title-value-cell
-              style="padding-top: 0"
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ltnhuyko','拣选库位')"
-              :value="nowPickData.fromLocationCode"
-              val-bold
-              val-red
-              :val-size="16"
-            />
-
-            <lw-title-value-cell
-              v-if="hasLpn"
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.wuoylxqq','托盘号')"
-              :value="nowPickData.fromLpn"
-              val-bold
-            />
-
-            <lw-title-value-cell
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.frxmzctd','箱号')"
-              :value="nowPickData.fromCase"
-              val-bold
-            />
-
-            <lw-input
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ltnhuyko','拣选库位')"
-              v-model="locationCode.value"
-              :get-focus.sync="locationCode.focus"
-              required
-              rule-key="location"
-              @confirm="locationCodeConfirm"
-            />
-
-            <lw-input
-              v-if="hasLpn"
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.wuoylxqq','托盘号')"
-              v-model="lpn.value"
-              :get-focus.sync="lpn.focus"
-              required
-              rule-key="lpn"
-              @confirm="lpnConfirm"
-            />
-
-            <lw-input
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.frxmzctd','箱号')"
-              v-model="box.value"
-              :get-focus.sync="box.focus"
-              required
-              rule-key="case"
-              @confirm="boxConfirm"
-            />
-
-            <div style="margin-top: 10px" class="lw-global-title">
-              {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.njqvptlf','商品明细') }}
-            </div>
-            <div style="padding: 0 5px">
-              <lw-sku-info-module
-                v-for="(i,k) in nowPickData.skuList"
-                :key="k"
-                v-bind="i"
-                is-row
-              />
-            </div>
-
-            <lw-cut-card
-              v-model="taskIndex"
-              :length="pickData.pendingPickCaseList.length"
-              :cut-start="cutStart"
-              :cut-end="cutEnd"
-            />
-
-          </div>
-
-        </van-tab>
-
-        <van-tab
-          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.emcahgjw','待拣箱')"
-          name="wait"
-        >
-
-          <div
-            class="lw-global-model-box lw-global-animation-out lw-global-click-style"
-            v-for="(i,k) in pickData.pendingPickCaseList"
-            :key="k"
-            :style="{animationDelay: 50 * k + 'ms'}"
-            @click="waitPickClick(k)"
-          >
-            <div
-              class="lw-global-flex-between lw-global-row-start"
-              style="padding-bottom:5px;margin-bottom: 5px"
-            >
-              <div class="lw-global-value-bold">{{ i.fromCase }}</div>
-              <lw-tag type="danger" plain round>
-                {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.oyxghmho','待拣选') }}
-              </lw-tag>
-            </div>
-
-            <div class="lw-global-flex-between">
-
-              <lw-title-value-cell
-                :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ltnhuyko','拣选库位')"
-                :value="i.fromLocationCode"
-                :val-size="16"
-                val-bold
-                val-red
-                :is-row="false"
-              />
-
-              <lw-title-value-cell
-                :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ugdrizab','数量')"
-                :value="i.totalQty"
-                val-bold
-                :is-row="false"
-              />
-
-            </div>
-
-
-            <lw-title-value-cell
-              style="margin-top: 5px"
-              v-if="i.fromLpn"
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.wuoylxqq','托盘号')"
-              :value="i.fromLpn"
-              val-bold
-              :is-row="false"
-            />
-
-          </div>
-
-        </van-tab>
-      </van-tabs>
-    </div>
-
-  </data-look-and-change>
-</template>
-
-<script>
-import dataLookAndChange from './../components/dataLookAndChange/index.vue'
-import {
-  projectQueryPickByCaseData,
-  projectWmsOutboundSubmitCasePickAbnormal,
-  projectWmsOutboundSubmitCasePickStockout,
-  projectWmsOutboundWholeCasePick
-} from "../../../../../api/outbound/pick/box";
-import {all} from "../mixin/all";
-
-export default {
-  name: "lwOutboundPickBoxActionPage",
-  components:{
-    dataLookAndChange
-  },
-  mixins:[all],
-  computed:{
-    hasLpn(){
-      return !!this.nowPickData.fromLpn
-    },
-    nowPickData(){
-      if (this.pickData.pendingPickCaseList && this.pickData.pendingPickCaseList.length){
-        return this.pickData.pendingPickCaseList[this.taskIndex]
-      }
-      return {}
-    }
-  },
-  data() {
-    return {
-      // 当前任务索引
-      taskIndex: 0,
-
-      // 拣选数据
-      pickData: {},
-
-      // tab激活项
-      tabActive:'ing',
-
-      // 拣选库位
-      locationCode:{
-        value:'',
-        focus: false
-      },
-
-      // 托盘号
-      lpn:{
-        value:'',
-        focus: false
-      },
-
-      // 箱号
-      box:{
-        value:'',
-        focus: false
-      }
-    }
-  },
-  mounted() {
-    this.getData()
-  },
-  methods: {
-    // 获取数据
-    getData(){
-      projectQueryPickByCaseData({
-        pickId: this.$route.query.lwPickId
-      }).then(res=>{
-        this.pickData = res
-        this.checkTaskIndex(this.pickData.pendingPickCaseList.length)
-      }).catch(()=>history.go(-1))
-    },
-
-
-    // 拣选库位确认
-    locationCodeConfirm(){
-      if (this.locationCodeCheck()){
-        if (this.hasLpn){
-          this.lpn.focus = true
-        }else {
-          this.box.focus = true
-        }
-      }
-    },
-    // 检查拣选库位
-    locationCodeCheck(){
-
-      return this.inputCheck({
-        key: 'locationCode',
-        checkVal: this.nowPickData.fromLocationCode,
-      })
-    },
-
-    // 托盘号确认
-    lpnConfirm(){
-      if (this.lpnCheck()) this.box.focus = true
-    },
-    // 托盘号校验
-    lpnCheck(){
-
-      if (!this.hasLpn) return true
-
-      return this.inputCheck({
-        key: 'lpn',
-        checkVal: this.nowPickData.fromLpn,
-        needCheck: false
-      })
-    },
-
-    // 箱号确认
-    boxConfirm(){
-      if (this.boxCheck()) this.pickConfirm()
-    },
-    // 箱号检查
-    boxCheck(){
-      return this.inputCheck({
-        key: 'box',
-        checkVal: this.nowPickData.fromCase,
-      })
-    },
-
-    // 任务行切换前
-    cutStart(){
-      return this.checkInputVal(['locationCode', 'lpn', 'box'])
-
-    },
-    // 任何行切换后
-    cutEnd(){
-      this.clearInputVal(['locationCode', 'lpn', 'box'])
-    },
-
-    // 确认拣选
-    pickConfirm(){
-      // 校验必填项
-      if (!(
-        this.locationCodeCheck() &&
-        this.lpnCheck() &&
-        this.boxCheck()
-      )) return
-
-      const item = this.nowPickData
-      projectWmsOutboundWholeCasePick({
-        pickId: this.pickData.pickId,
-        pickNo: this.pickData.pickNo,
-        fromLocationId: item.fromLocationId,
-        fromLpn: item.fromLpn,
-        fromCase: item.fromCase
-      }).then(res=>{
-        // 判断是否需要打印箱票
-        if(res.needPrintBox){
-          this.$refs.dataLookAndChange.print(res)
-        }
-
-        this.$lwToast.success(
-          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ytbbpcwy','拣选成功')
-        )
-
-        // 拣选完了就不要覆盖数据，会导致页面没有数据而崩溃
-        if (res.pickOrderFinish){
-          this.$refs.dataLookAndChange.openPickSuccessPopup()
-          return
-        }
-
-        this.pickData = res.pickTaskData
-        this.checkTaskIndex(this.pickData.pendingPickCaseList.length)
-      })
-
-    },
-    // 确认缺货
-    lackConfirm(data){
-      const item = this.nowPickData
-
-      return projectWmsOutboundSubmitCasePickStockout({
-        pickId: this.pickData.pickId,
-        pickNo: this.pickData.pickNo,
-        fromLocationId: item.fromLocationId,
-        fromLpn: item.fromLpn,
-        fromCase: item.fromCase,
-        ownerId: data.ownerId,
-        skuId: data.skuId,
-        stockoutQty: data.lackQty,
-      })
-    },
-    // 确认异常
-    abnConfirm(data){
-      const item = this.nowPickData
-      return projectWmsOutboundSubmitCasePickAbnormal({
-        pickId: this.pickData.pickId,
-        pickNo: this.pickData.pickNo,
-        fromLocationId: item.fromLocationId,
-        fromLpn: item.fromLpn,
-        fromCase: item.fromCase,
-        ownerId: data.ownerId,
-        skuId: data.skuId,
-        ...data.data
-      })
-    }
-  }
-}
-</script>
-
-<style scoped lang="less">
-
-</style>
+<!--
+  出库拣选 - 按箱
+  @author: 张文
+  @date: 2022-06-16
+-->
+<template>
+  <data-look-and-change
+    v-if="Object.keys(pickData).length"
+    ref="dataLookAndChange"
+    type="box"
+    :task-index="taskIndex"
+    :pick-data="pickData"
+    :pick-container="nowPickData.fromCase"
+    :lack-confirm-fn="lackConfirm"
+    :abn-confirm-fn="abnConfirm"
+    :get-data="getData"
+    @pickConfirm="pickConfirm"
+  >
+
+    <!-- 左右切换滚动到顶部的锚点 -->
+    <div id="tab-top"></div>
+    <div class="lw-global-tab-box">
+      <van-tabs
+        type="card"
+        animated
+        v-model="tabActive"
+        @change="goTop"
+      >
+
+        <van-tab
+          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ytzbefwn','正在拣选')"
+          name="ing"
+        >
+          <div class="lw-global-model-box">
+
+            <lw-title-value-cell
+              style="padding-top: 0"
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ltnhuyko','拣选库位')"
+              :value="nowPickData.fromLocationCode"
+              val-bold
+              val-red
+              :val-size="16"
+            />
+
+            <lw-title-value-cell
+              v-if="hasLpn"
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.wuoylxqq','托盘号')"
+              :value="nowPickData.fromLpn"
+              val-bold
+            />
+
+            <lw-title-value-cell
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.frxmzctd','箱号')"
+              :value="nowPickData.fromCase"
+              val-bold
+            />
+
+            <lw-input
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ltnhuyko','拣选库位')"
+              v-model="locationCode.value"
+              :get-focus.sync="locationCode.focus"
+              required
+              rule-key="location"
+              @confirm="locationCodeConfirm"
+            />
+
+            <lw-input
+              v-if="hasLpn"
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.wuoylxqq','托盘号')"
+              v-model="lpn.value"
+              :get-focus.sync="lpn.focus"
+              required
+              rule-key="lpn"
+              @confirm="lpnConfirm"
+            />
+
+            <lw-input
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.frxmzctd','箱号')"
+              v-model="box.value"
+              :get-focus.sync="box.focus"
+              required
+              rule-key="case"
+              @confirm="boxConfirm"
+            />
+
+            <div style="margin-top: 10px" class="lw-global-title">
+              {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.njqvptlf','商品明细') }}
+            </div>
+            <div style="padding: 0 5px">
+              <lw-sku-info-module
+                v-for="(i,k) in nowPickData.skuList"
+                :key="k"
+                v-bind="i"
+                is-row
+              />
+            </div>
+
+            <lw-cut-card
+              v-model="taskIndex"
+              :length="pickData.pendingPickCaseList.length"
+              :cut-start="cutStart"
+              :cut-end="cutEnd"
+            />
+
+          </div>
+
+        </van-tab>
+
+        <van-tab
+          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.emcahgjw','待拣箱')"
+          name="wait"
+        >
+
+          <div
+            class="lw-global-model-box lw-global-animation-out lw-global-click-style"
+            v-for="(i,k) in pickData.pendingPickCaseList"
+            :key="k"
+            :style="{animationDelay: 50 * k + 'ms'}"
+            @click="waitPickClick(k)"
+          >
+            <div
+              class="lw-global-flex-between lw-global-row-start"
+              style="padding-bottom:5px;margin-bottom: 5px"
+            >
+              <div class="lw-global-value-bold">{{ i.fromCase }}</div>
+              <lw-tag type="danger" plain round>
+                {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.oyxghmho','待拣选') }}
+              </lw-tag>
+            </div>
+
+            <div class="lw-global-flex-between">
+
+              <lw-title-value-cell
+                :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ltnhuyko','拣选库位')"
+                :value="i.fromLocationCode"
+                :val-size="16"
+                val-bold
+                val-red
+                :is-row="false"
+              />
+
+              <lw-title-value-cell
+                :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ugdrizab','数量')"
+                :value="i.totalQty"
+                val-bold
+                :is-row="false"
+              />
+
+            </div>
+
+
+            <lw-title-value-cell
+              style="margin-top: 5px"
+              v-if="i.fromLpn"
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.wuoylxqq','托盘号')"
+              :value="i.fromLpn"
+              val-bold
+              :is-row="false"
+            />
+
+          </div>
+
+        </van-tab>
+      </van-tabs>
+    </div>
+
+  </data-look-and-change>
+</template>
+
+<script>
+import dataLookAndChange from './../components/dataLookAndChange/index.vue'
+import {
+  projectQueryPickByCaseData,
+  projectWmsOutboundSubmitCasePickAbnormal,
+  projectWmsOutboundSubmitCasePickStockout,
+  projectWmsOutboundWholeCasePick
+} from "../../../../../api/outbound/pick/box";
+import {all} from "../mixin/all";
+
+export default {
+  name: "lwOutboundPickBoxActionPage",
+  components:{
+    dataLookAndChange
+  },
+  mixins:[all],
+  computed:{
+    hasLpn(){
+      return !!this.nowPickData.fromLpn
+    },
+    nowPickData(){
+      if (this.pickData.pendingPickCaseList && this.pickData.pendingPickCaseList.length){
+        return this.pickData.pendingPickCaseList[this.taskIndex]
+      }
+      return {}
+    }
+  },
+  data() {
+    return {
+      // 当前任务索引
+      taskIndex: 0,
+
+      // 拣选数据
+      pickData: {},
+
+      // tab激活项
+      tabActive:'ing',
+
+      // 拣选库位
+      locationCode:{
+        value:'',
+        focus: false
+      },
+
+      // 托盘号
+      lpn:{
+        value:'',
+        focus: false
+      },
+
+      // 箱号
+      box:{
+        value:'',
+        focus: false
+      },
+
+      printData:{}
+    }
+  },
+  mounted() {
+    this.getData()
+  },
+  methods: {
+    // 获取数据
+    getData(){
+      projectQueryPickByCaseData({
+        pickId: this.$route.query.lwPickId
+      }).then(res=>{
+        this.pickData = res
+        this.checkTaskIndex(this.pickData.pendingPickCaseList.length)
+      }).catch(()=>history.go(-1))
+    },
+
+
+    // 拣选库位确认
+    locationCodeConfirm(){
+      if (this.locationCodeCheck()){
+        if (this.hasLpn){
+          this.lpn.focus = true
+        }else {
+          this.box.focus = true
+        }
+      }
+    },
+    // 检查拣选库位
+    locationCodeCheck(){
+
+      return this.inputCheck({
+        key: 'locationCode',
+        checkVal: this.nowPickData.fromLocationCode,
+      })
+    },
+
+    // 托盘号确认
+    lpnConfirm(){
+      if (this.lpnCheck()) this.box.focus = true
+    },
+    // 托盘号校验
+    lpnCheck(){
+
+      if (!this.hasLpn) return true
+
+      return this.inputCheck({
+        key: 'lpn',
+        checkVal: this.nowPickData.fromLpn,
+        needCheck: false
+      })
+    },
+
+    // 箱号确认
+    boxConfirm(){
+      if (this.boxCheck()) this.pickConfirm()
+    },
+    // 箱号检查
+    boxCheck(){
+      return this.inputCheck({
+        key: 'box',
+        checkVal: this.nowPickData.fromCase,
+        needCheck: false
+      })
+    },
+
+    // 任务行切换前
+    cutStart(){
+      return this.checkInputVal(['locationCode', 'lpn', 'box'])
+
+    },
+    // 任何行切换后
+    cutEnd(){
+      this.clearInputVal(['locationCode', 'lpn', 'box'])
+    },
+
+    // 确认拣选
+    async pickConfirm(){
+      // 校验必填项
+      if (!(
+        this.locationCodeCheck() &&
+        this.lpnCheck() &&
+        this.boxCheck()
+      )) return
+
+      const item = this.nowPickData
+      const res = await projectWmsOutboundWholeCasePick({
+        pickId: this.pickData.pickId,
+        pickNo: this.pickData.pickNo,
+        fromLocationId: item.fromLocationId,
+        fromLpn: item.fromLpn,
+        fromCase: item.fromCase,
+        actFromCase: this.box.value,
+        actFromLpn: this.lpn.value
+      })
+
+      // 判断是否需要打印箱票
+      if(res.needPrintBox){
+        try {
+          await this.$refs.dataLookAndChange.print(res)
+        }catch (e) {
+          console.warn('独立件打印箱票失败：', e)
+        }
+      }
+
+      this.$lwToast.success(
+        this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.box.ytbbpcwy','拣选成功')
+      )
+
+      // 拣选完了就不要覆盖数据，会导致页面没有数据而崩溃
+      if (res.pickOrderFinish){
+        this.$refs.dataLookAndChange.openPickSuccessPopup()
+        return
+      }
+
+      this.pickData = res.pickTaskData
+      this.checkTaskIndex(this.pickData.pendingPickCaseList.length)
+
+    },
+    // 确认缺货
+    lackConfirm(data){
+      const item = this.nowPickData
+
+      return projectWmsOutboundSubmitCasePickStockout({
+        pickId: this.pickData.pickId,
+        pickNo: this.pickData.pickNo,
+        fromLocationId: item.fromLocationId,
+        fromLpn: item.fromLpn,
+        fromCase: item.fromCase,
+        ownerId: data.ownerId,
+        skuId: data.skuId,
+        stockoutQty: data.lackQty,
+      })
+    },
+    // 确认异常
+    abnConfirm(data){
+      const item = this.nowPickData
+      return projectWmsOutboundSubmitCasePickAbnormal({
+        pickId: this.pickData.pickId,
+        pickNo: this.pickData.pickNo,
+        fromLocationId: item.fromLocationId,
+        fromLpn: item.fromLpn,
+        fromCase: item.fromCase,
+        ownerId: data.ownerId,
+        skuId: data.skuId,
+        ...data.data
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>