@logwire/logwire-wms-pda-ui 3.1.2 → 3.1.3-zc-beta

package/src/views/wms/page/inbound/components/AsnInfo.vue

@@ -0,0 +1,258 @@
+<template>
+  <div class="asn-info-bg">
+    <!-- 收货单信息 -->
+    <div class="asn-info" :class="{shrink: isShrink}">
+      <div>
+        <div>{{ $lwLanguage.get('wms_project.pda.components.page.inbound.components.niivrnjg', '到货通知单') }}</div>
+        <div><b>{{ asn.asnNo }}</b></div>
+        <lw-button
+          v-if="showPrint"
+          style="flex-shrink: 0"
+          mini
+          round
+          @click="$emit('print')"
+        >
+          {{$lwLanguage.get('wms_project.pda.components.page.inbound.components.AsnInfo.cheknhil','商品补码')}}
+        </lw-button>
+        <div>
+          <lw-tag v-if="!isNaN(asn.delayTime) && asn.delayTime > 0" type="danger" plain>
+            {{ $lwLanguage.get('wms_project.pda.components.page.inbound.components.hgwhucpw', '延迟') }}
+          </lw-tag>
+          <lw-tag v-if="asn.isEmergency" type="danger" plain>BO</lw-tag>
+          <van-icon v-if="shrinkable" class="btn-shrink" :class="{inverted: isShrink}" name="arrow-up"
+                    @click.stop="isShrink = !isShrink"/>
+        </div>
+      </div>
+      <template v-for="i in fields">
+        <div v-if="asn[i.field]" :key="i.field">
+          <div>{{ i.label }}</div>
+          <div :style="i.style">
+            <div v-if="i.handler">{{ i.handler(asn[i.field]) }}</div>
+            <template v-else>
+              <div v-for="(line, idx) in (asn[i.field].toString().split('\n'))" :key="idx">
+                {{ line }}
+              </div>
+            </template>
+          </div>
+        </div>
+      </template>
+    </div>
+
+    <!-- 收货单数量 -->
+    <lw-data-look-bg :type="radius?'bottom':'not'">
+      <div>
+        <div>{{ asn.qty }}</div>
+        <div>{{ $lwLanguage.get('wms_project.pda.components.page.inbound.components.ooepssdd', '计划量') }}</div>
+      </div>
+      <div>
+        <div>{{ asn.receiveQty }}</div>
+        <div>{{ $lwLanguage.get('wms_project.pda.components.page.inbound.components.gjpbpfhb', '已收量') }}</div>
+      </div>
+      <div>
+        <div>{{ asn.pendingQty }}</div>
+        <div>{{ $lwLanguage.get('wms_project.pda.components.page.inbound.components.jmqngnfs', '待收量') }}</div>
+      </div>
+      <div>
+        <div>{{ asn.arrivalQty }}</div>
+        <div>{{ $lwLanguage.get('wms_project.pda.components.page.inbound.components.mwgalrja', '到货量') }}</div>
+      </div>
+      <div class="count-task-board-yellow">
+        <div>{{ asn.qualityLossQty }}</div>
+        <div>{{ $lwLanguage.get('wms_project.pda.components.page.inbound.components.rnruqkfc', '异常量') }}</div>
+      </div>
+    </lw-data-look-bg>
+  </div>
+</template>
+
+<script>
+// import { lwDataLookBg } from 'logwire-wms-pda-ui';
+
+export default {
+  name: 'AsnInfo',
+  // components: { lwDataLookBg },
+  props: {
+    data: Object,
+    shrinkable: {
+      type: Boolean,
+      default: false
+    },
+    radius: {
+      type: Boolean,
+      default: true,
+    },
+
+    // 是否显示打印按钮
+    showPrint: Boolean
+  },
+  computed: {
+    asn() {
+      const data = this.data
+      if (data) {
+        if (data.ownerCode) {
+          data.owner = data.ownerCode + ' - ' + data.ownerName
+        }
+        if (data.supplierCode) {
+          data.supplier = data.supplierCode + ' - ' + data.supplierName
+          if (data.supplierAddress) {
+            data.supplier += ('\n' + data.supplierAddress)
+          }
+        }
+        if (data.carrierCode) {
+          data.carrier = data.carrierCode + ' - ' + data.carrierName
+        }
+        if (data.allocWarehouseCode) {
+          data.allocWarehouse = data.allocWarehouseCode + ' - ' + data.allocWarehouseName
+        }
+      }
+      data.pendingQty = data.qty - data.receiveQty
+      if(data.pendingQty<0){
+        data.pendingQty = 0
+      }
+      return data
+    }
+  },
+  data() {
+    return {
+      isShrink: false,
+      fields: [
+        {
+          field: 'extNo',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.kkxwtszg', '外部单号')
+        },
+        {
+          field: 'type',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.mhbnxydj', '订单类型'),
+          handler: value => this.$lwDict.getDictLabel('biz_asn_type', value)
+        },
+        {
+          field: 'planNo',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.fiiclmal', '入库计划单')
+        },
+        {
+          field: 'allocationNo',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.phcgvdlm', '调拨单')
+        },
+        {
+          field: 'purchaseNo',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.taoumzqm', '采购单')
+        },
+        {
+          field: 'allocWarehouse',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.wlzobmav', '调出仓库')
+        },
+        {
+          field: 'owner',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.gkrdehkd', '货主')
+        },
+        {
+          field: 'supplier',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.uwjnnema', '供应商')
+        },
+        {
+          field: 'carrier',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.vjnvialr', '承运商')
+        },
+        {
+          field: 'carrierPlateNum',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.volitcbr', '车牌号')
+        },
+        {
+          field: 'planArrivalTime',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.zqaqvtnq', '计划时间'),
+          handler: value => this.$lwDate.format(value, 'yyyy-MM-dd hh:mm')
+        },
+        {
+          field: 'estArrivalTime',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.tfzugxpz', '预约时间'),
+          handler: value => this.$lwDate.format(value, 'yyyy-MM-dd hh:mm')
+        },
+        {
+          field: 'estDockName',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.rwoyzroy', '预约月台')
+        },
+        {
+          field: 'abnormalRate',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.inbound.components.rbkqkdsy', '异常率'),
+          style: {color: 'red'}
+        },
+      ]
+    }
+  },
+}
+</script>
+
+<style lang="less" scoped>
+.btn-shrink {
+  padding: 5px;
+
+  &.inverted {
+    transform: rotate(180deg);
+  }
+}
+
+.asn-info {
+  line-height: 1.5em;
+  font-size: 0.9em;
+  overflow: hidden;
+  padding: 10px;
+
+  &.shrink {
+    max-height: 114px;
+  }
+
+  & > div {
+    display: flex;
+    align-items: center;
+
+    & > div:nth-child(1) {
+      color: gray;
+      flex-basis: 25%;
+      margin-right: 10px;
+      text-align: right;
+
+      &:after {
+        content: ':';
+      }
+    }
+
+    & > div:nth-child(2) {
+      flex-grow: 1;
+    }
+  }
+}
+
+.asn-info-bg {
+  background: #fff;
+  border-radius: 8px;
+}
+
+.task-board-nums {
+  display: flex;
+  justify-content: space-between;
+  margin: 10px -10px 0;
+  padding: 15px;
+  background: #0f90dd;
+  color: white;
+  text-align: center;
+  font-size: 0.9em;
+
+  &.bottom-radius {
+    margin-bottom: -10px;
+    border-radius: 0 0 8px 8px;
+  }
+
+  & > div {
+    &:last-child {
+      color: yellow;
+    }
+
+    & > div:first-child {
+      font-size: 1.2em;
+    }
+
+    & > div:last-child {
+      margin-top: 5px;
+    }
+  }
+}
+</style>

package/src/views/wms/page/inbound/components/AsnSkuInfo.vue

@@ -0,0 +1,94 @@
+<template>
+  <div v-if="data && data.sku" class="sku-info" :class="'bottom'===type?'sku-info-bottom': ('not'===type?'sku-info-not':'sku-info-round')">
+    <div>
+      <div style="color: red; font-size: 1.1em;"><b>{{data.sku.code}}</b></div>
+      <div>
+        <lw-tag plain color="red" v-if="data.sku.new">{{$lwLanguage.get('wms_project.pda.components.page.inbound.components.hfesgrpm', '新品')}}</lw-tag>
+        <lw-tag plain color="red">{{ data.sku.skuUrgencyLabel }}</lw-tag>
+      </div>
+    </div>
+    <div>
+      <div>{{data.sku.name}}</div>
+    </div>
+    <div>
+      <div>
+        {{$lwLanguage.get('wms_project.pda.components.page.inbound.components.dtapgpqz', '异常率')}}
+        <b style="color: red; font-size: 1.1em;">
+          {{' ' + data.sku.abnormalRate}}</b>
+        %
+      </div>
+      <div>
+        <lw-button
+          v-if="showPrint"
+          mini
+          round
+          @click="$emit('printClick')"
+        >
+          {{ $lwLanguage.get('wms_project.pda.components.page.inbound.components.AsnSkuInfo.bitwuvok','补码') }}
+        </lw-button>
+
+        <lw-button
+          v-if="showContainerPrint"
+          style="flex-shrink: 0"
+          mini
+          round
+          @click="$emit('containerPrint')"
+        >
+          {{$lwLanguage.get('wms_project.pda.components.page.inbound.components.AsnSkuInfo.jtbuadug','打印容器号')}}
+        </lw-button>
+        <lw-tag plain color="red">{{data.sku.qualityTypeLabel}}</lw-tag>
+      </div>
+    </div>
+    <slot name="extend"/>
+    <slot name="extend2"/>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AsnSkuInfo',
+  props: {
+    data: Object,
+    type:{
+      type: String,
+      default: 'not'
+    },
+    showPrint: Boolean,
+
+    // 是否显示容器打印按钮
+    showContainerPrint: Boolean
+  },
+}
+</script>
+
+<style lang="less" scoped>
+.sku-info {
+  font-size: 0.9em;
+  line-height: 1.5em;
+  background: #fff;
+  padding: 10px;
+
+  & > div {
+    display: flex;
+    align-items: center;
+
+    & > div:first-child {
+      flex-grow: 1;
+      color: gray;
+    }
+  }
+}
+
+.sku-info-bottom {
+  border-bottom-left-radius: 8px;
+  border-bottom-right-radius: 8px;
+}
+
+.sku-info-not {
+}
+
+.sku-info-round {
+  margin: 10px 0 0;
+  border-radius: 8px;
+}
+</style>