CanadaMes.git - Gitblit

			@@ -20,15 +20,15 @@
			}}</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/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="18">
			<el-row :gutter="18" class="card">
			<el-col :span="7" v-for="(dataGroup, groupIndex) in jsonData" :key="groupIndex">
			<el-card class="json-block">
			<div class="button-row" style="display: flex; justify-content: space-between;">
			@@ -39,7 +39,7 @@
			<div v-for="(item, itemIndex) in dataGroup" :key="itemIndex" class="item-container">
			<div class="item-row">
			<span class="name" style="width:250px;">{{ item.name }}</span>
			<el-input v-if="item.type === '0'" v-model="item.value" class="input-box"></el-input>
			<el-input v-if="item.type === '0'" v-model="item.value" class="input-box" @keyup.enter.native="submitDataToBackend"></el-input>
			</div>
			</div>

			@@ -53,7 +53,8 @@
			<script>
			import LanguageMixin from '../../lang/LanguageMixin'
			import data from '../../configuration/parameter1'

			import { throttle } from 'lodash';
			let socket;
			export default {
			name: "Parameter1",
			mixins: [LanguageMixin],
			@@ -61,6 +62,10 @@
			return {
			jsonData: data // 加载整个data.json文件作为jsonData
			}
			}, created () {
			this.initWebSocket();
			// console.log('jsonData:', this.jsonData);

			},
			methods: {
			updateButtonValue(dataGroup, itemIndex) {
			@@ -70,18 +75,129 @@
			const inputData = this.jsonData.map(dataGroup => {
			return dataGroup.map(item => {
			if (item.type === '0') {
			return { name: item.name, value: item.value ,address:item.address};
			return { value: parseInt(item.value) };
			} else if (item.button) {
			return { name: item.title.name, value: item.title.value ,address:item.title.address};
			return { value: parseInt(item.button.value) };
			}
			return null;
			});
			});

			// 模拟提交数据到后端的操作，实际情况下需要根据你的后端API进行修改
			console.log('提交以下数据到后端:', inputData);
			// 将inputData转换为整数数组
			const integerArray = inputData.map(dataGroup => {
			return dataGroup.map(item => {
			if (item !== null) {
			return item.value;
			}
			return null;
			});
			});
			// 构建JSON对象
			const jsonObject = { data: integerArray };

			// 提交数据到后端
			const jsonString = JSON.stringify(jsonObject);
			console.log('提交以下数据到后端:', jsonString);
			socket?.send(jsonString);
			},
			initWebSocket () {

			let viewname = "Parameter1";

			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;
			}

			// 开启一个websocket服务
			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 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))) {
			const parms = obj.params;
			const fanzhuan = obj.fanzhuan;
			const xiaoche = obj.xiaoche;

			// console.log('parms:', parms);
			// console.log('fanzhuan:', fanzhuan);
			// console.log('xiaoche:', xiaoche);

			let index = 0;
			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(fanzhuan) && Array.isArray(fanzhuan[0]) && fanzhuan[0][0] !== undefined) {
			jsonData2[3][0]['value'] = fanzhuan[0][0];
			}
			if (Array.isArray(xiaoche) && Array.isArray(xiaoche[0]) && xiaoche[0][0] !== undefined) {
			jsonData2[4][0]['value'] = xiaoche[0][0];
			}
			}
			}, 200);

			document.addEventListener('mouseover', handleMouseMove);
			};






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

			// 发生错误事件
			socket.onerror = function () {
			console.log("websocket发生了错误");
			};


			}

			},
			replaceChineseWithEnglish () {
			const translation = this.$t('Parameter1');
			this.jsonData = this.jsonData.map(item => { return { name: translation[item.name] \|\| item.name, value: item.value }; });
			// console.log(translation);
			},
			send () {


			socket?.send(JSON.stringify(this.messagepack));
			},

			}
			}
			</script>