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

package/src/components/page/process/prepare/index.vue

@@ -0,0 +1,841 @@
+<!--
+  加工 - 备料
+  @author: 张文
+  @date: 2022-08-10
+-->
+<template>
+  <div>
+
+    <lw-nav-bar :title="$lwLanguage.get('','加工 - 备料')"/>
+
+    <div class="lw-global-page-box">
+
+      <!-- 数据看板 -->
+      <template>
+        <div class="lw-global-model-top-radius">
+          <lw-title-value-cell
+            :title="$lwLanguage.get('','加工线')"
+            value="PL-001"
+            val-bold
+            is-row-start
+          />
+          <!-- 时间统计 -->
+          <div class="lw-global-row-end">
+
+            <span class="lw-global-value-bold">{{ $lwDate.format(new Date(), 'MM-dd hh:mm') }}</span>
+
+            <span
+              class="lw-global-value-bold-red"
+              style="display: inline-block;margin-left: 10px"
+            >
+            {{ $lwLanguage.get('','已过') }}
+            {{
+                $lwDate.timeToStr({
+                  l:$lwDate.format('2022-08-10T10:00:00.000Z','yyyy-MM-dd hh:mm:ss'),
+                  n: $lwTimezone.getTimezoneDate({format:'yyyy-MM-dd hh:mm:ss'}),
+                  minType: 'min'
+                }).text
+              }}
+          </span>
+
+          </div>
+
+        </div>
+        <lw-data-look-bg
+          type="bottom"
+          :data="lookData"
+        />
+      </template>
+
+      <!-- tab -->
+      <div
+        style="margin-top: 10px"
+        class="lw-global-tab-box"
+      >
+        <van-tabs
+          type="card"
+          animated
+          v-model="tabActive"
+        >
+
+          <van-tab
+            name="down"
+            :title="$lwLanguage.get('','备料下架')"
+          >
+
+            <div v-if="down.data.length" class="lw-global-model-box">
+
+              <!-- 备件信息 -->
+              <lw-sku-info-module
+                :sku-code="downData.skuCode"
+                :sku-name="downData.skuName"
+                :qty="downData.qty"
+                :qty-text="$lwLanguage.get('','待备量')"
+              />
+
+              <!-- 标签 -->
+              <div class="lw-global-row">
+                <lw-tag
+                  v-for="(i,k) in downData.tagList"
+                  :key="k"
+                  round
+                  plain
+                >{{ i }}</lw-tag>
+              </div>
+
+              <!-- 扩展字段 -->
+              <div class="lw-global-row">
+                <lw-lot-look-module
+                  :columns="downData.lot"
+                  :show-row="false"
+                  value-key="value"
+                  title-key="title"
+                />
+              </div>
+
+              <!-- 库位 -->
+              <lw-title-value-cell
+                :title="$lwLanguage.get('','库位')"
+                :value="downData.locationCode"
+                val-bold
+              />
+
+              <!-- 托盘号 -->
+              <lw-title-value-cell
+                v-if="downHasLpn"
+                :title="$lwLanguage.get('','托盘号')"
+                :value="downData.lpn"
+                val-bold
+              />
+
+              <!-- 箱号 -->
+              <lw-title-value-cell
+                v-if="downHasBox"
+                :title="$lwLanguage.get('','箱号')"
+                :value="downData.box"
+                val-bold
+              />
+
+              <!-- 确认库位 -->
+              <lw-input
+                :title="$lwLanguage.get('','确认库位')"
+                v-model="down.loc.value"
+                :get-focus.sync="down.loc.focus"
+                rule-key="downLoc"
+                required
+                @confirm="downLocConfirm"
+              />
+
+              <!-- 确认托盘号 -->
+              <lw-input
+                :title="$lwLanguage.get('','确认托盘号')"
+                v-model="down.lpn.value"
+                :get-focus.sync="down.lpn.focus"
+                rule-key="lpn"
+                required
+                @confirm="downLpnConfirm"
+              />
+
+              <!-- 物料编码 -->
+              <lw-input
+                :title="$lwLanguage.get('','物料编码')"
+                v-model="down.sku.value"
+                :get-focus.sync="down.sku.focus"
+                rule-key="sku"
+                required
+                @confirm="downSkuConfirm"
+              />
+
+              <!-- 备料数量 -->
+              <lw-input
+                :title="$lwLanguage.get('','备料数量')"
+                v-model="down.num.value"
+                :get-focus.sync="down.num.focus"
+                type="digit"
+                required
+                @confirm="downNumConfirm"
+              />
+
+              <!-- 目标托盘号 -->
+              <lw-input
+                :title="$lwLanguage.get('','目标托盘号')"
+                v-model="down.toLpn.value"
+                :get-focus.sync="down.toLpn.focus"
+                rule-key="toLpn"
+                required
+                @confirm="downToLpnConfirm"
+              />
+
+              <!-- 任务切换 -->
+              <lw-cut-card
+                v-model="down.index"
+                :length="down.data.length"
+                :cut-start="downCutStart"
+                :cut-end="downCutEnd"
+              />
+
+            </div>
+            <lw-not-data v-else/>
+
+          </van-tab>
+
+
+          <van-tab
+            name="up"
+            :title="$lwLanguage.get('','备料上架')"
+          >
+
+            <div v-if="up.data.length" class="lw-global-model-box">
+
+              <div
+                style="font-size: 16px"
+                class="lw-global-row-start lw-global-value-bold-red"
+              >{{ upData.lpn }}</div>
+
+              <div
+                class="lw-global-row"
+                v-for="(i,k) in upData.skuList"
+                :key="k"
+              >
+                <lw-sku-info-module
+                  style="margin-bottom: 5px"
+                  :sku-code="i.skuCode"
+                  :sku-name="i.skuName"
+                  :qty="i.qty"
+                  :qty-text="$lwLanguage.get('','待上架')"
+                />
+
+                <lw-lot-look-module
+                  :columns="i.lot"
+                  :show-row="false"
+                  value-key="value"
+                  title-key="title"
+                />
+
+              </div>
+
+              <lw-title-value-cell
+                :title="$lwLanguage.get('','推荐上架库位')"
+                :value="upData.locationCode"
+                val-red
+                val-bold
+                val-size="16px"
+              />
+
+              <lw-input
+                :title="$lwLanguage.get('','确认目标库位')"
+                v-model="up.loc.value"
+                :get-focus.sync="up.loc.focus"
+                required
+                rule-key="upLoc"
+                @confirm="confirmUp"
+              />
+
+              <lw-cut-card
+                v-model="up.index"
+                :length="up.data.length"
+                :cut-start="upCutStart"
+                :cut-end="upCutEnd"
+              />
+
+            </div>
+            <lw-not-data v-else/>
+
+          </van-tab>
+        </van-tabs>
+      </div>
+
+    </div>
+
+    <lw-bottom-bar v-if="tabActive === 'down'">
+
+      <lw-button
+        type="last"
+        plain
+        @click="downAbnClick"
+      >{{ $lwLanguage.get('','下架异常') }}</lw-button>
+
+      <lw-button @click="confirmDown">
+        {{ $lwLanguage.get('','备料下架') }}
+      </lw-button>
+
+    </lw-bottom-bar>
+
+    <lw-bottom-bar v-if="tabActive === 'up'">
+
+      <lw-button @click="confirmUp">
+        {{ $lwLanguage.get('','备件上架') }}
+      </lw-button>
+
+    </lw-bottom-bar>
+
+
+
+    <!-- 异常 -->
+    <lw-popup
+      v-model="abnDown.show"
+      :title="$lwLanguage.get('','备件异常上报')"
+      background="#f0f0f0"
+      @closed="abnDown.showCom=false"
+    >
+
+      <template v-if="abnDown.showCom">
+
+        <!-- 基础信息 -->
+        <div class="lw-global-model-box">
+          <lw-title-value-cell
+            :title="$lwLanguage.get('','加工台')"
+            :value="downData.prepare"
+            text-align="right"
+            is-row-start
+          />
+
+          <lw-title-value-cell
+            :title="$lwLanguage.get('','备料任务号')"
+            :value="downData.taskNo"
+            text-align="right"
+          />
+
+          <div class="lw-global-row lw-global-flex-between">
+
+            <div
+              style="flex-shrink: 0"
+              class="lw-global-title"
+            >
+              {{ $lwLanguage.get('','物料') }}
+            </div>
+
+            <lw-sku-info-module
+              :sku-name="downData.skuName"
+              :sku-code="downData.skuCode"
+              :show-right="false"
+            />
+
+          </div>
+
+          <lw-title-value-cell
+            :title="$lwLanguage.get('','货主')"
+            :value="(downData.ownerCode || '-') + ' / ' +(downData.ownerName || '-')"
+            text-align="right"
+          />
+
+          <lw-title-value-cell
+            :title="$lwLanguage.get('','待备量')"
+            :value="downData.qty"
+            text-align="right"
+            val-bold
+            val-red
+          />
+
+          <lw-title-value-cell
+            :title="$lwLanguage.get('','下架库位')"
+            :value="downData.locationCode"
+            text-align="right"
+          />
+
+          <lw-title-value-cell
+            :title="$lwLanguage.get('','托盘号')"
+            :value="downData.lpn || '-'"
+            text-align="right"
+          />
+        </div>
+
+        <!-- 批次信息 -->
+        <div class="lw-global-model-box lw-global-collapse-box">
+          <van-collapse
+            v-model="abnDown.collapseAction"
+            :border="false"
+          >
+            <van-collapse-item
+              name="1"
+              :title="$lwLanguage.get('','批次信息')"
+            >
+
+              <lw-lot-look-module
+                :columns="downData.lot"
+                title-key="title"
+                value-key="value"
+              />
+
+            </van-collapse-item>
+          </van-collapse>
+        </div>
+
+        <!-- 异常输入框 -->
+        <lw-abnormal-input-module
+          class="lw-global-model-box"
+          ref="abnInput"
+          :type="$lwLanguage.get('','加工')"
+          :ab-type="$lwLanguage.get('','备料')"
+          :abn-type-key="['QTY', 'QUALITY']"
+          :qty="downData.qty"
+        />
+
+      </template>
+
+
+
+      <template #button>
+
+        <lw-button @click="confirmAbn">
+          {{ $lwLanguage.get('','上报') }}
+        </lw-button>
+
+      </template>
+    </lw-popup>
+
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: "lwProcessPrepareIndexPage",
+  data() {
+    return {
+      // 数据看板
+      lookData:{
+        plan:{
+          title: this.$lwLanguage.get('','计划量'),
+          value: 100
+        },
+        over:{
+          title: this.$lwLanguage.get('','已备量'),
+          value: 40
+        },
+        wait:{
+          title: this.$lwLanguage.get('','待备量'),
+          value: 50
+        },
+        abn:{
+          title: this.$lwLanguage.get('','异常量'),
+          value: 10,
+          color: 'yellow'
+        },
+      },
+
+      // tab激活项
+      tabActive: '',
+
+      // 备料下架
+      down:{
+        // 当前索引
+        index: 0,
+        // 下架数据
+        data: [
+          {
+            skuCode:'BL-001',
+            skuName:'备料-001',
+            qty: 100,
+            tagList:['中件','快移','BO'],
+            lot:[
+              {title:'订单号',value:'DD-001'},
+              {title:'收货日期',value:'2022-08-10T10:00:00.00Z'},
+              {title:'生产日期',value:'2022-08-09T10:00:00.00Z'},
+            ],
+            locationCode:'LOC-001',
+            lpn: 'LPN-001',
+            box: 'BOX-001',
+            prepare: 'JGT-001',
+            taskNo:'RW-001',
+            ownerCode:'HZ-001',
+            ownerName:'货主-001'
+          },
+          {
+            skuCode:'BL-002',
+            skuName:'备料-002',
+            qty: 200,
+            tagList:['中件','快移','BO'],
+            lot:[
+              {title:'订单号',value:'DD-001'},
+              {title:'收货日期',value:'2022-08-10T10:00:00.00Z'},
+              {title:'生产日期',value:'2022-08-09T10:00:00.00Z'},
+            ],
+            locationCode:'LOC-002',
+            lpn: 'LPN-002',
+          },
+          {
+            skuCode:'BL-003',
+            skuName:'备料-003',
+            qty: 300,
+            tagList:['中件','快移','BO'],
+            lot:[
+              {title:'订单号',value:'DD-001'},
+              {title:'收货日期',value:'2022-08-10T10:00:00.00Z'},
+              {title:'生产日期',value:'2022-08-09T10:00:00.00Z'},
+            ],
+            locationCode:'LOC-003',
+          },
+        ],
+        // 确认库位
+        loc:{
+          value:'',
+          focus: false
+        },
+        // 确认托盘号
+        lpn:{
+          value:'',
+          focus: false
+        },
+        // 物料编码
+        sku:{
+          value:'',
+          focus: false
+        },
+        // 备料数量
+        num:{
+          value:'',
+          focus: false
+        },
+        // 目标托盘
+        toLpn:{
+          value:'',
+          focus: false
+        }
+      },
+
+      // 备料上架
+      up:{
+        index: 0,
+        data:[
+          {
+            skuList:[
+              {
+                skuCode:'BL-001',
+                skuName:'备料-001',
+                qty: 100,
+                lot:[
+                  {title:'订单号',value:'DD-001'},
+                  {title:'收货日期',value:'2022-08-10T10:00:00.00Z'},
+                  {title:'生产日期',value:'2022-08-09T10:00:00.00Z'},
+                ],
+              },
+              {
+                skuCode:'BL-002',
+                skuName:'备料-002',
+                qty: 200,
+                lot:[
+                  {title:'订单号',value:'DD-001'},
+                  {title:'收货日期',value:'2022-08-10T10:00:00.00Z'},
+                  {title:'生产日期',value:'2022-08-09T10:00:00.00Z'},
+                ],
+              },
+              {
+                skuCode:'BL-003',
+                skuName:'备料-003',
+                qty: 300,
+                lot:[
+                  {title:'订单号',value:'DD-001'},
+                  {title:'收货日期',value:'2022-08-10T10:00:00.00Z'},
+                  {title:'生产日期',value:'2022-08-09T10:00:00.00Z'},
+                ],
+              },
+            ],
+            locationCode: 'TJ-001',
+            lpn: 'LPN-001'
+          },
+          {
+            skuList:[
+              {
+                skuCode:'BL-001',
+                skuName:'备料-001',
+                qty: 100,
+                lot:[
+                  {title:'订单号',value:'DD-001'},
+                  {title:'收货日期',value:'2022-08-10T10:00:00.00Z'},
+                  {title:'生产日期',value:'2022-08-09T10:00:00.00Z'},
+                ],
+              },
+              {
+                skuCode:'BL-002',
+                skuName:'备料-002',
+                qty: 200,
+                lot:[
+                  {title:'订单号',value:'DD-001'},
+                  {title:'收货日期',value:'2022-08-10T10:00:00.00Z'},
+                  {title:'生产日期',value:'2022-08-09T10:00:00.00Z'},
+                ],
+              },
+              {
+                skuCode:'BL-003',
+                skuName:'备料-003',
+                qty: 300,
+                lot:[
+                  {title:'订单号',value:'DD-001'},
+                  {title:'收货日期',value:'2022-08-10T10:00:00.00Z'},
+                  {title:'生产日期',value:'2022-08-09T10:00:00.00Z'},
+                ],
+              },
+            ],
+            locationCode: 'TJ-002',
+            lpn: 'LPN-002'
+          },
+        ],
+        loc:{
+          value: '',
+          focus: false
+        }
+      },
+
+      // 异常弹框
+      abnDown:{
+        show: false,
+        showCom: false,
+        collapseAction: []
+      }
+    }
+  },
+  computed:{
+    // 下架数据
+    downData(){
+      return this.down.data[this.down.index] || {}
+    },
+    // 下架 - 是否存在托盘号
+    downHasLpn(){
+      return !!this.downData.lpn
+    },
+    // 下架 - 是否存在箱号
+    downHasBox(){
+      return !!this.downData.box
+    },
+
+    // 上架数据
+    upData(){
+      return this.up.data[this.up.index] || {}
+    }
+  },
+  methods: {
+
+    // 数据检查
+    inputCheck(key, nullMsg, checkVal, errorMsg){
+      const val = this.down[key].value
+
+      if (!val){
+        this.down[key].focus = true
+        this.$lwShowErrorMsg(nullMsg)
+        return false
+      }
+
+      if (checkVal && val !== checkVal){
+        this.down[key].focus = true
+        this.$lwShowErrorMsg(errorMsg)
+        this.down[key].value = ''
+        return false
+      }
+
+      return true
+    },
+    // 任务切换前的校验
+    cutStart(data){
+      return new Promise((res,err)=>{
+        if (data){
+          this.$lwDialog.confirm({
+            title: this.$lwLanguage.get('','提示'),
+            message: this.$lwLanguage.get('','切换后当前输入内容将被清空')
+          }).then(()=>res()).catch(()=>err())
+        }else {
+          res()
+        }
+      })
+    },
+
+    // 下架 - 库位确认
+    downLocConfirm(){
+      if (this.downLocCheck()){
+        if (this.downHasLpn){
+          this.down.lpn.focus = true
+          return
+        }
+        this.down.num.focus = true
+      }
+    },
+    // 下架 - 库位检查
+    downLocCheck(){
+      return this.inputCheck(
+        'loc',
+        this.$lwLanguage.get('','请确认库位'),
+        this.downData.locationCode,
+        this.$lwLanguage.get('','当前库位与任务库位不一致')
+      )
+    },
+
+    // 下架 - 托盘号确认
+    downLpnConfirm(){
+      if (this.downLpnCheck()) this.down.num.focus = true
+    },
+    // 下架 - 托盘校验
+    downLpnCheck(){
+      if (!this.downHasLpn) return true
+      return this.inputCheck(
+        'lpn',
+        this.$lwLanguage.get('','请确认托盘号'),
+        this.downData.lpn,
+        this.$lwLanguage.get('','当前托盘号与任务托盘号不一致')
+      )
+    },
+
+    // 下架 - 物料编码确认
+    downSkuConfirm(){
+      if(this.downSkuCheck()) this.down.num.focus = true
+    },
+    // 下架 - 物料编码检查
+    downSkuCheck(){
+      return this.inputCheck(
+        'sku',
+        this.$lwLanguage.get('','物料编码不能为空'),
+        this.downData.skuCode,
+        this.$lwLanguage.get('','当前物料编码与任务物料编码不一致'),
+      )
+    },
+
+    // 下架 - 备料数量
+    downNumConfirm(){
+      if (this.downNumCheck()) this.down.toLpn.focus = ''
+    },
+    // 下架 - 备料数量检查
+    downNumCheck(){
+      const num = Number(this.down.num.value || 0)
+
+      if (!num){
+        this.down.num.focus = true
+        this.$lwShowErrorMsg(
+          this.$lwLanguage.get('','备料数量不能为空，且应当是大于0的整数')
+        )
+        return false
+      }
+
+      if(num > this.downData.qty){
+        this.down.num.focus = true
+        this.$lwShowErrorMsg(
+          this.$lwLanguage.get('','备料数量不能大于待备量')
+        )
+        this.down.num.value = ''
+        return false
+      }
+
+      return true
+    },
+
+    // 下架 - 目标托盘确认
+    downToLpnConfirm(){
+      if (this.downToLpnCheck()) this.confirmDown()
+    },
+    // 下架 - 目标托盘校验
+    downToLpnCheck(){
+      return this.inputCheck(
+        'toLpn',
+        this.$lwLanguage.get('','目标托盘不能为空')
+      )
+    },
+
+    // 下架 - 确认备料下架
+    confirmDown(){
+      // 校验必填项
+      if (
+        !(
+          this.downLocCheck() &&
+          this.downLpnCheck() &&
+          this.downSkuCheck() &&
+          this.downNumCheck() &&
+          this.downToLpnCheck()
+        )
+      ) return
+
+      console.log('备件下架确认')
+    },
+
+    // 任务切换前
+    downCutStart(){
+      const down = this.down
+      const data =  down.loc.value ||
+        down.lpn.value ||
+        down.sku.value ||
+        Number(down.num.value || 0) ||
+        down.toLpn.value
+
+      return this.cutStart(data)
+    },
+    // 任务切换后
+    downCutEnd(){
+      const down = this.down
+      down.loc.value = ''
+      down.lpn.value = ''
+      down.sku.value = ''
+      down.num.value = ''
+      down.toLpn.value = ''
+      down.loc.focus = true
+    },
+
+    // 下架异常
+    downAbnClick(){
+      this.abnDown.showCom = true
+      this.abnDown.show = true
+    },
+    // 下架 - 确认异常上报
+    confirmAbn(){
+      const {success, data} = this.$refs.abnInput.getAbnormalInputData()
+
+      if(!success) return
+
+      console.log(data)
+    },
+
+    // 上架 - 任务切换前
+    upCutStart(){
+      return this.cutStart(!!this.up.loc.value)
+    },
+    // 上架 - 任务切换后
+    upCutEnd(){
+      this.up.loc.value = ''
+      this.up.loc.focus = true
+    },
+
+    // 确认上架
+    confirmUp(){
+
+      if (!this.up.loc.value){
+        this.up.loc.focus = true
+        this.$lwShowErrorMsg(
+          this.$lwLanguage.get('','请确认目标库位')
+        )
+        return
+      }
+
+      if (this.upData.locationCode === this.up.loc.value){
+        this.confirmUpAction()
+        return
+      }
+
+      this.$lwDialog.confirm({
+        title: this.$lwLanguage.get('','提示'),
+        message: this.$lwLanguage.get('','目标库位不是推荐库位，确认上架？'),
+        msgList: [
+          {
+            key:this.$lwLanguage.get('','推荐上架库位'),
+            value: this.upData.locationCode
+          },
+          {
+            key:this.$lwLanguage.get('','目标库位'),
+            value: this.up.loc.value
+          },
+        ]
+      }).then(()=>{
+        this.confirmUpAction()
+      }).catch(()=>{
+        this.up.loc.value = ''
+        this.up.loc.focus = true
+      })
+
+    },
+    // 确认上架 - 提交后台
+    confirmUpAction(){
+      console.log('上架提交')
+    }
+
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>