修改input通过光标焦点是否在input内控制是否更新数据,回车下发参数让input失去焦点更新数据

wuyouming666

2023-12-26 a5a49ece3191bf8210c42b522503687cedb420c2

 CanadaMes-ui/src/views/Electrical/Positioning1.vue

@@ -137,7 +137,7 @@
                v-if="item.type === '0'"
                v-model="item.value"
                class="input-box"  :oninput="`value=value.replace(/^0|[^0-9]/g,'');if(value<`+item.min+`){value=`+item.value+`}else if(value>`+item.max+`){value=`+item.value+`}`"
                @keyup.enter.native="submitDataToBackend"
                @keyup.enter.native="submitDataToBackend($event)"
              ></el-input>
              <span v-if="item.unit" :name="item.unit">{{ item.unit }}</span>

@@ -180,7 +180,7 @@
      this.$set(dataGroup[itemIndex].button, "value", 1); // 点击按钮后将值改为1
    },
    //提交数据到后端
    submitDataToBackend() {
    submitDataToBackend(event) {
      const inputData = this.jsonData.map((dataGroup) => {
        return dataGroup.map((item) => {
          if (item.type === "0") {
@@ -208,6 +208,7 @@
      const jsonString = JSON.stringify(jsonObject);
       console.log('提交以下数据到后端:', jsonString);
      socket?.send(jsonString);
      event.target.blur(); // 取消输入框焦点
    },
    initWebSocket() {
      let viewname = "Positioning1";
@@ -236,21 +237,24 @@
        };

        // 收到消息
        let isMouseInInputBox = false; // 标记鼠标是否在输入框内
//         let isMouseInInputBox = false; // 标记鼠标是否在输入框内

const inputBox = document.querySelectorAll('.input-box');
inputBox.forEach(box => {
  box.addEventListener('mouseenter', () => {
    isMouseInInputBox = true;
  });
  box.addEventListener('mouseleave', () => {
    isMouseInInputBox = false;
  });
});
// const inputBox = document.querySelectorAll('.input-box');
// inputBox.forEach(box => {
//   box.addEventListener('mouseenter', () => {
//     isMouseInInputBox = true;
//   });
//   box.addEventListener('mouseleave', () => {
//     isMouseInInputBox = false;
//   });
// });

socket.onmessage = (msg) => {
  if (!msg.data) {
    return; // 如果收到空数据，则直接返回，不执行后续逻辑
  }
  if (document.activeElement.tagName.toLowerCase() === 'input') {
    return;
  }

  let obj = JSON.parse(msg.data);
@@ -258,7 +262,7 @@

  const parms = obj.params;

  if(parms && !isMouseInInputBox){ // 只有在鼠标不在输入框内时才更新数据
  if(parms ){ // 只有在鼠标不在输入框内时才更新数据
  //  console.log(parms)
   
    let index = 0;