From 31101f632c27c05d15f30ca3084e3ed3da2a29af Mon Sep 17 00:00:00 2001
From: wu <731351411@qq.com>
Date: 星期五, 08 十二月 2023 11:42:08 +0800
Subject: [PATCH] Merge branch 'master' of http://10.153.19.25:10101/r/CanadaMes

---
 CanadaMes-ui/src/views/Electrical/Parameter2.vue |  719 ++++++++++++++++++++++++++++++++++++++++-------------------
 1 files changed, 481 insertions(+), 238 deletions(-)

diff --git a/CanadaMes-ui/src/views/Electrical/Parameter2.vue b/CanadaMes-ui/src/views/Electrical/Parameter2.vue
index c18a80a..ad9df4b 100644
--- a/CanadaMes-ui/src/views/Electrical/Parameter2.vue
+++ b/CanadaMes-ui/src/views/Electrical/Parameter2.vue
@@ -1,239 +1,482 @@
-<template>
-    <div class="app">
-    <el-breadcrumb separator-class="el-icon-arrow-right" class="el-breadcrumb">
-        <router-link to="/Electrical/alarm" tag="el-button" type="text" active-class="blue-button">{{ $t('Alarm')
-        }}</router-link>
-        <router-link to="/Electrical/State" tag="el-button" type="text" active-class="blue-button">{{ $t('State')
-        }}</router-link>
-        <router-link to="/Electrical/Action" tag="el-button" type="text" active-class="blue-button">{{ $t('Action')
-        }}</router-link>
-        <router-link to="/Electrical/Parameter" tag="el-button" type="text" active-class="blue-button">{{ $t('Parameter')
-        }}</router-link>
-        <router-link to="/Electrical/Sign" tag="el-button" type="text" active-class="blue-button">{{ $t('Sign')
-        }}</router-link>
-         <router-link to="/Electrical/Servomanual" tag="el-button" type="text" active-class="blue-button">{{ $t('Servo Manual')
-        }}</router-link>
-      </el-breadcrumb>
-  
-      <el-breadcrumb separator-class="el-icon-arrow-right" class="el-breadcrumb">
-        <router-link to="/Electrical/Servomanualone" tag="el-button" type="text" active-class="blue-button">{{ $t('Servomanualone')
-        }}</router-link>
-          <router-link to="/Electrical/Parameter1" tag="el-button" type="text" active-class="blue-button">{{ $t('Parameter1')
-          }}</router-link>
-         <router-link to="/Electrical/Parameter2" tag="el-button" type="text" active-class="blue-button">{{ $t('Parameter2')
-          }}</router-link> 
-            <router-link to="/Electrical/Positioning1" tag="el-button" type="text" active-class="blue-button">{{ $t('Positioning1')
-          }}</router-link>
-            <router-link to="/Electrical/Positioning2" tag="el-button" type="text" active-class="blue-button">{{ $t('Positioning2')
-          }}</router-link>
-    </el-breadcrumb>
-  
-    <el-row :gutter="20">
-      <el-col :span="6" v-for="(dataGroup, groupIndex) in jsonData" :key="groupIndex">
-        <el-card class="json-block"  style="width:260px;">
-          <div class="button-row" style="display: flex; justify-content: space-between;">
-            <div v-for="(item, itemIndex) in dataGroup" :key="itemIndex">
-              <span v-if="item.title" :name="item.title.name" class="action-button" >{{ item.title.name }}</span>
-            </div>
-          </div>
-
-          <div class="button-row" style="display: flex; justify-content: space-between;">
-            <div v-for="(item, itemIndex) in dataGroup" :key="itemIndex">
-              <el-button v-if="item.button" :name="item.button.name" v-model="item.button.value" class="action-button"
-  @click="updateButtonValue(dataGroup, itemIndex);submitDataToBackend(item.button.name)"
-  :class="{ 'green-button': item.button.value === 0  && item.button.name !== '娓呴櫎ID','red-button': item.button.value === 1 && item.button.name !== '娓呴櫎ID' }">{{ item.button.name }}</el-button>
-            </div>
-          </div>
-          <div v-for="(item, itemIndex) in dataGroup" :key="itemIndex" class="item-container">
-            <div class="item-row">
-
-              <span class="name" style="width:150px;">{{ item.name }}</span>
-              <el-input v-if="item.type === '0'" v-model="item.value" readonly="readonly"    style="width:150px;" class="input-box"></el-input>
-            </div>
-          </div>
-        
-        </el-card>
-      </el-col>
-    </el-row>
-    <!-- <el-button @click="submitDataToBackend">鎻愪氦鏁版嵁鍒板悗绔�</el-button> -->
-  </div>
-  </template>
-  
-  <script>
-  import LanguageMixin from '../../lang/LanguageMixin'
-  import data from '../../configuration/parameter2'
-  let socket;
-  export default {
-  name: "Parameter2",
-  mixins: [LanguageMixin],
-  data() {
-    return {
-      jsonData: data ,
-
-      // 鍔犺浇鏁翠釜data.json鏂囦欢浣滀负jsonData
-    }
-  },
-  created () {
-    this.initWebSocket();
-    // console.log('jsonData:', this.jsonData); 
-
-  },
-  methods: {
-    updateButtonValue(dataGroup, itemIndex) {
-  // 灏嗗綋鍓嶆寜閽殑鍊艰涓�1
-
-    this.$set(dataGroup[itemIndex].button, 'value', 1);
-  
-
-  // 灏嗗叾浠栨寜閽殑鍊煎叏閮ㄨ涓�0
-
-},
-    submitDataToBackend(currentButtonName) {
-  if (currentButtonName === '娓呴櫎ID') {
-    const inputData = this.jsonData.map(dataGroup => {
-      return dataGroup.map(item => {
-        if (item.type === '3') {
-          return { value: item.button.value };
-        } 
-        return null;
-      });
-    });
-
-    const values = inputData.flat().filter(item => item !== null).map(item => item.value);
-
-    const jsonObject = { data: values };
- 
- // 鎻愪氦鏁版嵁鍒板悗绔�
- const jsonString = JSON.stringify(jsonObject);
-   console.log('Type涓�3鐨剉alue:', jsonString);
-     socket?.send(jsonString);
-  }
-},
-    initWebSocket () {
- 
-      let viewname = "Parameter2";
-
-      if (typeof WebSocket === "undefined") {
-        console.log("鎮ㄧ殑娴忚鍣ㄤ笉鏀寔WebSocket");
-      } else {
-        let socketUrl = "ws://" + "localhost:8888" + "/springboot-vue3/api/talk/" + viewname;
-
-        if (socket != null) {
-          socket.close();
-          socket = null;
-        }
-
-        // 寮�鍚竴涓獁ebsocket鏈嶅姟
-        socket = new WebSocket(socketUrl);
-
-        // 鎵撳紑浜嬩欢
-        socket.onopen = function () {
-          console.log("websocket宸叉墦寮�");
-        };
-
-        // 鏀跺埌娑堟伅
-        socket.onmessage = (msg) => {
-  if (!msg.data) {
-    return; // 濡傛灉鏀跺埌绌烘暟鎹紝鍒欑洿鎺ヨ繑鍥烇紝涓嶆墽琛屽悗缁�昏緫
-  }
-
-  let obj = JSON.parse(msg.data);
- 
-  const jsonData2 = this.jsonData;
- 
-      // 濡傛灉榧犳爣涓嶅湪杈撳叆妗嗗唴锛屾洿鏂拌緭鍏ユ鐨勫��
-      // this.submitDataToBackend()
-      const parms = obj.params;
-      // console.log(parms);
-
-      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') {
-      obj.value = parms[1][i];
-    }
-  }
-
-     
-}
-
-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 === '4') {
-      obj.button.value = parms[2][i];
-    }
-  }
-
-     
-}
-
-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 === '3') {
-      obj.button.value = parms[0][i];
-    }
-  }
-
-     
-}
-
-//  console.log(jsonData2);
-
-  
-};
-
-
-
-
-        // 鍏抽棴浜嬩欢
-        socket.onclose = function () {
-          console.log("websocket宸插叧闂�");
-        };
-
-        // 鍙戠敓閿欒浜嬩欢
-        socket.onerror = function () {
-          console.log("websocket鍙戠敓浜嗛敊璇�");
-        };
-
-      }
-    },
-    send () {
-     
-     
-      socket?.send(JSON.stringify(this.messagepack));
-    }
-
-  }
-  }
-  </script>
-  
-  <style scoped>
-  .item-row {
-  display: flex;
-  align-items: center;
-  margin-bottom: 5px; /* 璋冩暣姣忎釜椤圭洰涔嬮棿鐨勯棿璺� */
-  }
-  
-  .action-button {
-  margin-right: 30px;
-  background: #66b1ff;
-  color: #FFF;
-  }
-  .blue-button {
-  background-color: skyblue;
-}
-
-.green-button {
-  background-color: green;
-}
-
-.red-button{
-  background-color: red;
-}
-
+<template>
+    <div class="app">
+    <el-breadcrumb separator-class="el-icon-arrow-right" class="el-breadcrumb">
+        <router-link to="/Electrical/alarm" tag="el-button" type="text" active-class="blue-button">{{ $t('Alarm')
+        }}</router-link>
+        <router-link to="/Electrical/State" tag="el-button" type="text" active-class="blue-button">{{ $t('State')
+        }}</router-link>
+        <router-link to="/Electrical/Action" tag="el-button" type="text" active-class="blue-button">{{ $t('Action')
+        }}</router-link>
+        <!-- <router-link to="/Electrical/Parameter" tag="el-button" type="text" active-class="blue-button">{{ $t('Parameter')
+        }}</router-link> -->
+        <router-link to="/Electrical/Sign" tag="el-button" type="text" active-class="blue-button">{{ $t('Sign')
+        }}</router-link>
+         <router-link to="/Electrical/Servomanual" tag="el-button" type="text" active-class="blue-button">{{ $t('Parameter')
+        }}</router-link>
+      </el-breadcrumb>
+  
+      <el-breadcrumb separator-class="el-icon-arrow-right" class="el-breadcrumb">
+      <router-link to="/Electrical/Parameter2" tag="el-button" type="text" active-class="blue-button">{{ $t('Automatic State')
+      }}</router-link>
+      <router-link to="/Electrical/ManualJog" tag="el-button" type="text" active-class="blue-button">{{
+        $t('ManualJog')
+      }}</router-link>
+      
+       <router-link to="/Electrical/ManualonePosition" tag="el-button" type="text" active-class="blue-button">{{
+        $t('ManualonePosition')
+      }}</router-link>
+
+<router-link to="/Electrical/Servomanualone" tag="el-button" type="text" active-class="blue-button">{{
+        $t('Servomanualone')
+      }}</router-link>
+      <router-link to="/Electrical/Parameter1" tag="el-button" type="text" active-class="blue-button">{{ $t('Parameter1')
+      }}</router-link>
+     
+      <router-link to="/Electrical/Positioning1" tag="el-button" type="text" active-class="blue-button">{{
+        $t('Address parameter settings')
+      }}</router-link>
+      <router-link to="/Electrical/Positioning2" tag="el-button" type="text" active-class="blue-button">{{
+        $t('Positioning2')
+      }}</router-link>
+     
+      <router-link to="/Electrical/ManualonePosition2" tag="el-button" type="text" active-class="blue-button">{{
+        $t('ManualonePosition2')
+      }}</router-link>
+      <router-link to="/Electrical/AutomaticParameterSetting" tag="el-button" type="text" active-class="blue-button">{{
+        $t('Speed parameter settings')
+      }}</router-link>
+      
+    </el-breadcrumb>
+  
+    <el-row :gutter="40">
+      <el-col :span="6" v-for="(dataGroup, groupIndex) in jsonData" :key="groupIndex"   style="margin-bottom: -20px;">
+        <el-card class="json-block"  style="width:300px;margin-bottom: 2px;">
+          <div class="button-row" style="display: flex; justify-content: space-between;">
+            <div v-for="(item, itemIndex) in dataGroup" :key="itemIndex">
+              <span v-if="item.title" :name="item.title.name" class="action-button" >{{ item.title.name }}</span>
+            </div>
+          </div>
+
+          <div class="button-row" style="display: flex; justify-content: space-between;">
+            <div v-for="(item, itemIndex) in dataGroup" :key="itemIndex">
+              <el-button v-if="item.button && language==='en-US'" :name="item.button.name" v-model="item.button.value" class="action-button"
+  @click="updateButtonValue(dataGroup, itemIndex);submitDataToBackend(item.button.name)"
+  :class="{ 'green-button':  (item.button.value === 0  && item.button.name !==  'Clear ID' ) ,'red-button': item.button.value === 2 && (item.button.name !==  'Clear ID' ) ,'yellow-button': item.button.value === 1 && (item.button.name !==  'Clear ID' ),'id': item.button.value === 1 && (item.button.name ==  'Clear ID' ) }">{{ item.button.name }}</el-button>
+           
+
+  <el-button v-if="item.button && language==='zh-CN'" :name="item.button.name" v-model="item.button.value" class="action-button"
+  @click="updateButtonValue(dataGroup, itemIndex);submitDataToBackend(item.button.name)"
+  :class="{ 'green-button':  (item.button.value === 0  && item.button.name !==  '娓呴櫎ID' ) ,'red-button': item.button.value === 2 && (item.button.name !==  '娓呴櫎ID' ) ,'yellow-button': item.button.value === 1 && (item.button.name !==  '娓呴櫎ID' ),'id': item.button.value === 1 && (item.button.name ==  '娓呴櫎ID' ) }">{{ item.button.name }}</el-button>
+
+</div>
+          </div>
+          <div v-for="(item, itemIndex) in dataGroup" :key="itemIndex" class="item-container">
+            <div class="item-row">
+
+              
+              <span class="name" v-if="groupIndex === 12" style="width:250px;">{{ item.name }}</span>
+              <span class="name" v-else style="width:150px;">{{ item.name }}</span>
+      
+              <el-input v-if="item.type === '0'" v-model="item.value" readonly="readonly"     style="width:300px;" class="input-box"></el-input>
+             
+             
+            
+            </div>
+          </div>
+        
+        </el-card>
+      </el-col>
+    </el-row>
+    <!-- <el-button @click="submitDataToBackend">鎻愪氦鏁版嵁鍒板悗绔�</el-button> -->
+  </div>
+  </template>
+  
+  <script>
+  import LanguageMixin from '../../lang/LanguageMixin'
+  import data from '../../configuration/parameter2'
+  // import { throttle } from 'lodash';
+  let socket;
+
+  // window.onload=function(){
+  //   console.log("44");
+  // }
+  export default {
+    destroyed() {
+    socket.close();
+  },
+  name: "Parameter2",
+  mixins: [LanguageMixin],
+  data() {
+    return {
+      jsonData: data ,
+      inputValue: '',
+      language:this.$i18n.locale,
+
+      // 鍔犺浇鏁翠釜data.json鏂囦欢浣滀负jsonData
+    }
+  },
+ 
+  activated(){
+   
+    this.initWebSocket ();
+    this.filteredData();
+   const language = this.$i18n.locale;
+  console.log(language);
+  if (language === 'en-US') {
+    this.replaceChineseWithEnglish();
+  }
+  this.$forceUpdate();
+  },
+  
+  
+    computed: {
+
+ 
+},
+
+
+
+  methods: {
+    filteredData() {
+    return this.jsonData.map(item => {
+      const filteredValue = item.map(obj => {
+        if (typeof obj.button !== 'undefined' && typeof obj.button.value !== 'undefined') {
+          obj.button.value = obj.button.value.toString().replace(/[^a-zA-Z0-9]/g, '');
+        } else if (typeof obj.value !== 'undefined') {
+          obj.value = obj.value.toString().replace(/[^a-zA-Z0-9]/g, '');
+        }
+        return obj;
+      });
+      return filteredValue;
+    });
+  },
+  
+  updateButtonValue(dataGroup, itemIndex) {
+  if (dataGroup[itemIndex].button.value === 0) {
+    // 濡傛灉褰撳墠鎸夐挳鐨勫�兼槸 0锛屽皢鍏惰涓� 1
+    this.$set(dataGroup[itemIndex].button, 'value', 1);
+  } else {
+    // 鍚﹀垯灏嗗叾璁句负 0
+    this.$set(dataGroup[itemIndex].button, 'value', 0);
+  }
+},
+    submitDataToBackend(currentButtonName) {
+
+
+
+  if (currentButtonName === '娓呴櫎ID'  || currentButtonName === 'Clear ID' ) {
+  const data2 = [];
+  const resetButtonValues = this.jsonData.map(item => {
+    const buttonItem = item.find(subItem => subItem.button && ['娓呴櫎ID', 'Clear ID'].includes(subItem.button.name));
+
+    
+    return buttonItem ? buttonItem.button.value : null;
+  }).filter(value => value !== null);
+
+  // 灏嗗緱鍒扮殑鍊兼坊鍔犲埌 data 鏁扮粍涓�
+  data2.push(resetButtonValues.flat());
+  data2.push([]);
+  // 鍦� data2 鏁扮粍鍓嶉潰娣诲姞涓や釜绌烘暟缁�
+ 
+
+  // 鍒涘缓 jsonObject2 瀵硅薄锛屽苟娣诲姞 data2 灞炴��
+  const jsonObject2 = { data: data2 };
+
+  // 鎻愪氦鏁版嵁鍒板悗绔�
+  const jsonString2 = JSON.stringify(jsonObject2);
+  console.log('鎵�鏈塗ype涓�0鐨剉alue:', jsonString2);
+  socket?.send(jsonString2);
+ 
+ 
+}
+
+if (currentButtonName === 'Abort/ResumeTasks' || currentButtonName === '鎬ュ仠鍚庝腑姝�/缁х画閫夋嫨') {
+  const data3 = [];
+  const resetButtonValues3 = [this.jsonData[13][0].button.value];
+ 
+  // 灏嗗緱鍒扮殑鍊兼坊鍔犲埌 data 鏁扮粍涓�
+  data3.push(resetButtonValues3.flat());
+  data3.unshift([]);
+  // 鍦� data3 鏁扮粍鍓嶉潰娣诲姞涓や釜绌烘暟缁�
+  
+
+
+  // 鍒涘缓 jsonObject3 瀵硅薄锛屽苟娣诲姞 data3 灞炴��
+  const jsonObject3 = { data: data3 };
+
+  // 鎻愪氦鏁版嵁鍒板悗绔�
+  const jsonString3 = JSON.stringify(jsonObject3);
+  console.log('鎬ュ仠鍚庝腑姝�/缁х画閫夋嫨:', jsonString3);
+  socket?.send(jsonString3);
+  // setTimeout(()=>
+  //   window.location.reload(),2000
+  // )
+}
+
+
+
+
+
+
+},
+    initWebSocket () {
+ 
+      let viewname = "Parameter2";
+
+      if (typeof WebSocket === "undefined") {
+        console.log("鎮ㄧ殑娴忚鍣ㄤ笉鏀寔WebSocket");
+      } else {
+        let socketUrl = "ws://" + this.$t('ip')+":8888" + "/springboot-vue3/api/talk/" + viewname;
+
+        if (socket != null) {
+          socket.close();
+          socket = null;
+        }
+
+        // 寮�鍚竴涓獁ebsocket鏈嶅姟
+        socket = new WebSocket(socketUrl);
+
+        // 鎵撳紑浜嬩欢
+        socket.onopen = function () {
+          console.log("websocket宸叉墦寮�");
+        };
+
+        // 鏀跺埌娑堟伅
+        socket.onmessage = (msg) => {
+  if (!msg.data) {
+    return; // 濡傛灉鏀跺埌绌烘暟鎹紝鍒欑洿鎺ヨ繑鍥烇紝涓嶆墽琛屽悗缁�昏緫
+  }
+
+  let obj = JSON.parse(msg.data);
+ 
+  const jsonData2 = this.jsonData;
+
+      const parms = obj.params;
+
+   
+  //  console.log(obj);
+
+
+
+  // const handleMouseMove = throttle(function(event) {
+  // const inputBox = document.querySelectorAll('.id');
+  // const target = event.target;
+
+  // if (parms && inputBox && Array.from(inputBox).every(box => !box.contains(target))) {
+//鎬ュ仠鎸夐挳
+    jsonData2[13][0].button.value = obj.jiting[0][0];
+
+
+    //娓呴櫎id
+
+      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 === '3') {
+      obj.button.value = parms[0][i];
+      // console.log(obj.button.value);
+    }
+  }
+
+     
+}
+
+//ID
+const specialChars = /[^\w\s]/g; // 姝e垯琛ㄨ揪寮忓尮閰嶉潪瀛楁瘝銆佹暟瀛椼�佷笅鍒掔嚎鍜岀┖鏍肩殑瀛楃
+
+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') {
+  if (parms[1] && parms[1][i]) {
+    obj.value = parms[1][i].replace(specialChars, '');
+    // console.log(obj.value);
+  }
+  if (obj.name === 'ID2') {
+        obj.value = parms[1][7].replace(specialChars, ''); // 灏咺D2瀵瑰簲鐨勫�艰祴涓簆arms[1][6]
+      }
+
+      if (obj.name === 'A02ID') {
+        obj.value = parms[1][8].replace(specialChars, ''); // 灏咺D2瀵瑰簲鐨勫�艰祴涓簆arms[1][6]
+      }
+      if (obj.name === 'B01ID') {
+        obj.value = parms[1][9].replace(specialChars, ''); // 灏咺D2瀵瑰簲鐨勫�艰祴涓簆arms[1][6]
+      }
+      if (obj.name === 'B02ID') {
+        obj.value = parms[1][10].replace(specialChars, ''); // 灏咺D2瀵瑰簲鐨勫�艰祴涓簆arms[1][6]
+      }
+
+
+}
+
+  }
+}
+
+//鎵嬪姩鐘舵��
+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 === '4') {
+      obj.button.value = parms[2][i];
+    }
+  }
+
+     
+}
+//鏀瑰彉鐘舵�佹枃瀛�
+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 === '4' && obj.button.value===1) {
+      if ( obj.button.name.includes("鐘舵��")&& this.language==="zh-CN") {
+      obj.button.name =obj.button.name.replace("鎵嬪姩","鑷姩") ;
+    }
+    if ( obj.button.name.includes("Status")) {
+      obj.button.name =obj.button.name.replace("Manual","Auto") ;
+    }
+  }
+
+     
+}
+}
+//鎵弿鏋壂鐮佺殑ID
+
+jsonData2.forEach((item) => {
+  item.forEach((subItem) => {
+    if (subItem.read === 66) {
+      subItem.value = parms[3][0].replace(specialChars, ''); 
+    }
+  });
+});
+
+jsonData2.forEach((item) => {
+  item.forEach((subItem) => {
+    if (subItem.read === 666) {
+      subItem.value = parms[3][1].replace(specialChars, ''); 
+    }
+  });
+});
+
+
+
+//A01褰撳墠鏍煎瓙
+let lastParmsArray = parms[parms.length - 1];
+
+let lastParmsIndex = 0;
+
+for (let i = 0; i < jsonData2.length; i++) {
+    for (let j = 0; j < jsonData2[i].length; j++) {
+        if (jsonData2[i][j].read === 333) {
+            jsonData2[i][j].value = lastParmsArray[lastParmsIndex];
+            lastParmsIndex++;
+            if (lastParmsIndex === lastParmsArray.length) {
+                lastParmsIndex = 0;
+            }
+        }
+    }
+}
+
+
+
+
+  }
+//  console.log(jsonData2);
+// }, 50);
+        
+// document.addEventListener('mouseover', handleMouseMove);
+  
+// };
+
+
+
+
+        // 鍏抽棴浜嬩欢
+        socket.onclose = function () {
+          console.log("websocket宸插叧闂�");
+        };
+
+        // 鍙戠敓閿欒浜嬩欢
+        socket.onerror = function () {
+          console.log("websocket鍙戠敓浜嗛敊璇�");
+        };
+       
+        this.$router.afterEach(function(){
+          socket.close();
+        })
+
+      }
+    },
+    replaceChineseWithEnglish() {
+ 
+   
+ const nameMap=  this.$t('langParameter2')
+ this.jsonData = this.jsonData.map((item) => {
+return item.map((obj) => {
+if (obj.name) {
+ const newName = nameMap[obj.name] || obj.name;
+ return { ...obj, name: newName };
+} else if (obj.button && obj.button.name) {
+ const newName = nameMap[obj.button.name] || obj.button.name;
+ return { ...obj, button: { ...obj.button, name: newName } };
+} else {
+ return obj;
+}
+});
+});
+
+
+// console.log(this.jsonData)
+
+},
+    send () {
+     
+     
+      socket?.send(JSON.stringify(this.messagepack));
+    }
+
+  }
+  }
+  </script>
+  
+  <style scoped>
+  html,body{
+width:100%;
+height:85%;
+
+}
+  .item-row {
+  display: flex;
+  align-items: center;
+  margin-bottom: 5px; /* 璋冩暣姣忎釜椤圭洰涔嬮棿鐨勯棿璺� */
+  }
+  
+  .action-button {
+  margin-right: 30px;
+  background: #66b1ff;
+  color: #FFF;
+  }
+  .blue-button {
+  background-color: skyblue;
+}
+
+.green-button {
+  background-color: green;
+}
+
+.red-button{
+  background-color: red;
+}
+.yellow-button{
+  background-color: blue;
+}
+.id{
+
+  background-color: green;
+}
+
   </style>
\ No newline at end of file

--
Gitblit v1.8.0