warewms-PDA/pages/new_file.vue

<template>
  <view class="content">
    <view class="uni-form-item uni-column">
      <input type="text" v-model="value2" @focus="focusFunc" />
      <view class="title">实时获取请扫描输入值：{{ value }}</view>
      <u--input
        class="inputsss"
        v-model="value"
        placeholder="请扫描"
        clearable
        confirm-type="next"
        @input="onInput"
        @confirm="moveNext('b')"
        @blur="blur" />
      <view class="title">实时获取请扫描输入值2：{{ b }}</view>
      <u--input
        class="input"
        v-model="b"
        placeholder="请扫描"
        :focus="focusList['b']"
        clearable
        @input="onInputr"
        @confirm="confirmr"
        @blur="blurr" />
      <!-- <input
        v-model="a"
        type="text"
        confirm-type="next"
        @confirm="moveNext('b')" />
      <input v-model="b" :focus="focusList['b']" /> -->
    </view>
    <xw-scan></xw-scan>
  </view>
</template>

<script>
// 广播模式激光扫码
// import xwScan from "@/components/padDevice/scan-code.vue";
export default {
  components: {
    // xwScan,
  },
  data() {
    return {
      a: "",
      b: "",
      focusList: {
        b: false,
      },
      value: "",
      inputTagsValue: "",
      value2: "",
      focus: false,
      focusss: false,
      searchFocus: false,
      searchValue: "",
      textInput: "",
      isInputFocused: false,
      isHidden: true,
      isFocused: false,
      scanTitle: "扫描结果",
    };
  },

  onLoad() {},
  onUnload() {
    // 移除监听事件
    uni.$off("xwscan");
  },
  onShow() {
    const activeNode = document.activeElement;
    console.log(activeNode);
    uni.$off("xwscan"); // 每次进来先 移除全局自定义事件监听器
    uni.$on("xwscan", (res) => {
      console.log("扫码结果：", res.code);
      this.scanTitle = "激光扫码结果";
      // this.value = res.code;
      if (this.value == "") {
        this.value = res.code;
      } else {
        this.b = res.code;
      }
    });
  },

  methods: {
    focusFunc(e) {
      uni.$off("xwscan"); // 每次进来先 移除全局自定义事件监听器
      uni.$on("xwscan", (res) => {
        console.log("扫码结果：", res.code);
        // this.scanTitle = "激光扫码结果";
        this.value2 = res.code;
      });
      console.log("focus事件");
    },
    moveNext(dom) {
      this.focusList[dom] = true;
      console.log(dom);
    },
    focusInterestInput() {
      this.inputFocus = true;
    },

    handleInputBlur() {
      this.inputFocus = false;
    },
    focusHide(val) {
      let that = this;
      // setTimeout(() => {
      that.focus = true;
      // }, 100)
      console.log("eeeee");
      // 这是隐藏自动弹出软键盘 (好像没有用)
      setTimeout(() => {
        uni.hideKeyboard();
      }, 100);
    },
    blur() {
      this.focus = false;
    },
    blurr() {
      this.focusss = false;
    },
    confirm(value) {
      // 自动多次扫码
      let that = this;
      // that.value = ''
      setTimeout(() => {
        that.focus = false;
        that.$nextTick(() => {
          that.focus = true;
        });
        // that.value = ''
      }, 350);
      console.log("扫码结果：", value);
    },
    confirmr(value) {
      // 自动多次扫码
      let that = this;
      // that.value = ''
      setTimeout(() => {
        that.focusss = false;
        that.$nextTick(() => {
          that.focusss = true;
        });
        // that.value = ''
      }, 350);
      console.log("扫码结果：", value);
    },
    onInput(value) {
      console.log(value);
      this.value = value;
    },
    onInputr(value) {
      this.b = value;
    },
  },
};
</script>
<style scoped>
input {
  border: 1rpx solid #ccc;
  height: 80rpx;
  border-radius: 10rpx;
  font-size: 24rpx;
  padding: 0 10rpx;
}

.custom-input input.focused {
  background-color: rgb(111, 141, 255, 0.2); /* 设置输入框获得焦点时的背景色 */
  border: 1rpx solid rgb(111, 141, 255);
}
</style>