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

package/src/components/CarPlate/index.vue

@@ -41,9 +41,14 @@
       :title="titleText"
       v-model="showPopup"
       height="370px"
+      :show-keyboard-placeholder="false"
+      @opened="popupOpened"
     >
       <!-- 车牌类型 -->
-      <div style="font-size: 14px;">
+      <div
+        style="font-size: 1rem;"
+        class="lw-global-row-start"
+      >
         <van-radio-group
           v-model="carType"
           direction="horizontal"
@@ -51,38 +56,78 @@
         >
 
           <van-radio
-            style="margin-bottom: 8px"
+            v-if="!hiddenSelectOption"
+            class="radio"
+            name="select"
+          >
+            {{ $lwLanguage.get('', '选择车牌') }}
+          </van-radio>
+
+          <van-radio
+            class="radio"
             name="old"
-          >{{ $lwLanguage.get('wms_project.pda.components.ui.CarPlate.rnmtzvrt', '普通车牌') }}
+          >
+            {{ $lwLanguage.get('wms_project.pda.components.ui.CarPlate.rnmtzvrt', '普通车牌') }}
           </van-radio>
 
           <van-radio
             :disabled="carPlateList[6]==='挂'"
             name="new"
-            style="margin-bottom: 8px"
-          >{{ $lwLanguage.get('wms_project.pda.components.ui.CarPlate.rvwizyjh', '新能源车牌') }}
+            class="radio"
+          >
+            {{ $lwLanguage.get('wms_project.pda.components.ui.CarPlate.rvwizyjh', '新能源车牌') }}
           </van-radio>
 
           <van-radio
             v-if="!hiddenHandInput"
-            style="margin-bottom: 8px"
+            class="radio"
             name="handInput"
-          >{{ $lwLanguage.get('wms_project.pda.components.ui.CarPlate.phheorwz', '手动输入') }}
+          >
+            {{ $lwLanguage.get('wms_project.pda.components.ui.CarPlate.phheorwz', '手动输入') }}
           </van-radio>
 
         </van-radio-group>
       </div>
 
-      <template v-if="carType === 'handInput'">
+      <!-- 选择车牌 -->
+      <template v-if="carType==='select'">
+
         <lw-input
-          :title="$lwLanguage.get('wms_project.pda.components.ui.CarPlate.natiejjr','车牌号')"
-          v-model="handInput.value"
-          :get-focus.sync="handInput.focus"
-          :not-keyboard="false"
-          @confirm="handInputConfirm"
+          ref="carPlateSearch"
+          :title="$lwLanguage.get('', '车牌')"
+          :placeholder="$lwLanguage.get('', '请输入车牌编码/车牌号')"
+          v-model="selectData.keyword"
+          @confirm="selectSearchConfirm"
+        >
+          <template #button>
+            <lw-button
+              mini
+              @click="$refs.carPlateSearch.confirm()"
+            >
+              {{ $lwLanguage.get('', '搜索') }}
+            </lw-button>
+          </template>
+        </lw-input>
+
+        <lw-cell
+          v-for="(i,k) in selectData.datas"
+          :key="k"
+          :value="$lwCheckVal(i.code) + '/' + $lwCheckVal(i.name)"
+          value-align="left"
+          @click="carPlateConfirm(i.name)"
+        />
+        <lw-pagination
+          v-model="selectData.pageNum"
+          :page-total="selectData.pageTotal"
+          :page-size.sync="selectData.pageSize"
+          @change="selectPageChange"
         />
+
+        <lw-not-data v-if="!selectData.pageTotal"/>
+
       </template>
-      <template v-else>
+      <!-- 预设车牌 -->
+      <template v-if="!['select','handInput'].includes(carType)">
         <!-- 车牌显示部分 -->
         <div class="lw-global-flex-around lw-car-plate-box">
 
@@ -177,10 +222,23 @@
           </div>
         </div>
       </template>
+      <!-- 手动输入车牌 -->
+      <template v-if="carType === 'handInput'">
+        <lw-input
+          :title="$lwLanguage.get('wms_project.pda.components.ui.CarPlate.natiejjr','车牌号')"
+          v-model="handInput.value"
+          :get-focus.sync="handInput.focus"
+          :not-keyboard="false"
+          @confirm="handInputConfirm"
+        />
+      </template>
 
 
       <!-- 按钮操作区 -->
-      <template #button>
+      <template
+        v-if="carType!=='select'"
+        #button
+      >
         <lw-button
           v-if="carType !== 'handInput'"
           type="last"
@@ -229,6 +287,18 @@ export default {
       default: false
     },
 
+    // 是否隐藏选择车牌选项
+    hiddenSelectOption: {
+      type: Boolean,
+      default: false
+    },
+    // 用于搜索的额外参数
+    apiParam: {
+      type: Object,
+      default: () => {
+      }
+    },
+
     // 点击确认后的回调函数支持异步，返回false时将不关闭弹框
     confirmFn: Function
   },
@@ -281,7 +351,7 @@ export default {
       carPlateList: [],
 
       // 车牌类型
-      carType: 'old',
+      carType: '',
 
       // 当前输入的车牌号索引
       carPlateItemIndex: 0,
@@ -309,7 +379,17 @@ export default {
       ],
 
       // 显示车牌的样式
-      valClass: []
+      valClass: [],
+
+
+      // 选择车牌搜索数据
+      selectData: {
+        keyword: '',
+        pageNum: 1,
+        pageSize: 10,
+        pageTotal: 0,
+        datas: []
+      }
     }
   },
   methods: {
@@ -321,12 +401,17 @@ export default {
       const isChina = /zh|zH|Zh|ZH/.test(lang)
 
       // 如果语言是国内就判断当前车牌是否符合国内车牌规则
-
-      // const num = this.num || this.num === 0 ? this.num : ''
       if (isChina) {
         // 根据车牌长度确定时否是新能源或燃油车
         switch (this.num.length) {
           case 0:
+            if (this.hiddenSelectOption) {
+              this.carType = 'old'
+            } else {
+              this.carType = 'select'
+              !this.selectData.datas.length && this.selectSearchConfirm()
+            }
+            break;
           case 7:
             this.carType = 'old'
             break;
@@ -344,23 +429,39 @@ export default {
         this.carType = 'handInput'
       }
 
+
+      this.showPopup = true
+    },
+    // 弹框打开完成
+    popupOpened() {
       if (this.carType === 'handInput') {
         this.handInput.value = this.num
       } else {
         this.carPlateList = this.num.split('')
         this.carPlateItemIndex = 0
       }
-
-      this.showPopup = true
+    },
+    // 车牌号确认
+    async carPlateConfirm(num) {
+      this.num = num
+      if (this.confirmFn && typeof this.confirmFn === 'function') {
+        if (!await this.confirmFn(num)) return
+      }
+      this.showPopup = false
     },
 
     // 车牌类型改变
     carTypeChange() {
+      // 如果是选择车牌就看是否存在选择数据
+      if (this.carType === 'select') {
+        !this.selectData.pageTotal && this.selectSearchConfirm()
+        return;
+      }
 
       // 切换到手动输入就要清空输入框 同时清空预设键盘输入框
       if (this.carType === 'handInput') {
         this.handInput.focus = true
-        this.handInput.value = this.carPlateList.join('')
+        this.$nextTick(() => this.handInput.value = this.carPlateList.join(''))
         this.carPlateList = []
         this.carPlateItemIndex = 0
         return
@@ -409,7 +510,7 @@ export default {
     },
 
     // 确认
-    async confirm() {
+    confirm() {
       let num = this.carPlateList.join('')
       if (this.carType === 'old' && num.length !== 7) {
         this.$lwShowErrorMsg(
@@ -427,17 +528,32 @@ export default {
 
       if (this.carType === 'handInput') num = this.handInput.value
 
-      this.num = num
-      if (this.confirmFn && typeof this.confirmFn === 'function') {
-        if (!await this.confirmFn(num)) return
-      }
-      this.showPopup = false
+      this.carPlateConfirm(num)
     },
 
     // 手动输入确认
     handInputConfirm() {
       this.confirm()
-    }
+    },
+
+
+    // 车牌选择 - 搜索确认
+    selectSearchConfirm() {
+      this.selectData.pageNum = 1
+      this.selectPageChange()
+    },
+    // 车牌选择 - 页码改变
+    selectPageChange() {
+      this.$lwApi.common.getTruckList({
+        keyword: this.selectData.keyword,
+        pageNum: this.selectData.pageNum,
+        pageSize: this.selectData.pageSize,
+        ...this.apiParam
+      }).then(res => {
+        this.selectData.pageTotal = res.total || 0
+        this.selectData.datas = res.datas || []
+      })
+    },
   }
 }
 </script>
@@ -510,10 +626,14 @@ export default {
   height: 25px;
   line-height: 25px;
   text-align: center;
-  font-size: 14px;
+  font-size: 1rem;
   border: solid 1px #cccccc;
   border-radius: 5px;
   margin: 3px 2px;
 }
 
+.radio {
+  margin: 4px 6px;
+}
+
 </style>

package/src/components/Cell/index.vue

@@ -13,7 +13,7 @@
     <div
       :class="[
         'lw-global-flex-between',
-        isLink ? 'lw-global-click-style' : '',
+        isLink && 'lw-global-click-style',
         'lw-cell-boss'
       ]"
       @click="click"
@@ -55,18 +55,20 @@
       </div>
 
       <van-icon
-        class="lw-cell-icon"
-        v-if="isLink && (!isEdit || !isValue)"
+        v-if="showArrow || (isLink && (!isEdit || !isValue))"
+        color="#cdcdcd"
         name="arrow"
+        size="18px"
       />
 
     </div>
 
     <template v-if="isEdit">
       <van-icon
-        class="lw-cell-icon"
         v-if="isEdit && isValue"
         name="clear"
+        color="#cdcdcd"
+        size="18px"
         @click="clear"
       />
     </template>
@@ -127,11 +129,16 @@ export default {
       type: Boolean,
       default: true
     },
-    // 是否展示右侧箭头并开启点击反馈
+    // 是否开启点击反馈
     isLink: {
       type: Boolean,
       default: true
     },
+    // 是否展示右侧箭头
+    showArrow: {
+      type: Boolean,
+      default: false
+    },
     // 是否显示必填星号
     required: {
       type: Boolean,
@@ -223,7 +230,7 @@ export default {
 .lw-cell-box {
   border-bottom: solid 1px @borderColor;
   position: relative;
-  font-size: 14px;
+  font-size: 1rem;
   padding: 2px 0;
   min-height: 28px;
 }
@@ -247,12 +254,12 @@ export default {
 
 .lw-cell-placeholder {
   color: #cdcdcd;
-  font-size: 14px;
+  font-size: 1rem;
 }
 
 .lw-cell-icon {
   color: #cdcdcd;
-  font-size: 18px;
+  font-size: 1.28rem;
 }
 
 .lw-cell-inp {

package/src/components/CellPopupRadio/index.vue

@@ -86,6 +86,12 @@ export default {
     },
     // 当数据为空时的显示文字
     nullMsg: String,
+
+    // 初始化后默认选中数据的索引，当为0时默认不选中，当索引数大于数据长度时默认不选中
+    initSelectedIndex: {
+      type: Number,
+      default: 0
+    }
   },
   computed:{
     val:{
@@ -98,7 +104,7 @@ export default {
     },
     // 右侧显示的数据
     label:{
-      get(){
+      get() {
         if (!this.val && this.val !== 0) return ''
 
         if (this.columns) return this.getLabel(this.columns)
@@ -108,7 +114,8 @@ export default {
 
         return this.val
       },
-      set() {}
+      set() {
+      }
     }
   },
   data() {
@@ -117,11 +124,19 @@ export default {
       showPopup: false,
     }
   },
+  mounted() {
+    if (this.initSelectedIndex) {
+      const selectData = Array.isArray(this.columns) ? this.columns : (this.$lwDict.get(this.dictKey) || [])
+      const index = Math.abs(this.initSelectedIndex)
+      if (index > selectData.length) return
+      this.popupConfirm(selectData[index - 1], false)
+    }
+  },
   methods: {
     // 获取label的显示值
-    getLabel(arr=[]){
+    getLabel(arr = []) {
       for (let i = 0; i < arr.length; i++) {
-        if(arr[i][this.valueKey] === this.val){
+        if (arr[i][this.valueKey] === this.val) {
           return arr[i][this.labelKey]
         }
       }
@@ -129,10 +144,14 @@ export default {
     },
 
     // 弹出层点击确定
-    popupConfirm(item){
+    popupConfirm(item, event = true) {
+      const oldItem = {
+        label: this.label,
+        value: this.val
+      }
       this.label = item[this.labelKey]
       this.val = item[this.valueKey]
-      this.$emit('confirm', item)
+      event && this.$emit('confirm', item, oldItem)
     }
   }
 }

package/src/components/CellPopupSelect/index.vue

@@ -88,7 +88,7 @@
           <lw-pagination
             v-model="pageNum"
             :page-total="pageTotal"
-            :page-size="size"
+            :page-size.sync="size"
             :page-sizes="[max, max*2, max*4]"
             @update:pageSize="updatePageSize"
             @change="pageChange"/>