ZengTao
2024-08-06 7664b90f93c4862785b8c3c18ad26a0cf0eeec33
UI-Project/src/views/Identify/identify.vue
@@ -1,6 +1,20 @@
<template>
<template>
  <div style="display: flex;">
<el-input v-model="inputValue" style="margin-left: 15px;margin-top: 10px;width: 240px" placeholder="请输入工程号" @blur="handleBlur"/>
<el-pagination
      v-model:current-page="currentPage3"
      v-model:page-size="pageSize3"
      :size="size"
      :disabled="disabled"
      :background="background"
      layout="prev, pager, next, jumper"
      :total="1000"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
    />
    </div>
    <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;" v-loading="loading">
      <el-scrollbar height="600px" >
      <el-scrollbar height="550px" >
  <div id="app" style="margin-top: 20px;">  
    <!-- <div  
      :style="{ width: `${olWidth}px`, height: `${olHeight}px`,position: 'relative',}"
@@ -41,7 +55,7 @@
<script setup lang="ts">  
import { Delete, Upload } from '@element-plus/icons-vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { ref, onMounted, onBeforeUnmount,onUnmounted } from 'vue';
import { ref, onMounted, onBeforeUnmount,onUnmounted,watchEffect } from 'vue';
import request from "@/utils/request"
import { WebSocketHost ,host} from '@/utils/constants'
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
@@ -53,7 +67,7 @@
const olHeight = ref();
const process_id = ref(); // 用于存储process_id的响应式引用 
const glass_id = ref();
// const rects = ref([]); // 用于存储矩形数据的响应式引用
const inputValue = ref('');
const currentGlassId = ref(null); // 存储当前点击矩形的 glass_id  
const adjustedRects = ref([]);
// const handleBind = (row) => {
@@ -155,6 +169,42 @@
    console.error(error);
  }
}
const handleBlur = async () => {
  if (inputValue.value !== '') {
    try {
      var url="/cacheGlass/taskCache/cutTerritory?current="+inputValue.value;
      const response = await request.post(url)
      if (response.data && response.data.currentCutTerritory) {
        // 假设返回的数据需要调整坐标和尺寸
        adjustedRects.value = response.data.currentCutTerritory.map(rect => ({
          ...rect,
          x_axis: 1360 - (rect.x_axis + rect.width) * 0.37,
          y_axis: (rect.y_axis * 100) * 0.003,
          width: (rect.width * 100) * 0.002,
          height: (rect.height * 100) * 0.002,
          widtha: rect.width ,
          heighta: rect.height ,
          glass_state: rect.glass_state
        }));
      }
    } catch (error) {
      console.error('请求数据失败:', error);
    }
  }
};
// const handleBlur = async () => {
//   if (inputValue.value !=''){
//     try {
//       var url="/cacheGlass/taskCache/cutTerritory?current="+inputValue.value;
//       const response = await request.post(url)
//       console.log(response.data.length);
//     if (response.code == 200) {
//       adjustedRects.value = response.data
//       ElMessage.success(response.message);
//     } else {
//       ElMessage.error(response.msg);
//     }
// }
function getRectColor(state: number): string {  
  switch (state) {  
    case 0:  
@@ -205,6 +255,11 @@
    closeWebSocket(socket);
    }
    });
  watchEffect(() => {
  if (inputValue.value === '') {
    handleMessage();
  }
});
onBeforeUnmount(() => {
  console.log("关闭了")
  closeWebSocket();