ZengTao
2025-03-19 839957125186876493ceb3b96c553384cb1a76fe
UI-Project/src/views/largescreendisplay/screendisplay.vue
@@ -1,16 +1,17 @@
<script setup>
import { onBeforeUnmount, onMounted, onUnmounted, reactive, ref } from "vue";
import { useRouter } from "vue-router"
import { host, WebSocketHost } from '@/utils/constants'
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 {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import dayjs from 'dayjs';
import { ElMessage, ElMessageBox } from 'element-plus'
import { useI18n } from 'vue-i18n'
import {ElMessage} from 'element-plus'
import {useI18n} from 'vue-i18n'
const router = useRouter()
const blinda = ref(false)
const blindb = ref(false)
const { t } = useI18n()
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
let socket = null;
const rawGlassStorageDetailList = ref([])
@@ -224,7 +225,7 @@
      style: {
        width: '15px',
        height: '15px',
        backgroundColor: i % 2 === 0 ? '#911005' : 'blue',
        backgroundColor: i % 2 === 0 ? '#911005' : '#911005',
        position: 'absolute',
        transform: `translate(0px, 0px)`
      }
@@ -242,7 +243,7 @@
      style: {
        width: '15px',
        height: '15px',
        backgroundColor: i % 2 === 0 ? '#911005' : 'blue',
        backgroundColor: i % 2 === 0 ? '#911005' : '#911005',
        position: 'absolute',
        transform: `translate(0px, 0px)`
      }
@@ -260,7 +261,7 @@
      style: {
        width: '15px',
        height: '15px',
        backgroundColor: i % 2 === 0 ? '#911005' : 'blue',
        backgroundColor: i % 2 === 0 ? '#911005' : '#911005',
        position: 'absolute',
        transform: `translate(0px, 0px)`
      }
@@ -384,27 +385,25 @@
const iframe4 = ref(false);
const handlehistorical4 = () => {
  iframe4.value = true;
  iframeUrl4.value =`${window.location.origin}/#/StockBasicData/stockhistory`;;
  iframeUrl4.value =`${window.location.origin}/#/Caching/cachingbeforehistory`;
};
const iframeUrl5 = ref('');
const iframe5 = ref(false);
const handlehistorical5 = () => {
  iframe5.value = true;
  iframeUrl5.value = `${window.location.origin}/#/hollow/hellowslicecagehistory`;
  iframeUrl5.value = `${window.location.origin}/#/hollow/hellowslicecagehistory`;
  iframeUrl5.value = `${window.location.origin}/#/Caching/cachingunhistory`;
};
const iframeUrl6 = ref('');
const iframe6 = ref(false);
const handlehistorical6 = () => {
  iframe6.value = true;
  iframeUrl6.value =  `${window.location.origin}/#/Slicecage/slicecagehistory`;
  iframeUrl6.value = `${window.location.origin}/#/Slicecage/slicecagehistory`;
};
const iframeUrl7 = ref('');
const iframe7 = ref(false);
const handlehistorical7 = () => {
  iframe7.value = true;
  iframeUrl7.value = `${window.location.origin}/#/hollow/hellowquiptwohistory`;
  iframeUrl7.value = `${window.location.origin}/#/hollow/hellowquiphistory`;
};
const iframeUrl8 = ref('');
const iframe8 = ref(false);
@@ -416,7 +415,13 @@
const iframe9 = ref(false);
const handlehistorical9 = () => {
  iframe9.value = true;
  iframeUrl9.value = `${window.location.origin}/#/largescreendisplay/statistics`;
  iframeUrl9.value = `${window.location.origin}/#/hollow/hellowslicecagehistory`;
};
const iframeUrl10 = ref('');
const iframe10 = ref(false);
const handlehistorical10 = () => {
  iframe10.value = true;
  iframeUrl10.value = `${window.location.origin}/#/largescreendisplay/statistics`;
};
</script>
<template>
@@ -442,26 +447,33 @@
    <el-dialog v-model="iframe7" top="10vh" width="95%">
      <iframe :src="iframeUrl7" marginwidth="2000px" marginheight="2000px" width="100%" height="750px" frameborder="0"></iframe>
    </el-dialog>
    <el-dialog v-model="iframe8" top="10vh" width="95%">
      <iframe :src="iframeUrl8" marginwidth="2000px" marginheight="2000px" width="100%" height="750px" frameborder="0"></iframe>
    </el-dialog>
    <el-dialog v-model="iframe9" top="10vh" width="95%">
      <iframe :src="iframeUrl9" marginwidth="2000px" marginheight="2000px" width="100%" height="750px" frameborder="0"></iframe>
    </el-dialog>
    <el-dialog v-model="iframe10" top="10vh" width="95%">
      <iframe :src="iframeUrl10" marginwidth="2000px" marginheight="2000px" width="100%" height="750px" frameborder="0"></iframe>
    </el-dialog>
    <!-- 生产统计 -->
    <div style="height: 190px;width: 43%;float: right;position: absolute;" @click="handlehistorical9">
      <el-table height="700" ref="table" :data="productionVO"
    <div style="height: 100px;width: 88%;float: right;position: absolute;" @click="handlehistorical10">
      <el-table height="100" ref="table" :data="productionVO"
        :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }">
        <el-table-column prop="date" align="center" :label="$t('large.date')" min-width="70" />
        <el-table-column prop="countOutOne" align="center" :label="$t('large.countOutOne')" min-width="40" />
        <el-table-column prop="totalAreaOutOne" align="center" :label="$t('large.totalAreaOutOne')" min-width="40" />
        <el-table-column prop="countOutTwo" align="center" :label="$t('large.countOutTwo')" min-width="50" />
        <el-table-column prop="totalAreaOutTwo" align="center" :label="$t('large.totalAreaOutTwo')" min-width="40" />
        <el-table-column prop="countIn" align="center" :label="$t('large.countIn')" min-width="40" />
        <el-table-column prop="totalAreaIn" align="center" :label="$t('large.totalAreaIn')" min-width="40" />
        <el-table-column prop="totalAreaOutTwo" align="center" :label="$t('large.totalAreaOutTwo')" min-width="50" />
        <el-table-column prop="countIn" align="center" :label="$t('large.countIn')" min-width="50" />
        <el-table-column prop="totalAreaIn" align="center" :label="$t('large.totalAreaIn')" min-width="50" />
        <el-table-column prop="countOut" align="center" :label="$t('large.countOut')" min-width="40" />
        <el-table-column prop="totalAreaOut" align="center" :label="$t('large.totalAreaOut')" min-width="40" />
        <el-table-column prop="hollowCountOutOne" align="center" :label="$t('large.hollowCountOutOne')" min-width="40" />
        <el-table-column prop="hollowTotalAreaOutOne" align="center" :label="$t('large.hollowTotalAreaOutOne')" min-width="40" />
        <el-table-column prop="countOut" align="center" :label="$t('large.countOut')" min-width="40" />
        <el-table-column prop="hollowCountOutTwo" align="center" :label="$t('large.hollowCountOutTwo')" min-width="40" />
        <el-table-column prop="hollowTotalAreaOutTwo" align="center" :label="$t('large.hollowTotalAreaOutTwo')"
                         min-width="40"/>
        <!-- <el-table-column align="center" :label="$t('large.operate')" min-width="50">
          <template #default="scope">
            <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;"
@@ -560,16 +572,18 @@
        style="position: relative;width: 110px;height: 100px;top: 603px;left: 297px;"></div>
    </div>
    <!-- 订单情况 -->
    <div style="height: 190px;width: 48%;float: right;">
    <div style="height: 190px;width: 52%;float: right;">
      <div>
        <el-button style="margin-top: 5px;margin-left: 50px;" id="searchButton" type="info" @click="handlehistorical1">{{ $t('large.historicaltasks1') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 20px;" id="searchButton" type="info" @click="handlehistorical2">{{ $t('large.historicaltasks2') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 20px;" id="searchButton" type="info" @click="handlehistorical3">{{ $t('large.historicaltasks3') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 20px;" id="searchButton" type="info" @click="handlehistorical4">{{ $t('large.historicaltasks4') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 20px;" id="searchButton" type="info" @click="handlehistorical5">{{ $t('large.historicaltasks5') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 20px;" id="searchButton" type="info" @click="handlehistorical7">{{ $t('large.historicaltasks7') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 20px;" id="searchButton" type="info" @click="handlehistorical6">{{ $t('large.historicaltasks6') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 20px;" id="searchButton" type="info" @click="handlehistorical8">{{ $t('large.historicaltasks8') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 5px;" id="searchButton" type="info" @click="handlehistorical1">{{ $t('large.historicaltasks1') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 5px;" id="searchButton" type="info" @click="handlehistorical2">{{ $t('large.historicaltasks2') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 5px;" id="searchButton" type="info" @click="handlehistorical3">{{ $t('large.historicaltasks3') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 5px;" id="searchButton" type="info" @click="handlehistorical4">{{ $t('large.historicaltasks4') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 5px;" id="searchButton" type="info" @click="handlehistorical5">{{ $t('large.historicaltasks5') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 5px;" id="searchButton" type="info" @click="handlehistorical6">{{ $t('large.historicaltasks6') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 5px;" id="searchButton" type="info" @click="handlehistorical7">{{ $t('large.historicaltasks7') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 5px;" id="searchButton" type="info" @click="handlehistorical8">{{ $t('large.historicaltasks8') }}</el-button>
        <el-button style="margin-top: 5px;margin-left: 5px;" id="searchButton" type="info" @click="handlehistorical9">{{ $t('large.historicaltasks9') }}</el-button>
      </div>
      <el-table height="700" ref="table" :data="orderDTOS"
        :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }">
@@ -582,7 +596,7 @@
        <el-table-column prop="percent" align="center" :label="$t('large.percent')" min-width="50" />
        <el-table-column align="center" :label="$t('large.operate')" min-width="50">
          <template #default="scope">
            <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;"
            <el-button type="text" style="margin-left: 10px;margin-bottom: 10px;"
              @click="flowCardDetail(scope.row.orderId)">{{ $t('large.mes') }}</el-button>
          </template>
        </el-table-column>
@@ -620,8 +634,8 @@
  <el-dialog v-model="blinda" top="5vh" width="85%">
    <el-table height="650" ref="table" :data="tableData"
      :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }">
      <el-table-column prop="processId" fixed align="center" :label="$t('large.processId')" min-width="110" />
      <el-table-column prop="glassChild" align="center" :label="$t('large.productname')" min-width="110" />
      <el-table-column prop="processId" fixed align="center" :label="$t('large.processId')" min-width="150" />
      <el-table-column prop="glassChild" align="center" :label="$t('large.productname')" min-width="150" />
      <el-table-column prop="orderNumber" align="center" :label="$t('large.serialnumber')" min-width="110" />
      <el-table-column prop="technologyNumber" align="center" :label="$t('large.slicemarker')" min-width="110" />
      <el-table-column prop="width" align="center" :label="$t('large.width')" min-width="110" />