| | |
| | | active-class="blue-button" |
| | | >{{ $t("State") }}</router-link |
| | | > |
| | | <router-link |
| | | <!-- <router-link |
| | | to="/Electrical/Action" |
| | | tag="el-button" |
| | | type="text" |
| | | active-class="blue-button" |
| | | >{{ $t("Action") }}</router-link |
| | | > |
| | | >{{ $t("Action") }}</router-link --> |
| | | |
| | | <!-- <router-link to="/Electrical/Parameter" tag="el-button" type="text" active-class="blue-button">{{ $t('Parameter') |
| | | }}</router-link> --> |
| | | <router-link |
| | |
| | | active-class="blue-button" |
| | | >{{ $t("Automatic State") }}</router-link |
| | | > |
| | | <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" |
| | |
| | | >{{ $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 v-if="hasPermission" to="/Electrical/Servomanualone" tag="el-button" type="text" active-class="blue-button"> |
| | | {{ $t('Servomanualone') }} |
| | | </router-link> |
| | | |
| | | |
| | | <router-link v-if="hasPermission" to="/Electrical/Positioning1" tag="el-button" type="text" active-class="blue-button">{{ |
| | | $t('Address parameter settings') |
| | | }}</router-link> |
| | | |
| | | <router-link v-if="hasPermission" to="/Electrical/AutomaticParameterSetting" tag="el-button" type="text" active-class="blue-button">{{ |
| | | $t('Speed parameter settings') |
| | | }}</router-link> |
| | | |
| | | <router-link |
| | | to="/Electrical/Positioning1" |
| | | <router-link v-if="hasPermission" |
| | | to="/Electrical/InteractionState" |
| | | 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 |
| | | >{{ $t("InteractionState") }}</router-link |
| | | > |
| | | </el-breadcrumb> |
| | | |
| | |
| | | :span="6" |
| | | v-for="(dataGroup, groupIndex) in jsonData" |
| | | :key="groupIndex" |
| | | |
| | | style="margin-bottom: -20px;" |
| | | style="margin-bottom: -20px" |
| | | > |
| | | <el-card class="json-block" style="width: 300px; margin-bottom: 2px"> |
| | | <el-card class="json-block" style="width: 300px; margin-bottom: 2px;height:200px" :height="groupIndex === 12 ? '190px' : '170px'" > |
| | | <div |
| | | class="button-row" |
| | | style="display: flex; justify-content: space-between" |
| | |
| | | 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', |
| | | 'id': |
| | | item.button.value === 1 && item.button.name === 'Clear ID', |
| | | 'A01jiting':item.button.value === 0 && item.button.name === 'A01Abort/ResumeTasks', |
| | | 'A02jiting':item.button.value === 0 && item.button.name === 'A02Abort/ResumeTasks', |
| | | 'emgHMI':item.button.value === 0 && item.button.name === 'emgHMI', |
| | | 'GA01jiting':item.button.value ===1 && item.button.name === 'A01Abort/ResumeTasks', |
| | | 'GA02jiting':item.button.value === 1 && item.button.name === 'A02Abort/ResumeTasks', |
| | | 'GemgHMI':item.button.value === 1 && item.button.name === 'emgHMI' |
| | | |
| | | }" |
| | | >{{ item.button.name }}</el-button |
| | | > |
| | |
| | | 'yellow-button': |
| | | item.button.value === 1 && item.button.name !== '清除ID', |
| | | 'id': item.button.value === 1 && item.button.name === '清除ID', |
| | | 'A01jiting':item.button.value === 0 && item.button.name === 'A01终止/继续', |
| | | 'A02jiting':item.button.value === 0 && item.button.name === 'A02终止/继续', |
| | | 'emgHMI':item.button.value === 0 && item.button.name === '软急停', |
| | | 'GA01jiting':item.button.value === 1 && item.button.name === 'A01终止/继续', |
| | | 'GA02jiting':item.button.value === 1 && item.button.name === 'A02终止/继续', |
| | | 'GemgHMI':item.button.value === 1 && item.button.name === '软急停' |
| | | |
| | | }" |
| | | >{{ item.button.name }}</el-button |
| | | > |
| | |
| | | <span |
| | | class="name" |
| | | v-if="groupIndex === 12" |
| | | style="width: 250px" |
| | | style="width: 350px" |
| | | >{{ item.name }}</span |
| | | > |
| | | <span class="name" v-else style="width: 150px">{{ |
| | | item.name |
| | | }}</span> |
| | | |
| | | <el-input |
| | | v-if="item.type === '0' && groupIndex==15" |
| | | v-model="item.value" |
| | | @keyup.enter.native="timeout($event)" |
| | | style="width: 300px" |
| | | class="input-box2" |
| | | ></el-input> |
| | | <el-input |
| | | v-if="item.type === '0'" |
| | | v-else-if="item.type === '0' " |
| | | v-model="item.value" |
| | | readonly="readonly" |
| | | style="width: 300px" |
| | |
| | | <script> |
| | | import LanguageMixin from "../../lang/LanguageMixin"; |
| | | import data from "../../configuration/parameter2"; |
| | | import { |
| | | SelectPermissionByUserName, currentUsername |
| | | } from "../../api/home"; |
| | | // import { throttle } from 'lodash'; |
| | | let socket; |
| | | |
| | |
| | | jsonData: data, |
| | | inputValue: "", |
| | | language: this.$i18n.locale, |
| | | |
| | | |
| | | hasPermission: false // 默认没有权限 |
| | | |
| | | // 加载整个data.json文件作为jsonData |
| | | }; |
| | |
| | | this.replaceChineseWithEnglish(); |
| | | } |
| | | this.$forceUpdate(); |
| | | currentUsername().then(res => { |
| | | SelectPermissionByUserName(res.data).then(res => { |
| | | res.data.permission.forEach(item => { |
| | | if (item.permissionId == "36" && item.state == 1) { |
| | | this.hasPermission = true; |
| | | } |
| | | |
| | | }); |
| | | }); |
| | | |
| | | }); |
| | | }, |
| | | |
| | | computed: {}, |
| | |
| | | }, |
| | | |
| | | updateButtonValue(dataGroup, itemIndex) { |
| | | if (dataGroup[itemIndex].button.value === 1) { |
| | | // 如果当前按钮的值是 0,将其设为 1 |
| | | this.$set(dataGroup[itemIndex].button, 'value', 0); |
| | | } else { |
| | | // 否则将其设为 0 |
| | | this.$set(dataGroup[itemIndex].button, 'value', 1); |
| | | } |
| | | }, |
| | | if (dataGroup[itemIndex].button.value2 === 1) { |
| | | // 如果当前按钮的值是 0,将其设为 1 |
| | | this.$set(dataGroup[itemIndex].button, "value2", 0); |
| | | } else { |
| | | // 否则将其设为 0 |
| | | this.$set(dataGroup[itemIndex].button, "value2", 1); |
| | | } |
| | | }, |
| | | //范围 0-100 |
| | | timeout(event){ |
| | | |
| | | |
| | | const data3 = []; |
| | | const resetButtonValues3 = [this.jsonData[15][0].value]; |
| | | |
| | | if (resetButtonValues3.length > 0) { |
| | | |
| | | let firstValue = resetButtonValues3[0]; |
| | | if (!(firstValue >= "0" && firstValue <= "100")) { |
| | | resetButtonValues3.shift(); |
| | | this.$message.error("Out of range"); |
| | | |
| | | return false; |
| | | } |
| | | } |
| | | |
| | | // 将得到的值添加到 data 数组中 |
| | | data3.push(resetButtonValues3.flat()); |
| | | data3.unshift([],[]); |
| | | // 在 data3 数组前面添加两个空数组 |
| | | |
| | | // 创建 jsonObject3 对象,并添加 data3 属性 |
| | | const jsonObject3 = { data: data3 }; |
| | | |
| | | // 提交数据到后端 |
| | | const jsonString3 = JSON.stringify(jsonObject3); |
| | | console.log("Storage wait delay:", jsonString3); |
| | | socket?.send(jsonString3); |
| | | // setTimeout(()=> |
| | | // window.location.reload(),2000 |
| | | // ) |
| | | event.target.blur(); // 取消输入框焦点 |
| | | }, |
| | | |
| | | |
| | | |
| | | submitDataToBackend(currentButtonName) { |
| | | if (currentButtonName === "清除ID" || currentButtonName === "Clear ID") { |
| | | const data2 = []; |
| | |
| | | ["清除ID", "Clear ID"].includes(subItem.button.name) |
| | | ); |
| | | |
| | | return buttonItem ? buttonItem.button.value : null; |
| | | return buttonItem ? buttonItem.button.value2 : null; |
| | | }) |
| | | .filter((value) => value !== null); |
| | | .filter((value2) => value2 !== null); |
| | | |
| | | // 将得到的值添加到 data 数组中 |
| | | data2.push(resetButtonValues.flat()); |
| | | data2.push([]); |
| | | data2.push([],[]); |
| | | // 在 data2 数组前面添加两个空数组 |
| | | |
| | | // 创建 jsonObject2 对象,并添加 data2 属性 |
| | |
| | | const jsonString2 = JSON.stringify(jsonObject2); |
| | | console.log("所有Type为0的value:", jsonString2); |
| | | socket?.send(jsonString2); |
| | | |
| | | // 延迟2秒发送指定内容 |
| | | setTimeout(() => { |
| | | const jsonObject = { data: [[0, 0, 0, 0, 0, 0, 0, 0, 0, 0], [], []] }; |
| | | const jsonString = JSON.stringify(jsonObject); |
| | | console.log("发送的内容:", jsonString); |
| | | socket?.send(jsonString); |
| | | }, 1000); |
| | | |
| | | } |
| | | |
| | | if ( |
| | | currentButtonName === "Abort/ResumeTasks" || |
| | | currentButtonName === "急停后中止/继续选择" |
| | | currentButtonName === "A01Abort/ResumeTasks" || |
| | | currentButtonName === "A01终止/继续" || |
| | | currentButtonName === "A02Abort/ResumeTasks" || |
| | | currentButtonName === "A02终止/继续" || |
| | | currentButtonName === "软急停" || |
| | | currentButtonName === "emgHMI" |
| | | ) { |
| | | const data3 = []; |
| | | const resetButtonValues3 = [this.jsonData[13][0].button.value]; |
| | | const resetButtonValues3 = [this.jsonData[13][0].button.value2,this.jsonData[14][0].button.value2,this.jsonData[16][0].button.value2]; |
| | | |
| | | // 将得到的值添加到 data 数组中 |
| | | data3.push(resetButtonValues3.flat()); |
| | | data3.unshift([]); |
| | | data3.push([]); |
| | | // 在 data3 数组前面添加两个空数组 |
| | | |
| | | // 创建 jsonObject3 对象,并添加 data3 属性 |
| | |
| | | const jsonString3 = JSON.stringify(jsonObject3); |
| | | console.log("急停后中止/继续选择:", jsonString3); |
| | | socket?.send(jsonString3); |
| | | |
| | | setTimeout(() => { |
| | | const jsonObject = { data: [ [],[0, 0, 0], []] }; |
| | | const jsonString = JSON.stringify(jsonObject); |
| | | console.log("发送的回弹内容:", jsonString); |
| | | socket?.send(jsonString); |
| | | }, 1000); |
| | | |
| | | |
| | | |
| | | // setTimeout(()=> |
| | | // window.location.reload(),2000 |
| | | // ) |
| | | } |
| | | |
| | | |
| | | }, |
| | | |
| | | |
| | | initWebSocket() { |
| | | let viewname = "Parameter2"; |
| | | |
| | |
| | | socket.onopen = function () { |
| | | console.log("websocket已打开"); |
| | | }; |
| | | |
| | | // let isMouseInInputBox = false; // 标记鼠标是否在输入框内 |
| | | let isUpdated = false; // 定义标志变量 |
| | | // const inputBox = document.querySelectorAll('.input-box2'); |
| | | // 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 parms = obj.params; |
| | | |
| | | // console.log(obj); |
| | | //console.log(obj); |
| | | |
| | | // const handleMouseMove = throttle(function(event) { |
| | | // const inputBox = document.querySelectorAll('.id'); |
| | | // const target = event.target; |
| | | |
| | | if (parms ) { |
| | | //急停按钮 |
| | | jsonData2[13][0].button.value = obj.jiting[0][0]; |
| | | if (parms ) { |
| | | //急停按钮 |
| | | jsonData2[13][0].button.value = obj.jiting[0][0]; |
| | | jsonData2[14][0].button.value = obj.jiting[0][1]; |
| | | jsonData2[16][0].button.value = obj.jiting[0][2]; |
| | | |
| | | |
| | | //清除id |
| | | |
| | | |
| | | |
| | | //清除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; // 正则表达式匹配非字母、数字、下划线和空格的字符 |
| | | |
| | | 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, ""); // 将ID2对应的值赋为parms[1][7] |
| | | } |
| | | |
| | | if (obj.name === "A02ID") { |
| | | obj.value = parms[1][8].replace(specialChars, ""); |
| | | } |
| | | if (obj.name === "B01ID") { |
| | | obj.value = parms[1][9].replace(specialChars, ""); |
| | | } |
| | | if (obj.name === "B02ID") { |
| | | obj.value = parms[1][10].replace(specialChars, ""); |
| | | 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); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | //手动状态 |
| | | 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 |
| | | const specialChars = /[^\w\s]/g; // 正则表达式匹配非字母、数字、下划线和空格的字符 |
| | | |
| | | 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, ""); // 将ID2对应的值赋为parms[1][7] |
| | | } |
| | | |
| | | if (obj.name === "A02ID") { |
| | | obj.value = parms[1][8].replace(specialChars, ""); |
| | | } |
| | | if (obj.name === "B01ID") { |
| | | obj.value = parms[1][9].replace(specialChars, ""); |
| | | } |
| | | if (obj.name === "B02ID") { |
| | | obj.value = parms[1][10].replace(specialChars, ""); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | //扫描枪扫码的ID |
| | | |
| | | jsonData2.forEach((item) => { |
| | | item.forEach((subItem) => { |
| | | if (subItem.read === 66) { |
| | | subItem.value = parms[3][0].replace(specialChars, ""); |
| | | //手动状态 |
| | | 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"); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | this.$forceUpdate(); |
| | | |
| | | //扫描枪扫码的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, ""); |
| | | } |
| | | jsonData2.forEach((item) => { |
| | | item.forEach((subItem) => { |
| | | if (subItem.read === 666) { |
| | | subItem.value = parms[3][1].replace(specialChars, ""); |
| | | } |
| | | }); |
| | | }); |
| | | }); |
| | | |
| | | //A01当前格子 |
| | | let lastParmsArray = parms[parms.length - 1]; |
| | | //A01当前格子 |
| | | let lastParmsArray = parms[parms.length - 1]; |
| | | |
| | | let lastParmsIndex = 0; |
| | | 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; |
| | | 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; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | |
| | | jsonData2[15][0].value = obj.timeout[0]; |
| | | |
| | | if (!isUpdated) { |
| | | for (let i = 0; i < jsonData2.length; i++) { |
| | | for (let j = 0; j < jsonData2[i].length; j++) { |
| | | if(jsonData2[i][j].button){ |
| | | |
| | | |
| | | jsonData2[i][j].button.value2 = jsonData2[i][j].button.value; |
| | | } |
| | | } |
| | | } |
| | | isUpdated = true; // 更新标志变量的值 |
| | | } |
| | | |
| | | |
| | | } |
| | | }; |
| | | |
| | | // console.log(jsonData2); |
| | |
| | | .id { |
| | | background-color: green; |
| | | } |
| | | .A02jiting{ |
| | | |
| | | background-color: #66b1ff; |
| | | } |
| | | .A01jiting{ |
| | | |
| | | background-color: #66b1ff; |
| | | } |
| | | .emgHMI{ |
| | | |
| | | background-color: #66b1ff; |
| | | } |
| | | .GA02jiting{ |
| | | |
| | | background-color: green; |
| | | } |
| | | .GA01jiting{ |
| | | background-color: green; |
| | | } |
| | | .GemgHMI{ |
| | | background-color: green; |
| | | } |
| | | </style> |