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

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

@@ -1,622 +1,579 @@
-<!--
-  出库拣选 - 起始页（控制台）
-  @author: 张文
-  @date: 2022-06-20
--->
-<template>
-  <div>
-
-    <lw-nav-bar :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.tlejlbzl','出库拣选')"/>
-
-    <div class="lw-global-page-box">
-
-      <!-- 用户状态信息 -->
-      <div class="lw-global-model-box">
-
-        <!-- 状态管理 -->
-        <div class="lw-global-flex-between lw-global-row-start">
-          <lw-tag
-            :type="userStatus.type"
-            round
-            plain
-          >{{ userStatus.label }}</lw-tag>
-
-          <lw-button
-            round
-            mini
-            @click="userStatusChange"
-          >{{ userStatus.btn }}</lw-button>
-        </div>
-
-        <!-- 工作区域 -->
-        <div class="lw-global-collapse-box">
-
-          <!-- 折叠框 -->
-          <van-collapse
-            v-model="activeNames"
-            :border="false"
-          >
-            <van-collapse-item
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.itrshahh','工作区')"
-              name="1"
-            >
-              <template
-                #value
-                v-if="!activeNames.length"
-              >
-                <div>{{taskData.pickWorkArea}}</div>
-              </template>
-
-              <div style="padding: 0 10px">
-                <div>
-                <span
-                  style="font-size: 12px;font-weight: bold"
-                  class="lw-global-title"
-                >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.jepxuwmf','工作区域') }}:</span>
-                  <span
-                    style="font-size: 12px"
-                    class="lw-global-value"
-                  >{{ taskData.pickWorkArea }}</span>
-                </div>
-
-                <div>
-                <span
-                  style="font-weight: bold"
-                  class="lw-global-title"
-                >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.cbbkhktx','库区') }}:</span>
-                  <span
-                    class="lw-global-value"
-                  >{{ taskData.pickZoneCodes }}</span>
-                </div>
-              </div>
-
-            </van-collapse-item>
-          </van-collapse>
-
-
-        </div>
-
-        <!-- 设备信息 -->
-        <div
-          style="border-top: solid 1px #f0f0f0;padding-bottom: 0"
-          class="lw-global-flex-between lw-global-row-end"
-        >
-          <div style="color: #323233" class="lw-global-value">
-            {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.mphocsgl','叉车') }}
-          </div>
-
-          <div class="lw-global-title">
-            <span>{{ (taskData.useToolName ||'') + '-' + (taskData.useToolCode ||'') }}</span>
-            <lw-tag
-              v-if="taskData.canPickLocationPosition"
-              round
-              plain
-            >{{ taskData.canPickLocationPosition }}
-            </lw-tag>
-          </div>
-
-
-        </div>
-      </div>
-
-      <!--用户信息-->
-      <div
-        style="font-size: 12px;padding: 10px 5px"
-        class="lw-global-flex-between"
-      >
-        <div>{{taskData.staffName}}</div>
-        <div>{{ taskData.pickData.day }}</div>
-        <lw-tag
-          style="margin-right: 0"
-          round
-          plain
-          type="success"
-        >
-          {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ypzltcuy','已完成') }}
-          {{ userPlan }}%
-        </lw-tag>
-      </div>
-
-      <!--数据看板-->
-      <lw-data-look-bg>
-
-        <div>
-          <div>{{ taskData.pickData.receiveTaskCount }}</div>
-          <div>
-            {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.lmpwxfwy','接收行') }}
-          </div>
-        </div>
-
-        <div>
-          <div>{{ taskData.pickData.finishLineCount }}</div>
-          <div>{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.rebhfkmi','完成行') }}</div>
-        </div>
-
-        <div>
-          <div>{{ taskData.pickData.skuQty }}</div>
-          <div>{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.vvaytrgg','商品数') }}</div>
-        </div>
-
-        <div>
-          <div>{{ useMinutes }}</div>
-          <div>{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.lmmwhidr','有效工时') }}</div>
-        </div>
-
-      </lw-data-look-bg>
-
-      <!--任务信息-->
-      <div
-        v-if="taskData.pickTask && Object.keys(taskData.pickTask).length"
-        style="margin-top: 10px"
-        class="lw-global-model-box"
-      >
-
-        <div class="lw-global-flex-between lw-global-row-start">
-          <div class="lw-global-value-bold">{{ taskData.pickTask.pickNo }}</div>
-
-          <lw-tag
-            v-if="taskData.pickTask.taskStatus === '100'"
-            type="danger"
-            round
-            plain
-          >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.yhrczniq','待接收') }}</lw-tag>
-          <lw-tag
-            v-else
-            round
-            plain
-          >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.yjvjisxz','拣选中') }}</lw-tag>
-        </div>
-
-        <lw-title-value-cell
-          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.isbaqhcq','拣选方式')"
-          :value="taskData.pickTask.pickMethodLabel"
-          val-bold
-          val-red
-        />
-
-        <lw-title-value-cell
-          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.oaqrzmuc','拣选单位')"
-          :value="taskData.pickTask.pickUomLabel"
-          val-bold
-        />
-
-        <lw-title-value-cell
-          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ruzseogh','捆包类型')"
-          :value="taskData.pickTask.pickPackTypeLabel"
-          val-bold
-          val-red
-        />
-
-        <lw-title-value-cell
-          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.cmqistfm','高低位')"
-          :value="taskData.pickTask.locationPositionLabel"
-          val-bold
-        />
-
-        <div class="lw-global-row-end">
-
-          <div class="lw-global-flex-between">
-            <lw-title-value-cell
-              style="flex:1"
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.eznirkcm','拣选库区')"
-              :value="taskData.pickTask.pickZoneCodeList.join(',')"
-              val-bold
-              :is-row="false"
-            />
-            <lw-title-value-cell
-              style="flex-shrink: 0"
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ehnmuckr','行数')"
-              :value="taskData.pickTask.lineCount"
-              val-bold
-              :is-row="false"
-            />
-          </div>
-
-
-          <div
-            style="margin-top: 5px"
-            class="lw-global-flex-between"
-          >
-            <lw-title-value-cell
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ntfwzbfw','客户数')"
-              :value="taskData.pickTask.customerCount"
-              val-bold
-              :is-row="false"
-            />
-            <lw-title-value-cell
-              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.vvaytrgg','商品数')"
-              :value="taskData.pickTask.totalQty"
-              val-bold
-              :is-row="false"
-            />
-
-          </div>
-
-
-        </div>
-
-      </div>
-
-    </div>
-
-    <!-- 底部按钮应当在用户上线且有任务时才显示 -->
-    <lw-bottom-bar v-if="taskData.status==='ONLINE' && taskData.pickTask && Object.keys(taskData.pickTask).length">
-
-      <template v-if="taskData.pickTask.taskStatus === '100'">
-        <lw-button
-          type="last"
-          plain
-          @click="rejectBtnClick"
-        >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.mtqbwgfh','拒绝') }}</lw-button>
-        <lw-button @click="receive">
-          {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.kirpivou','接收任务 & 拣选') }}
-        </lw-button>
-      </template>
-
-      <template v-else>
-        <lw-button @click="actionPick">
-          {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ozvoiore','执行拣选') }}
-        </lw-button>
-      </template>
-
-    </lw-bottom-bar>
-
-    <!-- 用户下线理由弹框 -->
-    <lw-popup
-      :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.pdenuvpo','下线')"
-      v-model="offLinePopup.show"
-      @closed="offLinePopupOff"
-    >
-      <lw-cell-popup-radio
-        :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.jnvttgpl','下线原因')"
-        required
-        v-model="offLinePopup.reason"
-        :columns="offLinePopup.reasonList"
-      />
-
-      <lw-input
-        :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.zhzghnao','其他原因')"
-        v-model="offLinePopup.reasonOther"
-      />
-
-      <template #button>
-        <lw-button @click="userOffLineConfirm">
-          {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.wqhnusfp','确定') }}
-        </lw-button>
-      </template>
-
-    </lw-popup>
-
-
-    <!-- 拒绝任务弹框 -->
-    <lw-popup
-      :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.akjygike','拒绝任务')"
-      v-model="rejectPopup.show"
-      @closed="rejectPopupOff"
-    >
-
-      <lw-cell-popup-radio
-        :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.bosxxhdo','拒绝原因')"
-        required
-        v-model="rejectPopup.refuseReasonType"
-        :columns="rejectPopup.refuseReasonTypeList"
-      />
-
-      <lw-input
-        :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.zhzghnao','其他原因')"
-        v-model="rejectPopup.refuseReason"
-        input-align="right"
-      />
-
-      <template #button>
-        <lw-button @click="rejectConfirm">
-          {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.wqhnusfp','确定') }}
-        </lw-button>
-      </template>
-
-    </lw-popup>
-
-  </div>
-</template>
-
-<script>
-
-import {
-  projectWmsPickLoadUserPickStatus,
-  projectWmsPickTaskByTaskId,
-  projectWmsUserPickReceiveTask,
-  projectWmsUserPickRefuseTask,
-  wmsMobileBizTaskOffline,
-  wmsMobileBizTaskOnline
-} from "../../../../../api/outbound/pick";
-
-export default {
-  name: "lwOutboundPickIndexPage",
-  computed: {
-    // 用户状态信息
-    userStatus() {
-      if (this.taskData.status === 'ONLINE') {
-        return {
-          type: 'primary',
-          label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.qhvmgnvx','在线'),
-          btn: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ywfusvvu','下线')
-        }
-      }
-
-      return {
-        type: 'danger',
-        label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.pooyjzzy','离线'),
-        btn: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.vldsejsa','上线')
-      }
-    },
-
-    // 完成进度
-    userPlan(){
-      const pickData = this.taskData.pickData
-      return Math.floor( pickData.finishLineCount / pickData.receiveLineCount*100 ) || 0
-    },
-
-    // 有效工时
-    useMinutes(){
-      const time=this.taskData.pickData.useMinutes
-      if (time>=0 && time<60){
-        return time + this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.oghgqzjq','分钟')
-      }else {
-        return Math.floor(time/60) +
-          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.zxpkngyd','小时') +
-          time%60 +
-          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.oghgqzjq','分钟')
-      }
-    }
-  },
-  data() {
-    return {
-      // 自动刷新的定时器
-      autoTimer: '',
-
-      // 数据
-      taskData: {
-        pickData:{}
-      },
-
-      // 折叠框激活
-      activeNames: [],
-
-      // 下线原因弹框
-      offLinePopup:{
-        show: false,
-        // 下线原因选项
-        reasonList:[
-          {
-            label:this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.qqkcvsfj','中途休息'),
-            value:this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.qqkcvsfj','中途休息')
-          },
-          {
-            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.bbrpohzy','下班'),
-            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.bbrpohzy','下班')
-          },
-          {
-            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.dorvlmnr','其他'),
-            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.dorvlmnr','其他')
-          },
-        ],
-        // 下线原因
-        reason:'',
-        // 其他原因
-        reasonOther:''
-      },
-
-      // 拒绝任务弹框
-      rejectPopup:{
-        show: false,
-        // 拒绝原因
-        refuseReasonType: '',
-        // 原因选择
-        refuseReasonTypeList: [
-          {
-            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.qqkcvsfj','中途休息'),
-            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.qqkcvsfj','中途休息'),
-          },
-          {
-            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.bbrpohzy','下班'),
-            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.bbrpohzy','下班')
-          },
-          {
-            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.yeqdvajh','设备不匹配'),
-            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.yeqdvajh','设备不匹配'),
-          },
-          {
-            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.dorvlmnr','其他'),
-            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.dorvlmnr','其他')
-          },
-        ],
-        // 其他原因
-        refuseReason: ''
-      }
-    }
-  },
-  mounted() {
-
-    const {lwTaskId} = this.$route.query
-
-    // 判断是否通过任务进入
-    if (lwTaskId){
-      projectWmsPickTaskByTaskId({
-        taskId: lwTaskId
-      }).then(res=>{
-        this.checkPage(res, 'replace')
-      })
-    }else {
-      this.getData()
-    }
-
-  },
-  methods: {
-
-    // 获取数据
-    getData(loading = true){
-      projectWmsPickLoadUserPickStatus({loading}).then(res=>{
-        this.taskData = res
-
-        this.autoGetData()
-      }).catch(()=>{
-        history.go(-1)
-      })
-    },
-
-    // 自动获取数据
-    autoGetData(){
-      this.autoTimer = setTimeout(()=>{
-        this.getData(false)
-      }, 1000*15)
-    },
-
-    // 用户状态改变
-    userStatusChange(){
-      if (this.taskData.status === 'ONLINE'){
-        this.offLinePopup.show = true
-        clearTimeout(this.autoTimer)
-        return
-      }
-
-      wmsMobileBizTaskOnline({
-        operationType: "PICK"
-      }).then(()=>{
-        this.$lwToast.success(
-          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.rlmzugoo','已上线')
-        )
-        clearTimeout(this.autoTimer)
-        this.getData()
-      })
-    },
-    // 用户确认下线
-    userOffLineConfirm(){
-
-      if (!this.offLinePopup.reason){
-        this.$lwShowErrorMsg(
-          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ftqkgcsj','下线原因不能为空！')
-        )
-        return
-      }
-
-      wmsMobileBizTaskOffline({
-        operationType: 'PICK',
-        reason: this.offLinePopup.reason,
-        reasonOther: this.offLinePopup.reasonOther
-      }).then(()=>{
-        this.$lwToast.success(
-          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.vyyqyewy','已下线')
-        )
-        this.offLinePopup.show = false
-        this.getData()
-      })
-    },
-    // 下线弹框关闭
-    offLinePopupOff(){
-      this.offLinePopup.reason = ''
-      this.offLinePopup.reasonOther = ''
-    },
-
-    // 接受任务并拣选
-    receive(){
-      projectWmsUserPickReceiveTask({
-        taskId: this.taskData.pickTask.taskId
-      }).then(()=>this.actionPick())
-    },
-
-    // 点击拒绝按钮
-    rejectBtnClick(){
-      clearTimeout(this.autoTimer)
-      this.rejectPopup.show=true
-    },
-    // 确认拒绝
-    rejectConfirm(){
-
-      if (!this.rejectPopup.refuseReasonType){
-        this.$lwShowErrorMsg(
-          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.tgbitfun','拒绝原因不能为空')
-        )
-        return
-      }
-
-      projectWmsUserPickRefuseTask({
-        taskId: this.taskData.pickTask.taskId,
-        refuseReasonType: this.rejectPopup.refuseReasonType,
-        refuseReason: this.rejectPopup.refuseReason
-      }).then(()=>{
-        this.$lwToast.success(
-          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.dhdvigfg','已拒绝')
-        )
-        this.rejectPopup.show = false
-        this.getData()
-      })
-    },
-    // 拒绝弹框关闭
-    rejectPopupOff(){
-      this.rejectPopup.refuseReasonType = ''
-      this.rejectPopup.refuseReason = ''
-    },
-
-    // 执行拣选
-    actionPick(){
-      this.checkPage(this.taskData.pickTask)
-    },
-    // 判断跳转页面
-    checkPage(data, jumpType = 'push'){
-      const query = {
-        lwPickId: data.pickId
-      }
-
-      if (data.pickMethod === '400'){
-        this.$router[jumpType]({
-          path: '/outbound/pick/lwSowAction',
-          query
-        })
-        return
-      }
-
-
-      // 整箱
-      if (data.pickUom === 'CASE'){
-        this.$router[jumpType]({
-          path: '/outbound/pick/lwBoxAction',
-          query
-        })
-        return
-      }
-
-      // 整托盘
-      if (data.pickUom === 'LPN'){
-        this.$router[jumpType]({
-          path: '/outbound/pick/lwLpnAction',
-          query
-        })
-        return
-      }
-
-      // 独立件
-      if (data.pickPackType === 'ALONE'){
-        this.$router[jumpType]({
-          path: '/outbound/pick/lwAloneAction',
-          query
-        })
-        return
-      }
-
-      // 非独立件
-      this.$router[jumpType]({
-        path: '/outbound/pick/lwNotAloneAction',
-        query
-      })
-
-    }
-  },
-  beforeDestroy(){
-    clearTimeout(this.autoTimer)
-  }
-}
-</script>
-
-<style scoped lang="less">
-
-</style>
+<!--
+  出库拣选 - 起始页（控制台）
+  @author: 张文
+  @date: 2022-06-20
+-->
+<template>
+  <div>
+
+    <lw-nav-bar :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.tlejlbzl','出库拣选')"/>
+
+    <div class="lw-global-page-box">
+
+      <!-- 用户状态信息 -->
+      <div class="lw-global-model-box">
+
+        <!-- 状态管理 -->
+        <div
+          :class="[
+            'lw-global-flex-between',
+            'lw-global-row-start',
+            userStatus.animation
+          ]">
+          <lw-tag
+            v-if="userStatus.label"
+            :type="userStatus.type"
+            round
+            plain
+          >{{ userStatus.label }}</lw-tag>
+
+          <lw-button
+            round
+            mini
+            @click="userStatusChange"
+          >{{ userStatus.btn }}</lw-button>
+        </div>
+
+        <!-- 工作区域 -->
+        <div class="lw-global-collapse-box">
+
+          <!-- 折叠框 -->
+          <van-collapse
+            v-model="activeNames"
+            :border="false"
+          >
+            <van-collapse-item
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.itrshahh','工作区')"
+              name="1"
+            >
+              <template
+                #value
+                v-if="!activeNames.length"
+              >
+                <div>{{taskData.pickWorkArea}}</div>
+              </template>
+
+              <div style="padding: 0 10px">
+                <div>
+                <span
+                  style="font-size: 12px;font-weight: bold"
+                  class="lw-global-title"
+                >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.jepxuwmf','工作区域') }}:</span>
+                  <span
+                    style="font-size: 12px"
+                    class="lw-global-value"
+                  >{{ taskData.pickWorkArea }}</span>
+                </div>
+
+                <div>
+                <span
+                  style="font-weight: bold"
+                  class="lw-global-title"
+                >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.cbbkhktx','库区') }}:</span>
+                  <span
+                    class="lw-global-value"
+                  >{{ taskData.pickZoneCodes }}</span>
+                </div>
+              </div>
+
+            </van-collapse-item>
+          </van-collapse>
+
+
+        </div>
+
+        <!-- 设备信息 -->
+        <div
+          style="border-top: solid 1px #f0f0f0;padding-bottom: 0"
+          class="lw-global-flex-between lw-global-row-end"
+        >
+          <div style="color: #323233" class="lw-global-value">
+            {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.mphocsgl','叉车') }}
+          </div>
+
+          <div class="lw-global-title">
+            <span>{{ (taskData.useToolName ||'') + '-' + (taskData.useToolCode ||'') }}</span>
+            <lw-tag
+              v-if="taskData.canPickLocationPosition"
+              round
+              plain
+            >{{ taskData.canPickLocationPosition }}
+            </lw-tag>
+          </div>
+
+
+        </div>
+      </div>
+
+      <!--用户信息-->
+      <div
+        style="font-size: 12px;padding: 10px 5px"
+        class="lw-global-flex-between"
+      >
+        <div>{{taskData.staffName}}</div>
+        <div>{{ taskData.pickData.day }}</div>
+        <lw-tag
+          style="margin-right: 0"
+          round
+          plain
+          type="success"
+        >
+          {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ypzltcuy','已完成') }}
+          {{ userPlan }}%
+        </lw-tag>
+      </div>
+
+      <!--数据看板-->
+      <lw-data-look-bg>
+
+        <div>
+          <div>{{ taskData.pickData.receiveTaskCount }}</div>
+          <div>
+            {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.lmpwxfwy','接收行') }}
+          </div>
+        </div>
+
+        <div>
+          <div>{{ taskData.pickData.finishLineCount }}</div>
+          <div>{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.rebhfkmi','完成行') }}</div>
+        </div>
+
+        <div>
+          <div>{{ taskData.pickData.skuQty }}</div>
+          <div>{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.vvaytrgg','商品数') }}</div>
+        </div>
+
+        <div>
+          <div>{{ useMinutes }}</div>
+          <div>{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.lmmwhidr','有效工时') }}</div>
+        </div>
+
+      </lw-data-look-bg>
+
+      <!--任务信息-->
+      <div
+        v-if="taskData.pickTask && Object.keys(taskData.pickTask).length"
+        style="margin-top: 10px"
+        class="lw-global-model-box"
+      >
+
+        <div class="lw-global-flex-between lw-global-row-start">
+          <div class="lw-global-value-bold">{{ taskData.pickTask.pickNo }}</div>
+
+          <lw-tag
+            v-if="taskData.pickTask.taskStatus === '100'"
+            type="danger"
+            round
+            plain
+          >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.yhrczniq','待接收') }}</lw-tag>
+          <lw-tag
+            v-else
+            round
+            plain
+          >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.yjvjisxz','拣选中') }}</lw-tag>
+        </div>
+
+        <lw-title-value-cell
+          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.isbaqhcq','拣选方式')"
+          :value="taskData.pickTask.pickMethodLabel"
+          val-bold
+          val-red
+        />
+
+        <lw-title-value-cell
+          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.oaqrzmuc','拣选单位')"
+          :value="taskData.pickTask.pickUomLabel"
+          val-bold
+        />
+
+        <lw-title-value-cell
+          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ruzseogh','捆包类型')"
+          :value="taskData.pickTask.pickPackTypeLabel"
+          val-bold
+          val-red
+        />
+
+        <lw-title-value-cell
+          :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.cmqistfm','高低位')"
+          :value="taskData.pickTask.locationPositionLabel"
+          val-bold
+        />
+
+        <div class="lw-global-row-end">
+
+          <div class="lw-global-flex-between">
+            <lw-title-value-cell
+              style="flex:1"
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.eznirkcm','拣选库区')"
+              :value="taskData.pickTask.pickZoneCodeList.join(',')"
+              val-bold
+              :is-row="false"
+            />
+            <lw-title-value-cell
+              style="flex-shrink: 0"
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ehnmuckr','行数')"
+              :value="taskData.pickTask.lineCount"
+              val-bold
+              :is-row="false"
+            />
+          </div>
+
+
+          <div
+            style="margin-top: 5px"
+            class="lw-global-flex-between"
+          >
+            <lw-title-value-cell
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ntfwzbfw','客户数')"
+              :value="taskData.pickTask.customerCount"
+              val-bold
+              :is-row="false"
+            />
+            <lw-title-value-cell
+              :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.vvaytrgg','商品数')"
+              :value="taskData.pickTask.totalQty"
+              val-bold
+              :is-row="false"
+            />
+
+          </div>
+
+
+        </div>
+
+      </div>
+
+    </div>
+
+    <!-- 底部按钮应当在用户上线且有任务时才显示 -->
+    <lw-bottom-bar v-if="taskData.status==='ONLINE' && taskData.pickTask && Object.keys(taskData.pickTask).length">
+
+      <template v-if="taskData.pickTask.taskStatus === '100'">
+        <lw-button
+          type="last"
+          plain
+          @click="rejectBtnClick"
+        >{{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.mtqbwgfh','拒绝') }}</lw-button>
+        <lw-button @click="receive">
+          {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.kirpivou','接收任务 & 拣选') }}
+        </lw-button>
+      </template>
+
+      <template v-else>
+        <lw-button @click="actionPick">
+          {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ozvoiore','执行拣选') }}
+        </lw-button>
+      </template>
+
+    </lw-bottom-bar>
+
+    <!-- 用户下线理由弹框 -->
+    <lw-off-line-popup-module
+      :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.pdenuvpo','下线')"
+      v-model="offLinePopup.show"
+      @confirm="userOffLineConfirm"
+    />
+
+
+    <!-- 拒绝任务弹框 -->
+    <lw-popup
+      :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.akjygike','拒绝任务')"
+      v-model="rejectPopup.show"
+      @closed="rejectPopupOff"
+    >
+
+      <lw-cell-popup-radio
+        :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.bosxxhdo','拒绝原因')"
+        required
+        v-model="rejectPopup.refuseReasonType"
+        :columns="rejectPopup.refuseReasonTypeList"
+      />
+
+      <lw-input
+        :title="$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.zhzghnao','其他原因')"
+        v-model="rejectPopup.refuseReason"
+        input-align="right"
+      />
+
+      <template #button>
+        <lw-button @click="rejectConfirm">
+          {{ $lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.wqhnusfp','确定') }}
+        </lw-button>
+      </template>
+
+    </lw-popup>
+
+  </div>
+</template>
+
+<script>
+
+import {
+  projectWmsPickLoadUserPickStatus,
+  projectWmsPickTaskByTaskId,
+  projectWmsUserPickReceiveTask,
+  projectWmsUserPickRefuseTask,
+  wmsMobileBizTaskOffline,
+  wmsMobileBizTaskOnline
+} from "../../../../../api/outbound/pick";
+
+export default {
+  name: "lwOutboundPickIndexPage",
+  computed: {
+    // 用户状态信息
+    userStatus() {
+      if (this.taskData.status === 'ONLINE') {
+        return {
+          type: 'primary',
+          label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.qhvmgnvx','在线'),
+          btn: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.ywfusvvu','下线'),
+          animation:'lw-global-animation-out'
+        }
+      }
+
+      return {
+        type: 'danger',
+        label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.pooyjzzy','离线'),
+        btn: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.vldsejsa','上线'),
+        animation: 'lw-global-animation-rotate'
+      }
+    },
+
+    // 完成进度
+    userPlan(){
+      const pickData = this.taskData.pickData
+      return Math.floor( pickData.finishLineCount / pickData.receiveLineCount*100 ) || 0
+    },
+
+    // 有效工时
+    useMinutes(){
+      const time=this.taskData.pickData.useMinutes
+      if (time>=0 && time<60){
+        return time + this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.oghgqzjq','分钟')
+      }else {
+        return Math.floor(time/60) +
+          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.zxpkngyd','小时') +
+          time%60 +
+          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.oghgqzjq','分钟')
+      }
+    }
+  },
+  data() {
+    return {
+      // 自动刷新的定时器
+      autoTimer: '',
+
+      // 数据
+      taskData: {
+        pickData:{}
+      },
+
+      // 折叠框激活
+      activeNames: [],
+
+      // 下线原因弹框
+      offLinePopup:{
+        show: false,
+      },
+
+      // 拒绝任务弹框
+      rejectPopup:{
+        show: false,
+        // 拒绝原因
+        refuseReasonType: '',
+        // 原因选择
+        refuseReasonTypeList: [
+          {
+            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.qqkcvsfj','中途休息'),
+            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.qqkcvsfj','中途休息'),
+          },
+          {
+            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.bbrpohzy','下班'),
+            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.bbrpohzy','下班')
+          },
+          {
+            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.yeqdvajh','设备不匹配'),
+            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.yeqdvajh','设备不匹配'),
+          },
+          {
+            label: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.dorvlmnr','其他'),
+            value: this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.dorvlmnr','其他')
+          },
+        ],
+        // 其他原因
+        refuseReason: ''
+      }
+    }
+  },
+  mounted() {
+
+    const {lwTaskId} = this.$route.query
+
+    // 判断是否通过任务进入
+    if (lwTaskId){
+      projectWmsPickTaskByTaskId({
+        taskId: lwTaskId
+      }).then(res=>{
+        this.checkPage(res, 'replace')
+      })
+    }else {
+      this.getData()
+    }
+
+  },
+  methods: {
+
+    // 获取数据
+    getData(loading = true){
+      projectWmsPickLoadUserPickStatus({loading}).then(res=>{
+        this.taskData = res
+
+        this.autoGetData()
+      }).catch(()=>{
+        history.go(-1)
+      })
+    },
+
+    // 自动获取数据
+    autoGetData(){
+      this.autoTimer = setTimeout(()=>{
+        this.getData(false)
+      }, 1000*15)
+    },
+
+    // 用户状态改变
+    userStatusChange(){
+      if (this.taskData.status === 'ONLINE'){
+        this.offLinePopup.show = true
+        clearTimeout(this.autoTimer)
+        return
+      }
+
+      wmsMobileBizTaskOnline({
+        operationType: "PICK"
+      }).then(()=>{
+        this.$lwToast.success(
+          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.rlmzugoo','已上线')
+        )
+        clearTimeout(this.autoTimer)
+        this.getData()
+      })
+    },
+    // 用户确认下线
+    userOffLineConfirm(obj){
+
+      wmsMobileBizTaskOffline({
+        operationType: 'PICK',
+        ...obj
+      }).then(()=>{
+        this.$lwToast.success(
+          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.vyyqyewy','已下线')
+        )
+        this.offLinePopup.show = false
+        this.getData()
+      })
+    },
+
+    // 接受任务并拣选
+    receive(){
+      projectWmsUserPickReceiveTask({
+        taskId: this.taskData.pickTask.taskId
+      }).then(()=>this.actionPick())
+    },
+
+    // 点击拒绝按钮
+    rejectBtnClick(){
+      clearTimeout(this.autoTimer)
+      this.rejectPopup.show=true
+    },
+    // 确认拒绝
+    rejectConfirm(){
+
+      if (!this.rejectPopup.refuseReasonType){
+        this.$lwShowErrorMsg(
+          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.tgbitfun','拒绝原因不能为空')
+        )
+        return
+      }
+
+      projectWmsUserPickRefuseTask({
+        taskId: this.taskData.pickTask.taskId,
+        refuseReasonType: this.rejectPopup.refuseReasonType,
+        refuseReason: this.rejectPopup.refuseReason
+      }).then(()=>{
+        this.$lwToast.success(
+          this.$lwLanguage.get('wms_project.pda.components.page.outbound.pick.index.dhdvigfg','已拒绝')
+        )
+        this.rejectPopup.show = false
+        this.getData()
+      })
+    },
+    // 拒绝弹框关闭
+    rejectPopupOff(){
+      this.rejectPopup.refuseReasonType = ''
+      this.rejectPopup.refuseReason = ''
+    },
+
+    // 执行拣选
+    actionPick(){
+      this.checkPage(this.taskData.pickTask)
+    },
+    // 判断跳转页面
+    checkPage(data, jumpType = 'push'){
+      const query = {
+        lwPickId: data.pickId
+      }
+
+      // 边拣边分
+      if (data.pickMethod === '400'){
+        this.$router[jumpType]({
+          path: '/outbound/pick/lwSowAction',
+          query
+        })
+        return
+      }
+
+      // 整箱
+      if (data.pickUom === 'CASE'){
+        this.$router[jumpType]({
+          path: '/outbound/pick/lwBoxAction',
+          query
+        })
+        return
+      }
+
+      // 整托盘
+      if (data.pickUom === 'LPN'){
+        this.$router[jumpType]({
+          path: '/outbound/pick/lwLpnAction',
+          query
+        })
+        return
+      }
+
+      // 独立件
+      if (data.pickPackType === 'ALONE'){
+        this.$router[jumpType]({
+          path: '/outbound/pick/lwAloneAction',
+          query
+        })
+        return
+      }
+
+      // 非独立件
+      this.$router[jumpType]({
+        path: '/outbound/pick/lwNotAloneAction',
+        query
+      })
+
+    }
+  },
+  beforeDestroy(){
+    clearTimeout(this.autoTimer)
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>