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

package/src/components/page/outbound/handover/index/index.vue

@@ -0,0 +1,220 @@
+<!--
+  出库交接 - 起始页
+  @author: 张文
+  @date: 2022-07-11
+-->
+<template>
+  <div>
+
+    <lw-nav-bar :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.index.hdrrzzsu','出库交接')"/>
+
+    <div class="lw-global-page-box">
+
+      <div v-if="tabList.length" class="lw-global-tab-box">
+
+        <van-tabs
+          type="card"
+          animated
+          v-model="tabActive"
+          @change="tabChange"
+        >
+          <van-tab
+            v-for="(i,k) in tabList"
+            :key="k"
+            :name="i"
+            :title="i"
+          ></van-tab>
+        </van-tabs>
+
+        <div class="lw-global-model-box">
+
+          <lw-input
+            :placeholder="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.index.gqwxdyfh','线路名/线路编码/箱票号搜索')"
+            v-model="search"
+            :show-bottom-border="false"
+            rule-key="case"
+            @confirm="searchConfirm"
+            @clear="searchConfirm"
+          >
+
+            <template #button>
+
+              <lw-button
+                round
+                mini
+                @click="searchConfirm"
+              >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.handover.index.zgbyciol','搜索') }}</lw-button>
+
+            </template>
+
+          </lw-input>
+
+        </div>
+
+        <collapse-item
+          v-for="(i,k) in dataList"
+          :key="i.valueGroupKey"
+          :item="i"
+          :index="k"
+          @click="itemClick"
+        />
+        <lw-not-data v-if="!dataList.length"/>
+      </div>
+      <lw-not-data v-else/>
+
+    </div>
+
+    <!-- 选择交接方式弹框 -->
+    <lw-popup
+      :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.index.mcnoinju','选择交接方式')"
+      v-model="selectMethodPopup.show"
+    >
+      <div
+        class="lw-global-click-style lw-global-flex-between lw-global-row"
+        v-for="(i,k) in selectMethodPopup.list"
+        :key="k"
+        @click="selectConfirm(i.type)"
+      >
+
+        <div
+          class="lw-global-value"
+          style="flex: 1"
+        >{{ i.title }}</div>
+        <van-icon style="flex-shrink: 0" name="arrow" />
+      </div>
+
+
+    </lw-popup>
+  </div>
+</template>
+
+<script>
+import collapseItem from './../components/collapseItem.vue'
+import {
+  projectHandoverStartStaffTask,
+  projectWmsGetWarehouseHandoverTabKey,
+  projectWmsOutboundGetHandoverData
+} from "../../../../../api/outbound/handover";
+
+export default {
+  name: "lwOutboundHandoverIndexPage",
+  components:{
+    collapseItem
+  },
+  data() {
+    return {
+      // tab集货项
+      tabActive: '',
+
+      // tab项
+      tabList: [],
+
+      // 搜索栏
+      search: '',
+
+      // 显示数据
+      dataList: [],
+
+      // 选择交接类型弹框
+      selectMethodPopup:{
+        show: false,
+        data:{},
+        list:[
+          {title: this.$lwLanguage.get('wms_project.pda.components.page.outbound.handover.index.iaguxiqo','按码托号交接'), type:'lpn'},
+          {title: this.$lwLanguage.get('wms_project.pda.components.page.outbound.handover.index.kjrvljgo','按客户交接'), type:'customer'},
+          {title: this.$lwLanguage.get('wms_project.pda.components.page.outbound.handover.index.bbbrulkb','按线路交接'), type:'line'},
+        ]
+      }
+    }
+  },
+  mounted() {
+    this.init()
+  },
+  methods: {
+    // 初始化
+    async init(){
+      await this.getTabList()
+
+      //如果没有分组数据就不执行后面操作
+      if (!this.tabList.length) return
+
+      this.tabActive = this.tabList[0]
+      this.getData()
+    },
+
+    // 获取tab数据项
+    getTabList(){
+      this.tabList = []
+      return new Promise((PR,PE)=>{
+        projectWmsGetWarehouseHandoverTabKey().then(res=>{
+          this.tabList = res || []
+          PR()
+        }).catch(()=>PE())
+      })
+    },
+
+    // 获取数据
+    getData(){
+      this.dataList = []
+      projectWmsOutboundGetHandoverData({
+        queryParam: this.search,
+        tabGroupKey: this.tabActive
+      }).then(res=>{
+        this.dataList = res || []
+      })
+    },
+
+    // tab发生改变
+    tabChange(){
+      this.search = ''
+      this.getData()
+    },
+
+    // 确认搜索
+    searchConfirm(){
+      this.getData()
+    },
+
+    // 显示数据被点击
+    itemClick(item){
+      this.selectMethodPopup.data = item
+      this.selectMethodPopup.show = true
+    },
+
+    // 确认交接方式
+    async selectConfirm(type){
+      const query = {
+        lwTabGroupKey: this.tabActive,
+        lwValueGroupKey: this.selectMethodPopup.data.valueGroupKey
+      }
+      let path = '/outbound/handover/'
+
+      switch (type) {
+        case 'lpn':
+          path += 'lwLpnAction'
+          break;
+        case 'customer':
+          path += 'lwCustomerAction'
+          break;
+        case 'line':
+          path += 'lwLineAction'
+          break;
+        default:
+          console.warn(this.$lwLanguage.get('wms_project.pda.components.page.outbound.handover.index.tdfrkozg', '交接方式规则无法解析，传入类型：'), type)
+          return
+      }
+
+      await projectHandoverStartStaffTask()
+
+      await this.$router.push({
+        path,
+        query
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>

package/src/components/page/outbound/handover/line/index.js

@@ -0,0 +1,11 @@
+/*
+* 出库交接 - 按线路交接
+* @author: 张文
+* @date  2022-07-11
+* */
+
+import lwOutboundHandoverLineActionPage from "./index.vue";
+
+lwOutboundHandoverLineActionPage.install = Vue => Vue.component(lwOutboundHandoverLineActionPage.name, lwOutboundHandoverLineActionPage)
+
+export default lwOutboundHandoverLineActionPage

package/src/components/page/outbound/handover/line/index.vue

@@ -0,0 +1,32 @@
+<!--
+  出库交接 - 按线路交接
+  @author: 张文
+  @date: 2022-07-11
+-->
+<template>
+  <customer-and-line
+    handover-type="100"
+  />
+</template>
+
+<script>
+
+import customerAndLine from "../components/customerAndLine.vue";
+
+export default {
+  name: "lwOutboundHandoverLineActionPage",
+  components:{
+    customerAndLine,
+  },
+  data() {
+    return {
+
+    }
+  },
+  methods: {}
+}
+</script>
+
+<style scoped lang="less">
+
+</style>

package/src/components/page/outbound/handover/lpn/index.js

@@ -0,0 +1,11 @@
+/*
+* 出库交接 - 按店交接
+* @author: 张文
+* @date  2022-07-11
+* */
+
+import lwOutboundHandoverLpnActionPage from "./index.vue";
+
+lwOutboundHandoverLpnActionPage.install = Vue => Vue.component(lwOutboundHandoverLpnActionPage.name, lwOutboundHandoverLpnActionPage)
+
+export default lwOutboundHandoverLpnActionPage

package/src/components/page/outbound/handover/lpn/index.vue

@@ -0,0 +1,262 @@
+<!--
+  出库交接 - 按托盘
+  @author: 张文
+  @date: 2022-07-14
+-->
+<template>
+  <page-box
+    ref="pageBox"
+    :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.aqxotryb','出库交接 - 按托盘')"
+    :line-data="lineData"
+    :box-list="boxList"
+    is-lpn
+    :show-bottom-bar="tabActive==='ing'"
+    @repeatScan="repeatScan"
+    @handoverSubmit="handoverSubmit"
+    @inputFocus="lpn.focus=true"
+  >
+    <!-- tab -->
+    <div class="lw-global-tab-box">
+
+      <van-tabs
+        type="card"
+        animated
+        v-model="tabActive"
+      >
+
+        <!-- 正在交接 -->
+        <van-tab
+          name="ing"
+          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.edsgudgl','正在交接')"
+        >
+
+          <!-- 扫描输入框 -->
+          <div
+            style="padding: 5px 10px"
+            class="lw-global-model-box"
+          >
+            <lw-input
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.qqmzsweo','码托号')"
+              v-model="lpn.value"
+              :get-focus.sync="lpn.focus"
+              :show-bottom-border="false"
+              rule-key="lpn"
+              @confirm="lpnConfirm"
+            />
+
+            <div
+              v-if="Object.keys(nowScanData).length"
+              class="lw-global-flex-between"
+            >
+
+              <lw-title-value-cell
+                :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.lukxepnw','箱数')"
+                :value="nowScanData.boxCount"
+                val-bold
+                val-red
+                :is-row="false"
+              />
+
+              <lw-title-value-cell
+                :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.ipclegpu','总数量')"
+                :value="nowScanData.totalQty"
+                val-bold
+                val-red
+                :is-row="false"
+              />
+
+            </div>
+          </div>
+
+          <!-- 当前扫描的箱数据 -->
+          <lpn-list-item
+            class="lw-global-animation-out"
+            v-for="(i,k) in boxList"
+            :key="i.lpn"
+            :item="i"
+            :route-query="routeQuery"
+            :style="{animationDelay: 50 * k + 'ms'}"
+          />
+
+
+        </van-tab>
+
+        <!-- 码托列表 -->
+        <van-tab
+          name="lpn"
+          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.xoehqzkm','码托列表')"
+        >
+          <lpn-list-item
+            class="lw-global-animation-out"
+            v-for="(i,k) in lpnList.list"
+            :key="k"
+            :item="i"
+            :route-query="routeQuery"
+            :style="{animationDelay: 50 * k + 'ms'}"
+          />
+
+          <lw-pages
+            v-model="lpnList.pageNum"
+            :page-size="lpnList.pageSize"
+            :page-total="lpnList.pageTotal"
+            @change="lpnListPageChange"
+          />
+          <lw-not-data v-if="!lpnList.list.length"/>
+        </van-tab>
+
+        <!-- 店铺列表 -->
+        <van-tab
+          name="store"
+          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.lgyrbgra','店铺列表')"
+        >
+          <customer-list
+            v-model="customer.pageNum"
+            :list="customer.list"
+            :page-total="customer.pageTotal"
+            @pageChange="getCustomerData"
+            @click="showBoxNoPopup"
+          />
+        </van-tab>
+
+      </van-tabs>
+    </div>
+
+
+
+    <!-- 查看线路交接箱信息弹框 -->
+    <lw-popup
+      :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.cjxbldrd','捆包箱信息')"
+      v-model="boxDataPopup.show"
+      height="90%"
+      background="#f0f0f0"
+      @closed="boxDataPopup.showCom=false"
+    >
+
+      <div v-if="boxDataPopup.showCom" class="lw-global-tab-box">
+        <van-tabs
+          type="card"
+          animated
+          v-model="boxDataPopup.tabActive"
+        >
+
+          <!-- 未交接 -->
+          <van-tab
+            name="wait"
+            :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.sjwcynzm','未交接')"
+          >
+            <box-num-list
+              :query="boxDataPopup.query"
+            />
+          </van-tab>
+
+          <!-- 已交接 -->
+          <van-tab
+            name="wait"
+            :title="$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.galxmagt','已交接')"
+          >
+            <box-num-list
+              type="200"
+              :query="boxDataPopup.query"
+            />
+          </van-tab>
+        </van-tabs>
+      </div>
+
+    </lw-popup>
+  </page-box>
+</template>
+
+<script>
+import pageBox from './../components/pageBox.vue'
+import customerList from "./../components/customerList.vue"
+import boxNumList from "./../components/boxNumList.vue"
+import lpnListItem from "./../components/lpnListItem.vue"
+import {action} from "../mixin";
+import {
+  projectWmsOutboundGetHandoverLpnBoxData,
+  projectWmsOutboundGetValueGroupLpnHandoverData
+} from "../../../../../api/outbound/handover/lpn";
+
+export default {
+  name: "lwOutboundHandoverLpnActionPage",
+  components:{
+    pageBox,
+    customerList,
+    boxNumList,
+    lpnListItem,
+  },
+  mixins:[action],
+  data() {
+    return {
+      lpn:{
+        value: '',
+        focus: true,
+        disabled: false
+      },
+
+      isLpnHandover: true,
+
+      lpnList:{
+        pageNum: 1,
+        pageSize: 10,
+        pageTotal: 0,
+        list: {}
+      }
+    }
+  },
+  methods: {
+    // 码托列表页面改变
+    lpnListPageChange(){
+      this.getLpnList()
+    },
+    // 获取码托列表数据
+    getLpnList(){
+      projectWmsOutboundGetValueGroupLpnHandoverData({
+        ...this.routeQuery,
+        pageNum: this.lpnList.pageNum,
+        pageSize: this.lpnList.pageSize
+      }).then(res=>{
+        this.lpnList.list = []
+        this.lpnList.pageTotal = res.total
+        this.lpnList.list = res.datas
+      })
+    },
+
+    // 托盘号确认
+    lpnConfirm(){
+      const lpn = this.lpn.value
+      if (!lpn){
+        this.lpn.focus = true
+        this.$lwShowErrorMsg(
+          this.$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.yzvamnac','托盘号不能为空')
+        )
+        return
+      }
+
+      projectWmsOutboundGetHandoverLpnBoxData({
+        ...this.routeQuery,
+        lpn
+      }).then(res=>{
+        this.nowScanData = res
+        this.boxList.unshift(res)
+        this.lpn.value = ''
+        this.lpn.focus = true
+      })
+    },
+
+    // 重新扫描
+    repeatScan(){
+      this.nowScanData = {}
+      this.boxList = []
+      this.lpn.focus = true
+      this.$lwToast.success(
+        this.$lwLanguage.get('wms_project.pda.components.page.outbound.handover.lpn.trlsspbh','操作成功')
+      )
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>