| | |
| | | </el-row> |
| | | <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': true, 'error-button': item.button.name === 'Fault' && item.button.value === 1,'error-button2': item.button.name === 'NotZero' && item.button.value === 0,'fuwei': item.button.name === 'Reset' && item.button.value === 1,'qidong': item.button.name === 'A01 Semi-Auto' && item.button.value === 1,'qidong2': item.button.name === 'A02 Semi-Auto' && item.button.value === 1}" @click="updateButtonValue(dataGroup, itemIndex); submitDataToBackend(item.button.name);">{{ 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': true, 'error-button': item.button.name === '故障' && item.button.value === 1,'error-button2': item.button.name === '未回零' && item.button.value === 0,'fuwei': item.button.name === '复位' && item.button.value === 1,'qidong': item.button.name === 'A01半自动' && item.button.value === 1,'qidong2': item.button.name === 'A02半自动' && item.button.value === 1 }" @click="updateButtonValue(dataGroup, itemIndex); submitDataToBackend(item.button.name);">{{ item.button.name }}</el-button> |
| | | <el-button v-if="item.button && language === 'en-US' " :name="item.button.name" v-model="item.button.value" :class="{'action-button': true, 'error-button': item.button.name === 'Fault' && item.button.value === 1,'error-button2': item.button.name === 'NotZero' && item.button.value === 0,'fuwei': item.button.name === 'Reset' && item.button.value === 1,'huiling': item.button.name === 'Home' && item.button.value === 1,'qidong': item.button.name === 'A01 Semi-Auto' && item.button.value === 1,'qidong2': item.button.name === 'A02 Semi-Auto' && item.button.value === 1,'qidong3': item.button.name === 'A01 Semi-Auto Start' && item.button.value === 1,'qidong4': item.button.name === 'A02 Semi-Auto Start' && item.button.value === 1,'qidong5': item.button.name === 'A02 Semi-Auto Start' && item.button.value === 1}" @click="updateButtonValue(dataGroup, itemIndex); submitDataToBackend(item.button.name);">{{ 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': true, 'error-button': item.button.name === '故障' && item.button.value === 1,'error-button2': item.button.name === '未回零' && item.button.value === 0,'fuwei': item.button.name === '复位' && item.button.value === 1,'huiling': item.button.name === '回零' && item.button.value === 1,'qidong': item.button.name === 'A01半自动' && item.button.value === 1,'qidong2': item.button.name === 'A02半自动' && item.button.value === 1,'qidong3': item.button.name === 'A01半自动启动' && item.button.value === 1,'qidong4': item.button.name === 'A02半自动启动' && item.button.value === 1,'qidong5': item.button.name === 'A02半自动' && item.button.value === 1 }" @click="updateButtonValue(dataGroup, itemIndex); submitDataToBackend(item.button.name);">{{ item.button.name }}</el-button> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | |
| | | |
| | | this.initWebSocket(); |
| | | const language = this.$i18n.locale; |
| | | console.log(language); |
| | | // console.log(language); |
| | | if (language === 'en-US') { |
| | | this.replaceChineseWithEnglish(); |
| | | } |
| | |
| | | } |
| | | }, |
| | | submitDataToBackend(currentButtonName) { |
| | | |
| | | //A01半自动启动提交 |
| | | if (currentButtonName === 'A01半自动启动' ||currentButtonName === 'A01 Semi-Auto Start') { |
| | | const data = []; |
| | | |
| | |
| | | socket?.send(jsonString); |
| | | |
| | | } |
| | | //A02半自动启动 提交 |
| | | |
| | | if (currentButtonName === 'A02半自动启动' ||currentButtonName === 'A02 Semi-Auto Start') { |
| | | const data2 = []; |
| | |
| | | |
| | | } |
| | | |
| | | //复位提交 |
| | | |
| | | if (currentButtonName === '复位' || currentButtonName === 'Reset') { |
| | | const data2 = []; |
| | | const resetButtonValues = this.jsonData.map(item => { |
| | |
| | | // ) |
| | | |
| | | } |
| | | |
| | | ////回零提交 |
| | | if (currentButtonName === '回零' || currentButtonName === 'Home') { |
| | | const data3 = []; |
| | | const resetButtonValues3 = this.jsonData.map(item => { |
| | |
| | | } |
| | | |
| | | |
| | | |
| | | //A01半自动提交 |
| | | |
| | | if (currentButtonName === 'A01半自动' || currentButtonName === 'A01 Semi-Auto' ) { |
| | | const elements = document.getElementsByClassName('special-class'); |
| | |
| | | |
| | | |
| | | if (currentButtonName === 'A02半自动' || currentButtonName === 'A02 Semi-Auto' ) { |
| | | // 获取所有class为special-class2的元素 |
| | | const elements = document.getElementsByClassName('special-class2'); |
| | | |
| | | const data = []; |
| | | // 遍历所有元素 |
| | | for (let i = 0; i < elements.length; i++) { |
| | | // 如果元素隐藏 |
| | | if (elements[i].style.display === 'none') { |
| | | // 显示元素 |
| | | elements[i].style.display = ''; // 显示元素 |
| | | this.zhi2=1; |
| | | // 遍历jsonData |
| | | for (let i = 0; i < this.jsonData.length; i++) { |
| | | let arr = this.jsonData[i]; |
| | | // 遍历arr |
| | | for (let j = 0; j < arr.length; j++) { |
| | | let obj2 = arr[j]; |
| | | // 如果button的name为A02半自动或者A02 Semi-Auto |
| | | if (obj2.button && (obj2.button.name === "A02半自动" || obj2.button.name === "A02 Semi-Auto")) { |
| | | // 设置button的value为1 |
| | | obj2.button.value = 1; |
| | | // console.log(obj2.button.value) |
| | | } |
| | |
| | | } |
| | | |
| | | }else{ |
| | | // 如果元素显示 |
| | | elements[i].style.display = 'none'; |
| | | this.zhi2=0; |
| | | // 遍历jsonData |
| | | for (let i = 0; i < this.jsonData.length; i++) { |
| | | let arr = this.jsonData[i]; |
| | | // 遍历arr |
| | | for (let j = 0; j < arr.length; j++) { |
| | | let obj2 = arr[j]; |
| | | // 如果button的name为A02半自动或者A02 Semi-Auto |
| | | if (obj2.button && (obj2.button.name === "A02半自动" || obj2.button.name === "A02 Semi-Auto")) { |
| | | // 设置button的value为0 |
| | | obj2.button.value = 0; |
| | | // console.log(obj2.button.value) |
| | | } |
| | |
| | | } |
| | | } |
| | | |
| | | // 将zhi2添加到data数组中 |
| | | data.push([this.zhi2]); |
| | | |
| | | // 将data数组添加到jsonObject中 |
| | | data.unshift([],[],[],[],[],[],[]); |
| | | |
| | | |
| | |
| | | socket.close(); |
| | | socket = null; |
| | | } |
| | | |
| | | // 开启一个websocket服务 |
| | | socket = new WebSocket(socketUrl); |
| | | |
| | |
| | | const handleMouseMove = throttle(function(event) { |
| | | const inputBox = document.querySelectorAll('.el-card__body'); |
| | | const target = event.target; |
| | | if (inputBox && Array.from(inputBox).every(box => !box.contains(target))) { |
| | | if (obj.zuhe1 && inputBox && Array.from(inputBox).every(box => !box.contains(target))) { |
| | | |
| | | //启动按钮 |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | jsonData2[0][9].button.value = obj.qidong[0][0]; // 第一个子数组中第一个 type=66 的 button |
| | | jsonData2[0][10].button.value = obj.qidong[0][1]; // 第一个子数组中第二个 type=66 的 button |
| | | jsonData2[1][7].button.value = obj.qidong[0][2]; // 第二个子数组中第一个 type=66 的 button |
| | | jsonData2[1][8].button.value = obj.qidong[0][3]; |
| | | |
| | | |
| | | |
| | | // 输出更新后的 jsonData2 |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | // 执行更新逻辑 |
| | | for (let i = 0; i < 6; i++) { |
| | | jsonData2[i].forEach((item, index) => { |
| | |
| | | } |
| | | |
| | | |
| | | |
| | | //故障更新 |
| | | |
| | | for (let i = 0; i < jsonData2.length; i++) { |
| | | let arr = jsonData2[i]; |
| | |
| | | |
| | | } |
| | | |
| | | |
| | | // 复位更新 |
| | | for (let i = 0; i < jsonData2.length; i++) { |
| | | let arr = jsonData2[i]; |
| | | for (let j = 0; j < arr.length; j++) { |
| | |
| | | |
| | | |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | //未回零更新 |
| | | |
| | | for (let i = 3; i < jsonData2.length; i++) { |
| | | let arr2 = jsonData2[i]; |
| | |
| | | |
| | | } |
| | | // console.log(jsonData2) |
| | | //进片id |
| | | jsonData2.forEach((item) => { |
| | | item.forEach((subItem) => { |
| | | if (subItem.read === 9999) { |
| | |
| | | } |
| | | }); |
| | | }); |
| | | |
| | | //取片id |
| | | jsonData2.forEach((item) => { |
| | | item.forEach((subItem) => { |
| | | if (subItem.read === 8888) { |
| | |
| | | } |
| | | }); |
| | | }); |
| | | //急停 |
| | | |
| | | |
| | | for (let i = 0; i < jsonData2.length; i++) { |
| | | let arr2 = jsonData2[i]; |
| | | for (let j = 0; j < arr2.length; j++) { |
| | | let obj3 = arr2[j]; |
| | | if(obj3.button){ |
| | | if (obj3.button && (obj3.button.name === "急停后中止/继续选择" || obj3.button.name === "Abort/ResumeTasks" )) { |
| | | obj3.button.value = obj.resumeTasks[0][i]; |
| | | console.log(obj3.button.value) |
| | | } |
| | | |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | |
| | | |
| | | socket?.send(JSON.stringify(this.messagepack)); |
| | | }, |
| | | //替换语言 |
| | | replaceChineseWithEnglish() { |
| | | |
| | | |
| | |
| | | </script> |
| | | |
| | | <style scoped> |
| | | html,body{ |
| | | width:100%; |
| | | height:85%; |
| | | |
| | | } |
| | | |
| | | .item-row { |
| | | display: flex; |
| | |
| | | background-color: green; |
| | | } |
| | | |
| | | .qidong2 { |
| | | .qidong3 { |
| | | background-color: green; |
| | | } |
| | | .qidong { |
| | | background-color: green; |
| | | } |
| | | |
| | | .qidong4 { |
| | | background-color: green; |
| | | } |
| | | |
| | | |
| | | .qidong5 { |
| | | background-color: green; |
| | | } |
| | | |
| | | .huiling { |
| | | background-color: green; |
| | | } |
| | | </style> |