前端页面适配

wangfei

2024-11-13 18e4df43f79f51539474b2918544a9d2d4c5c4e0

前端页面适配

 UI-Project/config.js

@@ -1,10 +1,10 @@
export default {
    // serverUrl: "10.153.19.150:88/api",
    serverUrl: "10.153.19.150:88/api",
//  serverUrl: "192.168.1.199:88/api",
    serverUrl: "127.0.0.1:88/api",
    // serverUrl2: "10.153.19.150:88"
    // serverUrl: "127.0.0.1:88/api",
    serverUrl2: "10.153.19.150:88"
    // serverUrl2: "192.168.1.199:88"
    serverUrl2: "127.0.0.1:88"
    // serverUrl2: "127.0.0.1:88"

    //serverUrl:"res.abeim.cn"
}

 UI-Project/package-lock.json

@@ -35,6 +35,7 @@
      "devDependencies": {
        "@types/sortablejs": "^1.15.7",
        "@vitejs/plugin-vue": "^4.6.2",
        "babel-polyfill": "^6.26.0",
        "http-proxy-middleware": "^3.0.0",
        "unplugin-auto-import": "^0.17.6",
        "vite": "^4.4.9"
@@ -632,6 +633,33 @@
        "proxy-from-env": "^1.1.0"
      }
    },
    "node_modules/babel-polyfill": {
      "version": "6.26.0",
      "resolved": "https://registry.npmmirror.com/babel-polyfill/-/babel-polyfill-6.26.0.tgz",
      "integrity": "sha512-F2rZGQnAdaHWQ8YAoeRbukc7HS9QgdgeyJ0rQDd485v9opwuPvjpPFcOOT/WmkKTdgy9ESgSPXDcTNpzrGr6iQ==",
      "dev": true,
      "dependencies": {
        "babel-runtime": "^6.26.0",
        "core-js": "^2.5.0",
        "regenerator-runtime": "^0.10.5"
      }
    },
    "node_modules/babel-runtime": {
      "version": "6.26.0",
      "resolved": "https://registry.npmmirror.com/babel-runtime/-/babel-runtime-6.26.0.tgz",
      "integrity": "sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g==",
      "dev": true,
      "dependencies": {
        "core-js": "^2.4.0",
        "regenerator-runtime": "^0.11.0"
      }
    },
    "node_modules/babel-runtime/node_modules/regenerator-runtime": {
      "version": "0.11.1",
      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
      "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
      "dev": true
    },
    "node_modules/balanced-match": {
      "version": "1.0.2",
      "resolved": "https://registry.npmmirror.com/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -773,6 +801,14 @@
      "resolved": "https://registry.npmmirror.com/confbox/-/confbox-0.1.7.tgz",
      "integrity": "sha512-uJcB/FKZtBMCJpK8MQji6bJHgu1tixKPxRLeGkNzBoOZzpnZUJm0jm2/sBDWcuBx1dYgxV4JU+g5hmNxCyAmdA==",
      "dev": true
    },
    "node_modules/core-js": {
      "version": "2.6.12",
      "resolved": "https://registry.npmmirror.com/core-js/-/core-js-2.6.12.tgz",
      "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
      "deprecated": "core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.",
      "dev": true,
      "hasInstallScript": true
    },
    "node_modules/crc-32": {
      "version": "1.2.2",
@@ -1549,6 +1585,12 @@
      "engines": {
        "node": ">=8.10.0"
      }
    },
    "node_modules/regenerator-runtime": {
      "version": "0.10.5",
      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
      "integrity": "sha512-02YopEIhAgiBHWeoTiA8aitHDt8z6w+rQqNuIftlM+ZtvSl/brTouaU7DW6GO/cHtvxJvS4Hwv2ibKdxIRi24w==",
      "dev": true
    },
    "node_modules/require-directory": {
      "version": "2.1.1",
@@ -2623,6 +2665,35 @@
        "proxy-from-env": "^1.1.0"
      }
    },
    "babel-polyfill": {
      "version": "6.26.0",
      "resolved": "https://registry.npmmirror.com/babel-polyfill/-/babel-polyfill-6.26.0.tgz",
      "integrity": "sha512-F2rZGQnAdaHWQ8YAoeRbukc7HS9QgdgeyJ0rQDd485v9opwuPvjpPFcOOT/WmkKTdgy9ESgSPXDcTNpzrGr6iQ==",
      "dev": true,
      "requires": {
        "babel-runtime": "^6.26.0",
        "core-js": "^2.5.0",
        "regenerator-runtime": "^0.10.5"
      }
    },
    "babel-runtime": {
      "version": "6.26.0",
      "resolved": "https://registry.npmmirror.com/babel-runtime/-/babel-runtime-6.26.0.tgz",
      "integrity": "sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g==",
      "dev": true,
      "requires": {
        "core-js": "^2.4.0",
        "regenerator-runtime": "^0.11.0"
      },
      "dependencies": {
        "regenerator-runtime": {
          "version": "0.11.1",
          "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
          "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
          "dev": true
        }
      }
    },
    "balanced-match": {
      "version": "1.0.2",
      "resolved": "https://registry.npmmirror.com/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -2728,6 +2799,12 @@
      "version": "0.1.7",
      "resolved": "https://registry.npmmirror.com/confbox/-/confbox-0.1.7.tgz",
      "integrity": "sha512-uJcB/FKZtBMCJpK8MQji6bJHgu1tixKPxRLeGkNzBoOZzpnZUJm0jm2/sBDWcuBx1dYgxV4JU+g5hmNxCyAmdA==",
      "dev": true
    },
    "core-js": {
      "version": "2.6.12",
      "resolved": "https://registry.npmmirror.com/core-js/-/core-js-2.6.12.tgz",
      "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
      "dev": true
    },
    "crc-32": {
@@ -3136,6 +3213,7 @@
        "@vitejs/plugin-vue": "^4.6.2",
        "@vue-macros/reactivity-transform": "^0.3.23",
        "axios": "^1.6.8",
        "babel-polyfill": "*",
        "chart.js": "^4.4.3",
        "echarts": "^5.5.1",
        "element-plus": "^2.4.0",
@@ -3154,7 +3232,7 @@
        "vue-echarts": "^6.7.3",
        "vue-i18n": "^9.10.1",
        "vue-print-nb": "^1.7.5",
        "vue-router": "4.0.13",
        "vue-router": "^4.0.13",
        "vue3-print-nb": "^0.1.4",
        "vxe-table": "^4.5.15",
        "xe-utils": "^3.5.14",
@@ -3594,6 +3672,35 @@
            "proxy-from-env": "^1.1.0"
          }
        },
        "babel-polyfill": {
          "version": "6.26.0",
          "resolved": "https://registry.npmmirror.com/babel-polyfill/-/babel-polyfill-6.26.0.tgz",
          "integrity": "sha512-F2rZGQnAdaHWQ8YAoeRbukc7HS9QgdgeyJ0rQDd485v9opwuPvjpPFcOOT/WmkKTdgy9ESgSPXDcTNpzrGr6iQ==",
          "dev": true,
          "requires": {
            "babel-runtime": "^6.26.0",
            "core-js": "^2.5.0",
            "regenerator-runtime": "^0.10.5"
          }
        },
        "babel-runtime": {
          "version": "6.26.0",
          "resolved": "https://registry.npmmirror.com/babel-runtime/-/babel-runtime-6.26.0.tgz",
          "integrity": "sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g==",
          "dev": true,
          "requires": {
            "core-js": "^2.4.0",
            "regenerator-runtime": "^0.11.0"
          },
          "dependencies": {
            "regenerator-runtime": {
              "version": "0.11.1",
              "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
              "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
              "dev": true
            }
          }
        },
        "balanced-match": {
          "version": "1.0.2",
          "resolved": "https://registry.npmmirror.com/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -3699,6 +3806,12 @@
          "version": "0.1.7",
          "resolved": "https://registry.npmmirror.com/confbox/-/confbox-0.1.7.tgz",
          "integrity": "sha512-uJcB/FKZtBMCJpK8MQji6bJHgu1tixKPxRLeGkNzBoOZzpnZUJm0jm2/sBDWcuBx1dYgxV4JU+g5hmNxCyAmdA==",
          "dev": true
        },
        "core-js": {
          "version": "2.6.12",
          "resolved": "https://registry.npmmirror.com/core-js/-/core-js-2.6.12.tgz",
          "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
          "dev": true
        },
        "crc-32": {
@@ -4223,6 +4336,12 @@
          "requires": {
            "picomatch": "^2.2.1"
          }
        },
        "regenerator-runtime": {
          "version": "0.10.5",
          "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
          "integrity": "sha512-02YopEIhAgiBHWeoTiA8aitHDt8z6w+rQqNuIftlM+ZtvSl/brTouaU7DW6GO/cHtvxJvS4Hwv2ibKdxIRi24w==",
          "dev": true
        },
        "require-directory": {
          "version": "2.1.1",
@@ -4781,6 +4900,12 @@
        "picomatch": "^2.2.1"
      }
    },
    "regenerator-runtime": {
      "version": "0.10.5",
      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz",
      "integrity": "sha512-02YopEIhAgiBHWeoTiA8aitHDt8z6w+rQqNuIftlM+ZtvSl/brTouaU7DW6GO/cHtvxJvS4Hwv2ibKdxIRi24w==",
      "dev": true
    },
    "require-directory": {
      "version": "2.1.1",
      "resolved": "https://registry.npmmirror.com/require-directory/-/require-directory-2.1.1.tgz",

 UI-Project/package.json

@@ -35,6 +35,7 @@
  "devDependencies": {
    "@types/sortablejs": "^1.15.7",
    "@vitejs/plugin-vue": "^4.6.2",
    "babel-polyfill": "^6.26.0",
    "http-proxy-middleware": "^3.0.0",
    "unplugin-auto-import": "^0.17.6",
    "vite": "^4.4.9"

 UI-Project/src/App.vue

@@ -1,14 +1,23 @@
<template>

  <router-view></router-view>

</template>
<script setup>
import {ref} from 'vue'
import { RouterView } from 'vue-router'
import {onMounted} from 'vue'
import DevicePixelRatio from '@/utils/evicePixelRatio.js';

// 定义一个函数来调整 body 的缩放比例
function bodyScale() {
  const deviceheight = document.documentElement.clientHeight;
  const scale = deviceheight / 740;
  document.body.style.zoom = scale;
}

// 在组件挂载时执行
onMounted(() => {
  new DevicePixelRatio().init();
  bodyScale();
});
</script>

<style scoped>

</style>
/* 你的样式内容 */
</style>

 UI-Project/src/main.js

@@ -1,7 +1,6 @@
import './assets/main.css'
 
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import {createApp} from 'vue'
import {createPinia} from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
import App from './App.vue'
import router from './router'
@@ -12,12 +11,12 @@
import 'vxe-table/lib/style.css'
import i18n from '@/lang'
// import Echarts from "vue-echarts"
import * as echarts from "echarts"
// echarts.registerMap('china', china)
// Vue.prototype.$echarts = echarts
// app.component("v-chart", Echarts)
// app.config.globalProperties.$echarts = echarts
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import 'babel-polyfill'

const app = createApp(App)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {

 UI-Project/src/utils/constants.js

@@ -1,4 +1,4 @@
//  export const WebSocketHost = "192.168.1.199";
// export const WebSocketHost = "10.153.19.150";
export const WebSocketHost = "127.0.0.1";
export const host = "8083";
export const WebSocketHost = "10.153.19.150";
// export const WebSocketHost = "127.0.0.1";
export const host = "88";

 UI-Project/src/utils/evicePixelRatio.js

New file
@@ -0,0 +1,57 @@
/**
 * @description 校正windows页面在系统进行缩放后导致页面被放大的问题，通常放大比例是125%、150%
 * **/

class DevicePixelRatio {
    constructor() {
    }

    //获取系统类型
    _getSystem() {
        let flag = false;
        var agent = navigator.userAgent.toLowerCase();
        if (agent.indexOf("windows") >= 0) {
            return true;
        }
    }

    //获取页面缩放比例
    _addHandler(element, type, handler) {
        if (element.addEventListener) {
            element.addEventListener(type, handler, false);
        } else if (element.attachEvent) {
            element.attachEvent("on" + type, handler);
        } else {
            element["on" + type] = handler;
        }
    }

    //校正浏览器缩放比例
    _correct() {
        let t = this;
        //页面devicePixelRatio（设备像素比例）变化后，计算页面body标签zoom修改其大小，来抵消devicePixelRatio带来的变化。
        document.getElementsByTagName('body')[0].style.zoom = 1 / window.devicePixelRatio;
    }

    //监听页面缩放
    _watch() {
        let t = this;
        t._addHandler(window, 'resize', function () { //注意这个方法是解决全局有两个window.resize
            //重新校正
            t._correct()
        })
    }

    //初始化页面比例
    init() {
        let t = this;
        if (t._getSystem()) { //判断设备，目前只在windows系统下校正浏览器缩放比例
            //初始化页面校正浏览器缩放比例
            t._correct();
            //开启监听页面缩放
            t._watch();
        }
    }
}

export default DevicePixelRatio;

 UI-Project/src/views/Caching/cachingbefore.vue

@@ -1,30 +1,28 @@
<script setup>
import {Search} from "@element-plus/icons-vue";
import {reactive} from "vue";
import {onBeforeUnmount, onMounted, onUnmounted, ref} from "vue";
import {useRouter} from "vue-router"
const router = useRouter()
const adda = ref(false)
import { WebSocketHost ,host} from '@/utils/constants'
import {host, WebSocketHost} from '@/utils/constants'

import request from "@/utils/request"
import { ref, onMounted , onBeforeUnmount,onUnmounted} from "vue";
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
// import { ref } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import {ElMessage, ElMessageBox} from 'element-plus'
//  import LanguageMixin from './lang/LanguageMixin'
import {useI18n} from 'vue-i18n'

import { useI18n } from 'vue-i18n'
  const { t } = useI18n()
  let language = ref(localStorage.getItem('lang') || 'zh')
const router = useRouter()
const adda = ref(false)
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
const tableData = ref([])
const slot = ref('')
const adjustedRects = ref([]);
onMounted(async () => {  
  try {  
onMounted(async () => {
  try {
    const response = await request.post('/cacheGlass/edgStorageCage/selectEdgStorageCage'); // 替换为你的API端点  
    if (response.code === 200) {  
    if (response.code === 200) {
      const rawRects = response.data; // 设置矩形数据  
          tableData.value = response.data
      tableData.value = response.data
          console.log(response.data);
          adjustedRects.value = rawRects.map(rect => ({  
            ...rect, // 复制原始对象的其他属性  
@@ -105,7 +103,6 @@
  closeWebSocket();
});
</script>

<template>
  <div style="height: 500px;">
    <el-card style="flex: 1;margin-left: 10px;margin-top: 20px;" v-loading="loading">

 UI-Project/src/views/GlassStorage/rawfilmstorage.vue

@@ -322,17 +322,26 @@
}); 
</script>
<template>
  <div>
  <div style="display: flex; flex-direction: row; align-items: center; margin-top: 20px;">  
    <el-button style="margin-left: 20px;" id="searchButton" type="success" @click="dialogFormVisiblea = true">{{ $t('film.mes') }}</el-button>
  <el-button style="margin-left: 20px;" id="searchButton" type="success" @click="handleBinda">{{ $t('film.warehousing') }}</el-button>
  <el-button style="margin-left: 20px;" id="searchButton" type="success" @click="handleBindc">{{ $t('film.pwarehousing') }}</el-button>
  <el-button style="margin-left: 20px;" id="searchButton" type="success" @click="handleBinde">{{ $t('film.pwareout') }}</el-button>
    <el-date-picker style="margin-left: 10px;"  v-model="timeRange" type="datetimerange"
        format="YYYY/MM/DD HH:mm:ss"  
        value-format="YYYY-MM-DD HH:mm:ss"
        :start-placeholder="$t('film.starttime')" 
        :end-placeholder="$t('film.endtime')" 
  <div style="height: 500px;">
    <div style="display: flex; flex-direction: row; align-items: center; margin-top: 20px;">
      <el-button style="margin-left: 20px;" id="searchButton" type="success" @click="dialogFormVisiblea = true">
        {{ $t('film.mes') }}
      </el-button>
      <el-button style="margin-left: 20px;" id="searchButton" type="success" @click="handleBinda">
        {{ $t('film.warehousing') }}
      </el-button>
      <el-button style="margin-left: 20px;" id="searchButton" type="success" @click="handleBindc">
        {{ $t('film.pwarehousing') }}
      </el-button>
      <el-button style="margin-left: 20px;" id="searchButton" type="success" @click="handleBinde">{{
          $t('film.pwareout')
        }}
      </el-button>
      <el-date-picker style="margin-left: 10px;" v-model="timeRange" type="datetimerange"
                      format="YYYY/MM/DD HH:mm:ss"
                      value-format="YYYY-MM-DD HH:mm:ss"
                      :start-placeholder="$t('film.starttime')"
                      :end-placeholder="$t('film.endtime')"
        :default-time="defaultTime" />
    <el-select v-model="selectValuesa[0]" clearable :placeholder="$t('film.taskstatus')" style="margin-left: 10px;" >
      <el-option :label="$t('film.built')" value="1"></el-option>
@@ -381,8 +390,9 @@
      </div>
    </el-card>
    <div class="awatch">
    <img src="../../assets/ypcc.png" alt="" style="width: 100%;height: 120%;margin-left: 10px;position: relative;margin-top: -20px;"> 
</div>
      <img src="../../assets/ypcc.png" alt=""
           style="width: 100%;height: 120%;margin-left: -10px;position: relative;margin-top: -20px;">
    </div>
    <el-dialog v-model="dialogFormVisiblea" top="5vh" width="85%" >
    <el-table  ref="table" style="margin-top: 20px;height: 700px;"
        :data="tableDatab" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">

 UI-Project/src/views/Identify/identify.vue

@@ -1,15 +1,17 @@
<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="currentPage"
      :page-size="pageSize"
      :size="size"
      :disabled="disabled"
      layout="prev, pager, next, jumper"
      :total="totalPages"
      @current-change="handleCurrentChange"
    />
  <div style="height: 500px;">
    <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="currentPage"
          :page-size="pageSize"
          :size="size"
          :disabled="disabled"
          layout="prev, pager, next, jumper"
          :total="totalPages"
          @current-change="handleCurrentChange"
      />
    </div>
    <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;height: 800px;" v-loading="loading">
      <el-scrollbar height="750px" width="1400px" style="background-color: #e9e9eb;">
@@ -33,29 +35,34 @@
  </div>
  </div> 
   </div>
  </el-scrollbar>
  <el-dialog v-model="blind" top="30vh" width="15%" style="text-align: center;" @close="handleDialogClose">
        <el-button :disabled="currentGlassRect?.glass_state === 8 || currentGlassRect?.glass_state === 9" type="warning" plain :icon="Delete" @click="handleDamage(currentGlassId)"  style="width: 140px;margin-left: 10px;">
      </el-scrollbar>
      <el-dialog v-model="blind" top="30vh" width="15%" style="text-align: center;" @close="handleDialogClose">
        <el-button :disabled="currentGlassRect?.glass_state === 8 || currentGlassRect?.glass_state === 9" type="warning"
                   plain :icon="Delete" @click="handleDamage(currentGlassId)" style="width: 140px;margin-left: 10px;">
          {{ $t('order.dilapidation') }}
        </el-button>
        <el-button :disabled="currentGlassRect?.glass_state === 9 || currentGlassRect?.glass_state === 8" type="danger" plain @click="handleManualTake(currentGlassId)" style="width: 140px;margin-top: 10px;">
          <el-icon class="el-icon--right"><Upload /></el-icon>
          {{ $t('order.takeaway') }}</el-button>
  </el-dialog> 
  </el-card>
</template>  
<script setup lang="ts">  
import { Delete, Upload } from '@element-plus/icons-vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { ref, onMounted, onBeforeUnmount,onUnmounted, computed  } from 'vue';  
        <el-button :disabled="currentGlassRect?.glass_state === 9 || currentGlassRect?.glass_state === 8" type="danger"
                   plain @click="handleManualTake(currentGlassId)" style="width: 140px;margin-top: 10px;">
          <el-icon class="el-icon--right">
            <Upload/>
          </el-icon>
          {{ $t('order.takeaway') }}
        </el-button>
      </el-dialog>
    </el-card>
  </div>
</template>
<script setup lang="ts">
import {ElMessage} from 'element-plus'
import {computed, onMounted, onUnmounted, ref} from 'vue';
import request from "@/utils/request"
import { WebSocketHost ,host} from '@/utils/constants'
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
  import { useI18n } from 'vue-i18n'
  const { t } = useI18n()
  let language = ref(localStorage.getItem('lang') || 'zh')
import {host, WebSocketHost} from '@/utils/constants'
import {useI18n} from 'vue-i18n'

const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
const blind = ref(false)
const olWidth = ref(); 
const olWidth = ref();
const olHeight = ref();
const glass_id = ref();
const inputValue = ref('');

 UI-Project/src/views/PurchaseReturn/purchaseReturn.vue

@@ -1,15 +1,14 @@
<script setup lang="ts">
import {Search ,Delete, Upload,Edit} from "@element-plus/icons-vue";
import {reactive} from "vue";
import {nextTick, onBeforeUnmount, onMounted, ref} from "vue";
import request from "@/utils/request"
import { ref, onMounted, onBeforeUnmount,nextTick  } from 'vue';  
import { WebSocketHost ,host} from '@/utils/constants'
import { ElMessage, ElMessageBox } from 'element-plus'
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
  import { useI18n } from 'vue-i18n'
  import { useRouter } from 'vue-router'
  const { t } = useI18n()
  let language = ref(localStorage.getItem('lang') || 'zh')
import {host, WebSocketHost} from '@/utils/constants'
import {ElMessage} from 'element-plus'
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import {useI18n} from 'vue-i18n'
import {useRouter} from 'vue-router'

const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
const dialogFormVisible = ref(false)
const dialogFormVisiblea = ref(true)
const dialogFormVisibleb = ref(false)
@@ -770,9 +769,9 @@
    }
}
catch (error) {
    // 处理错误
    // console.error(error);
  }
  // 处理错误
  // console.error(error);
}
}
onBeforeUnmount(() => {
  console.log("关闭了")
@@ -780,17 +779,34 @@
});
</script>
<template>
  <div style="margin-top: 10px;">
     <el-button style="margin-left: 15px;" id="searchButton" type="primary" @click="dialogFormVisiblea = true;dialogFormVisible = false;dialogFormVisibleb = false;dialogFormVisiblec = false;" >{{ $t('processCard.beforefurnace') }}</el-button>
     <el-button style="margin-left: 15px;" id="searchButton" type="primary" @click="dialogFormVisible = true;dialogFormVisiblea = false;dialogFormVisibleb = false;dialogFormVisiblec = false;">{{ $t('processCard.intofurnace') }}</el-button>
    <el-button  id="searchButton" type="success" @click="dialogFormVisibleb = true;dialogFormVisible = false;dialogFormVisiblea = false;dialogFormVisiblec = false;">{{ $t('processCard.outfurnace') }}</el-button>
    <el-button  id="searchButton" type="info" @click="dialogFormVisiblec = true;dialogFormVisibleb = false;dialogFormVisible = false;dialogFormVisiblea = false">{{ $t('processCard.print') }}</el-button>
<div v-if="dialogFormVisible" >
    <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;height: 600px;" v-loading="loading">
<div style="width: 49%;float: right;background-color: #f4f4f5;height: 430px;">
    <div v-if="adjustedRects1.length > 0">
      <!-- <div style="text-align: center;">炉号：{{ engineerIdDisplay }}-{{ adjustedRects[0].temperingLayoutId }}</div>   -->
    <div style="text-align: center;"> {{ $t('processCard.temperinglayout') }}：{{ adjustedRects1[0].engineerId }}-{{ adjustedRects1[0].temperingLayoutId }} </div>
  <div style="height: 500px;">
    <div style="margin-top: 10px;">
      <el-button style="margin-left: 15px;" id="searchButton" type="primary"
                 @click="dialogFormVisiblea = true;dialogFormVisible = false;dialogFormVisibleb = false;dialogFormVisiblec = false;">
        {{ $t('processCard.beforefurnace') }}
      </el-button>
      <el-button style="margin-left: 15px;" id="searchButton" type="primary"
                 @click="dialogFormVisible = true;dialogFormVisiblea = false;dialogFormVisibleb = false;dialogFormVisiblec = false;">
        {{ $t('processCard.intofurnace') }}
      </el-button>
      <el-button id="searchButton" type="success"
                 @click="dialogFormVisibleb = true;dialogFormVisible = false;dialogFormVisiblea = false;dialogFormVisiblec = false;">
        {{ $t('processCard.outfurnace') }}
      </el-button>
      <el-button id="searchButton" type="info"
                 @click="dialogFormVisiblec = true;dialogFormVisibleb = false;dialogFormVisible = false;dialogFormVisiblea = false">
        {{ $t('processCard.print') }}
      </el-button>
      <div v-if="dialogFormVisible">
        <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;height: 600px;"
                 v-loading="loading">
          <div style="width: 49%;float: right;background-color: #f4f4f5;height: 430px;">
            <div v-if="adjustedRects1.length > 0">
              <!-- <div style="text-align: center;">炉号：{{ engineerIdDisplay }}-{{ adjustedRects[0].temperingLayoutId }}</div>   -->
              <div style="text-align: center;"> {{ $t('processCard.temperinglayout') }}：{{
                  adjustedRects1[0].engineerId
                }}-{{ adjustedRects1[0].temperingLayoutId }}
              </div>
    <el-scrollbar height="430px" style="background-color: #e9e9eb;">
    <div  style="position: relative;max-width: 1400px;">  
      <div  
@@ -984,17 +1000,19 @@
      <el-table  
        :data="tableData"  
        style="width: 100%;height: 760px"  
      >  
      <el-table-column prop="flowCardId" :label="$t('processCard.flowcard')" width="140" align="center"/>
      <el-table-column prop="layer" :label="$t('processCard.layer')" align="center" width="52"/>
      <el-table-column prop="engineerId" :label="$t('processCard.project')" align="center" width="110"/>
      <el-table-column prop="temperingLayoutId" :label="$t('processCard.temperinglayout')" align="center" width="52"/>
      <el-table-column prop="temperingFeedSequence" :label="$t('processCard.temperingfeed')" align="center" width="52"/>
      <el-table-column prop="width" :label="$t('processCard.width')" align="center" width="80"/>
      <el-table-column prop="height" :label="$t('processCard.height')" align="center" width="80"/>
      <el-table-column prop="thickness" :label="$t('processCard.thickness')" align="center" width="52"/>
      </el-table>  
    </el-dialog>  
      >
        <el-table-column prop="flowCardId" :label="$t('processCard.flowcard')" width="140" align="center"/>
        <el-table-column prop="layer" :label="$t('processCard.layer')" align="center" width="52"/>
        <el-table-column prop="engineerId" :label="$t('processCard.project')" align="center" width="110"/>
        <el-table-column prop="temperingLayoutId" :label="$t('processCard.temperinglayout')" align="center" width="52"/>
        <el-table-column prop="temperingFeedSequence" :label="$t('processCard.temperingfeed')" align="center"
                         width="52"/>
        <el-table-column prop="width" :label="$t('processCard.width')" align="center" width="80"/>
        <el-table-column prop="height" :label="$t('processCard.height')" align="center" width="80"/>
        <el-table-column prop="thickness" :label="$t('processCard.thickness')" align="center" width="52"/>
      </el-table>
  </el-dialog>
    </div>
  </div>
</template>
<style scoped>

 UI-Project/src/views/PurchaseReturn/purchaseStorage.vue

@@ -1,13 +1,10 @@
<script setup>
import {Search} from "@element-plus/icons-vue";
import {reactive} from "vue";
import {useRouter} from "vue-router"
import { ElMessage, ElMessageBox } from 'element-plus'
import {onBeforeUnmount, onMounted, onUnmounted, ref} from "vue";
import {ElMessage} from 'element-plus'
import request from "@/utils/request"
 
import { ref, onMounted, onBeforeUnmount,onUnmounted } from 'vue';  
import { WebSocketHost ,host} from '@/utils/constants'
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
import {host, WebSocketHost} from '@/utils/constants'
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';

const adjustedRects = ref([]);
const currentGlassId = ref(null);
const currenttemperingFeedSequence = ref(null);
@@ -161,19 +158,24 @@
  closeWebSocket();
});
</script>
 

<template>
  <div style="margin-top: 10px;">
<div>
    <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;height: 800px;" v-loading="loading">
      <!-- <el-card style="margin-left: 10px;margin-top: 10px;margin-right: 10px;" v-loading="loading"> -->
      <div v-if="adjustedRects.length > 0">
      <div style="text-align: center;">炉号：{{ adjustedRects[0].engineerId }}-{{ adjustedRects[0].temperingLayoutId }}</div>  
    <el-scrollbar height="750px" width="1400px" style="background-color: #e9e9eb;">
    <div  style="position: relative;">  
      <div  
      v-for="(rect, index) in adjustedRects"
      :key="index"  
  <div style="height: 500px;">
    <div style="margin-top: 10px;">
      <div>
        <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;height: 800px;"
                 v-loading="loading">
          <!-- <el-card style="margin-left: 10px;margin-top: 10px;margin-right: 10px;" v-loading="loading"> -->
          <div v-if="adjustedRects.length > 0">
            <div style="text-align: center;">炉号：{{ adjustedRects[0].engineerId }}-{{
                adjustedRects[0].temperingLayoutId
              }}
            </div>
            <el-scrollbar height="750px" width="1400px" style="background-color: #e9e9eb;">
              <div style="position: relative;">
                <div
                    v-for="(rect, index) in adjustedRects"
                    :key="index"
      @click="showDialog(rect)"  
      class="rect"  
      :style="{ position: 'absolute',  top: `${rect.ycoordinate}px`, left: `${rect.xcoordinate}px`,
@@ -187,17 +189,18 @@
  </div>
  </div> 
   </div>
   </el-scrollbar>
   </div>
    </el-card>
    </div>
    <el-dialog v-model="blind" top="30vh" width="15%" style="text-align: center;" @close="handleDialogClose">
        <el-button :disabled="!canSelectProject" type="warning" plain :icon="Delete" @click="handleDamage"  style="width: 140px;margin-left: 10px;">
            </el-scrollbar>
          </div>
        </el-card>
      </div>
      <el-dialog v-model="blind" top="30vh" width="15%" style="text-align: center;" @close="handleDialogClose">
        <el-button :disabled="!canSelectProject" type="warning" plain :icon="Delete" @click="handleDamage"
                   style="width: 140px;margin-left: 10px;">
          {{ $t('order.dilapidation') }}
        </el-button>
  </el-dialog> 
      </el-dialog>
    </div>
  </div>
 
</template>
 
<style scoped>

 UI-Project/src/views/Returns/returns.vue

@@ -579,21 +579,31 @@
  } catch (error) {
    console.error('请求时发生错误', error);
    ElMessage.error('请求时发生错误');
  }  
  }
};
</script>
<template>
  <div>
    <div id="dotClass">
      <div>{{ $t('basicData.laserprinting') }}</div>  
    <i :style="{ marginTop: '2px', backgroundColor: markingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>  
    <el-button @click="confirmMarkingMachine" style="margin-left: 30px;margin-top: -3px;">{{ $t('basicData.yes') }}</el-button>
    <div style="margin-left: 70px;">{{ $t('basicData.cuttingmachine') }}</div>
    <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>  
    <el-button @click="confirmCuttingMachine" style="margin-left: 30px;margin-top: -3px;" >{{ $t('basicData.yes') }}</el-button>
    <div style="margin-left: 70px;">{{ upstatus  }} </div>
    <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatusColor, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>  
    <el-button @click="confirmCutting" style="margin-left: 30px;margin-top: -3px;" >{{ $t('basicData.change') }}</el-button>
  <div style="height: 500px;">
    <div>
      <div id="dotClass">
        <div>{{ $t('basicData.laserprinting') }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: markingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
        <el-button @click="confirmMarkingMachine" style="margin-left: 30px;margin-top: -3px;">{{
            $t('basicData.yes')
          }}
        </el-button>
        <div style="margin-left: 70px;">{{ $t('basicData.cuttingmachine') }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
        <el-button @click="confirmCuttingMachine" style="margin-left: 30px;margin-top: -3px;">{{
            $t('basicData.yes')
          }}
        </el-button>
        <div style="margin-left: 70px;">{{ upstatus }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatusColor, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
        <el-button @click="confirmCutting" style="margin-left: 30px;margin-top: -3px;">{{
            $t('basicData.change')
          }}
        </el-button>
  
  </div>
    <el-button :disabled="!canSelectProject" style="margin-top: 5px;margin-left: 15px;"  type="primary" @click="selectproject">{{ $t('basicData.selectproject') }}</el-button>
@@ -885,6 +895,7 @@
      </div>
    </template>
  </el-dialog>
  </div>
</template>
<style scoped>
#dt { display:block; float:left;line-height: 20px;margin-left: 100px;}

 UI-Project/src/views/Returns/upreturns.vue

@@ -235,21 +235,31 @@
    }
  } catch (error) {
    ElMessage.error(t('basicData.glassnull'));
  }  
  }
};
</script>
<template>
  <div>
    <div id="dotClass">
      <div>{{ $t('basicData.laserprinting') }}</div>  
    <i :style="{ marginTop: '2px', backgroundColor: markingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>  
    <el-button @click="confirmMarkingMachine" style="margin-left: 30px;margin-top: -3px;">{{ $t('basicData.yes') }}</el-button>
    <div style="margin-left: 70px;">{{ $t('basicData.cuttingmachine') }}</div>
    <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>  
    <el-button @click="confirmCuttingMachine" style="margin-left: 30px;margin-top: -3px;" >{{ $t('basicData.yes') }}</el-button>
    <div style="margin-left: 70px;">{{ upstatus  }} </div>
    <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatusColor, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>  
    <el-button @click="confirmCutting" style="margin-left: 30px;margin-top: -3px;" >{{ $t('basicData.change') }}</el-button>
  <div style="height: 500px;">
    <div>
      <div id="dotClass">
        <div>{{ $t('basicData.laserprinting') }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: markingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
        <el-button @click="confirmMarkingMachine" style="margin-left: 30px;margin-top: -3px;">{{
            $t('basicData.yes')
          }}
        </el-button>
        <div style="margin-left: 70px;">{{ $t('basicData.cuttingmachine') }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
        <el-button @click="confirmCuttingMachine" style="margin-left: 30px;margin-top: -3px;">{{
            $t('basicData.yes')
          }}
        </el-button>
        <div style="margin-left: 70px;">{{ upstatus }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatusColor, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
        <el-button @click="confirmCutting" style="margin-left: 30px;margin-top: -3px;">{{
            $t('basicData.change')
          }}
        </el-button>
  </div>
    <el-button style="margin-top: 5px;margin-left: 15px;"  type="primary" @click="selectproject">{{ $t('Mounting.previewproject') }}</el-button>
    <el-button style="margin-top: 5px;margin-left: 20px;" type="success" @click="handleBind">{{ $t('basicData.startloading') }}</el-button>
@@ -310,7 +320,7 @@
        <div style="display: flex;">
          <img src="../../assets/shangpianji.png" alt=""
               style="max-width: 25%;max-height: 25%;margin-left: 10%;margin-top: 5%;">
          <el-table :data="tableDataa" border style="width: 75%;margin-top: 10%;margin-left: 2%;"
          <el-table :data="tableDataa" border style="width: 75%;margin-top: 10%;margin-left: 8%;"
                    :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"
          >
            <el-table-column prop="workstationId" align="center" :label="$t('basicData.station')" min-width="60"/>
@@ -318,7 +328,7 @@
            <el-table-column prop="patternHeight" align="center" :label="$t('basicData.height')" min-width="80"/>
            <el-table-column prop="filmsId" align="center" :label="$t('basicData.coatingtypes')" min-width="80"/>
            <el-table-column prop="number" align="center" :label="$t('basicData.quantity')" min-width="80"/>
        </el-table>
          </el-table>
    </div>
  </div>
      <!-- <div style="width: 48%;float: right;">
@@ -432,7 +442,7 @@
      </div>
    </template>
  </el-dialog>

  </div>
</template>
 
<style scoped>

 UI-Project/src/views/Returns/upreturns2.vue

@@ -235,21 +235,31 @@
    }
  } catch (error) {
    ElMessage.error(t('basicData.glassnull'));
  }  
  }
};
</script>
<template>
  <div>
    <div id="dotClass">
      <div>{{ $t('basicData.laserprinting') }}</div>  
    <i :style="{ marginTop: '2px', backgroundColor: markingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>  
    <el-button @click="confirmMarkingMachine" style="margin-left: 30px;margin-top: -3px;">{{ $t('basicData.yes') }}</el-button>
    <div style="margin-left: 70px;">{{ $t('basicData.cuttingmachine') }}</div>
    <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>  
    <el-button @click="confirmCuttingMachine" style="margin-left: 30px;margin-top: -3px;" >{{ $t('basicData.yes') }}</el-button>
    <div style="margin-left: 70px;">{{ upstatus  }} </div>
    <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatusColor, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>  
    <el-button @click="confirmCutting" style="margin-left: 30px;margin-top: -3px;" >{{ $t('basicData.change') }}</el-button>
  <div style="height: 500px;">
    <div>
      <div id="dotClass">
        <div>{{ $t('basicData.laserprinting') }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: markingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
        <el-button @click="confirmMarkingMachine" style="margin-left: 30px;margin-top: -3px;">{{
            $t('basicData.yes')
          }}
        </el-button>
        <div style="margin-left: 70px;">{{ $t('basicData.cuttingmachine') }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatus, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
        <el-button @click="confirmCuttingMachine" style="margin-left: 30px;margin-top: -3px;">{{
            $t('basicData.yes')
          }}
        </el-button>
        <div style="margin-left: 70px;">{{ upstatus }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: cuttingMachineStatusColor, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
        <el-button @click="confirmCutting" style="margin-left: 30px;margin-top: -3px;">{{
            $t('basicData.change')
          }}
        </el-button>
  </div>
    <el-button style="margin-top: 5px;margin-left: 15px;"  type="primary" @click="selectproject">{{ $t('Mounting.previewproject') }}</el-button>
    <el-button style="margin-top: 5px;margin-left: 20px;" type="success" @click="handleBind">{{ $t('basicData.startloading') }}</el-button>
@@ -310,7 +320,7 @@
        <div style="display: flex;">
          <img src="../../assets/shangpianji.png" alt=""
               style="max-width: 25%;max-height: 25%;margin-left: 10%;margin-top: 5%;">
          <el-table :data="tableDataa" border style="width: 75%;margin-top: 10%;margin-left: 2%;"
          <el-table :data="tableDataa" border style="width: 75%;margin-top: 10%;margin-left: 8%;"
                    :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"
          >
            <el-table-column prop="workstationId" align="center" :label="$t('basicData.station')" min-width="60"/>
@@ -432,7 +442,7 @@
      </div>
    </template>
  </el-dialog>

  </div>
</template>
 
<style scoped>

 UI-Project/src/views/StockBasicData/stockBasicData.vue

@@ -1,25 +1,24 @@
<script setup>
import {Search} from "@element-plus/icons-vue";
import {reactive} from "vue";
import {onBeforeUnmount, onMounted, onUnmounted, reactive, ref} from "vue";
import {useRouter} from "vue-router"
import {host, WebSocketHost} from '@/utils/constants'
import request from "@/utils/request"
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
// import { ref } from 'vue'
import {ElMessage, ElMessageBox} from 'element-plus'
//  import LanguageMixin from './lang/LanguageMixin'
import {useI18n} from 'vue-i18n'

const router = useRouter()
const adda = ref(false)
import { WebSocketHost ,host} from '@/utils/constants'
import request from "@/utils/request"
import { ref, onMounted , onBeforeUnmount,onUnmounted} from "vue";
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
// import { ref } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
//  import LanguageMixin from './lang/LanguageMixin'
  import { useI18n } from 'vue-i18n'
  const { t } = useI18n()
  let language = ref(localStorage.getItem('lang') || 'zh')
 
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')

const tableData = ref([])
const slot = ref('')
const requestData = {  
  line: 2001  
};  
const requestData = {
  line: 2001
};
const timeRange = ref([])
const selectValuesa = reactive([]);
// request.post("/cacheGlass/taskCache/selectEdgTask",{
@@ -144,26 +143,29 @@
});
  onUnmounted(() => {
    if (socket) {
    closeWebSocket(socket);
      closeWebSocket(socket);
    }
    });
  });
onBeforeUnmount(() => {
  console.log("关闭了")
  closeWebSocket();
});
</script>
<template>
  <div>
    <el-card style="flex: 1;margin-left: 10px;margin-top: 20px;" v-loading="loading">
      <el-select v-model="selectValuesa[0]" filterable :placeholder="$t('workOrder.cway')" clearable style="margin-left: 20px;margin-bottom: 10px;">
            <el-option :label="$t('workOrder.edgingone')" value="2001"></el-option>
            <el-option :label="$t('workOrder.edgingtwo')" value="2002"></el-option>
          </el-select>
 
          <el-select v-model="selectValuesa[1]" filterable :placeholder="$t('workOrder.cstate')" clearable style="margin-left: 20px;margin-bottom: 10px;" >
            <el-option :label="$t('workOrder.nedging')" value="0"></el-option>
            <el-option :label="$t('workOrder.edging')" value="1"></el-option>
            <el-option :label="$t('workOrder.finedging')" value="2"></el-option>
  <div style="height: 500px;">
    <div>
      <el-card style="flex: 1;margin-left: 10px;margin-top: 20px;" v-loading="loading">
        <el-select v-model="selectValuesa[0]" filterable :placeholder="$t('workOrder.cway')" clearable
                   style="margin-left: 20px;margin-bottom: 10px;">
          <el-option :label="$t('workOrder.edgingone')" value="2001"></el-option>
          <el-option :label="$t('workOrder.edgingtwo')" value="2002"></el-option>
        </el-select>

        <el-select v-model="selectValuesa[1]" filterable :placeholder="$t('workOrder.cstate')" clearable
                   style="margin-left: 20px;margin-bottom: 10px;">
          <el-option :label="$t('workOrder.nedging')" value="0"></el-option>
          <el-option :label="$t('workOrder.edging')" value="1"></el-option>
          <el-option :label="$t('workOrder.finedging')" value="2"></el-option>
          </el-select>
          <span class="demonstration" style="margin-left: 20px;margin-bottom: 10px;">{{ $t('workOrder.time') }}</span>
            <el-date-picker v-model="timeRange" type="datetimerange" range-separator="至" :start-placeholder="$t('reportmanage.starttime')"  style="margin-left: 20px;margin-bottom: 10px;" value-format = "YYYY-MM-DD hh:mm:ss"
@@ -189,17 +191,24 @@
              {{ scope.row.status==0?"未磨边":scope.row.status==1?"磨边中":"已磨边" }}
            </template>
        </el-table-column>
 
 


          <el-table-column fixed="right" :label="$t('workOrder.operate')" align="center" width="200">
            <template #default="scope">
              <el-button size="mini" type="text" plain @click="open(scope.row)">{{ $t('workOrder.breakage') }}</el-button>
              <el-button size="mini" type="text" plain @click="opena(scope.row)">{{ $t('workOrder.takeout') }}</el-button>
              <el-button size="mini" type="text" plain @click="open(scope.row)">{{
                  $t('workOrder.breakage')
                }}
              </el-button>
              <el-button size="mini" type="text" plain @click="opena(scope.row)">{{
                  $t('workOrder.takeout')
                }}
              </el-button>
            </template>
        </el-table-column>
          </el-table-column>
        </el-table>
      </div>
    </el-card>
      </el-card>
    </div>
  </div>
</template>
 

 UI-Project/src/views/StockBasicData/stockBasicDatatwo.vue

@@ -1,25 +1,24 @@
<script setup>
import {Search} from "@element-plus/icons-vue";
import {reactive} from "vue";
import {onBeforeUnmount, onMounted, onUnmounted, ref} from "vue";
import {useRouter} from "vue-router"
import {host, WebSocketHost} from '@/utils/constants'
import request from "@/utils/request"
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
// import { ref } from 'vue'
import {ElMessage, ElMessageBox} from 'element-plus'
//  import LanguageMixin from './lang/LanguageMixin'
import {useI18n} from 'vue-i18n'

const router = useRouter()
const adda = ref(false)
import { WebSocketHost ,host} from '@/utils/constants'
import request from "@/utils/request"
import { ref, onMounted , onBeforeUnmount,onUnmounted} from "vue";
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
// import { ref } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
//  import LanguageMixin from './lang/LanguageMixin'
  import { useI18n } from 'vue-i18n'
  const { t } = useI18n()
  let language = ref(localStorage.getItem('lang') || 'zh')
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')

const tableData = ref([])
const slot = ref('')
const requestData = {  
const requestData = {
  line: 2002
};  
};
// request.post("/cacheGlass/taskCache/selectEdgTask",{
//   ...requestData,  

@@ -122,17 +121,17 @@
</script>

<template>
  <div>
  <div style="height: 500px;">
    <el-card style="flex: 1;margin-left: 10px;margin-top: 20px;" v-loading="loading">
      <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;">
        <el-table height="240" ref="table" 
        @selection-change="handleSelectionChange"
        :data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
          <el-table-column prop="glass_id" align="center" :label="$t('workOrder.glassID')" min-width="180" />
          <el-table-column prop="width" align="center" :label="$t('workOrder.width')" min-width="120" />
          <el-table-column prop="height" align="center" :label="$t('workOrder.height')" min-width="80" />
          <el-table-column prop="thickness" align="center" :label="$t('workOrder.thickness')" min-width="120" />
          <el-table-column prop="glass_type" align="center" :label="$t('workOrder.glasstype')" min-width="120" />
        <el-table height="240" ref="table"
                  @selection-change="handleSelectionChange"
                  :data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
          <el-table-column prop="glass_id" align="center" :label="$t('workOrder.glassID')" min-width="180"/>
          <el-table-column prop="width" align="center" :label="$t('workOrder.width')" min-width="120"/>
          <el-table-column prop="height" align="center" :label="$t('workOrder.height')" min-width="80"/>
          <el-table-column prop="thickness" align="center" :label="$t('workOrder.thickness')" min-width="120"/>
          <el-table-column prop="glass_type" align="center" :label="$t('workOrder.glasstype')" min-width="120"/>
          <el-table-column fixed="right" :label="$t('workOrder.operate')" align="center" width="200">
            <template #default="scope">
              <el-button size="mini" type="text" plain @click="open(scope.row)">{{ $t('workOrder.breakage') }}</el-button>

 UI-Project/src/views/UnLoadGlass/loadmachinerack.vue

@@ -1,18 +1,14 @@
<script setup>
import { onBeforeUnmount, onMounted, onUnmounted, reactive, ref } from "vue";
import { useRouter } from "vue-router"
import { useI18n } from 'vue-i18n'
import { ElMessage } from 'element-plus'
import {onBeforeUnmount, onMounted, onUnmounted, reactive, ref} from "vue";
import {useRouter} from "vue-router"
import {useI18n} from 'vue-i18n'
import {ElMessage} from 'element-plus'
import request from "@/utils/request";
import { closeWebSocket, initializeWebSocket } from '@/utils/WebSocketService';
import { host, WebSocketHost } from '@/utils/constants'
import PrintFlow from "@/views/UnLoadGlass/PrintFlow.vue";
import Landingindication from "./Landingindication.vue";
import Landingindicationtwo from "./Landingindicationtwo.vue";
import PrintLabel from "@/views/UnLoadGlass/PrintCustomLabelSemi1.vue";
 
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import {host, WebSocketHost} from '@/utils/constants'

const router = useRouter()
const { t } = useI18n()
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
const printLoading = ref(true)
const fullFlowCard = ref('')
@@ -434,27 +430,26 @@
    body.removeChild(style);
  }, 20);
}
 
 
 
 


// beforeUnmount(() => {
//   closeWebSocket();
// });
// setInterval(fetchTableData, 2000)
</script>
<template>
  <div>
    <el-button style="margin-top: 10px;margin-left: 10px;margin-bottom: 10px;" id="searchButton" type="primary"
      @click="dialogFormVisibleaDownGlass = true">{{ $t('reportWork.details') }}
    </el-button>
    <el-button style="margin-top: 10px;margin-left: 10px;margin-bottom: 10px;" id="searchButton" type="primary"
      @click="dialogFormVisibleaDownGlasss = true">{{ $t('reportWork.filming') }}
    </el-button>
    <el-switch style="margin-top: 10px;margin-left: 15px;margin-bottom: 10px;" v-model="autoPrint" class="mb-2"
      :inactive-text="$t('basicData.printing')" @change="handleChange" />
    <el-card style="flex: 1;" v-loading="loading">
      <el-card style="flex: 1;margin-left: 4px;margin-top: 1px;" v-loading="loading">
  <div style="height: 500px;">
    <div>
      <el-button style="margin-top: 10px;margin-left: 10px;margin-bottom: 10px;" id="searchButton" type="primary"
                 @click="dialogFormVisibleaDownGlass = true">{{ $t('reportWork.details') }}
      </el-button>
      <el-button style="margin-top: 10px;margin-left: 10px;margin-bottom: 10px;" id="searchButton" type="primary"
                 @click="dialogFormVisibleaDownGlasss = true">{{ $t('reportWork.filming') }}
      </el-button>
      <el-switch style="margin-top: 10px;margin-left: 15px;margin-bottom: 10px;" v-model="autoPrint" class="mb-2"
                 :inactive-text="$t('basicData.printing')" @change="handleChange"/>
      <el-card style="flex: 1;" v-loading="loading">
        <el-card style="flex: 1;margin-left: 4px;margin-top: 1px;" v-loading="loading">
        <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;">
          <el-table height="350px" ref="table" @selection-change="handleSelectionChange" :data="tableData"
            :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }">
@@ -586,7 +581,6 @@
    </el-card>
 
  </div>
 
  <el-dialog v-model="dialogFormVisiblea" top="21vh" width="40%" :title="$t('reportWork.bindingshelves')">
    <div style="margin-left: 50px;margin-top: 10px;margin-bottom: 10px;">
      <el-form size="mini" label-width="100px">
@@ -623,15 +617,15 @@
      </div>
    </template>
  </el-dialog>
 
  <el-dialog id="sizePrintCalrd" v-model="dialogTableVisible" destroy-on-close>
    <print-flow id="child" :printFlowCardId="printFlowCardId" :printLayer="printLayer"
      style="width: 100%;height: 100%" />
  </el-dialog>
  <el-dialog id="sizePrintCalrd1" v-model="dialogTableVisible1" destroy-on-close>
    <print-label id="printFlowCard" :printFlowCardId="printFlowCardId" :printLayer="printLayer" :printGlassId="printGlassId"  style="" />
  </el-dialog>
 
    <el-dialog id="sizePrintCalrd" v-model="dialogTableVisible" destroy-on-close>
      <print-flow id="child" :printFlowCardId="printFlowCardId" :printLayer="printLayer"
                  style="width: 100%;height: 100%"/>
    </el-dialog>
    <el-dialog id="sizePrintCalrd1" v-model="dialogTableVisible1" destroy-on-close>
      <print-label id="printFlowCard" :printFlowCardId="printFlowCardId" :printLayer="printLayer"
                   :printGlassId="printGlassId" style=""/>
    </el-dialog>
  </div>
</template>
<style scoped>
#dt {

 UI-Project/src/views/largescreen/largescreen.vue

@@ -1,15 +1,16 @@
<template>  
  <el-card style="flex: 1;margin-left: 1px;margin-top: 10px;margin-right: 1px;" v-loading="loading">
    <el-scrollbar height="800px">
  <div style="font-size: 20px;font-weight: bold;">{{ $t('large.loading') }}{{ temperingtotal }} </div>
  <div id="top" style="height: 150px;display: flex; justify-content: center; align-items: center;">  
  <div class="echarts-container">
  <div v-for="(processData, index) in processesData" :key="index" class="echarts-item" @click="showDialog">
    <div :id="'pieChart_' + index" class="pie-chart"></div>
  </div>
</div>
</div> 
<div style="display: flex;">
<template>
  <div style="height: 500px;">
    <el-card style="flex: 1;margin-left: 1px;margin-top: 10px;margin-right: 1px;" v-loading="loading">
      <el-scrollbar height="800px">
        <div style="font-size: 20px;font-weight: bold;">{{ $t('large.loading') }}{{ temperingtotal }}</div>
        <div id="top" style="height: 150px;display: flex; justify-content: center; align-items: center;">
          <div class="echarts-container">
            <div v-for="(processData, index) in processesData" :key="index" class="echarts-item" @click="showDialog">
              <div :id="'pieChart_' + index" class="pie-chart"></div>
            </div>
          </div>
        </div>
        <div style="display: flex;">
<div class="parter" style="margin-top: 10px;margin-left: 150px; height: 240px;width: 1000px;">
    <img src="../../assets/dpxsa.png" style="margin-left: -10px; width: 100%;height: 100%;" alt="Your Image">
  <div  class="moving-rect lipiana" v-show="woshia"></div>
@@ -104,33 +105,37 @@
  </template>
</el-dialog>
<el-dialog v-model="blind" top="10vh" width="70%" >
  <el-date-picker style="margin-left: 1px;"  v-model="timeRange" type="daterange" format="YYYY/MM/DD" value-format="YYYY-MM-DD"
  :start-placeholder="$t('large.starttime')" :end-placeholder="$t('large.endtime')" :default-time="defaultTime" />
    <el-button type="primary" style="margin-left: 10px;margin-top: -6px;" @click="selectReportData()">{{ $t('large.inquire') }}</el-button>
    <div style="height: 550px;display: flex;margin-top: 10px;justify-content: center; align-items: center;">  
  <div class="echarts-container">
  <div v-for="(processData, index) in dialogprocesses" :key="index" class="echarts-item">
    <div :id="'dialogPieChart_' + index" class="pie-chart"></div>
  <el-date-picker style="margin-left: 1px;" v-model="timeRange" type="daterange" format="YYYY/MM/DD" value-format="YYYY-MM-DD"
                  :start-placeholder="$t('large.starttime')" :end-placeholder="$t('large.endtime')"
                  :default-time="defaultTime"/>
  <el-button type="primary" style="margin-left: 10px;margin-top: -6px;" @click="selectReportData()">
    {{ $t('large.inquire') }}
  </el-button>
  <div style="height: 550px;display: flex;margin-top: 10px;justify-content: center; align-items: center;">
    <div class="echarts-container">
      <div v-for="(processData, index) in dialogprocesses" :key="index" class="echarts-item">
        <div :id="'dialogPieChart_' + index" class="pie-chart"></div>
      </div>
    </div>
  </div>
</el-dialog>
  </div>
  </div>
  </el-dialog> 
</template>  
<script setup>  
import { Delete, Upload } from '@element-plus/icons-vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { ref, onMounted , onBeforeUnmount, reactive, computed, shallowRef, onUnmounted, watchEffect,nextTick  } from "vue";
</template>
<script setup>
import {ElMessage} from 'element-plus'
import {nextTick, onBeforeUnmount, onMounted, onUnmounted, ref} from "vue";
import request from "@/utils/request"
import { WebSocketHost ,host} from '@/utils/constants'
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
import {host, WebSocketHost} from '@/utils/constants'
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import {useI18n} from 'vue-i18n'
import * as echarts from 'echarts';

const {t} = useI18n()
const tableData = ref([])
const tableDatab = ref([])
const tableDatac = ref([])
const adjustedRects = ref([]);  
const chartRefs = ref([]);  
const adjustedRects = ref([]);
const chartRefs = ref([]);
const timeRange = ref([])
const flake = ref(false)
const flakeb = ref(false)

 UI-Project/vue.config.js

@@ -2,4 +2,16 @@
    assetsDir: 'static',
    parallel: false,
    publicPath: './',
    presets: [
        // '@vue/cli-plugin-babel/preset', 
        '@vue/app',
        [
            '@babel/preset-env',
            {
                useBuiltIns: 'entry'
            }
        ]
    ],
    sourceType: 'unambiguous',

};