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

package/src/components/page/inbound/unload/action/index.vue

@@ -0,0 +1,557 @@
+<!--
+  卸货 - 执行
+  @author: 张文
+  @date: 2022-12-02
+-->
+<template>
+  <div>
+
+    <lw-nav-bar :title="$lwLanguage.get('','卸货')"/>
+
+    <div class="lw-global-page-box">
+
+      <div class="lw-global-model-box">
+
+        <div class="lw-global-flex-between lw-global-row-start">
+
+          <div class="lw-global-value-bold">XHD20221107-001</div>
+
+          <div class="lw-global-title">
+            {{ $lwDate.format('2022-12-02T07:00:00Z','yyyy-MM-dd hh:mm') }}
+          </div>
+
+        </div>
+
+        <lw-title-value-cell
+          :title="$lwLanguage.get('','外部单号')"
+          value="WBDH20221104-0009，A20221104-0010，0011"
+        />
+
+        <lw-title-value-cell
+          :title="$lwLanguage.get('','到货通知单')"
+          value="WBDH20221104-0009"
+        />
+
+        <lw-title-value-cell
+          :title="$lwLanguage.get('','车牌号')"
+          value="A20221104"
+        />
+
+        <lw-title-value-cell
+          :title="$lwLanguage.get('','计划量')"
+          value="10托5箱1EA"
+          val-bold
+        />
+
+        <lw-title-value-cell
+          :title="$lwLanguage.get('','已卸货量')"
+          value="10托5箱1EA"
+          val-bold
+          val-red
+          is-row-end
+        />
+
+      </div>
+
+
+      <div
+        style="margin-top: 10px"
+        class="lw-global-tab-box"
+      >
+        <van-tabs
+          type="card"
+          animated
+          v-model="tabActive"
+          @change="tabChange"
+        >
+
+          <!-- 托 -->
+          <van-tab
+            name="lpn"
+            :title="$lwLanguage.get('','托')"
+          ></van-tab>
+
+          <!-- 箱 -->
+          <van-tab
+            name="case"
+            :title="$lwLanguage.get('','箱')"
+          ></van-tab>
+
+          <!-- 商品 -->
+          <van-tab
+            name="sku"
+            :title="$lwLanguage.get('','商品')"
+          ></van-tab>
+
+
+        </van-tabs>
+      </div>
+
+      <!-- 数据采集区域 -->
+      <div
+        style="padding: 5px 10px"
+        class="lw-global-model-box"
+      >
+
+        <lw-input
+          :title="$lwLanguage.get('','商品条码')"
+          v-model="dataInfo.skuCode.value"
+          :get-focus.sync="dataInfo.skuCode.focus"
+          rule-key="skuCode"
+          :create-rule="$lwScanRule.create('卸货-执行卸货-商品号','SKU')"
+          @confirm="skuCodeConfirm"
+        />
+
+        <lw-input
+          :title="$lwLanguage.get('','商品名称')"
+          v-model="dataInfo.skuName.value"
+          :get-focus.sync="dataInfo.skuName.focus"
+          @confirm="skuNameConfirm"
+        />
+
+        <lw-input
+          v-if="tabActive==='lpn'"
+          :title="$lwLanguage.get('','托码')"
+          v-model="dataInfo.lpn.value"
+          :get-focus.sync="dataInfo.lpn.focus"
+          rule-key="lpn"
+          :create-rule="$lwScanRule.create('卸货-执行卸货-托码','LPN')"
+          auto-clear-val
+          @confirm="lpnAndCaseConfirm"
+        />
+
+        <lw-input
+          v-if="tabActive==='case'"
+          :title="$lwLanguage.get('','箱码')"
+          v-model="dataInfo.case.value"
+          :get-focus.sync="dataInfo.case.focus"
+          rule-key="case"
+          :create-rule="$lwScanRule.create('卸货-执行卸货-箱号','CASE')"
+          auto-clear-val
+          @confirm="lpnAndCaseConfirm"
+        />
+
+        <lw-input
+          :title="$lwLanguage.get('','数量')"
+          v-model="dataInfo.qty.value"
+          :get-focus.sync="dataInfo.qty.focus"
+          required
+          type="digit"
+          :show-bottom-border="false"
+        />
+
+      </div>
+      <!-- 扫描数据统计 -->
+      <lw-scan-data-list-module
+        v-if="tabActive!=='sku'"
+        class="lw-global-model-box"
+        :title="scanModel.title"
+        :row-title="scanModel.rowTitle"
+        v-model="dataInfo.list"
+        sn-key="code"
+        @del="changeDataInfoQty"
+        @confirm="changeDataInfoQty"
+      />
+      <!-- 异常信息 -->
+      <div
+        style="padding: 5px 10px"
+        class="lw-global-model-box"
+      >
+        <lw-cell-popup-radio
+          :title="$lwLanguage.get('','卸货异常')"
+          v-model="dataInfo.abnormal.value"
+          dict-key="abnormal_type_choice"
+        />
+
+        <lw-input
+          :title="$lwLanguage.get('','备注')"
+          v-model="dataInfo.remark.value"
+          type="textarea"
+          :rows="3"
+          :show-bottom-border="false"
+        />
+      </div>
+
+
+
+    </div>
+
+    <lw-bottom-bar>
+
+      <lw-button
+        type="last"
+        plain
+        @click="repeatScan"
+      >
+        {{$lwLanguage.get('','重新扫描')}}
+      </lw-button>
+
+      <lw-button @click="overUnload">
+        {{$lwLanguage.get('','完成卸货')}}
+      </lw-button>
+
+      <lw-button
+        type="last"
+        plain
+        @click="confirmUnload"
+      >
+        {{$lwLanguage.get('','确认卸货')}}
+      </lw-button>
+
+    </lw-bottom-bar>
+
+    <!-- 确认卸货弹框 -->
+    <lw-popup
+      :title="$lwLanguage.get('','确认卸货')"
+      v-model="confirmPopup.show"
+    >
+
+      <lw-sku-info-module
+        v-if="dataInfo.skuCode.value || dataInfo.skuName.value"
+        :sku-code="dataInfo.skuCode.value"
+        :sku-name="dataInfo.skuName.value"
+        :show-right="false"
+      />
+
+      <lw-title-value-cell
+        v-if="dataInfo.abnormal.value"
+        :title="$lwLanguage.get('','卸货异常')"
+        :value="dataInfo.abnormal.label"
+      />
+
+      <lw-title-value-cell
+        v-if="dataInfo.remark.value"
+        :title="$lwLanguage.get('','备注')"
+        :value="dataInfo.remark.value"
+      />
+
+      <lw-input
+        :title="$lwLanguage.get('','数量')"
+        v-model="confirmPopup.qty.value"
+        :get-focus.sync="confirmPopup.qty.focus"
+        type="digit"
+        @confirm="confirmPopupSubmit"
+      >
+        <template #button>
+
+          <span class="lw-global-value-bold-red">
+            {{ confirmPopup.qtyLabel }}
+          </span>
+
+        </template>
+
+      </lw-input>
+
+
+      <template #button>
+
+        <lw-button @click="confirmPopupSubmit">
+          {{$lwLanguage.get('','确认')}}
+        </lw-button>
+
+      </template>
+
+
+    </lw-popup>
+
+    <!-- 选择商品弹框 -->
+    <lw-popup
+      :title="$lwLanguage.get('','选择商品')"
+      v-model="selectSkuPopup.show"
+      background="#f0f0f0"
+    >
+
+      <div
+        class="lw-global-model-box lw-global-click-style"
+        v-for="(i,k) in selectSkuPopup.list"
+        :key="k"
+        @click="selectSkuPopupConfirm(i)"
+      >
+
+
+        <div class="lw-global-flex-between lw-global-row-start">
+
+          <div class="lw-global-value-bold">货主001-HZ001</div>
+
+          <van-icon name="arrow" />
+
+        </div>
+
+        <lw-sku-info-module
+          :sku-code="i.code"
+          :sku-name="i.name"
+          :show-right="false"
+          is-row-last
+        />
+
+        <div class="lw-global-flex-between">
+
+          <div>
+            <span class="lw-global-title">
+              {{$lwLanguage.get('','异常率')}}
+            </span>
+            <span class="lw-global-value-bold-red">0%</span>
+          </div>
+
+          <div>
+            <lw-tag
+              round
+              plain
+            >免检</lw-tag>
+            <lw-tag
+              round
+              plain
+            >正常</lw-tag>
+          </div>
+
+        </div>
+
+      </div>
+
+    </lw-popup>
+
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: "lwInboundUnloadActionPage",
+  data() {
+    return {
+      tabActive:'lpn',
+      tabActiveOld:'lpn',
+
+      dataInfo:{
+        skuCode:{
+          value:'',
+          focus: false
+        },
+        skuName:{
+          value:'',
+          focus: false
+        },
+        lpn:{
+          value:'',
+          focus: false
+        },
+        case:{
+          value:'',
+          focus: false
+        },
+        qty:{
+          value:'',
+          focus: false
+        },
+        list:[
+          {
+            code:'SN-001',
+            qty: 1
+          },
+          {
+            code:'SN-002',
+            qty: 2
+          },
+          {
+            code:'SN-003',
+            qty: 3
+          },
+          {
+            code:'SN-004',
+            qty: 4
+          },
+          {
+            code:'SN-005',
+            qty: 5
+          },
+        ],
+        abnormal:{
+          value:'',
+          label:'',
+          focus: false,
+        },
+        remark:{
+          value:'',
+          focus: false
+        },
+      },
+
+      // 确认卸货弹框
+      confirmPopup:{
+        show: false,
+        qty:{
+          value: '',
+          focus: false
+        },
+        qtyLabel:''
+      },
+
+      // 选择商品弹框
+      selectSkuPopup:{
+        show: true,
+        list:[
+          {
+            code:'234',
+            name:'234',
+          },
+          {
+            code:'234',
+            name:'234',
+          },
+          {
+            code:'234',
+            name:'234',
+          },
+        ]
+      }
+    }
+  },
+  computed:{
+    // 扫描数据模块标题
+    scanModel(){
+
+      if (this.tabActive === 'lpn'){
+        return {
+          title: this.$lwLanguage.get('','已扫托码'),
+          rowTitle: this.$lwLanguage.get('','托码')
+        }
+      }
+
+      return {
+        title: this.$lwLanguage.get('','已扫箱码'),
+        rowTitle: this.$lwLanguage.get('','箱码')
+      }
+
+    }
+  },
+  methods: {
+    // 清除输入框
+    clearInput(){
+      this.dataInfo.skuCode.value = ''
+      this.dataInfo.skuName.value = ''
+      this.dataInfo.lpn.value = ''
+      this.dataInfo.case.value = ''
+      this.dataInfo.qty.value = ''
+      this.dataInfo.abnormal.value = ''
+      this.dataInfo.remark.value = ''
+      this.dataInfo.list = []
+      this.dataInfo.skuCode.focus = true
+      this.tabActiveOld = this.tabActive
+    },
+    // 清除数据的方法
+    clearDataFn(message){
+      const isNull = ['skuCode','skuName','lpn','case','qty','abnormal','remark'].some(item=>{
+        return !!this.dataInfo[item].value
+      })
+      if (isNull || this.dataInfo.list.length){
+        this.$lwDialog.confirm({
+          title:this.$lwLanguage.get('','提示'),
+          message
+        }).then(()=>{
+          this.clearInput()
+        }).catch(()=>{
+          this.tabActive = this.tabActiveOld
+        })
+        return
+      }
+
+      this.clearInput()
+    },
+    // tab切换
+    tabChange(){
+      this.clearDataFn(this.$lwLanguage.get('','当前存在录入数据，切换后数据将会被清空'))
+    },
+
+    // 商品号确认
+    skuCodeConfirm(){
+      // TODO 调接口获取商品信息 如果存在多条就弹框选择
+      this.selectSkuPopup.show = true
+    },
+    // 商品名称确认
+    skuNameConfirm(){
+      if (this.tabActive === 'lpn'){
+        this.dataInfo.lpn.focus = true
+        return
+      }
+      if (this.tabActive === 'case'){
+        this.dataInfo.case.focus = true
+        return
+      }
+      this.dataInfo.qty.focus = true
+    },
+    // 托码、箱号确认
+    lpnAndCaseConfirm(val, data){
+      this.dataInfo.list.unshift({
+        code: data.data.key,
+        qty: data.data.qty || 1
+      })
+      this.changeDataInfoQty(true)
+    },
+
+
+    // 重新扫描
+    repeatScan(){
+      this.clearDataFn(this.$lwLanguage.get('','当前存在录入数据，确认全部清除？'))
+    },
+
+    // 完成卸货
+    overUnload(){
+      this.$lwToast.success(
+        this.$lwLanguage.get('','已完成')
+      )
+      history.go(-1)
+    },
+
+    // 确认卸货
+    confirmUnload(){
+      this.confirmPopup.qty.value = this.dataInfo.qty.value || 0
+
+      switch (this.tabActive){
+        case 'lpn':
+          this.confirmPopup.qtyLabel = this.$lwLanguage.get('','托')
+          break;
+        case 'case':
+          this.confirmPopup.qtyLabel = this.$lwLanguage.get('','箱')
+          break;
+        default:
+          this.confirmPopup.qtyLabel = this.$lwLanguage.get('','商品')
+      }
+
+      this.confirmPopup.show = true
+    },
+    // 确认卸货提交
+    confirmPopupSubmit(){
+      if (!Number(this.confirmPopup.qty.value || 0)){
+        this.$lwShowErrorMsg(
+          this.$lwLanguage.get('','数量不能为空，且应当是大于0的正整数')
+        )
+        return
+      }
+
+      this.$lwToast.success(
+        this.$lwLanguage.get('','已确认')
+      )
+      this.confirmPopup.show = false
+      this.clearInput()
+    },
+
+    // 修改数量
+    changeDataInfoQty(data){
+      if (data){
+        const qty = this.dataInfo.list.map(item=>Number(item.qty || 0))
+        this.dataInfo.qty.value = qty.reduce((a,b)=>{return a+b}, 0)
+      }
+    },
+
+    // 确认商品信息
+    selectSkuPopupConfirm(item){
+      console.log(item)
+      this.selectSkuPopup.show = false
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>

package/src/components/page/inbound/unload/add/index.js

@@ -0,0 +1,11 @@
+/*
+* 新建卸货单
+* @author: 张文
+* @date: 2022-12-02
+* */
+
+import lwInboundUnloadAddPage from "./index.vue";
+
+lwInboundUnloadAddPage.install = Vue => Vue.component(lwInboundUnloadAddPage.name, lwInboundUnloadAddPage)
+
+export default lwInboundUnloadAddPage