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

package/src/components/Input/index.vue

@@ -1,646 +1,646 @@
-<!--
-  @name: 输入框
-  @description: -
-  @author 张文
-  @date: 2022-01-18
--->
-<template>
-  <div
-    :class="[
-      'lw-global-flex-start',
-      showBottomBorder ? 'lw-global-bottom-border' : '',
-      required?'lw-global-required' : '',
-      'lw-input-box',
-    ]"
-  >
-    <label
-      v-if="title.length || !!$slots.title"
-      :class="[
-        'lw-global-flex-start',
-        'lw-input-title',
-        showColon?'lw-global-show-colon':''
-      ]"
-      :style="{
-        width:titleWidth ? titleWidth + 'px' : 'auto',
-        textAlign: titleAlign || 'left',
-        display:'inline-block'
-      }"
-    >
-      <slot name="title">{{ title }}</slot>
-
-    </label>
-
-    <div class="lw-global-flex-start lw-input-body">
-      <!-- 输入框主体 -->
-      <div class="lw-global-flex-start lw-input-boss">
-
-        <!-- 扫码 -->
-        <img
-          v-if="showScanIcon && !disabled && !readonly"
-          class="lw-input-img"
-          src="../../assets/img/common/inputScanIcon.png"
-          alt="扫码"
-          @click="scanIconClick"
-        >
-
-        <!-- 文本域 -->
-        <textarea
-          v-if="type === 'textarea'"
-          ref="lwInput"
-          class="lw-input-input"
-          v-model="val"
-          :name="name"
-          :disabled="disabled"
-          :readonly="readonly || readonlyInp"
-          :rows="rows"
-          :maxlength="maxlength"
-          :style="{
-            textAlign:inputAlign,
-            resize:'none'
-          }"
-          :placeholder="placeholderData"
-          :data-lwSaveFocus="saveFocusStatus"
-          @focus="inputFocus"
-          @blur="inputBlur"
-          @keydown.enter="confirm"
-          @click="click"
-        />
-
-        <!-- 输入框 -->
-        <input
-          v-else
-          ref="lwInput"
-          class="lw-input-input"
-          :type="['number','digit'].includes(type) ? 'text' : type"
-          :name="name"
-          :value="val"
-          :maxlength="maxlength"
-          :disabled="disabled"
-          :readonly="readonly || readonlyInp"
-          :style="{
-            textAlign:inputAlign
-          }"
-          :placeholder="placeholderData"
-          :data-lwSaveFocus="saveFocusStatus"
-          @focus="inputFocus"
-          @blur="inputBlur"
-          @keydown.enter="confirm"
-          @input="input"
-          @click="click"
-        >
-
-        <!-- 字数统计 -->
-        <div
-          v-if="showWordLimit"
-          class="lw-input-word-limit"
-        >
-          <span v-if="maxlength">{{ value.length || 0 }} / {{ maxlength }}</span>
-          <span v-else>{{ value.length }}</span>
-        </div>
-
-        <!-- 清除按钮 -->
-        <van-icon
-          v-if="((showClear && !disabled && !readonly && !readonlyInp) || needShowClear ) && val"
-          class="lw-input-clear"
-          name="clear"
-          @click="clearClick"
-        />
-
-        <!-- 获取焦点时划线用的 -->
-        <div class="lw-input-border"></div>
-
-        <!-- 按钮插槽 -->
-        <div
-          v-if="$slots.button"
-          class="lw-input-button-box"
-        >
-          <slot name="button"></slot>
-        </div>
-      </div>
-
-    </div>
-
-  </div>
-</template>
-
-<script>
-
-export default {
-  name: "lwInput",
-  props: {
-    // 输入框的值
-    value: [String, Number],
-
-    // 输入框标题
-    title: {
-      type: [String, Number],
-      default: ''
-    },
-
-    // 标题的对齐方式
-    titleAlign: String,
-
-    // 标题的宽度
-    titleWidth: Number,
-
-    // 输入框的名字，form表单使用
-    name: String,
-
-    // 输入类型： number-数字包含小数，digit-整数，textarea-文本域，text-普通输入框(默认)
-    type: {
-      type: String,
-      default: 'text'
-    },
-
-    // 占位符，默认为：请扫描或输入+传入的title值
-    placeholder: String,
-
-    // 是否禁用，默认false
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-
-    // 是否自读，默认false
-    readonly: {
-      type: Boolean,
-      default: false
-    },
-
-    // 输入内容格式化函数，默认在change事件时触发
-    formatter: Function,
-
-    // 是否显示必填的星号，默认false。仅展示星号不做必填校验
-    required: {
-      type: Boolean,
-      default: false
-    },
-
-    // 输入框文本对齐位置，默认左对齐
-    inputAlign: {
-      type: String,
-      default: 'left'
-    },
-
-    // 文本域时显示的文本行数
-    rows: {
-      type: Number,
-      default: 2
-    },
-
-    // 允许输入的最大字符量
-    maxlength: [Number, String],
-
-    // 是否显示字数统计
-    showWordLimit: {
-      type: Boolean,
-      default: false
-    },
-
-    // 是否显示清除图标
-    showClear: {
-      type: Boolean,
-      default: true
-    },
-
-    // 是否强制显示清除图标，为true时将会忽略禁用和只读配置，而强制显示清除按钮
-    needShowClear: {
-      type: Boolean,
-      default: false
-    },
-
-    // 是否显示下边框
-    showBottomBorder: {
-      type: Boolean,
-      default: true
-    },
-
-    // 是否获取输入框焦点，默认false，失去焦点后会改变值为false
-    getFocus: {
-      type: Boolean,
-      default: false
-    },
-
-    // 是否禁止软键盘弹出，默认禁止弹出，可通过双击输入框强制弹出
-    notKeyboard: {
-      type: Boolean,
-      default: true
-    },
-
-    // 获得扫码结果后是否立刻将输入框内容置空，默认false
-    autoClearVal: {
-      type: Boolean,
-      default: false
-    },
-
-    // 是否显示扫描图标
-    showScanIcon: {
-      type: Boolean,
-      default: true
-    },
-
-    // 输入完成后是否立刻失去焦点
-    inputOverBlur: {
-      type: Boolean,
-      default: false
-    },
-
-    // 是否显示冒号
-    showColon: {
-      type: Boolean,
-      default: false
-    },
-
-    // 如果输入类型是小数，则小数点接受几位，0表示不限制
-    decimalScale: {
-      type: Number,
-      default: 0
-    },
-
-    /*
-    * 条码解析如果id不存在自主生成所需的数据，数据应当包含
-    * {
-    *   name: 规则名称,
-    *   appCode: 所属项目,
-    *   moduleName: 所属模块,
-    *   bizType: 规则类型,
-    *   defaultBizType: 默认规则
-    * }
-    * */
-    createRule: Object,
-    // 货主id
-    ownerId: null,
-    // 扫码解析规则
-    ruleKey: String,
-    // 条码解析规则前缀，不传默认使用路由地址+ruleKey
-    rulePrefix: String,
-    // 扫码解析后输入框回填字段的key
-    ruleValueKey: {
-      type: String,
-      default: 'key'
-    },
-    // 解码的额外参数
-    ruleServeQuery: {
-      type: Object,
-      default: () => {
-      }
-    },
-    // 是否保存当前获取焦点的状态
-    saveFocusStatus: {
-      type: Boolean,
-      default: true
-    },
-
-    // 条码解析错误的提示类型 error - 强制错误弹框，toast - 轻提醒
-    ruleErrorType: {
-      type: String,
-      default: 'error'
-    }
-  },
-  computed: {
-    // 输入框实际绑定的值
-    val: {
-      get() {
-        return this.value
-      },
-      set(v) {
-        this.$emit('input', v)
-      }
-    },
-    // 提示文字
-    placeholderData() {
-      if (this.disabled || this.readonly) {
-        return ''
-      }
-
-      if (this.placeholder) {
-        return this.placeholder
-      }
-
-      return this.$lwLanguage.get('wms_project.pda.common.scanInput', '请扫描或输入') + this.title
-    },
-    // 获取焦点
-    focusVal: {
-      get() {
-        return this.getFocus
-      },
-      set(v) {
-        this.$emit('update:getFocus', v)
-      }
-    }
-  },
-  watch: {
-    getFocus: {
-      handler(n) {
-        n ? this.setFocusFn() : this.setBlurFn()
-      },
-    }
-  },
-  data() {
-    return {
-      // 用于禁止弹出键盘的临时标识
-      readonlyInp: false,
-      // 是否通过点击键盘
-      isClickKeyboard: false,
-
-      // 点击需要的数据
-      clickData: {
-        num: 0,
-        timeout: null
-      },
-
-    }
-  },
-  mounted() {
-    this.focusVal && this.setFocusFn()
-
-  },
-  methods: {
-
-    // 扫描
-    scanIconClick() {
-      this.$lwAppPower.scan().then((result) => {
-        if (result) {
-          // eslint-disable-next-line vue/no-mutating-props
-          this.value = result
-          this.confirm()
-        }
-      })
-    },
-
-    // 点击清除按钮
-    clearClick() {
-      this.clearVal()
-      this.$emit('clear')
-    },
-    // 点击清除
-    clearVal() {
-      this.val = ''
-      this.$refs.lwInput.value = ''
-      this.$refs.lwInput.focus()
-    },
-
-
-    // 获取焦点
-    setFocusFn() {
-      this.$refs.lwInput.focus()
-    },
-
-    // 失去焦点
-    setBlurFn() {
-      this.$refs.lwInput.blur()
-    },
-
-    // 获取焦点事件
-    inputFocus() {
-      this.isOpenKeyboard()
-      this.focusVal = true
-    },
-
-    // 失去焦点事件
-    inputBlur() {
-      if (this.val) this.val = this.val.toString().trim()
-      this.focusVal = false
-      this.$emit('blur')
-    },
-
-    // 是否弹出键盘
-    isOpenKeyboard() {
-      if (this.notKeyboard) {
-        this.readonlyInp = true
-        setTimeout(() => {
-          this.readonlyInp = false
-          this.$lwAppPower.hideSoftInput(this)
-        }, 200)
-      }
-    },
-
-    // 点击回车
-    async confirm() {
-      let obj = {data: {}}
-      let val = this.val
-
-      // 去除空格
-      if (val) val = val.toString().trim()
-
-
-      // 如果配置存在解析id，且输入框有值时触发解析
-      if (this.ruleKey && val) {
-
-        const componentId = (this.rulePrefix || this.$route.path) + '/' + this.ruleKey
-
-        let hasFocus = false
-        if (this.focusVal) {
-          hasFocus = true
-          this.focusVal = false
-        }
-
-        obj = await this.$lwBarcodeResolve.resolve({
-          componentId,
-          barcode: val,
-          createRule: this.createRule,
-          args: this.ruleServeQuery,
-          ownerId: this.ownerId,
-          ruleErrorType: this.ruleErrorType
-        })
-
-        if (hasFocus) this.focusVal = true
-
-        // 如果解析失败就不触发任何事件并清空输入框
-        if (!obj.success) {
-          this.clearVal()
-          return
-        }
-
-        // 回填数据 当所需值不存在时，取key
-        if (this.ruleValueKey) {
-          val = obj.data[this.ruleValueKey] || obj.data.key
-        }
-      }
-
-      // 是否需要清空输入框
-      if (this.autoClearVal || obj.autoClear) {
-        this.clearVal()
-        // this.val = ''
-      } else {
-
-        this.val = val
-      }
-
-      // 输入框是否需要失去焦点
-      if (this.inputOverBlur) {
-        this.inputBlur()
-      }
-
-      // 触发震动
-      this.$lwAppPower.shortVibrate(500)
-
-      this.$emit('confirm', val, obj)
-    },
-
-    // 输入框输入
-    input() {
-      let val = this.$refs.lwInput.value
-
-      // 整数
-      if (this.type === 'digit') {
-        val = val.replace(/\D/g, '')
-      }
-
-      // 小数
-      if (this.type === 'number') {
-        const num = val.replace(/[^\d/.]/, '')
-        if (/^\d+/.test(num)) {
-          const use = num.includes('.')
-          if (use) {
-            const list = num.split('.')
-            const decimal = this.decimalScale ? list[1].substring(0, this.decimalScale) : list[1]
-            val = list[0] + '.' + decimal
-          } else {
-            val = num
-          }
-        } else {
-          val = ''
-        }
-      }
-
-      // 是否存在格式化函数
-      if (this.formatter && typeof this.formatter === 'function') {
-        val = this.formatter(val)
-      }
-
-      // 赋值
-      this.$refs.lwInput.value = val
-
-
-      this.$emit('input', val)
-    },
-
-
-    // 点击
-    click() {
-
-      this.clickData.timeout && clearTimeout(this.clickData.timeout)
-
-      this.clickData.num++
-
-      // 显示当前输入框解析id
-      if (this.clickData.num >= 10) {
-
-        const componentId = (this.rulePrefix || this.$route.path) + '/' + this.ruleKey
-
-        const message = this.ruleKey ?
-          this.$lwLanguage.get('wms_project.pda.components.Input.index.yhrktchj', '当前输入框解析ID为：') + componentId :
-          this.$lwLanguage.get('wms_project.pda.components.Input.index.nwiaoput', '当前输入框未配置解析ID')
-
-
-        this.$lwDialog.confirm({
-          type: this.ruleKey ? 'success' : 'warning',
-          message,
-          confirmButtonText: this.$lwLanguage.get('wms_project.pda.components.Input.index.amytwqyl', '复制ID'),
-          showConfirmButton: !!this.ruleKey
-        }).then(() => {
-          navigator.clipboard.writeText(componentId).then(() => {
-            this.$lwToast.success(
-              this.$lwLanguage.get('wms_project.pda.components.Input.index.pzencdqg', '已复制')
-            )
-          })
-        }).catch(() => {
-        })
-
-        this.clickData.num = 0
-        return
-      }
-
-      this.clickData.timeout = setTimeout(() => {
-        this.clickData.num = 0
-      }, 500)
-    }
-  }
-}
-</script>
-
-<style scoped lang="less">
-@import "../../assets/css/var.less";
-
-
-.lw-input-box {
-  font-size: 1rem;
-  overflow: hidden;
-  padding: 2px 0;
-}
-
-.lw-input-title {
-  color: @titleColor;
-  flex-shrink: 0;
-  margin-right: 5px;
-}
-
-.lw-input-body {
-  flex: 1;
-  position: relative;
-  transition: all .3s;
-}
-
-.lw-input-boss {
-  flex: 1;
-  position: relative;
-}
-
-.lw-input-img {
-  width: 18px;
-  padding: 5px;
-}
-
-.lw-input-clear {
-  font-size: 1.28rem;
-  color: #cdcdcd;
-}
-
-.lw-input-input {
-  width: 100%;
-  border: none;
-  padding: 6px;
-
-  &::-webkit-input-placeholder {
-    color: #ccc;
-  }
-
-
-  &:focus ~ .lw-input-border:after {
-    width: 100%;
-  }
-}
-
-.lw-input-border {
-
-  &:after {
-    content: ' ';
-    display: block;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    width: 0;
-    height: 1px;
-    background-color: @baseColor;
-    transform: scaleY(0.5);
-    transition: all .3s;
-  }
-}
-
-.lw-input-word-limit {
-  font-size: 0.85rem;
-  flex-shrink: 0;
-  margin-right: 5px;
-
-  > span {
-    color: #ccc;
-  }
-}
-
-.lw-input-button-box {
-  flex-shrink: 0;
-  margin-left: 5px;
-}
-
-</style>
+<!--
+  @name: 输入框
+  @description: -
+  @author 张文
+  @date: 2022-01-18
+-->
+<template>
+  <div
+    :class="[
+      'lw-global-flex-start',
+      showBottomBorder ? 'lw-global-bottom-border' : '',
+      required?'lw-global-required' : '',
+      'lw-input-box',
+    ]"
+  >
+    <label
+      v-if="title.length || !!$slots.title"
+      :class="[
+        'lw-global-flex-start',
+        'lw-input-title',
+        showColon?'lw-global-show-colon':''
+      ]"
+      :style="{
+        width:titleWidth ? titleWidth + 'px' : 'auto',
+        textAlign: titleAlign || 'left',
+        display:'inline-block'
+      }"
+    >
+      <slot name="title">{{ title }}</slot>
+
+    </label>
+
+    <div class="lw-global-flex-start lw-input-body">
+      <!-- 输入框主体 -->
+      <div class="lw-global-flex-start lw-input-boss">
+
+        <!-- 扫码 -->
+        <img
+          v-if="showScanIcon && !disabled && !readonly"
+          class="lw-input-img"
+          src="../../assets/img/common/inputScanIcon.png"
+          alt="扫码"
+          @click="scanIconClick"
+        >
+
+        <!-- 文本域 -->
+        <textarea
+          v-if="type === 'textarea'"
+          ref="lwInput"
+          class="lw-input-input"
+          v-model="val"
+          :name="name"
+          :disabled="disabled"
+          :readonly="readonly || readonlyInp"
+          :rows="rows"
+          :maxlength="maxlength"
+          :style="{
+            textAlign:inputAlign,
+            resize:'none'
+          }"
+          :placeholder="placeholderData"
+          :data-lwSaveFocus="saveFocusStatus"
+          @focus="inputFocus"
+          @blur="inputBlur"
+          @keydown.enter="confirm"
+          @click="click"
+        />
+
+        <!-- 输入框 -->
+        <input
+          v-else
+          ref="lwInput"
+          class="lw-input-input"
+          :type="['number','digit'].includes(type) ? 'text' : type"
+          :name="name"
+          :value="val"
+          :maxlength="maxlength"
+          :disabled="disabled"
+          :readonly="readonly || readonlyInp"
+          :style="{
+            textAlign:inputAlign
+          }"
+          :placeholder="placeholderData"
+          :data-lwSaveFocus="saveFocusStatus"
+          @focus="inputFocus"
+          @blur="inputBlur"
+          @keydown.enter="confirm"
+          @input="input"
+          @click="click"
+        >
+
+        <!-- 字数统计 -->
+        <div
+          v-if="showWordLimit"
+          class="lw-input-word-limit"
+        >
+          <span v-if="maxlength">{{ value.length || 0 }} / {{ maxlength }}</span>
+          <span v-else>{{ value.length }}</span>
+        </div>
+
+        <!-- 清除按钮 -->
+        <van-icon
+          v-if="((showClear && !disabled && !readonly && !readonlyInp) || needShowClear ) && val"
+          class="lw-input-clear"
+          name="clear"
+          @click="clearClick"
+        />
+
+        <!-- 获取焦点时划线用的 -->
+        <div class="lw-input-border"></div>
+
+        <!-- 按钮插槽 -->
+        <div
+          v-if="$slots.button"
+          class="lw-input-button-box"
+        >
+          <slot name="button"></slot>
+        </div>
+      </div>
+
+    </div>
+
+  </div>
+</template>
+
+<script>
+
+export default {
+  name: "lwInput",
+  props: {
+    // 输入框的值
+    value: [String, Number],
+
+    // 输入框标题
+    title: {
+      type: [String, Number],
+      default: ''
+    },
+
+    // 标题的对齐方式
+    titleAlign: String,
+
+    // 标题的宽度
+    titleWidth: Number,
+
+    // 输入框的名字，form表单使用
+    name: String,
+
+    // 输入类型： number-数字包含小数，digit-整数，textarea-文本域，text-普通输入框(默认)
+    type: {
+      type: String,
+      default: 'text'
+    },
+
+    // 占位符，默认为：请扫描或输入+传入的title值
+    placeholder: String,
+
+    // 是否禁用，默认false
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+
+    // 是否自读，默认false
+    readonly: {
+      type: Boolean,
+      default: false
+    },
+
+    // 输入内容格式化函数，默认在change事件时触发
+    formatter: Function,
+
+    // 是否显示必填的星号，默认false。仅展示星号不做必填校验
+    required: {
+      type: Boolean,
+      default: false
+    },
+
+    // 输入框文本对齐位置，默认左对齐
+    inputAlign: {
+      type: String,
+      default: 'left'
+    },
+
+    // 文本域时显示的文本行数
+    rows: {
+      type: Number,
+      default: 2
+    },
+
+    // 允许输入的最大字符量
+    maxlength: [Number, String],
+
+    // 是否显示字数统计
+    showWordLimit: {
+      type: Boolean,
+      default: false
+    },
+
+    // 是否显示清除图标
+    showClear: {
+      type: Boolean,
+      default: true
+    },
+
+    // 是否强制显示清除图标，为true时将会忽略禁用和只读配置，而强制显示清除按钮
+    needShowClear: {
+      type: Boolean,
+      default: false
+    },
+
+    // 是否显示下边框
+    showBottomBorder: {
+      type: Boolean,
+      default: true
+    },
+
+    // 是否获取输入框焦点，默认false，失去焦点后会改变值为false
+    getFocus: {
+      type: Boolean,
+      default: false
+    },
+
+    // 是否禁止软键盘弹出，默认禁止弹出，可通过双击输入框强制弹出
+    notKeyboard: {
+      type: Boolean,
+      default: true
+    },
+
+    // 获得扫码结果后是否立刻将输入框内容置空，默认false
+    autoClearVal: {
+      type: Boolean,
+      default: false
+    },
+
+    // 是否显示扫描图标
+    showScanIcon: {
+      type: Boolean,
+      default: true
+    },
+
+    // 输入完成后是否立刻失去焦点
+    inputOverBlur: {
+      type: Boolean,
+      default: false
+    },
+
+    // 是否显示冒号
+    showColon: {
+      type: Boolean,
+      default: false
+    },
+
+    // 如果输入类型是小数，则小数点接受几位，0表示不限制
+    decimalScale: {
+      type: Number,
+      default: 0
+    },
+
+    /*
+    * 条码解析如果id不存在自主生成所需的数据，数据应当包含
+    * {
+    *   name: 规则名称,
+    *   appCode: 所属项目,
+    *   moduleName: 所属模块,
+    *   bizType: 规则类型,
+    *   defaultBizType: 默认规则
+    * }
+    * */
+    createRule: Object,
+    // 货主id
+    ownerId: null,
+    // 扫码解析规则
+    ruleKey: String,
+    // 条码解析规则前缀，不传默认使用路由地址+ruleKey
+    rulePrefix: String,
+    // 扫码解析后输入框回填字段的key
+    ruleValueKey: {
+      type: String,
+      default: 'key'
+    },
+    // 解码的额外参数
+    ruleServeQuery: {
+      type: Object,
+      default: () => {
+      }
+    },
+    // 是否保存当前获取焦点的状态
+    saveFocusStatus: {
+      type: Boolean,
+      default: true
+    },
+
+    // 条码解析错误的提示类型 error - 强制错误弹框，toast - 轻提醒
+    ruleErrorType: {
+      type: String,
+      default: 'error'
+    }
+  },
+  computed: {
+    // 输入框实际绑定的值
+    val: {
+      get() {
+        return this.value
+      },
+      set(v) {
+        this.$emit('input', v)
+      }
+    },
+    // 提示文字
+    placeholderData() {
+      if (this.disabled || this.readonly) {
+        return ''
+      }
+
+      if (this.placeholder) {
+        return this.placeholder
+      }
+
+      return this.$lwLanguage.get('wms_project.pda.common.scanInput', '请扫描或输入') + this.title
+    },
+    // 获取焦点
+    focusVal: {
+      get() {
+        return this.getFocus
+      },
+      set(v) {
+        this.$emit('update:getFocus', v)
+      }
+    }
+  },
+  watch: {
+    getFocus: {
+      handler(n) {
+        n ? this.setFocusFn() : this.setBlurFn()
+      },
+    }
+  },
+  data() {
+    return {
+      // 用于禁止弹出键盘的临时标识
+      readonlyInp: false,
+      // 是否通过点击键盘
+      isClickKeyboard: false,
+
+      // 点击需要的数据
+      clickData: {
+        num: 0,
+        timeout: null
+      },
+
+    }
+  },
+  mounted() {
+    this.focusVal && this.setFocusFn()
+
+  },
+  methods: {
+
+    // 扫描
+    scanIconClick() {
+      this.$lwAppPower.scan().then((result) => {
+        if (result) {
+          // eslint-disable-next-line vue/no-mutating-props
+          this.value = result
+          this.confirm()
+        }
+      })
+    },
+
+    // 点击清除按钮
+    clearClick() {
+      this.clearVal()
+      this.$emit('clear')
+    },
+    // 点击清除
+    clearVal() {
+      this.val = ''
+      this.$refs.lwInput.value = ''
+      this.$refs.lwInput.focus()
+    },
+
+
+    // 获取焦点
+    setFocusFn() {
+      this.$refs.lwInput.focus()
+    },
+
+    // 失去焦点
+    setBlurFn() {
+      this.$refs.lwInput.blur()
+    },
+
+    // 获取焦点事件
+    inputFocus() {
+      this.isOpenKeyboard()
+      this.focusVal = true
+    },
+
+    // 失去焦点事件
+    inputBlur() {
+      if (this.val) this.val = this.val.toString().trim()
+      this.focusVal = false
+      this.$emit('blur')
+    },
+
+    // 是否弹出键盘
+    isOpenKeyboard() {
+      if (this.notKeyboard) {
+        this.readonlyInp = true
+        setTimeout(() => {
+          this.readonlyInp = false
+          this.$lwAppPower.hideSoftInput(this)
+        }, 200)
+      }
+    },
+
+    // 点击回车
+    async confirm() {
+      let obj = {data: {}}
+      let val = this.val
+
+      // 去除空格
+      if (val) val = val.toString().trim()
+
+
+      // 如果配置存在解析id，且输入框有值时触发解析
+      if (this.ruleKey && val) {
+
+        const componentId = (this.rulePrefix || this.$route.path) + '/' + this.ruleKey
+
+        let hasFocus = false
+        if (this.focusVal) {
+          hasFocus = true
+          this.focusVal = false
+        }
+
+        obj = await this.$lwBarcodeResolve.resolve({
+          componentId,
+          barcode: val,
+          createRule: this.createRule,
+          args: this.ruleServeQuery,
+          ownerId: this.ownerId,
+          ruleErrorType: this.ruleErrorType
+        })
+
+        if (hasFocus) this.focusVal = true
+
+        // 如果解析失败就不触发任何事件并清空输入框
+        if (!obj.success) {
+          this.clearVal()
+          return
+        }
+
+        // 回填数据 当所需值不存在时，取key
+        if (this.ruleValueKey) {
+          val = obj.data[this.ruleValueKey] || obj.data.key
+        }
+      }
+
+      // 是否需要清空输入框
+      if (this.autoClearVal || obj.autoClear) {
+        this.clearVal()
+        // this.val = ''
+      } else {
+
+        this.val = val
+      }
+
+      // 输入框是否需要失去焦点
+      if (this.inputOverBlur) {
+        this.inputBlur()
+      }
+
+      // 触发震动
+      this.$lwAppPower.shortVibrate(500)
+
+      this.$emit('confirm', val, obj)
+    },
+
+    // 输入框输入
+    input() {
+      let val = this.$refs.lwInput.value
+
+      // 整数
+      if (this.type === 'digit') {
+        val = val.replace(/\D/g, '')
+      }
+
+      // 小数
+      if (this.type === 'number') {
+        const num = val.replace(/[^\d/.]/, '')
+        if (/^\d+/.test(num)) {
+          const use = num.includes('.')
+          if (use) {
+            const list = num.split('.')
+            const decimal = this.decimalScale ? list[1].substring(0, this.decimalScale) : list[1]
+            val = list[0] + '.' + decimal
+          } else {
+            val = num
+          }
+        } else {
+          val = ''
+        }
+      }
+
+      // 是否存在格式化函数
+      if (this.formatter && typeof this.formatter === 'function') {
+        val = this.formatter(val)
+      }
+
+      // 赋值
+      this.$refs.lwInput.value = val
+
+
+      this.$emit('input', val)
+    },
+
+
+    // 点击
+    click() {
+
+      this.clickData.timeout && clearTimeout(this.clickData.timeout)
+
+      this.clickData.num++
+
+      // 显示当前输入框解析id
+      if (this.clickData.num >= 10) {
+
+        const componentId = (this.rulePrefix || this.$route.path) + '/' + this.ruleKey
+
+        const message = this.ruleKey ?
+          this.$lwLanguage.get('wms_project.pda.components.Input.index.yhrktchj', '当前输入框解析ID为：') + componentId :
+          this.$lwLanguage.get('wms_project.pda.components.Input.index.nwiaoput', '当前输入框未配置解析ID')
+
+
+        this.$lwDialog.confirm({
+          type: this.ruleKey ? 'success' : 'warning',
+          message,
+          confirmButtonText: this.$lwLanguage.get('wms_project.pda.components.Input.index.amytwqyl', '复制ID'),
+          showConfirmButton: !!this.ruleKey
+        }).then(() => {
+          navigator.clipboard.writeText(componentId).then(() => {
+            this.$lwToast.success(
+              this.$lwLanguage.get('wms_project.pda.components.Input.index.pzencdqg', '已复制')
+            )
+          })
+        }).catch(() => {
+        })
+
+        this.clickData.num = 0
+        return
+      }
+
+      this.clickData.timeout = setTimeout(() => {
+        this.clickData.num = 0
+      }, 500)
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+@import "../../assets/css/var.less";
+
+
+.lw-input-box {
+  font-size: 1rem;
+  overflow: hidden;
+  padding: 2px 0;
+}
+
+.lw-input-title {
+  color: @titleColor;
+  flex-shrink: 0;
+  margin-right: 5px;
+}
+
+.lw-input-body {
+  flex: 1;
+  position: relative;
+  transition: all .3s;
+}
+
+.lw-input-boss {
+  flex: 1;
+  position: relative;
+}
+
+.lw-input-img {
+  width: 18px;
+  padding: 5px;
+}
+
+.lw-input-clear {
+  font-size: 1.28rem;
+  color: #cdcdcd;
+}
+
+.lw-input-input {
+  width: 100%;
+  border: none;
+  padding: 6px;
+
+  &::-webkit-input-placeholder {
+    color: #ccc;
+  }
+
+
+  &:focus ~ .lw-input-border:after {
+    width: 100%;
+  }
+}
+
+.lw-input-border {
+
+  &:after {
+    content: ' ';
+    display: block;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 0;
+    height: 1px;
+    background-color: @baseColor;
+    transform: scaleY(0.5);
+    transition: all .3s;
+  }
+}
+
+.lw-input-word-limit {
+  font-size: 0.85rem;
+  flex-shrink: 0;
+  margin-right: 5px;
+
+  > span {
+    color: #ccc;
+  }
+}
+
+.lw-input-button-box {
+  flex-shrink: 0;
+  margin-left: 5px;
+}
+
+</style>