看板大屏2修改页面

huang

2025-04-17 3a0087aa5e3eed5d9d7a793a17dc01fd1d6df80c

 UI-Project/src/views/Rotate/rotate.vue

@@ -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,8 +19,14 @@
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方式展示数据
@@ -29,9 +37,11 @@
// 定义消息处理函数，更新 receivedData 变量
const handleMessage = (data) => {
  // 更新 tableData 的数据
  loadData.value = data.taskingList[0];
  findMachine.value = data.machine[0];
  sendRecords.value = data.sendRecords[0].reverse();
  let dataJson = data[""+machineId][0];

  loadData.value = dataJson.taskingList[0];
  findMachine.value = dataJson.machine[0];
  sendRecords.value = dataJson.sendRecords[0].reverse();
  
  if(findMachine.value.remark.toString()!=errorScanId&&findMachine.value.remark.toString()!=""&&findMachine.value.remark.toString()!=undefined){
    //有数据就弹窗 
@@ -199,6 +209,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(
@@ -299,6 +342,17 @@
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,6 +390,12 @@
      <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="searchButton" @click="downLine('下线')">下线</el-button>
      <el-button type="primary" id="searchButton" @click="workStatus('破损')">破损</el-button>
@@ -343,7 +403,7 @@
    </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 +411,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, '重发')">{{