@logwire/logwire-wms-pda-ui 3.3.4 → 3.5.0

package/src/views/common/module/SearchSelectPopup/index.vue

@@ -0,0 +1,303 @@
+<!--
+  选择搜索弹框
+  @author: 张文
+  @date: 2023-09-14
+-->
+<template>
+  <div>
+    <lw-input
+      ref="searchSelectInput"
+      :title="title"
+      v-model="inputVal"
+      :required="required"
+      :show-bottom-border="showBorder"
+      :get-focus.sync="focus"
+      :disabled="disabled || isDisabled"
+      :rule-key="ruleKey"
+      :rule-prefix="rulePrefix"
+      :rule-value-key="ruleValueKey"
+      :rule-serve-query="ruleServeQuery"
+      :create-rule="createRule"
+      :owner-id="ownerId"
+      :input-align="inputAlign"
+      :need-show-clear="!disabled"
+      :placeholder="placeholder"
+      @confirm="inputConfirm"
+      @clear="inputClear"
+    >
+
+      <template #button>
+        <van-icon
+          v-if="!disabled && (!isDisabled || hasDataHideSelect)"
+          name="arrow"
+          color="#cdcdcd"
+          size="18px"
+          @click="popup.show = true"
+        />
+      </template>
+    </lw-input>
+
+    <!-- 选择弹框 -->
+    <lw-much-data-select-popup-module
+      v-model="popup.show"
+      :keyword="popup.keyword"
+      :title="title"
+      :type="type"
+      :api="getData"
+      :label-key="labelKey"
+      :owner-label-key="ownerLabelKey"
+      :rule-key="ruleKey"
+      :rule-prefix="rulePrefix"
+      :rule-value-key="ruleValueKey"
+      :rule-serve-query="ruleServeQuery"
+      :create-rule="createRule"
+      :owner-id="ownerId"
+      :owner-rule-key="ownerRuleKey"
+      :owner-rule-value-key="ownerRuleValueKey"
+      :owner-create-rule="ownerCreateRule"
+      :hidden-owner-search="hiddenOwnerSearch"
+      @confirm="dataSelected"
+    />
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: "lwSearchSelectPopupModule",
+  props: {
+    // 类型
+    type: String,
+    /*
+    * 获取数据的方法
+    * 入参：{ pageSize: 分页大小, pageNum: 页码, keyword: 搜索的关键字 }
+    * 返回：{ total: 总条数, datas: 数据（数组类型） }
+    * */
+    api: {
+      type: Function,
+      required: true
+    },
+    // 数据显示的key
+    labelKey: {
+      type: Array,
+      default: () => ['code', 'name']
+    },
+    // 当type=sku时货主的取值
+    ownerLabelKey: {
+      type: Array,
+      default: () => ['ownerCode', 'ownerName']
+    },
+    // 选中后的取值key
+    valueKey: {
+      type: String,
+      default: 'id'
+    },
+    // 选中的值
+    value: String,
+    // 标题
+    title: String,
+    // 输入框占位符
+    placeholder: String,
+    // 焦点
+    getFocus: {
+      type: Boolean,
+      default: false
+    },
+    // 是否显示下划线
+    showBorder: {
+      type: Boolean,
+      default: true
+    },
+    // 是否显示必填星号
+    required: {
+      type: Boolean,
+      default: false
+    },
+    // 扫码解析后输入框回填字段的key
+    ruleValueKey: {
+      type: String,
+      default: 'key'
+    },
+    // 解码的额外参数
+    ruleServeQuery: {
+      type: Object,
+      default: () => {
+      }
+    },
+    // 货主id
+    ownerId: null,
+    // 条码解析规则key
+    ruleKey: String,
+    // 条码解析规则前缀
+    rulePrefix: String,
+    // 条码解析创建规则数据
+    createRule: Object,
+    // 货主条码解析规则key
+    ownerRuleKey: String,
+    // 货主条码解析规则前缀
+    ownerRuleValueKey: String,
+    // 货主条码解析创建规则数据
+    ownerCreateRule: Object,
+    // 输入框文本对齐方式
+    inputAlign: String,
+    // 是否禁用，如果值为true则不显示清空按钮
+    disabled: Boolean,
+    // 有选中数据后隐藏打开选择弹框按钮
+    hasDataHideSelect: {
+      type: Boolean,
+      default: true
+    },
+    // 失焦后是否自动搜索
+    blurSearch: {
+      type: Boolean,
+      default: true
+    },
+    // 是否显示货主搜索弹框，当 type=sku 时有效
+    hiddenOwnerSearch: {
+      type: Boolean,
+      default: false
+    },
+
+
+  },
+  computed: {
+    // 是否获取焦点
+    focus: {
+      get() {
+        return this.getFocus
+      },
+      set(v) {
+        this.$emit('update:getFocus', v)
+      }
+    },
+    // 选中的值
+    selectedVal: {
+      get() {
+        return this.value
+      },
+      set(v) {
+        this.$emit('input', v)
+      }
+    },
+  },
+  data() {
+    return {
+      // 显示在输入框的值
+      inputVal: '',
+      // 是否禁用
+      isDisabled: false,
+
+      // 搜索弹框
+      popup: {
+        show: false,
+        keyword: '',
+      }
+
+    }
+  },
+  methods: {
+    // 暴露给外部使用 - 调用前请务必确保value参数有值 - 用于回填数据/参数表明是否禁用选择
+    initEchoData(isDisabled) {
+      if (!this.selectedVal) {
+        this.$lwToast.fail(
+          this.$lwLanguage.get('', '初始化{title}失败，参数value值为空', {title: this.title})
+        )
+        return
+      }
+
+      this.getData({id: this.selectedVal}).then(({datas}) => {
+        this.formatDataAndDisabled(datas[0])
+        this.isDisabled = isDisabled
+      })
+    },
+    // 暴露给外部使用 - 用于手动调用输入框的搜索。当输入框没有搜索的情况会自动调用搜索，如果搜索成功后会触发 confirm 事件或弹出选择框
+    needSearch() {
+      // 如果当前有值、或被禁用就直接返回 false
+      if (this.disabled || this.isDisabled) return
+
+      // 如果输入框存在值则调用输入框的回车搜索
+      this.$refs.searchSelectInput.confirm()
+    },
+    // 暴露给外部使用 - 用于清空输入框
+    inputClear(getFocus = true, emit = true) {
+      this.isDisabled = false
+      this.inputVal = ''
+      this.selectedVal = ''
+      this.popup.keyword = ''
+      getFocus && this.$nextTick(() => this.focus = true)
+      emit && this.$emit('clear')
+    },
+
+
+    // 回填数据并禁用输入框
+    formatDataAndDisabled(item) {
+      this.focus = false
+      this.$nextTick(() => {
+        this.isDisabled = true
+        this.inputVal = this.getLabel(item)
+      })
+    },
+
+    // 获取选择的显示值
+    getLabel(item) {
+      let str = ''
+      this.labelKey.forEach(k => {
+        str += (item[k] + ' / ')
+      })
+      return str.substring(0, str.length - 3)
+    },
+    // 获取数据
+    getData(data) {
+      return this.api({
+        pageSize: 10,
+        pageNum: 1,
+        ...data
+      })
+    },
+    // 确认选中
+    dataSelected(item) {
+      this.formatDataAndDisabled(item)
+      this.selectedVal = item[this.valueKey]
+      this.popup.show = false
+      this.$emit('confirm', item)
+    },
+
+    // 输入框 - 确定
+    async inputConfirm(val, {data}) {
+
+      // 如果类型为 sku，且解析数据中包含有 skuId 则不需要再请求接口直接回填数据即可
+      if (this.type === 'sku' && data.skuId) {
+        this.dataSelected({
+          id: data.skuId,
+          code: data.skuCode,
+          name: data.skuName,
+          barcodeData: data
+        })
+        return
+      }
+
+      const {total, datas} = await this.getData({keyword: this.inputVal})
+
+      switch (total) {
+        case 0:
+          this.$lwToast.fail(
+            this.$lwLanguage.get('', '没有查询到任何数据')
+          )
+          this.inputClear()
+          return false
+        case 1:
+          this.dataSelected(datas[0])
+          return true
+        default:
+          this.popup.keyword = this.inputVal
+          this.popup.show = true
+          return false
+      }
+    },
+  }
+}
+</script>
+
+<style scoped lang="less">
+
+</style>

package/src/views/common/module/SystemInfo/index.vue

@@ -13,9 +13,10 @@
         <span class="lw-system-info-state">{{ username }}</span>
         {{ $lwLanguage.get('wms_project.pda.model.systemInfo.yi', '已') }}
         <span class="lw-system-info-state">
-          {{ online?
-            $lwLanguage.get('wms_project.pda.model.systemInfo.upLine', '上线') :
-            $lwLanguage.get('wms_project.pda.model.systemInfo.downLine', '下线')
+          {{
+            online ?
+              $lwLanguage.get('wms_project.pda.model.systemInfo.upLine', '上线') :
+              $lwLanguage.get('wms_project.pda.model.systemInfo.downLine', '下线')
           }}
         </span>
       </div>
@@ -23,7 +24,8 @@
         mini
         round
         @click="click"
-      >{{ statusBtnText }}</lw-button>
+      >{{ statusBtnText }}
+      </lw-button>
     </div>
 
     <div v-if="online">
@@ -31,24 +33,36 @@
       <span class="lw-system-info-state">{{ onLineTime }}</span>
     </div>
 
-    <!-- 仓库信息 -->
-    <div v-if="showWarehouse" class="lw-global-flex-start">
-      <img class="lw-system-info-row-img" :src="warehouseImg" alt="">
-      <div class="lw-system-info-row-val">{{ warehouseName || $lwWarehouse.get().name || '-' }}</div>
-    </div>
+    <div
+      style="flex-wrap: wrap"
+      class="lw-global-flex-between"
+    >
+
+      <!-- 仓库信息 -->
+      <div
+        v-if="showWarehouse"
+        class="lw-global-flex-start system-item"
+      >
+        <img class="lw-system-info-row-img" :src="warehouseImg" alt="">
+        <div class="lw-system-info-row-val">{{ warehouseName || $lwWarehouse.get().name || '-' }}</div>
+      </div>
 
-    <!-- 当前服务器信息 -->
-    <div v-if="showServer" class="lw-global-flex-start">
-      <img class="lw-system-info-row-img" :src="serverImg" alt="">
-      <!-- 服务器名未获取 -->
-      <div class="lw-system-info-row-val">{{ serverNameVal || '-' }}</div>
-    </div>
+      <!-- 当前服务器信息 -->
+      <div
+        v-if="showServer"
+        class="lw-global-flex-start system-item"
+      >
+        <img class="lw-system-info-row-img" :src="serverImg" alt="">
+        <!-- 服务器名未获取 -->
+        <div class="lw-system-info-row-val">{{ serverNameVal || '-' }}</div>
+      </div>
 
-    <!-- 时区 -->
-    <div v-if="showServer" class="lw-global-flex-start">
-      <img class="lw-system-info-row-img" src="./../../../../assets/img/timezone.png" alt="">
-      <!-- 服务器名未获取 -->
-      <div class="lw-system-info-row-val">{{ $lwLocalStorage.get('lwTimezone').timezone || '-' }}</div>
+      <!-- 时区 -->
+      <div v-if="showServer" class="lw-global-flex-start">
+        <img class="lw-system-info-row-img" src="./../../../../assets/img/timezone.png" alt="">
+        <!-- 服务器名未获取 -->
+        <div class="lw-system-info-row-val">{{ $lwLocalStorage.get('lwTimezone').timezone || '-' }}</div>
+      </div>
     </div>
 
     <slot name="end"/>
@@ -134,15 +148,15 @@ export default {
   },
   methods: {
     // 获取当前登录状态
-    async getUserStatus(){
-      let res = this.$lwUserInfo.get()
+    async getUserStatus(need) {
+      let res = need ? await this.$lwUserInfo.asyncGet() : this.$lwUserInfo.get()
 
       this.online = res.taskOnlineData.online
 
       this.username = res.common_name
 
 
-      if (this.online){
+      if (this.online) {
 
         this.statusBtnText = this.$lwLanguage.get('wms_project.pda.model.systemInfo.downLine', '下线')
         const {text} = this.$lwDate.timeToStr({
@@ -171,7 +185,7 @@ export default {
 
     // 状态管理弹出关闭
     onlineConfirm(){
-      this.getUserStatus()
+      this.getUserStatus(true)
     }
   }
 }
@@ -202,13 +216,19 @@ export default {
   color: @baseColor;
 }
 
-.lw-system-info-row-img{
+.lw-system-info-row-img {
   width: 18px;
   margin-right: 8px;
 }
 
-.lw-system-info-row-val{
+.lw-system-info-row-val {
   color: @titleColor;
 }
 
+
+.system-item {
+  min-width: 30%;
+  margin-right: 5px;
+}
+
 </style>

package/src/views/common/module/UserCheckbox/index.js

@@ -0,0 +1,11 @@
+/*
+* 用户复选模块
+* @author: 张文
+* @date: 2023-04-18
+* */
+
+import lwUserCheckboxModule from "./index.vue";
+
+lwUserCheckboxModule.install = Vue => Vue.component(lwUserCheckboxModule.name, lwUserCheckboxModule)
+
+export default lwUserCheckboxModule

package/src/views/{vin/module/userCheckbox → common/module/UserCheckbox}/index.vue

@@ -28,7 +28,7 @@
             required && 'lw-global-required'
           ]"
         >
-          {{ title || $lwLanguage.get('', '员工') }}
+          {{ titleMsg }}
         </div>
 
         <div class="lw-global-flex-start" style="flex: 1;flex-wrap: wrap;margin-left: 5px">
@@ -48,8 +48,13 @@
             style="width: 100%;padding: 0;margin-left: 4px"
             v-model="user"
             :get-focus.sync="userFocus"
-            :placeholder="title || $lwLanguage.get('', '员工')"
             :show-bottom-border="false"
+            :placeholder="placeholder"
+            :rule-key="ruleKey"
+            :rule-prefix="rulePrefix"
+            :rule-value-key="ruleValueKey"
+            :rule-serve-query="ruleServeQuery"
+            :create-rule="createRule"
             @confirm="userConfirm"
           >
 
@@ -72,17 +77,28 @@
 
     </div>
 
-    <lw-vin-user-select-popup-module
+    <lw-user-select-popup-module
       v-model="showPopup"
+      :rule-key="ruleKey"
+      :rule-prefix="rulePrefix"
+      :rule-value-key="ruleValueKey"
+      :rule-serve-query="ruleServeQuery"
+      :create-rule="createRule"
+      checkbox
+      :max="max"
+      :result-list="userList"
       @selectConfirm="addUser"
+      @checkboxConfirm="checkboxConfirm"
     />
   </div>
 </template>
 
 <script>
+import {userSelectInputMixin} from "./../../mixin/userSelectInputMixin";
 
 export default {
-  name: "lwVinUserCheckboxModule",
+  name: "lwUserCheckboxModule",
+  mixins: [userSelectInputMixin],
   props: {
     title: String,
     //是否必填
@@ -122,6 +138,12 @@ export default {
     },
     // 是否忽略仓库配置的不允许删除当前用户配置
     ignoreConfig: Boolean,
+
+    // 最大可选数，为 0 时不限制
+    max: {
+      type: Number,
+      default: 0
+    },
   },
   data() {
     return {
@@ -147,6 +169,15 @@ export default {
         this.$emit('update:focus', v)
       }
     },
+
+    // 标题
+    titleMsg() {
+      return this.title || this.$lwLanguage.get('wms_project.pda.common.module.UserCheckbox.index.ohippvhi', '员工')
+    },
+    // 输入框占位符
+    placeholder() {
+      return this.$lwLanguage.get('wms_project.pda.common.module.UserCheckbox.index.ohippvhic', '请扫描或输入') + this.titleMsg
+    }
   },
   mounted() {
     this.init()
@@ -157,30 +188,59 @@ export default {
     async init() {
       if (!this.selectNowUser) return
 
-      const res = await this.$lwApi.common.staffInfo(this.$lwUserInfo.get().staff.code)
-      const disabled = !this.ignoreConfig && this.$lwWarehouseConfig.get('systemConfig.WMS_APP_LOGIN_USER_AS_CURRENT_USER') === 'true'
-      this.addUser({
-        ...res,
-        disabled
+      // 如果已经传入了数据就不要再添加当前用户数据
+      this.$nextTick(async () => {
+
+        if (this.userList.length) return
+
+        const res = await this.$lwApi.common.staffInfo(this.$lwUserInfo.get().staff.code)
+        const disabled = !this.ignoreConfig && this.$lwWarehouseConfig.get('systemConfig.WMS_APP_LOGIN_USER_AS_CURRENT_USER') === 'true'
+        this.addUser({
+          ...res,
+          disabled
+        }, 'init')
       })
+
     },
 
     // 搜索确认用户
     async userConfirm() {
+      if (this.max > 0 && this.userList.length >= this.max) {
+        this.$lwShowNoticeBar({
+          message: this.$lwLanguage.get('wms_project.pda.common.module.UserCheckbox.index.ohippvhid', '超过最大可选数：') + this.max,
+          type: 'error'
+        })
+        this.user = ''
+        return
+      }
+
       const res = await this.$lwApi.common.staffInfo(this.user)
       this.addUser(res)
     },
 
     // 添加已选员工
-    addUser(res) {
-      !this.userList.some(item => item.code === res.code) && this.userList.push(res)
-      this.userFocus = true
+    addUser(res, type) {
+
+      // 判断是否是初始状态进入，避免不必要的焦点获取
+      type !== 'init' ? this.userFocus = true : ''
       this.user = ''
+
+      // 判断当前选中用户是否存在已选列表
+      if (this.userList.some(item => item.code === res.code)) return
+
+      this.userList.push(res)
+      this.$emit('change')
+    },
+    // 弹框点击确认
+    checkboxConfirm(res) {
+      this.userList = res
+      this.$emit('change')
     },
 
     // 删除员工
     delUser(index) {
       this.userList.splice(index, 1)
+      this.$emit('change')
     },
   }
 }

package/src/views/common/module/UserCheckbox//345/221/230/345/267/245/345/244/215/351/200/211/346/250/241/345/235/227.md

@@ -0,0 +1 @@
+可选择多个员工，自动去重。显示员工姓名且可以删除

package/src/views/common/module/UserSelect/index.js

@@ -0,0 +1,11 @@
+/*
+* 员工选择模块
+* @author: 张文
+* @date: 2023-02-24
+* */
+
+import lwUserSelectModule from "./index.vue";
+
+lwUserSelectModule.install = Vue => Vue.component(lwUserSelectModule.name, lwUserSelectModule)
+
+export default lwUserSelectModule

package/src/views/{vin/module/userSelect → common/module/UserSelect}/index.vue

@@ -7,12 +7,17 @@
   <div>
 
     <lw-input
-      :title="title || $lwLanguage.get('wms_project.pda.vin.module.userSelect.index.zzvospaa','工号')"
+      :title="title || $lwLanguage.get('wms_project.pda.common.module.UserSelect.index.thtsabqj', '工号')"
       v-model="userNo"
       :required="required"
       :show-bottom-border="showBorder"
       :get-focus.sync="getFocus"
       :disabled="disabled"
+      :rule-key="ruleKey"
+      :rule-prefix="rulePrefix"
+      :rule-value-key="ruleValueKey"
+      :rule-serve-query="ruleServeQuery"
+      :create-rule="createRule"
       @confirm="$emit('confirm')"
     >
 
@@ -30,8 +35,13 @@
 
 
     <!-- 选择用户弹框 -->
-    <lw-vin-user-select-popup-module
+    <lw-user-select-popup-module
       v-model="popupShow"
+      :rule-key="ruleKey"
+      :rule-prefix="rulePrefix"
+      :rule-value-key="ruleValueKey"
+      :rule-serve-query="ruleServeQuery"
+      :create-rule="createRule"
       @selectConfirm="userSelectPopupSelected"
     />
 
@@ -39,10 +49,12 @@
 </template>
 
 <script>
+import {userSelectInputMixin} from "./../../mixin/userSelectInputMixin";
 
 
 export default {
-  name: "lwVinUserSelectModule",
+  name: "lwUserSelectModule",
+  mixins: [userSelectInputMixin],
   props: {
     title: String,
 

package/src/views/common/module/UserSelect//345/221/230/345/267/245/345/215/225/351/200/211/346/250/241/345/235/227.md

@@ -0,0 +1 @@
+仅可选择一个员工，显示员工工号

package/src/views/common/module/UserSelectPopup/index.js

@@ -0,0 +1,11 @@
+/*
+* 员工选择模块
+* @author: 张文
+* @date: 2023-04-19
+* */
+
+import lwUserSelectPopupModule from "./index.vue";
+
+lwUserSelectPopupModule.install = Vue => Vue.component(lwUserSelectPopupModule.name, lwUserSelectPopupModule)
+
+export default lwUserSelectPopupModule