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

wuyouming666

2023-12-26 a5a49ece3191bf8210c42b522503687cedb420c2

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

@@ -64,7 +64,7 @@
            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>

  <!-- <el-input v-if="item.type === '0'"
@@ -114,6 +114,7 @@


  },
 
  methods: {
    closeSocket () {
      // 关闭 WebSocket 连接
@@ -155,7 +156,7 @@
      const jsonString = JSON.stringify(jsonObject);
      console.log('提交以下数据到后端:', jsonString);
      socket?.send(jsonString);

      event.target.blur(); // 取消输入框焦点

    },
    initWebSocket () {
@@ -181,109 +182,117 @@
        };

        // 收到消息
        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);
  
  const jsonData2 = this.jsonData;

  const parms = obj.params;
      const fanzhuan = obj.fanzhuan;
      const xiaoche = obj.xiaoche;
      const dache = obj.dache1;
  const fanzhuan = obj.fanzhuan;
  const xiaoche = obj.xiaoche;
  const dache = obj.dache1;

      const parms2 = obj.params2;
      const fanzhuan2 = obj.fanzhuan2;
      const xiaoche2 = obj.xiaoche2;
  const parms2 = obj.params2;
  const fanzhuan2 = obj.fanzhuan2;
  const xiaoche2 = obj.xiaoche2;

  if(parms && !isMouseInInputBox){
     
  if(parms){
    let index = 0;
    for (let i = 0; i < jsonData2.length - 1; i++) {
      let arr = jsonData2[i];

      let index = 0;
      for (let i = 0; i < jsonData2.length - 1; i++) {
        let arr = jsonData2[i];

        for (let j = 0; j < arr.length; j++) {
          let obj = arr[j];
          if (obj.type === '0' && Object.prototype.hasOwnProperty.call(obj, 'value')) {
            if (Array.isArray(parms) && Array.isArray(parms[0]) && parms[0][index] !== undefined) {
              obj.value = parms[0][index];
              index++;
            }
      for (let j = 0; j < arr.length; j++) {
        let obj = arr[j];
        if (obj.type === '0' && Object.prototype.hasOwnProperty.call(obj, 'value')) {
          if (Array.isArray(parms) && Array.isArray(parms[0]) && parms[0][index] !== undefined) {
            obj.value = parms[0][index];
            index++;
          }
        }
      }
      if (Array.isArray(fanzhuan) && Array.isArray(fanzhuan[0]) && fanzhuan[0][0] !== undefined) {
        jsonData2[4][0]['value'] = fanzhuan[0][0];
      }
      if (Array.isArray(xiaoche) && Array.isArray(xiaoche[0]) && xiaoche[0][0] !== undefined) {
        jsonData2[3][0]['value'] = xiaoche[0][0];
      }
      if (Array.isArray(dache) && Array.isArray(dache[0]) && dache[0][0] !== undefined) {
        jsonData2[2][0]['value'] = dache[0][0];
      }

      let index2 = 0;
      for (let i = 5; i < jsonData2.length; i++) {
        let arr2 = jsonData2[i];

        for (let j = 0; j < arr2.length; j++) {
          let obj2 = arr2[j];
          if (obj2.type === '0' && Object.prototype.hasOwnProperty.call(obj2, 'value')) {
            if (Array.isArray(parms2) && Array.isArray(parms2[0]) && parms2[0][index2] !== undefined) {
              obj2.value = parms2[0][index2];
              index2++;
            }
          }
        }
      }

     
              for (let i = 0; i < jsonData2.length; i++) {
                let arr = jsonData2[i];

                for (let j = 0; j < arr.length; j++) {
                  let obj = arr[j];
                  if (obj.type === '0' && Object.prototype.hasOwnProperty.call(obj, 'value')) {
                    if (Array.isArray(parms) && Array.isArray(parms[0]) && parms[0][index] !== undefined) {
                      obj.value = parms[0][index];
                      index++;
                    }
                  }
                }
              }
      
      if (Array.isArray(fanzhuan2) && Array.isArray(fanzhuan2[0]) && fanzhuan2[0][0] !== undefined) {
        jsonData2[8][0]['value'] = fanzhuan2[0][0];
      }

      if (Array.isArray(xiaoche2) && Array.isArray(xiaoche2[0]) && xiaoche2[0][0] !== undefined) {
        jsonData2[9][0]['value'] = xiaoche2[0][0];
      }
    }
  

    if (Array.isArray(fanzhuan) && Array.isArray(fanzhuan[0]) && fanzhuan[0][0] !== undefined) {
      jsonData2[4][0]['value'] = fanzhuan[0][0];
    }
    if (Array.isArray(xiaoche) && Array.isArray(xiaoche[0]) && xiaoche[0][0] !== undefined) {
      jsonData2[3][0]['value'] = xiaoche[0][0];
    }
    if (Array.isArray(dache) && Array.isArray(dache[0]) && dache[0][0] !== undefined) {
      jsonData2[2][0]['value'] = dache[0][0];
    }

    let index2 = 0;
    for (let i = 5; i < jsonData2.length; i++) {
      let arr2 = jsonData2[i];

      for (let j = 0; j < arr2.length; j++) {
        let obj2 = arr2[j];
        if (obj2.type === '0' && Object.prototype.hasOwnProperty.call(obj2, 'value')) {
          if (Array.isArray(parms2) && Array.isArray(parms2[0]) && parms2[0][index2] !== undefined) {
            obj2.value = parms2[0][index2];
            index2++;
          }
        }
      }
    }

    // // 添加判断条件：如果光标在输入框内，则不执行后续逻辑
    // if (document.activeElement.tagName.toLowerCase() === 'input') {
    //   return;
    // }

    for (let i = 0; i < jsonData2.length; i++) {
      let arr = jsonData2[i];

      for (let j = 0; j < arr.length; j++) {
        let obj = arr[j];
        if (obj.type === '0' && Object.prototype.hasOwnProperty.call(obj, 'value')) {
          if (Array.isArray(parms) && Array.isArray(parms[0]) && parms[0][index] !== undefined) {
            obj.value = parms[0][index];
            index++;
          }
        }
      }
    }

    if (Array.isArray(fanzhuan2) && Array.isArray(fanzhuan2[0]) && fanzhuan2[0][0] !== undefined) {
      jsonData2[8][0]['value'] = fanzhuan2[0][0];
    }

    if (Array.isArray(xiaoche2) && Array.isArray(xiaoche2[0]) && xiaoche2[0][0] !== undefined) {
      jsonData2[9][0]['value'] = xiaoche2[0][0];
    }
  }
};






        // 关闭事件
        socket.onclose = function () {
          console.log("websocket已关闭");