JiuMuMES.git - Gitblit

			@@ -2,10 +2,12 @@
			<script setup>
			import request from "@/utils/request";
			import { ElMessage, ElMessageBox } from "element-plus";
			import { reactive, ref, onMounted, onBeforeUnmount, onUnmounted } from 'vue'
			import { computed,reactive, ref, onMounted, onBeforeUnmount, onUnmounted } from 'vue'
			import { useI18n } from 'vue-i18n'
			import { WebSocketHost, host } from '@/utils/constants'
			import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
			import {gridDateFormatter} from '@/stores/tool';

			let language = ref(localStorage.getItem('lang') \|\| 'zh')
			const { t } = useI18n()
			const requestData = reactive({
			@@ -17,59 +19,110 @@
			const findMachine = ref([]);
			const sendRecords = ref([]);
			const downLineTask = ref([]);
			const searchs = ref();

			const machineId = 20;//当前页面的设备ID
			const userInfo=JSON.parse(window.localStorage.getItem('userInfo'));
			const pageParams=userInfo.user.menus[0].pages[5].params;
			const pageParamsJson=JSON.parse(pageParams);
			const machineId = pageParamsJson.machineId;//当前页面的设备ID
			console.log(machineId);
			//const machineId = 20;//当前页面的设备ID
			var errorScanId;
			var errorOpen=false;
			//使用WebSocket方式展示数据
			let socket = null;
			let socketDownLineTask = null;
			const socketUrl = `ws://${WebSocketHost}:${host}/api/deviceInteraction/api/talk/rotate`;
			const socketDownLineTaskUrl = `ws://${WebSocketHost}:${host}/api/deviceInteraction/api/talk/downLineTask`;
			// 定义消息处理函数，更新 receivedData 变量
			const handleMessage = (data) => {
			// 更新 tableData 的数据
			loadData.value = data.taskingList[0];
			findMachine.value = data.machine[0];
			sendRecords.value = data.sendRecords[0].reverse();

			if(findMachine.value.remark.toString()!=errorScanId&&findMachine.value.remark.toString()!=""&&findMachine.value.remark.toString()!=undefined){
			//有数据就弹窗
			if(errorOpen){
			ElMessageBox.close();
			}
			errorScanId=findMachine.value.remark.toString();
			errorInfoFuntion(findMachine.value.remark.toString());
			errorOpen=true;
			}else if(findMachine.value.remark.toString()==""&&errorOpen){
			ElMessageBox.close();
			errorOpen=false;
			// 新增：定时任务ID（用于清除定时器）

			const timerId = ref(null);
			/**
			* 单次接口请求函数
			* 作用：调用后端接口，获取数据后交给 handleMessage 处理
			*/
			const fetchMachineData = async () => {
			try {
			// 任务数据
			request.post("/deviceInteraction/tasking/findMachineTask",{
			"id": machineId
			}).then((res) => { // 替换为你的API端点
			if (res.code === 200) {
			// 假设后端返回的数据格式与 handleMessage 预期一致
			const responseData = res.data \|\| {};
			loadData.value =responseData;
			}
			});

			// 设备数据
			request.post("/deviceInteraction/machine/findMachine",{
			"id": machineId
			}).then((res) => { // 替换为你的API端点
			if (res.code === 200) {
			// 假设后端返回的数据格式与 handleMessage 预期一致
			const responseData = res.data \|\| {};
			findMachine.value =responseData;
			if (Object.keys(findMachine.value).length === 0){
			if(findMachine.value.remark.toString()!=errorScanId&&findMachine.value.remark.toString()!=""&&findMachine.value.remark.toString()!=undefined){
			//有数据就弹窗
			if(errorOpen){
			ElMessageBox.close();
			}
			errorScanId=findMachine.value.remark.toString();
			errorInfoFuntion(findMachine.value.remark.toString());
			errorOpen=true;
			}else if(findMachine.value.remark.toString()==""&&errorOpen){
			ElMessageBox.close();
			errorOpen=false;
			}
			}
			}
			});

			// 线下数据
			request.post("/deviceInteraction/tasking/selectGlassDownLine").then((res) => { // 替换为你的API端点
			if (res.code === 200) {
			// 假设后端返回的数据格式与 handleMessage 预期一致
			const responseData = res.data \|\| {};
			downLineTask.value =responseData;
			}
			});
			} catch (err) {
			console.error('定时请求后端接口失败：', err);
			}

			};
			// 定义消息处理函数，更新 receivedData 变量
			const handleMessage2 = (data) => {
			downLineTask.value = data.downLineTask[0];
			// console.log(data);

			/**
			* 启动定时器
			* @param {number} interval - 定时间隔（毫秒，默认500ms，与后端任务频率对齐）
			*/
			const startTimer = (interval = 500) => {
			// 先清除已有定时器（避免重复创建）
			if (timerId.value) clearInterval(timerId.value);
			// 立即执行一次（避免首次等待间隔）
			fetchMachineData();
			// 创建新定时器
			timerId.value = setInterval(() => {
			fetchMachineData();
			}, interval);
			};

			/**
			* 清除定时器（避免内存泄漏）
			*/
			const clearTimer = () => {
			if (timerId.value) {
			clearInterval(timerId.value);
			timerId.value = null; // 重置ID
			}
			};

			// 组件卸载时清除定时器（关键：避免组件销毁后定时器仍运行）
			onUnmounted(() => {
			if (socket) {
			closeWebSocket(socket);
			}
			if (socketDownLineTask) {
			closeWebSocket(socketDownLineTask);
			}
			});
			onBeforeUnmount(() => {
			console.log("关闭了")
			closeWebSocket();
			clearTimer();
			});

			onMounted(async () => {
			//使用WebSocket方式展示数据
			socket = initializeWebSocket(socketUrl, handleMessage);// 初始化 WebSocket，并传递消息处理函数
			//使用WebSocket方式展示数据
			socketDownLineTask = initializeWebSocket(socketDownLineTaskUrl, handleMessage2);// 初始化 WebSocket，并传递消息处理函数
			startTimer(500); // 500ms 间隔（可根据业务调整，如1000ms）
			// //使用WebSocket方式展示数据
			// socket = initializeWebSocket(socketUrl, handleMessage);// 初始化 WebSocket，并传递消息处理函数
			// //使用WebSocket方式展示数据
			// socketDownLineTask = initializeWebSocket(socketDownLineTaskUrl, handleMessage2);// 初始化 WebSocket，并传递消息处理函数
			});
			//报警提示
			const errorInfoFuntion = async (info) => {
			@@ -199,6 +252,39 @@
			})
			})
			}

			//定制/标准
			const rotateMode = async (mode) => {
			ElMessageBox.confirm(
			t('functionState.tips'),
			t('delivery.prompt'),
			{
			confirmButtonText: t('functionState.sure'),
			cancelButtonText: t('functionState.cancel'),
			type: 'warning',
			}
			)
			.then(() => {
			//下线接口
			request.post("/deviceInteraction/machine/toggleModeRotate",
			{
			"id": machineId,
			"rotateMode": mode
			}).then((res) => { // 替换为你的API端点
			if (res.code === 200) {
			ElMessage.success(res.message);
			} else {
			ElMessage.warning(res.message)
			}
			})
			})
			.catch(() => {
			ElMessage({
			type: 'info',
			message: t('functionState.cancel'),
			})
			})
			}
			//破损
			const damagedTask = async (row) => {
			ElMessageBox.confirm(
			@@ -264,6 +350,7 @@
			const topLineShow = async () => {
			blind.value = true;
			}

			//上线
			const topLine = async (row) => {
			ElMessageBox.confirm(
			@@ -296,9 +383,50 @@
			})
			})
			}

			//删除线下玻璃
			const deleteGlassDownLine = async () => {
			ElMessageBox.confirm(
			t('functionState.tips'),
			t('delivery.prompt'),
			{
			confirmButtonText: t('functionState.sure'),
			cancelButtonText: t('functionState.cancel'),
			type: 'warning',
			}
			)
			.then(() => {
			//上线接口
			request.post("/deviceInteraction/tasking/deleteGlassDownLine").then((res) => { // 替换为你的API端点
			if (res.code === 200) {
			ElMessage.success(res.message);
			} else {
			ElMessage.warning(res.message)
			}
			})
			})
			.catch(() => {
			ElMessage({
			type: 'info',
			message: t('functionState.cancel'),
			})
			})
			}

			const handleDialogClose = () => {

			}
			const fetchData = async () => {
			//扫码回车提交
			//alert(searchs.value);
			searchs.value="";
			}
			const filterTableData = computed(() =>
			loadData.value.filter(
			(data) =>
			!searchs.value \|\|data.scanId.toLowerCase().includes(searchs.value.toLowerCase())
			)
			)
			</script>
			<template>
			<div ref="content" style="padding:0 20px;">
			@@ -336,14 +464,21 @@
			<el-button :type="(findMachine['mode'] == '定制' ? 'danger' : 'success')" id="ButtonMachineMode"
			@click="machineMode((findMachine['mode'] == 0 ? 1 : 0))">{{ findMachine['mode'] == 0 ?
			$t('functionState.modeD') : $t('functionState.modeB') }}</el-button>

			<el-button :type="(findMachine['rotateMode'] == 1 ? 'danger' : 'success')" id="ButtonRotateMode"
			@click="rotateMode((findMachine['rotateMode'] == 1 ? 2 : 1))">{{ findMachine['rotateMode'] == 1 ?
			$t('functionState.rotate') : $t('functionState.notRotate') }}</el-button>


			<el-button type="primary" id="ButtonTopLine" @click="topLineShow">{{ $t('functionState.topLine') }}</el-button>
			<el-button type="primary" id="deleteGlassDownLine" @click="deleteGlassDownLine">{{ $t('functionState.deleteDownLineGlass') }}</el-button>
			<!-- <el-button type="primary" id="searchButton" @click="downLine('下线')">下线</el-button>
			<el-button type="primary" id="searchButton" @click="workStatus('破损')">破损</el-button>
			<el-button type="primary" id="searchButton" @click="workStatus('完工')">完工</el-button> -->
			</div>
			<div id="main-body" style="min-height:240px;">
			<!-- 表格内容 -->
			<el-table :data="loadData" stripe style="height:680px"
			<el-table :data="filterTableData" stripe style="height:680px"
			:header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129', textAlign: 'center' }"
			:cell-style="{ textAlign: 'center' }">
			<!-- <el-table-column type="selection" min-width="30" /> -->
			@@ -351,11 +486,20 @@
			<el-table-column prop="batchNumber" :label="$t('glassInfo.batchNumber')" />
			<el-table-column prop="taskType" :label="$t('glassInfo.taskType')" />
			<el-table-column prop="glassId" :label="$t('glassInfo.glassId')" />
			<el-table-column prop="scanId" :label="$t('glassInfo.scanId')" />
			<el-table-column prop="scanId" :label="$t('glassInfo.scanId')" >
			<template #header>
			<div>
			<div>{{ $t('glassInfo.scanId') }}
			</div>
			<el-input v-model="searchs" type="primary" id="ReportSubmission" @keyup.enter="fetchData"></el-input>
			</div>
			</template>
			</el-table-column>
			<el-table-column prop="length" :label="$t('glassInfo.length')" />
			<el-table-column prop="width" :label="$t('glassInfo.width')" />
			<el-table-column prop="thickness" :label="$t('glassInfo.thickness')" />
			<el-table-column prop="workState" :label="$t('glassInfo.workState')" />
			<el-table-column prop="operationRecordTime" :formatter="gridDateFormatter" :label="$t('glassInfo.operationRecordTime')" width="180"/>
			<el-table-column fixed="right" :label="$t('productStock.operate')" align="center" width="270">
			<template #default="scope">
			<el-button size="mini" link type="primary" plain @click="workStatus(scope.row, '重发')">{{