中空理片笼、卧式缓存模块、钢化前大理片笼、原片仓储模块新增历史任务页面，大屏显示页面修改、上片接口判断（部分）

wangfei

2025-03-12 da3b8f9268253a8da7c7d6d2217693114b48fe28

中空理片笼、卧式缓存模块、钢化前大理片笼、原片仓储模块新增历史任务页面，大屏显示页面修改、上片接口判断（部分）

 UI-Project/src/lang/en.js

@@ -837,5 +837,10 @@
          pairQuantity: '总配对数量：',
          cpairQuantity: '请输入总配对数量',
          schedulingswitch: '调度开关',
      }
      },
    screendisplay:{
        pwidth: '请输入宽度',
        pheight: '请输入高度',
        upnumber: '上片数量',
    }
  }

 UI-Project/src/lang/py.js

@@ -835,5 +835,10 @@
        pairQuantity: '总配对数量：',
        cpairQuantity: '请输入总配对数量',
        schedulingswitch: '调度开关',
    },
    screendisplay:{
        pwidth: '请输入宽度',
        pheight: '请输入高度',
        upnumber: '上片数量',
    }
}

 UI-Project/src/lang/zh.js

@@ -836,5 +836,10 @@
        pairQuantity: '总配对数量：',
        cpairQuantity: '请输入总配对数量',
        schedulingswitch: '调度开关',
    },
    screendisplay:{
        pwidth: '请输入宽度',
        pheight: '请输入高度',
        upnumber: '上片数量',
    }
}

 UI-Project/src/router/index.js

@@ -132,7 +132,14 @@
    name: 'slicecage',
    component: () => import('../views/Slicecage/slicecage.vue')
  },
  
]

// {
//   path: '/slicecagehistory',  
//   name: 'slicecagehistory',  
//   component: () => import('../views/slicecagehistory.vue')
// },
},
/*----------- 钢化 ----------------*/
{
@@ -318,7 +325,67 @@
      path: '/register',
      name: 'register',
      component: () => import('../views/RegisterView.vue')
    }
    },
    {
       path: '/slicecagehistory',
        name: 'slicecagehistory',
        component: () => import('../views/Slicecage/slicecagehistory.vue'),
        children: [
          {
           path: '/Slicecage/slicecagehistory',
           name: 'slicecagehistory',
           component: () => import('../views/Slicecage/slicecagehistory.vue')
          },
        ]
       },
       {
          path: '/hellowslicecagehistory',
           name: 'hellowslicecagehistory',
           component: () => import('../views/hollow/hellowslicecagehistory.vue'),
           children: [
             {
              path: '/hollow/hellowslicecagehistory',
              name: 'hellowslicecagehistory',
              component: () => import('../views/hollow/hellowslicecagehistory.vue')
             },
           ]
          },
          {
             path: '/cachingbeforehistory',
              name: 'cachingbeforehistory',
              component: () => import('../views/Caching/cachingbeforehistory.vue'),
              children: [
                {
                 path: '/Caching/cachingbeforehistory',
                 name: 'cachingbeforehistory',
                 component: () => import('../views/Caching/cachingbeforehistory.vue')
                },
              ]
             },
             {
              path: '/cachingunhistory',
               name: 'cachingunhistory',
               component: () => import('../views/Caching/cachingunhistory.vue'),
               children: [
                 {
                  path: '/Caching/cachingunhistory',
                  name: 'cachingunhistory',
                  component: () => import('../views/Caching/cachingunhistory.vue')
                 },
               ]
              },
              {
               path: '/rawhistory',
                name: 'rawhistory',
                component: () => import('../views/GlassStorage/rawhistory.vue'),
                children: [
                  {
                   path: '/GlassStorage/rawhistory',
                   name: 'rawhistory',
                   component: () => import('../views/GlassStorage/rawhistory.vue')
                  },
                ]
               },
  ]
})
// 导航守卫  

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

@@ -55,27 +55,28 @@
  parseAndSetTime();
});
// 历史任务
const iframeUrl = ref('');
const handlehistorical = (row) => {
  blindb.value = true;
  historical()
  iframeUrl.value = `${window.location.origin}/#/Caching/cachingbeforehistory`;
};
// 历史任务
const historical = async () => {
  try { 
  let startTime = window.localStorage.getItem('startTime')
  var url="/cacheGlass/edgStorageDeviceTaskHistory?deviceId="+1 + "&startTime=" + startTime + "&endTime=" + globalDate + "&glassId=" + '' + "&taskState=" + '' + "&taskType=" + '';
      const response = await request.get(url) 
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatad.value = response.data;
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// const historical = async () => {
//   try { 
//   let startTime = window.localStorage.getItem('startTime')
//   var url="/cacheGlass/edgStorageDeviceTaskHistory?deviceId="+1 + "&startTime=" + startTime + "&endTime=" + globalDate + "&glassId=" + '' + "&taskState=" + '' + "&taskType=" + '';
//       const response = await request.get(url) 
//       if (response.code == 200) {
//         ElMessage.success(response.message);
//         tableDatad.value = response.data;
//       } else {
//         ElMessage.error(response.message);
//     }
// }
// catch (error) {
//     console.error(error);
//   }
// }
const sethistorical = async () => {
  try { 
    const params = {
@@ -446,6 +447,16 @@
</div>
<!-- 历史任务 -->
<el-dialog v-model="blindb" top="10vh" width="90%">
     <iframe 
     :src="iframeUrl" 
     marginwidth="2000px"
     marginheight="2000px"
     width="100%" 
     height="700px" 
     frameborder="0"
     ></iframe>
  </el-dialog>
<!-- <el-dialog v-model="blindb" top="10vh" width="90%">
  <div style="display: flex;">
    <el-input v-model="glassId" style="margin-left: 10px;margin-bottom: 10px;width: 270px;" :placeholder="$t('searchOrder.inglassID')" />
            <el-select 
@@ -518,7 +529,7 @@
        <el-button @click="blindb = false">{{ $t('large.close') }}</el-button>
      </div>
    </template>
  </el-dialog>
  </el-dialog> -->
</template>
<style scoped>
#dt { display:block; float:left;line-height: 20px;margin-left: 100px;}

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

New file
@@ -0,0 +1,276 @@
<template>  
    <div>  
  <div style="display: flex;width: 1770px;">
    <el-input v-model="glassId" clearable style="margin-left: 10px;margin-bottom: 10px;width: 200px;" :placeholder="$t('searchOrder.inglassID')" />
    <el-select 
            :placeholder="$t('searchOrder.taskstatus')"
             clearable
             style="width: 270px;margin-left: 10px;"  
             v-model="taskState">
               <el-option
                v-for="item in optionsa"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
          </el-select>
          <el-select 
            :placeholder="$t('film.enabletype')"
             clearable
             style="width: 270px;margin-left: 10px;"  
             v-model="taskType">
               <el-option
                v-for="item in optionsb"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
          </el-select>
            <el-date-picker v-model="timeRange" type="datetimerange" range-separator="至" :start-placeholder="$t('reportmanage.starttime')" 
             style="margin-left: 15px;" value-format = "YYYY-MM-DD hh:mm:ss"
              :end-placeholder="$t('reportmanage.endtime')">
            </el-date-picker>
          <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;" @click="sethistorical()">{{$t('reportmanage.inquire')}}</el-button>
     </div>
        <el-table ref="table" style="margin-top: 20px;height: 580px;width: 1770px;" :data="tableDatax" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
      <el-table-column prop="glassIdIn" align="center" :label="$t('searchOrder.glassID')" min-width="80" />
          <el-table-column
            align="center"
            :label="$t('film.taskstatus')"
            min-width="80"
            prop="taskState"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypeb(scope.row.taskState)">  
          {{ getStatusTextb(scope.row.taskState) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column
            align="center"
            :label="$t('film.enabletype')"
            min-width="80"
            prop="taskType"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypea(scope.row.taskType)">  
          {{ getStatusTexta(scope.row.taskType) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column prop="createTime" align="center" :label="$t('reportmanage.starttime')" min-width="100" />
          <el-table-column prop="updateTime" align="center" :label="$t('reportmanage.endtime')" min-width="100" />
        </el-table>
  <div style="margin-top: 20px;margin-left: 40%;">
        <el-pagination
          v-model:current-page="currentPage2"
          :page-size="pageSize"
          :size="large"
          :disabled="disabled"
          layout="prev, pager, next, jumper"
          :total="totalRecords"
          @current-change="handlePageChange2"
          style="margin-top: 10px;"
      />
    </div>
  </div>
  </template>  
<script lang="ts" setup>
import {useI18n} from 'vue-i18n'
import {useRouter} from "vue-router"
import request from "@/utils/request"
import {host, WebSocketHost} from '@/utils/constants'
import {onBeforeUnmount, onMounted, onUnmounted, reactive, ref} from "vue";
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import {ElMessage, ElMessageBox} from 'element-plus'
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
import { inject } from 'vue';
const globalDate = inject('globalDate');
const router = useRouter()
const timeRange = ref([])
const selectValuesa = reactive([]);
const tableDatax = ref([])
const currentPage2 = ref(1)
const totalRecords = ref(0)
const glassId = ref('');
const startSlot = ref('');
const targetSlot = ref('');
const taskState = ref('');
const taskType = ref('');
let getglobalDate = window.localStorage.getItem('getglobalDate')
const historical = async (page) => {
  try {
  let startTime = window.localStorage.getItem('startTime')
      const response = await request.post("/cacheGlass/edgStorageDeviceTaskHistory", {
        deviceId: 1,
        pageNo: 1,
        pageSize: 20,
        glassId: glassId.value,
        taskState: '',
        taskType: '',
        startTime: startTime,
        endTime: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
        console.log(response.data.pages);
        totalRecords.value = response.data.total/2 || 0
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
const handlePageChange2 = (newPage) => {
  currentPage2.value = newPage;
  console.log(currentPage2.value);
  window.localStorage.setItem('pagenumber', currentPage2.value)
  historicala(currentPage2.value);
};
const historicala = async (page) => {
  try { 
  let page = window.localStorage.getItem('pagenumber')
  let startTime = window.localStorage.getItem('startTime')
      const response = await request.post("/cacheGlass/edgStorageDeviceTaskHistory", {
        deviceId: 1,
        pageNo: page,
        pageSize: 20,
        glassId: glassId.value,
        taskState: '',
        taskType: '',
        startTime: startTime,
        endTime: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
        console.log(response.data.pages);
        
        totalRecords.value = response.data.total/2 || 0
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 历史查询点击
const sethistorical = async () => {
  try { 
  let startTime = window.localStorage.getItem('startTime')
  let page = window.localStorage.getItem('pagenumber')
  console.log(page);
  const response = await request.post("/cacheGlass/edgStorageDeviceTaskHistory", {
        deviceId: 1,
        pageNo: page,
        pageSize: 20,
        glassId: glassId.value,
        taskState: taskState.value,
        taskType: taskType.value,
      startTime: (timeRange.value && timeRange.value[0]) || '',
      endTime: (timeRange.value && timeRange.value[1]) || '',
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 格式化时间戳为年月日时间字符串的函数
function formatTimestamp(timestamp) {
  const date = new Date(timestamp);
  const year = date.getFullYear();
  const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始，需要加1，并补零
  const day = String(date.getDate()).padStart(2, '0'); // 补零
  const hours = String(date.getHours()).padStart(2, '0'); // 补零（如果需要显示时间）
  const minutes = String(date.getMinutes()).padStart(2, '0'); // 补零（如果需要显示时间）
  const seconds = String(date.getSeconds()).padStart(2, '0'); // 补零（如果需要显示时间）
  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
// 格式化后端时间并计算一周前的时间
const defaultTime = ref<[Date, Date]>([new Date(), new Date()]);
function parseAndSetTime() {
  const backendTime = new Date(getglobalDate);
  const oneWeekAgo = new Date(backendTime.getTime() - 7 * 24 * 60 * 60 * 1000); // 减去7天
  console.log(formatTimestamp(oneWeekAgo));
  console.log(oneWeekAgo);
  timeRange.value = [formatTimestamp(oneWeekAgo), formatTimestamp(backendTime)];
  window.localStorage.setItem('startTime', formatTimestamp(oneWeekAgo))
}
function getStatusTypeb(taskState: number) {  
  switch (taskState) {  
    case 0:
      return 'primary';  
    case 1: 
      return 'success';  
  }  
}
function getStatusTextb(taskState: number) {
  switch (taskState) {
    case 0:  
      return t('searchOrder.empty');
    case 1:  
      return t('searchOrder.endtask');
  }  
}
function getStatusTypea(taskType: number) {  
  switch (taskType) {  
    case 1: 
      return 'primary';  
    case 2: 
      return 'success';  
    case 3:
      return 'warning';  
  }  
}  
function getStatusTexta(taskType: number) {
  switch (taskType) {
    case 1:  
      return t('sorter.advancetask');
    case 2:  
    return t('sorter.outputtasks');
    case 3:  
    return t('sorter.straighttasks');
  }  
}
const optionsa = [
  {
    value: 0,
    label: t('searchOrder.empty'),
  },
  {
    value: 1,
    label: t('searchOrder.endtask'),
  }
]
const optionsb = [
  {
    value: 1,
    label: t('sorter.advancetask'),
  },
  {
    value: 2,
    label: t('sorter.outputtasks'),
  },
  {
    value: 3,
    label: t('sorter.straighttasks'),
  }
]
onMounted(() => {
  parseAndSetTime();
  historical(1);
});
  </script>
  <style scoped>  
  </style>

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

@@ -54,27 +54,11 @@
  parseAndSetTime();
});
// 历史任务
const iframeUrl = ref('');
const handlehistorical = (row) => {
  blindb.value = true;
  historical()
  iframeUrl.value = `${window.location.origin}/#/Caching/cachingunhistory`;
};
// 历史任务
const historical = async () => {
  try { 
  let startTime = window.localStorage.getItem('startTime')
  var url="/cacheGlass/edgStorageDeviceTaskHistory?deviceId="+2 + "&startTime=" + startTime + "&endTime=" + globalDate + "&glassId=" + '' + "&taskState=" + '' + "&taskType=" + '';
      const response = await request.get(url) 
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatad.value = response.data;
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
const sethistorical = async () => {
  try { 
    const params = {
@@ -445,78 +429,14 @@
</div>
<!-- 历史任务 -->
<el-dialog v-model="blindb" top="10vh" width="90%">
  <div style="display: flex;">
    <el-input v-model="glassId" style="margin-left: 10px;margin-bottom: 10px;width: 270px;" :placeholder="$t('searchOrder.inglassID')" />
            <el-select 
            :placeholder="$t('searchOrder.taskstatus')"
             clearable
             style="width: 270px;margin-left: 10px;"  
             v-model="taskState">
               <el-option
                v-for="item in optionsa"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
          </el-select>
          <el-select 
            :placeholder="$t('film.enabletype')"
             clearable
             style="width: 270px;margin-left: 10px;"  
             v-model="taskType">
               <el-option
                v-for="item in optionsb"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
          </el-select>
          <span class="demonstration" style="margin-left: 20px;margin-top: 3px;">{{ $t('workOrder.time') }}</span>
            <el-date-picker v-model="timeRange" type="datetimerange" range-separator="至" :start-placeholder="$t('reportmanage.starttime')" 
             style="margin-left: 15px;" value-format = "YYYY-MM-DD hh:mm:ss"
              :end-placeholder="$t('reportmanage.endtime')">
            </el-date-picker>
          <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;" @click="sethistorical()">{{
        $t('reportmanage.inquire')
      }}</el-button>
      </div>
    <el-table ref="table" style="margin-top: 20px;height: 650px;" :data="tableDatad" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
      <el-table-column prop="glassIdIn" align="center" :label="$t('searchOrder.intoglassid')" min-width="80" />
      <el-table-column prop="glassIdOut" align="center" :label="$t('searchOrder.outputglassID')" min-width="80" />
          <el-table-column prop="currentCell" align="center" :label="$t('sorter.layernow')" min-width="80" />
          <el-table-column prop="startCell" align="center" :label="$t('processCard.layer')" min-width="120" />
          <el-table-column
            align="center"
            :label="$t('film.taskstatus')"
            min-width="80"
            prop="taskState"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypeb(scope.row.taskState)">  
          {{ getStatusTextb(scope.row.taskState) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column
            align="center"
            :label="$t('film.enabletype')"
            min-width="80"
            prop="taskType"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypea(scope.row.taskType)">  
          {{ getStatusTexta(scope.row.taskType) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column prop="createTime" align="center" :label="$t('film.createtime')" min-width="120" />
          <el-table-column prop="updateTime" align="center" :label="$t('sorter.updateTime')" min-width="120" />
        </el-table>
        <template #footer>
      <div id="dialog-footer">
        <el-button @click="blindb = false">{{ $t('large.close') }}</el-button>
      </div>
    </template>
     <iframe 
     :src="iframeUrl" 
     marginwidth="2000px"
     marginheight="2000px"
     width="100%" 
     height="700px" 
     frameborder="0"
     ></iframe>
  </el-dialog>
</template>
<style scoped>

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

New file
@@ -0,0 +1,276 @@
<template>  
    <div>  
  <div style="display: flex;width: 1770px;">
    <el-input v-model="glassId" clearable style="margin-left: 10px;margin-bottom: 10px;width: 200px;" :placeholder="$t('searchOrder.inglassID')" />
    <el-select 
            :placeholder="$t('searchOrder.taskstatus')"
             clearable
             style="width: 270px;margin-left: 10px;"  
             v-model="taskState">
               <el-option
                v-for="item in optionsa"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
          </el-select>
          <el-select 
            :placeholder="$t('film.enabletype')"
             clearable
             style="width: 270px;margin-left: 10px;"  
             v-model="taskType">
               <el-option
                v-for="item in optionsb"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
          </el-select>
            <el-date-picker v-model="timeRange" type="datetimerange" range-separator="至" :start-placeholder="$t('reportmanage.starttime')" 
             style="margin-left: 15px;" value-format = "YYYY-MM-DD hh:mm:ss"
              :end-placeholder="$t('reportmanage.endtime')">
            </el-date-picker>
          <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;" @click="sethistorical()">{{$t('reportmanage.inquire')}}</el-button>
     </div>
        <el-table ref="table" style="margin-top: 20px;height: 580px;width: 1770px;" :data="tableDatax" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
      <el-table-column prop="glassIdIn" align="center" :label="$t('searchOrder.glassID')" min-width="80" />
          <el-table-column
            align="center"
            :label="$t('film.taskstatus')"
            min-width="80"
            prop="taskState"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypeb(scope.row.taskState)">  
          {{ getStatusTextb(scope.row.taskState) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column
            align="center"
            :label="$t('film.enabletype')"
            min-width="80"
            prop="taskType"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypea(scope.row.taskType)">  
          {{ getStatusTexta(scope.row.taskType) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column prop="createTime" align="center" :label="$t('reportmanage.starttime')" min-width="100" />
          <el-table-column prop="updateTime" align="center" :label="$t('reportmanage.endtime')" min-width="100" />
        </el-table>
  <div style="margin-top: 20px;margin-left: 40%;">
        <el-pagination
          v-model:current-page="currentPage2"
          :page-size="pageSize"
          :size="large"
          :disabled="disabled"
          layout="prev, pager, next, jumper"
          :total="totalRecords"
          @current-change="handlePageChange2"
          style="margin-top: 10px;"
      />
    </div>
  </div>
  </template>  
<script lang="ts" setup>
import {useI18n} from 'vue-i18n'
import {useRouter} from "vue-router"
import request from "@/utils/request"
import {host, WebSocketHost} from '@/utils/constants'
import {onBeforeUnmount, onMounted, onUnmounted, reactive, ref} from "vue";
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import {ElMessage, ElMessageBox} from 'element-plus'
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
import { inject } from 'vue';
const globalDate = inject('globalDate');
const router = useRouter()
const timeRange = ref([])
const selectValuesa = reactive([]);
const tableDatax = ref([])
const currentPage2 = ref(1)
const totalRecords = ref(0)
const glassId = ref('');
const startSlot = ref('');
const targetSlot = ref('');
const taskState = ref('');
const taskType = ref('');
let getglobalDate = window.localStorage.getItem('getglobalDate')
const historical = async (page) => {
  try {
  let startTime = window.localStorage.getItem('startTime')
      const response = await request.post("/cacheGlass/edgStorageDeviceTaskHistory", {
        deviceId: 2,
        pageNo: 1,
        pageSize: 20,
        glassId: glassId.value,
        taskState: '',
        taskType: '',
        startTime: startTime,
        endTime: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
        console.log(response.data.pages);
        totalRecords.value = response.data.total/2 || 0
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
const handlePageChange2 = (newPage) => {
  currentPage2.value = newPage;
  console.log(currentPage2.value);
  window.localStorage.setItem('pagenumber', currentPage2.value)
  historicala(currentPage2.value);
};
const historicala = async (page) => {
  try { 
  let page = window.localStorage.getItem('pagenumber')
  let startTime = window.localStorage.getItem('startTime')
      const response = await request.post("/cacheGlass/edgStorageDeviceTaskHistory", {
        deviceId: 2,
        pageNo: page,
        pageSize: 20,
        glassId: glassId.value,
        taskState: '',
        taskType: '',
        startTime: startTime,
        endTime: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
        console.log(response.data.pages);
        
        totalRecords.value = response.data.total/2 || 0
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 历史查询点击
const sethistorical = async () => {
  try { 
  let startTime = window.localStorage.getItem('startTime')
  let page = window.localStorage.getItem('pagenumber')
  console.log(page);
  const response = await request.post("/cacheGlass/edgStorageDeviceTaskHistory", {
        deviceId: 2,
        pageNo: page,
        pageSize: 20,
        glassId: glassId.value,
        taskState: taskState.value,
        taskType: taskType.value,
      startTime: (timeRange.value && timeRange.value[0]) || '',
      endTime: (timeRange.value && timeRange.value[1]) || '',
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 格式化时间戳为年月日时间字符串的函数
function formatTimestamp(timestamp) {
  const date = new Date(timestamp);
  const year = date.getFullYear();
  const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始，需要加1，并补零
  const day = String(date.getDate()).padStart(2, '0'); // 补零
  const hours = String(date.getHours()).padStart(2, '0'); // 补零（如果需要显示时间）
  const minutes = String(date.getMinutes()).padStart(2, '0'); // 补零（如果需要显示时间）
  const seconds = String(date.getSeconds()).padStart(2, '0'); // 补零（如果需要显示时间）
  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
// 格式化后端时间并计算一周前的时间
const defaultTime = ref<[Date, Date]>([new Date(), new Date()]);
function parseAndSetTime() {
  const backendTime = new Date(getglobalDate);
  const oneWeekAgo = new Date(backendTime.getTime() - 7 * 24 * 60 * 60 * 1000); // 减去7天
  console.log(formatTimestamp(oneWeekAgo));
  console.log(oneWeekAgo);
  timeRange.value = [formatTimestamp(oneWeekAgo), formatTimestamp(backendTime)];
  window.localStorage.setItem('startTime', formatTimestamp(oneWeekAgo))
}
function getStatusTypeb(taskState: number) {  
  switch (taskState) {  
    case 0:
      return 'primary';  
    case 1: 
      return 'success';  
  }  
}
function getStatusTextb(taskState: number) {
  switch (taskState) {
    case 0:  
      return t('searchOrder.empty');
    case 1:  
      return t('searchOrder.endtask');
  }  
}
function getStatusTypea(taskType: number) {  
  switch (taskType) {  
    case 1: 
      return 'primary';  
    case 2: 
      return 'success';  
    case 3:
      return 'warning';  
  }  
}  
function getStatusTexta(taskType: number) {
  switch (taskType) {
    case 1:  
      return t('sorter.advancetask');
    case 2:  
    return t('sorter.outputtasks');
    case 3:  
    return t('sorter.straighttasks');
  }  
}
const optionsa = [
  {
    value: 0,
    label: t('searchOrder.empty'),
  },
  {
    value: 1,
    label: t('searchOrder.endtask'),
  }
]
const optionsb = [
  {
    value: 1,
    label: t('sorter.advancetask'),
  },
  {
    value: 2,
    label: t('sorter.outputtasks'),
  },
  {
    value: 3,
    label: t('sorter.straighttasks'),
  }
]
onMounted(() => {
  parseAndSetTime();
  historical(1);
});
  </script>
  <style scoped>  
  </style>

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

@@ -339,42 +339,11 @@
  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
// 历史任务
const iframeUrl = ref('');
const handlehistorical = (row) => {
  blindb.value = true;
  historical()
  iframeUrl.value = `${window.location.origin}/#/GlassStorage/rawhistory`;
};
// 历史任务
const historical = async () => {
  try { 
  let celllista=[]
  let stateLista=[]
  if(selectValuesb[0]!=null&&selectValuesb[0]!='undefined'){
    if(selectValuesb[0]!=""){
      celllista=[selectValuesb[0]];
    }
  }
  if(selectValuesb[1]!=null&&selectValuesb[1]!='undefined'){
    if(selectValuesb[1]!=""){
      stateLista=[selectValuesb[1]];
    }
  }
      const response = await request.post("/glassStorage/rawGlassStorageTask/queryRawGlassHistoryTask", {
        beginDate: (timeRangea.value && timeRangea.value[0]) || '',
        endDate: (timeRangea.value && timeRangea.value[1]) || '',
        taskState: [],
        taskType: []
  })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatad.value = response.data;
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 任务成功处理
const successfull = async(row) => { 
  try {
@@ -592,6 +561,16 @@
</el-dialog>
<!-- 历史任务 -->
<el-dialog v-model="blindb" top="10vh" width="90%">
     <iframe 
     :src="iframeUrl" 
     marginwidth="2000px"
     marginheight="2000px"
     width="100%" 
     height="700px" 
     frameborder="0"
     ></iframe>
  </el-dialog>
<!-- <el-dialog v-model="blindb" top="10vh" width="90%">
  <div style="display: flex;">
    <el-date-picker style="margin-left: 10px;" v-model="timeRangea" type="datetimerange"
        format="YYYY/MM/DD HH:mm:ss"
@@ -655,7 +634,7 @@
        <el-button @click="blindb = false">{{ $t('large.close') }}</el-button>
      </div>
    </template>
  </el-dialog>
  </el-dialog> -->
<el-dialog v-model="dialogFormVisibleb" top="23vh" width="55%" :title="$t('film.addglass')" >
    <div style="margin-left: -50px;margin-top: 10px;margin-bottom: 10px;">
            <el-form  size="mini" label-width="150px">

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

New file
@@ -0,0 +1,267 @@
<template>  
    <div>  
  <div style="display: flex;width: 1770px;">
          <el-select v-model="selectValuesa[0]" filterable :placeholder="$t('searchOrder.taskstatus')" clearable
          style="width: 200px;margin-left: 10px;">
          <el-option :label="$t('searchOrder.begin')" value="1"></el-option>
          <el-option :label="$t('searchOrder.finish')" value="2"></el-option>
          <el-option :label="$t('order.dilapidation')" value="3"></el-option>
          <el-option :label="$t('searchOrder.uncar')" value="4"></el-option>
        </el-select>
        <el-select v-model="selectValuesa[1]" filterable :placeholder="$t('film.enabletype')" clearable
          style="width: 200px;margin-left: 10px;">
          <el-option :label="$t('searchOrder.inkage')" value="1"></el-option>
          <el-option :label="$t('searchOrder.outfilm')" value="2"></el-option>
          <el-option :label="$t('film.dispatch')" value="3"></el-option>
        </el-select>
            <el-date-picker v-model="timeRange" type="datetimerange" range-separator="至" :start-placeholder="$t('reportmanage.starttime')" 
             style="margin-left: 15px;" value-format = "YYYY-MM-DD hh:mm:ss"
              :end-placeholder="$t('reportmanage.endtime')">
            </el-date-picker>
          <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;" @click="sethistorical()">{{$t('reportmanage.inquire')}}</el-button>
     </div>
        <el-table ref="table" style="margin-top: 20px;height: 580px;width: 1770px;" :data="tableDatax" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
      <el-table-column prop="startSlot" align="center" :label="$t('film.originateslot')" min-width="80" />
          <el-table-column prop="endSlot" align="center" :label="$t('film.endslot')" min-width="80" />
          <el-table-column
            align="center"
            :label="$t('film.taskstatus')"
            min-width="80"
            prop="taskState"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypeb(scope.row.taskState)">  
          {{ getStatusTextb(scope.row.taskState) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column
            align="center"
            :label="$t('film.enabletype')"
            min-width="80"
            prop="taskType"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypea(scope.row.taskType)">  
          {{ getStatusTexta(scope.row.taskType) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column prop="createTime" align="center" :label="$t('reportmanage.starttime')" min-width="100" />
          <el-table-column prop="updateTime" align="center" :label="$t('reportmanage.endtime')" min-width="100" />
        </el-table>
  <div style="margin-top: 20px;margin-left: 40%;">
        <el-pagination
          v-model:current-page="currentPage2"
          :page-size="pageSize"
          :size="large"
          :disabled="disabled"
          layout="prev, pager, next, jumper"
          :total="totalRecords"
          @current-change="handlePageChange2"
          style="margin-top: 10px;"
      />
    </div>
  </div>
  </template>  
<script lang="ts" setup>
import {useI18n} from 'vue-i18n'
import {useRouter} from "vue-router"
import request from "@/utils/request"
import {host, WebSocketHost} from '@/utils/constants'
import {onBeforeUnmount, onMounted, onUnmounted, reactive, ref} from "vue";
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import {ElMessage, ElMessageBox} from 'element-plus'
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
import { inject } from 'vue';
const globalDate = inject('globalDate');
const router = useRouter()
const timeRange = ref([])
const selectValuesa = reactive([]);
const tableDatax = ref([])
const currentPage2 = ref(1)
const totalRecords = ref(0)
const glassId = ref('');
const startSlot = ref('');
const targetSlot = ref('');
let getglobalDate = window.localStorage.getItem('getglobalDate')
const historical = async () => {
  try {
  let startTime = window.localStorage.getItem('startTime')
      const response = await request.post("/glassStorage/rawGlassStorageTask/queryRawGlassHistoryTask", {
        pageNo: 1,
        pageSize: 20,
        taskState: [],
        taskType: [],
        beginDate: startTime,
        endDate: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
        console.log(response.data.pages);
        
        totalRecords.value = response.data.total/2 || 0
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
const handlePageChange2 = (newPage) => {
  currentPage2.value = newPage;
  console.log(currentPage2.value);
  window.localStorage.setItem('pagenumber', currentPage2.value)
  historicala(currentPage2.value);
};
const historicala = async (page) => {
  try { 
  let page = window.localStorage.getItem('pagenumber')
  let startTime = window.localStorage.getItem('startTime')
      const response = await request.post("/glassStorage/rawGlassStorageTask/queryRawGlassHistoryTask", {
        pageNo: page,
        pageSize: 20,
        taskState: [],
        taskType: [],
        beginDate: startTime,
        endDate: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
        console.log(response.data.pages);
        
        totalRecords.value = response.data.total/2 || 0
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 历史查询点击
const sethistorical = async () => {
  try { 
  let startTime = window.localStorage.getItem('startTime')
  let celllist=[]
  let stateList=[]
  let pstartSlot= ''
  let ptargetSlot=''
  if(selectValuesa[0]!=null&&selectValuesa[0]!='undefined'){
    if(selectValuesa[0]!=""){
      celllist=[selectValuesa[0]];
    }
  }
  if(selectValuesa[1]!=null&&selectValuesa[1]!='undefined'){
    if(selectValuesa[1]!=""){
      stateList=[selectValuesa[1]];
    }
  }
  console.log(startSlot.value);
  
  if(startSlot.value != ""){
    pstartSlot = startSlot.value
  }else{
    pstartSlot = '0'
  }
  if(targetSlot.value != ""){
    ptargetSlot = targetSlot.value
  }else{
    ptargetSlot = '0'
  }
  let page = window.localStorage.getItem('pagenumber')
  const response = await request.post("/glassStorage/rawGlassStorageTask/queryRawGlassHistoryTask", {
        pageNo: page,
        pageSize: 20,
        taskState: celllist,
        taskType: stateList,
        beginDate: startTime,
        endDate: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 格式化时间戳为年月日时间字符串的函数
function formatTimestamp(timestamp) {
  const date = new Date(timestamp);
  const year = date.getFullYear();
  const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始，需要加1，并补零
  const day = String(date.getDate()).padStart(2, '0'); // 补零
  const hours = String(date.getHours()).padStart(2, '0'); // 补零（如果需要显示时间）
  const minutes = String(date.getMinutes()).padStart(2, '0'); // 补零（如果需要显示时间）
  const seconds = String(date.getSeconds()).padStart(2, '0'); // 补零（如果需要显示时间）
  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
// 格式化后端时间并计算一周前的时间
const defaultTime = ref<[Date, Date]>([new Date(), new Date()]);
function parseAndSetTime() {
  const backendTime = new Date(getglobalDate);
  const oneWeekAgo = new Date(backendTime.getTime() - 7 * 24 * 60 * 60 * 1000); // 减去7天
  console.log(formatTimestamp(oneWeekAgo));
  console.log(oneWeekAgo);
  timeRange.value = [formatTimestamp(oneWeekAgo), formatTimestamp(backendTime)];
  window.localStorage.setItem('startTime', formatTimestamp(oneWeekAgo))
}
function getStatusTypeb(state: number) {  
  switch (state) {  
    case 0:
      return 'primary';  
    case 2: 
      return 'success';  
    case 3: 
      return 'danger';  
    case 4: 
      return 'warning';  
  }  
}
function getStatusTextb(state: number) {
  switch (state) {
    case 0:  
      return t('searchOrder.begin');
    case 2:  
      return t('searchOrder.finish');
    case 3:  
    return t('order.dilapidation');
    case 4:  
    return t('searchOrder.uncar');
  }  
}
function getStatusTypea(ishorizontal: number) {  
  switch (ishorizontal) {  
    case 1: 
      return 'primary';  
    case 2: 
      return 'success';  
    case 3:
      return 'warning';  
  }  
}  
function getStatusTexta(ishorizontal: number) {
  switch (ishorizontal) {
    case 1:  
      return t('searchOrder.inkage');
    case 2:  
    return t('searchOrder.outfilm');
    case 3:  
    return t('film.dispatch');
  }  
}
onMounted(() => {
  parseAndSetTime();
  historical();
});
  </script>
  <style scoped>  
  </style>

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

@@ -26,6 +26,8 @@
const cuttingMachineStatusColor = ref('#911005');
const tableDataa = ref<any[]>([]);
const tableDatab = ref<any[]>([]);
const stationInfos = reactive({});
const buttonEnabledStatus = ref({});
const tableData = ref([])
const titleSelectJson = ref({
  engineerId: [],
@@ -83,6 +85,41 @@
  }else {
    tableDataa.value = ''
  }
  if (data.stationOne != null) {
    // data.stationOne[0].forEach(station => {
    //   stationInfos[station.slot] = {
    //     hasValidDimension: station.patternHeight !== null && station.patternHeight !== '' ||
    //                        station.patternThickness !== null && station.patternThickness !== ''
    //   };
    //   console.log(station);
    //   console.log(stationInfos[station.slot]);
      
    // });
    data.stationOne[0].forEach((station) => {
  stationInfos[station.patternHeight] = {
    hasPatternHeight: station.patternHeight !== null && station.patternHeight !== '',
  };
  // buttonEnabledStatus.value[workstationId] = hasValidDimension;
      console.log(station);
      console.log(stationInfos[station.patternHeight]);
});
  }
  // if (data.stationOne != null) {
  //   // 初始化按钮状态对象
  //   buttonEnabledStatus.value = {};
  //   data.stationOne[0].forEach((station, index) => {
  //     const workstationId = station.workstationId;
  //     const hasValidDimension = station.patternHeight !== null && station.patternHeight !== '' ||
  //                               station.patternThickness !== null && station.patternThickness !== '';
  //     buttonEnabledStatus.value[workstationId] = hasValidDimension;
  //     console.log(station.workstationId);
      
  //   });
  // }




  if(data.loadTask1!=null){
  tableData.value = data.loadTask1[0]
  window.localStorage.setItem('engineeringIda', tableData.value[0].engineeringId)
@@ -96,6 +133,13 @@
  canSelectProjectc.value = false;
  tableData.value = '';
}
};
// 检查按钮是否可用
// const isButtonEnabled = (slot: string) => {
//   return buttonEnabledStatus.value[slot] || false;
// };
const isButtonEnabled = (patternHeight: string) => {
  return stationInfos[patternHeight]?.hasValidDimension ?? false;
};
onBeforeUnmount(() => {
  closeWebSocket();
@@ -480,7 +524,7 @@
            <el-table-column prop="number" align="center" :label="$t('basicData.quantity')" min-width="80"/>
            <el-table-column fixed="right" :label="$t('film.operate')" align="center">
            <template #default="scope">
          <el-button size="mini" :disabled="scope.row.number == 0 || scope.row.number == ''" type="text" plain @click="handleptask(scope.row.workstationId)">{{ $t('basicData.rackreset') }}</el-button>
          <el-button size="mini" :disabled="!isButtonEnabled(scope.row.patternHeight)" type="text" plain @click="handleptask(scope.row.workstationId)">{{ $t('basicData.rackreset') }}</el-button>
            </template>
        </el-table-column>
          </el-table>

 UI-Project/src/views/Slicecage/slicecage.vue

@@ -256,83 +256,11 @@
  }  
}; 
// 历史任务
// const handlehistorical = (row) => {
//   blindb.value = true;
//   historical()
// };
// 历史任务
const historical = async () => {
  try { 
  let startTime = window.localStorage.getItem('startTime')
      const response = await request.post("/cacheVerticalGlass/bigStorageCageHistoryTask/queryBigStorageCageHistoryTask", {
        glassId: glassId.value,
        startSlot: 0,
        targetSlot: 0,
        taskStateList: [],
        taskTypeList: [],
        beginDate: startTime,
        endDate: globalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data;
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 历史查询
const sethistorical = async () => {
  try { 
  let startTime = window.localStorage.getItem('startTime')
  let celllist=[]
  let stateList=[]
  let pstartSlot= ''
  let ptargetSlot=''
  if(selectValuesa[0]!=null&&selectValuesa[0]!='undefined'){
    if(selectValuesa[0]!=""){
      celllist=[selectValuesa[0]];
    }
  }
  if(selectValuesa[1]!=null&&selectValuesa[1]!='undefined'){
    if(selectValuesa[1]!=""){
      stateList=[selectValuesa[1]];
    }
  }
  if(startSlot.value != ""){
    pstartSlot = startSlot.value
  }else{
    pstartSlot = '0'
  }
  if(targetSlot.value != ""){
    ptargetSlot = targetSlot.value
  }else{
    ptargetSlot = '0'
  }
      const response = await request.post("/cacheVerticalGlass/bigStorageCageHistoryTask/queryBigStorageCageHistoryTask", {
        glassId: glassId.value,
        startSlot: pstartSlot,
        targetSlot: ptargetSlot,
        taskStateList: celllist,
        taskTypeList: stateList,
        beginDate: startTime,
        endDate: globalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data;
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}

const iframeUrl = ref('');
const handlehistorical = (row) => {
  blindb.value = true;
  iframeUrl.value = `${window.location.origin}/#/Slicecage/slicecagehistory`;
};
 // 拿走
 const brokec = async(row) => {  
  try {
@@ -1518,66 +1446,14 @@
  </el-dialog>
<!-- 历史任务 -->
<el-dialog v-model="blindb" top="10vh" width="90%">
  <div style="display: flex;">
    <el-input v-model="glassId" style="margin-left: 10px;margin-bottom: 10px;width: 270px;" :placeholder="$t('searchOrder.inglassID')" />
    <el-input v-model="startSlot" style="margin-left: 10px;margin-bottom: 10px;width: 270px;" :placeholder="$t('film.originateslot')" />
    <el-input v-model="targetSlot" style="margin-left: 10px;margin-bottom: 10px;width: 270px;" :placeholder="$t('film.endslot')" />
          <el-select v-model="selectValuesa[0]" filterable :placeholder="$t('searchOrder.taskstatus')" clearable
          style="width: 270px;margin-left: 10px;">
          <el-option :label="$t('searchOrder.begin')" value="0"></el-option>
          <el-option :label="$t('searchOrder.finish')" value="2"></el-option>
          <el-option :label="$t('order.dilapidation')" value="3"></el-option>
          <el-option :label="$t('searchOrder.uncar')" value="4"></el-option>
        </el-select>
        <el-select v-model="selectValuesa[1]" filterable :placeholder="$t('film.enabletype')" clearable
          style="width: 270px;margin-left: 10px;">
          <el-option :label="$t('searchOrder.inkage')" value="1"></el-option>
          <el-option :label="$t('searchOrder.outfilm')" value="2"></el-option>
          <el-option :label="$t('film.dispatch')" value="3"></el-option>
        </el-select>
            <el-date-picker v-model="timeRange" type="datetimerange" range-separator="至" :start-placeholder="$t('reportmanage.starttime')" 
             style="margin-left: 15px;" value-format = "YYYY-MM-DD hh:mm:ss"
              :end-placeholder="$t('reportmanage.endtime')">
            </el-date-picker>
          <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;" @click="sethistorical()">{{$t('reportmanage.inquire')}}</el-button>
      </div>
    <el-table ref="table" style="margin-top: 20px;height: 650px;" :data="tableDatad" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
      <el-table-column prop="glassIdIn" align="center" :label="$t('searchOrder.intoglassid')" min-width="80" />
      <el-table-column prop="glassIdOut" align="center" :label="$t('searchOrder.outputglassID')" min-width="80" />
          <el-table-column prop="currentCell" align="center" :label="$t('sorter.layernow')" min-width="80" />
          <el-table-column prop="startCell" align="center" :label="$t('processCard.layer')" min-width="120" />
          <el-table-column
            align="center"
            :label="$t('film.taskstatus')"
            min-width="80"
            prop="taskState"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypeb(scope.row.taskState)">  
          {{ getStatusTextb(scope.row.taskState) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column
            align="center"
            :label="$t('film.enabletype')"
            min-width="80"
            prop="taskType"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypea(scope.row.taskType)">  
          {{ getStatusTexta(scope.row.taskType) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column prop="createTime" align="center" :label="$t('film.createtime')" min-width="120" />
          <el-table-column prop="updateTime" align="center" :label="$t('sorter.updateTime')" min-width="120" />
        </el-table>
        <template #footer>
      <div id="dialog-footer">
        <el-button @click="blindb = false">{{ $t('large.close') }}</el-button>
      </div>
    </template>
     <iframe 
     :src="iframeUrl" 
     marginwidth="2000px"
     marginheight="2000px"
     width="100%" 
     height="700px" 
     frameborder="0"
     ></iframe>
  </el-dialog>
<!-- 钢化查询 -->
<el-dialog v-model="dialogFormVisiblec" top="5vh" width="85%" :title="$t('searchOrder.temperingqueries')">

 UI-Project/src/views/Slicecage/slicecagehistory.vue

New file
@@ -0,0 +1,280 @@
<template>  
    <div>  
  <div style="display: flex;width: 1770px;">
    <el-input v-model="glassId" clearable style="margin-left: 10px;margin-bottom: 10px;width: 200px;" :placeholder="$t('searchOrder.inglassID')" />
    <el-input v-model="startSlot" clearable style="margin-left: 10px;margin-bottom: 10px;width: 200px;" :placeholder="$t('film.originateslot')" />
    <el-input v-model="targetSlot" clearable style="margin-left: 10px;margin-bottom: 10px;width: 200px;" :placeholder="$t('film.endslot')" />
          <el-select v-model="selectValuesa[0]" filterable :placeholder="$t('searchOrder.taskstatus')" clearable
          style="width: 200px;margin-left: 10px;">
          <el-option :label="$t('searchOrder.begin')" value="0"></el-option>
          <el-option :label="$t('searchOrder.finish')" value="2"></el-option>
          <el-option :label="$t('order.dilapidation')" value="3"></el-option>
          <el-option :label="$t('searchOrder.uncar')" value="4"></el-option>
        </el-select>
        <el-select v-model="selectValuesa[1]" filterable :placeholder="$t('film.enabletype')" clearable
          style="width: 200px;margin-left: 10px;">
          <el-option :label="$t('searchOrder.inkage')" value="1"></el-option>
          <el-option :label="$t('searchOrder.outfilm')" value="2"></el-option>
          <el-option :label="$t('film.dispatch')" value="3"></el-option>
        </el-select>
            <el-date-picker v-model="timeRange" type="datetimerange" range-separator="至" :start-placeholder="$t('reportmanage.starttime')" 
             style="margin-left: 15px;" value-format = "YYYY-MM-DD hh:mm:ss"
              :end-placeholder="$t('reportmanage.endtime')">
            </el-date-picker>
          <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;" @click="sethistorical()">{{$t('reportmanage.inquire')}}</el-button>
     </div>
        <el-table ref="table" style="margin-top: 20px;height: 580px;width: 1770px;" :data="tableDatax" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
      <el-table-column prop="glassId" align="center" :label="$t('searchOrder.glassID')" min-width="80" />
      <el-table-column prop="startSlot" align="center" :label="$t('film.originateslot')" min-width="80" />
          <el-table-column prop="targetSlot" align="center" :label="$t('film.endslot')" min-width="80" />
          <el-table-column
            align="center"
            :label="$t('film.taskstatus')"
            min-width="80"
            prop="taskState"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypeb(scope.row.taskState)">  
          {{ getStatusTextb(scope.row.taskState) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column
            align="center"
            :label="$t('film.enabletype')"
            min-width="80"
            prop="taskType"
          >
          <template #default="scope">  
        <el-tag :type="getStatusTypea(scope.row.taskType)">  
          {{ getStatusTexta(scope.row.taskType) }}  
        </el-tag>  
      </template> 
          </el-table-column>
          <el-table-column prop="createTime" align="center" :label="$t('reportmanage.starttime')" min-width="100" />
          <el-table-column prop="updateTime" align="center" :label="$t('reportmanage.endtime')" min-width="100" />
        </el-table>
  <div style="margin-top: 20px;margin-left: 40%;">
        <el-pagination
          v-model:current-page="currentPage2"
          :page-size="pageSize"
          :size="large"
          :disabled="disabled"
          layout="prev, pager, next, jumper"
          :total="totalRecords"
          @current-change="handlePageChange2"
          style="margin-top: 10px;"
      />
    </div>
  </div>
  </template>  
<script lang="ts" setup>
import {useI18n} from 'vue-i18n'
import {useRouter} from "vue-router"
import request from "@/utils/request"
import {host, WebSocketHost} from '@/utils/constants'
import {onBeforeUnmount, onMounted, onUnmounted, reactive, ref} from "vue";
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import {ElMessage, ElMessageBox} from 'element-plus'
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
import { inject } from 'vue';
const globalDate = inject('globalDate');
const router = useRouter()
const timeRange = ref([])
const selectValuesa = reactive([]);
const tableDatax = ref([])
const currentPage2 = ref(1)
const totalRecords = ref(0)
const glassId = ref('');
const startSlot = ref('');
const targetSlot = ref('');
let getglobalDate = window.localStorage.getItem('getglobalDate')
const historical = async () => {
  try {
  let startTime = window.localStorage.getItem('startTime')
      const response = await request.post("/cacheVerticalGlass/bigStorageCageHistoryTask/queryBigStorageCageHistoryTask", {
        pageNo: 1,
        pageSize: 20,
        glassId: glassId.value,
        startSlot: 0,
        targetSlot: 0,
        taskStateList: [],
        taskTypeList: [],
        beginDate: startTime,
        endDate: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
        console.log(response.data.pages);
        
        totalRecords.value = response.data.total/2 || 0
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
const handlePageChange2 = (newPage) => {
  currentPage2.value = newPage;
  console.log(currentPage2.value);
  window.localStorage.setItem('pagenumber', currentPage2.value)
  historicala(currentPage2.value);
}; 
const historicala = async (page) => {
  try { 
  let page = window.localStorage.getItem('pagenumber')
  let startTime = window.localStorage.getItem('startTime')
      const response = await request.post("/cacheVerticalGlass/bigStorageCageHistoryTask/queryBigStorageCageHistoryTask", {
        pageNo: page,
        pageSize: 20,
        glassId: glassId.value,
        startSlot: 0,
        targetSlot: 0,
        taskStateList: [],
        taskTypeList: [],
        beginDate: startTime,
        endDate: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
        console.log(response.data.pages);
        
        totalRecords.value = response.data.total/2 || 0
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 历史查询点击
const sethistorical = async () => {
  try { 
  let startTime = window.localStorage.getItem('startTime')
  let celllist=[]
  let stateList=[]
  let pstartSlot= ''
  let ptargetSlot=''
  if(selectValuesa[0]!=null&&selectValuesa[0]!='undefined'){
    if(selectValuesa[0]!=""){
      celllist=[selectValuesa[0]];
    }
  }
  if(selectValuesa[1]!=null&&selectValuesa[1]!='undefined'){
    if(selectValuesa[1]!=""){
      stateList=[selectValuesa[1]];
    }
  }
  console.log(startSlot.value);
  
  if(startSlot.value != ""){
    pstartSlot = startSlot.value
  }else{
    pstartSlot = '0'
  }
  if(targetSlot.value != ""){
    ptargetSlot = targetSlot.value
  }else{
    ptargetSlot = '0'
  }
  let page = window.localStorage.getItem('pagenumber')
  const response = await request.post("/cacheVerticalGlass/bigStorageCageHistoryTask/queryBigStorageCageHistoryTask", {
        pageNo: page,
        pageSize: 20,
        glassId: glassId.value,
        startSlot: pstartSlot,
        targetSlot: ptargetSlot,
        taskStateList: celllist,
        taskTypeList: stateList,
        beginDate: startTime,
        endDate: getglobalDate
    })
      if (response.code == 200) {
        ElMessage.success(response.message);
        tableDatax.value = response.data.records;
      } else {
        ElMessage.error(response.message);
    }
}
catch (error) {
    console.error(error);
  }
}
// 格式化时间戳为年月日时间字符串的函数
function formatTimestamp(timestamp) {
  const date = new Date(timestamp);
  const year = date.getFullYear();
  const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始，需要加1，并补零
  const day = String(date.getDate()).padStart(2, '0'); // 补零
  const hours = String(date.getHours()).padStart(2, '0'); // 补零（如果需要显示时间）
  const minutes = String(date.getMinutes()).padStart(2, '0'); // 补零（如果需要显示时间）
  const seconds = String(date.getSeconds()).padStart(2, '0'); // 补零（如果需要显示时间）
  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
// 格式化后端时间并计算一周前的时间
const defaultTime = ref<[Date, Date]>([new Date(), new Date()]);
function parseAndSetTime() {
  const backendTime = new Date(getglobalDate);
  const oneWeekAgo = new Date(backendTime.getTime() - 7 * 24 * 60 * 60 * 1000); // 减去7天
  console.log(formatTimestamp(oneWeekAgo));
  console.log(oneWeekAgo);
  timeRange.value = [formatTimestamp(oneWeekAgo), formatTimestamp(backendTime)];
  window.localStorage.setItem('startTime', formatTimestamp(oneWeekAgo))
}
function getStatusTypeb(state: number) {  
  switch (state) {  
    case 0:
      return 'primary';  
    case 2: 
      return 'success';  
    case 3: 
      return 'danger';  
    case 4: 
      return 'warning';  
  }  
}
function getStatusTextb(state: number) {
  switch (state) {
    case 0:  
      return t('searchOrder.begin');
    case 2:  
      return t('searchOrder.finish');
    case 3:  
    return t('order.dilapidation');
    case 4:  
    return t('searchOrder.uncar');
  }  
}
function getStatusTypea(ishorizontal: number) {  
  switch (ishorizontal) {  
    case 1: 
      return 'primary';  
    case 2: 
      return 'success';  
    case 3:
      return 'warning';  
  }  
}  
function getStatusTexta(ishorizontal: number) {
  switch (ishorizontal) {
    case 1:  
      return t('searchOrder.inkage');
    case 2:  
    return t('searchOrder.outfilm');
    case 3:  
    return t('film.dispatch');
  }  
}
onMounted(() => {
  parseAndSetTime();
  historical();
});
  </script>
  <style scoped>  
  </style>

 UI-Project/src/views/hollow/hellowslicecagehistory.vue

New file
@@ -0,0 +1,279 @@
<template>  
  <div>  
<div style="display: flex;width: 1770px;">
  <el-input v-model="glassId" clearable style="margin-left: 10px;margin-bottom: 10px;width: 200px;" :placeholder="$t('searchOrder.inglassID')" />
  <el-input v-model="startSlot" clearable style="margin-left: 10px;margin-bottom: 10px;width: 200px;" :placeholder="$t('film.originateslot')" />
  <el-input v-model="targetSlot" clearable style="margin-left: 10px;margin-bottom: 10px;width: 200px;" :placeholder="$t('film.endslot')" />
        <el-select v-model="selectValuesa[0]" filterable :placeholder="$t('searchOrder.taskstatus')" clearable
        style="width: 200px;margin-left: 10px;">
        <el-option :label="$t('searchOrder.begin')" value="0"></el-option>
        <el-option :label="$t('searchOrder.finish')" value="2"></el-option>
        <el-option :label="$t('order.dilapidation')" value="3"></el-option>
        <el-option :label="$t('searchOrder.uncar')" value="4"></el-option>
      </el-select>
      <el-select v-model="selectValuesa[1]" filterable :placeholder="$t('film.enabletype')" clearable
        style="width: 200px;margin-left: 10px;">
        <el-option :label="$t('searchOrder.inkage')" value="1"></el-option>
        <el-option :label="$t('searchOrder.outfilm')" value="2"></el-option>
        <el-option :label="$t('film.dispatch')" value="3"></el-option>
      </el-select>
          <el-date-picker v-model="timeRange" type="datetimerange" range-separator="至" :start-placeholder="$t('reportmanage.starttime')" 
           style="margin-left: 15px;" value-format = "YYYY-MM-DD hh:mm:ss"
            :end-placeholder="$t('reportmanage.endtime')">
          </el-date-picker>
        <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;" @click="sethistorical()">{{$t('reportmanage.inquire')}}</el-button>
   </div>
      <el-table ref="table" style="margin-top: 20px;height: 580px;width: 1770px;" :data="tableDatax" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
    <el-table-column prop="glassId" align="center" :label="$t('searchOrder.glassID')" min-width="80" />
    <el-table-column prop="startSlot" align="center" :label="$t('film.originateslot')" min-width="80" />
        <el-table-column prop="targetSlot" align="center" :label="$t('film.endslot')" min-width="80" />
        <el-table-column
          align="center"
          :label="$t('film.taskstatus')"
          min-width="80"
          prop="taskState"
        >
        <template #default="scope">  
      <el-tag :type="getStatusTypeb(scope.row.taskState)">  
        {{ getStatusTextb(scope.row.taskState) }}  
      </el-tag>  
    </template> 
        </el-table-column>
        <el-table-column
          align="center"
          :label="$t('film.enabletype')"
          min-width="80"
          prop="taskType"
        >
        <template #default="scope">  
      <el-tag :type="getStatusTypea(scope.row.taskType)">  
        {{ getStatusTexta(scope.row.taskType) }}  
      </el-tag>  
    </template> 
        </el-table-column>
        <el-table-column prop="createTime" align="center" :label="$t('reportmanage.starttime')" min-width="100" />
        <el-table-column prop="updateTime" align="center" :label="$t('reportmanage.endtime')" min-width="100" />
      </el-table>
<div style="margin-top: 20px;margin-left: 40%;">
      <el-pagination
        v-model:current-page="currentPage2"
        :page-size="pageSize"
        :size="large"
        :disabled="disabled"
        layout="prev, pager, next, jumper"
        :total="totalRecords"
        @current-change="handlePageChange2"
        style="margin-top: 10px;"
    />
  </div>
</div>
</template>  
<script lang="ts" setup>
import {useI18n} from 'vue-i18n'
import {useRouter} from "vue-router"
import request from "@/utils/request"
import {host, WebSocketHost} from '@/utils/constants'
import {onBeforeUnmount, onMounted, onUnmounted, reactive, ref} from "vue";
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import {ElMessage, ElMessageBox} from 'element-plus'
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
import { inject } from 'vue';
const globalDate = inject('globalDate');
const router = useRouter()
const timeRange = ref([])
const selectValuesa = reactive([]);
const tableDatax = ref([])
const currentPage2 = ref(1)
const totalRecords = ref(0)
const glassId = ref('');
const startSlot = ref('');
const targetSlot = ref('');
let getglobalDate = window.localStorage.getItem('getglobalDate')
const historical = async () => {
try {
let startTime = window.localStorage.getItem('startTime')
    const response = await request.post("/hollowGlass/hollowBigStorageCageHistoryTask/queryHollowBigStorageCageHistoryTask", {
      pageNo: 1,
      pageSize: 20,
      glassId: '',
      startSlot: 0,
      targetSlot: 0,
      taskStateList: [],
      taskTypeList: [],
      beginDate: startTime,
      endDate: getglobalDate
  })
    if (response.code == 200) {
      ElMessage.success(response.message);
      tableDatax.value = response.data.records;
      console.log(response.data.pages);
      
      totalRecords.value = response.data.total/2 || 0
    } else {
      ElMessage.error(response.message);
  }
}
catch (error) {
  console.error(error);
}
}
const handlePageChange2 = (newPage) => {
currentPage2.value = newPage;
console.log(currentPage2.value);
window.localStorage.setItem('pagenumber', currentPage2.value)
historicala(currentPage2.value);
};
const historicala = async (page) => {
try { 
let page = window.localStorage.getItem('pagenumber')
let startTime = window.localStorage.getItem('startTime')
    const response = await request.post("/hollowGlass/hollowBigStorageCageHistoryTask/queryHollowBigStorageCageHistoryTask", {
      pageNo: page,
      pageSize: 20,
      glassId: glassId.value,
      startSlot: 0,
      targetSlot: 0,
      taskStateList: [],
      taskTypeList: [],
      beginDate: startTime,
      endDate: getglobalDate
  })
    if (response.code == 200) {
      ElMessage.success(response.message);
      tableDatax.value = response.data.records;
      console.log(response.data.pages);
      
      totalRecords.value = response.data.total/2 || 0
    } else {
      ElMessage.error(response.message);
  }
}
catch (error) {
  console.error(error);
}
}
// 历史查询
const sethistorical = async () => {
try { 
let startTime = window.localStorage.getItem('startTime')
let celllist=[]
let stateList=[]
let pstartSlot= ''
let ptargetSlot=''
if(selectValuesa[0]!=null&&selectValuesa[0]!='undefined'){
  if(selectValuesa[0]!=""){
    celllist=[selectValuesa[0]];
  }
}
if(selectValuesa[1]!=null&&selectValuesa[1]!='undefined'){
  if(selectValuesa[1]!=""){
    stateList=[selectValuesa[1]];
  }
}
if(startSlot.value != ""){
  pstartSlot = startSlot.value
}else{
  pstartSlot = '0'
}
if(targetSlot.value != ""){
  ptargetSlot = targetSlot.value
}else{
  ptargetSlot = '0'
}
let page = window.localStorage.getItem('pagenumber')
const response = await request.post("/hollowGlass/hollowBigStorageCageHistoryTask/queryHollowBigStorageCageHistoryTask", {
      pageNo: page,
      pageSize: 20,
      glassId: glassId.value,
      startSlot: pstartSlot,
      targetSlot: ptargetSlot,
      taskStateList: celllist,
      taskTypeList: stateList,
      beginDate: startTime,
      endDate: getglobalDate
  })
    if (response.code == 200) {
      ElMessage.success(response.message);
      tableDatax.value = response.data.records;
    } else {
      ElMessage.error(response.message);
  }
}
catch (error) {
  console.error(error);
}
}

// 格式化时间戳为年月日时间字符串的函数
function formatTimestamp(timestamp) {
const date = new Date(timestamp);
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始，需要加1，并补零
const day = String(date.getDate()).padStart(2, '0'); // 补零
const hours = String(date.getHours()).padStart(2, '0'); // 补零（如果需要显示时间）
const minutes = String(date.getMinutes()).padStart(2, '0'); // 补零（如果需要显示时间）
const seconds = String(date.getSeconds()).padStart(2, '0'); // 补零（如果需要显示时间）
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
// 格式化后端时间并计算一周前的时间
const defaultTime = ref<[Date, Date]>([new Date(), new Date()]);
function parseAndSetTime() {
const backendTime = new Date(getglobalDate);
const oneWeekAgo = new Date(backendTime.getTime() - 7 * 24 * 60 * 60 * 1000); // 减去7天
console.log(formatTimestamp(oneWeekAgo));
console.log(oneWeekAgo);
timeRange.value = [formatTimestamp(oneWeekAgo), formatTimestamp(backendTime)];
window.localStorage.setItem('startTime', formatTimestamp(oneWeekAgo))
}
function getStatusTypeb(taskState: number) {  
switch (taskState) {  
  case 0:
    return 'primary';  
  case 2: 
    return 'success';  
  case 3: 
    return 'danger';  
  case 4: 
    return 'warning';  
}  
}
function getStatusTextb(taskState: number) {
switch (taskState) {
  case 0:  
    return t('searchOrder.begin');
  case 2:  
    return t('searchOrder.finish');
  case 3:  
  return t('order.dilapidation');
  case 4:  
  return t('searchOrder.uncar');
}  
}
function getStatusTypea(taskType: number) {  
switch (taskType) {  
  case 1: 
    return 'primary';  
  case 2: 
    return 'success';  
  case 3:
    return 'warning';  
}  
}  
function getStatusTexta(taskType: number) {
switch (taskType) {
  case 1:  
    return t('searchOrder.inkage');
  case 2:  
  return t('searchOrder.outfilm');
  case 3:  
  return t('film.dispatch');
}  
}
onMounted(() => {
parseAndSetTime();
historical();
});
</script>
<style scoped>  
</style>

 UI-Project/src/views/hollow/hollowslicecage.vue

@@ -6,7 +6,6 @@
import {onBeforeUnmount, onMounted, onUnmounted, reactive, ref} from "vue";
import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService';
import {ElMessage, ElMessageBox} from 'element-plus'

const dialogFormVisibleaDownGlasss = ref(false)
const scanGlass = ref([])
const {t} = useI18n()
@@ -57,6 +56,7 @@
const cell7=ref(true);
const cell8=ref(true);
const cell9=ref(true);
const blindb = ref(false)
const selectedRow = ref(null);
const temperingengineerId=ref('');
const handlePageChange2 = (newPage) => {
@@ -576,6 +576,11 @@
    left,
  };
};
const iframeUrl = ref('');
const handlehistorical = (row) => {
  blindb.value = true;
  iframeUrl.value = `${window.location.origin}/#/hollow/hellowslicecagehistory`;
};
onMounted(() => {
  socket = initializeWebSocket(socketUrl, handleMessage);
});
@@ -629,6 +634,7 @@
<template>
  <div style="height: 600px;">
    <el-button style="margin-top: 7px;margin-left: 10px;" id="searchButton" type="primary" @click="handlexiang">{{ $t('searchOrder.cageinformation') }}</el-button>
    <el-button style="margin-top: 7px;margin-left: 10px;" id="searchButton" type="success" @click="handlehistorical">{{ $t('searchOrder.historicaltasks') }}</el-button>
    <el-switch style="margin-top: 7px;margin-left: 10px;" v-model="diaodu" class="mb-2" :inactive-text="$t('searchOrder.Schedulingswitch')" @change="handlediaodu" />
    <div id="dotClass">
        <div>{{ $t('searchOrder.inkageEntity') }}</div>
@@ -951,6 +957,17 @@
    </div>
  </div>
  </el-dialog>
  <!-- 历史任务 -->
<el-dialog v-model="blindb" top="10vh" width="90%">
     <iframe 
     :src="iframeUrl" 
     marginwidth="2000px"
     marginheight="2000px"
     width="100%" 
     height="700px" 
     frameborder="0"
     ></iframe>
  </el-dialog>
</template>
<style>
#dt { display:block; float:left;line-height: 20px;margin-left: 100px;}

 UI-Project/src/views/largescreendisplay/screendisplay.vue

@@ -12,7 +12,6 @@
const blindb = ref(false)
const { t } = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
 
let socket = null;
const rawGlassStorageDetailList = ref([])
const orderDTOS = ref([])
@@ -21,7 +20,6 @@
  rawGlassStorageDetailList.value = data.rawGlassStorageDetailList[0]
  orderDTOS.value = data.orderDTOS[0]
};
 
let socket1 = null;
const edgOneTasks = ref([])
const edgTwoTasks = ref([])
@@ -41,9 +39,7 @@
    numBoxes2.value = edgTwoTasks.value.length;
    boxStart2();
  }
  
};
 
let socket2 = null;
const temperingTaskType = ref([])
const temperingGlassInfoList = ref([])
@@ -62,22 +58,18 @@
    boxStart3();
  }
};
 
let socket3 = null;
const bigStorageCageUsage = ref([])
const socketUrl3 = `ws://${WebSocketHost}:${host}/api/cacheVerticalGlass/api/talk/largenScreen`;
const handleMessage3 = (data) => {
  bigStorageCageUsage.value = data.bigStorageCageUsage[0];
};
 
let socket4 = null;
const hollowBigStorageCageUsage = ref([])
const socketUrl4 = `ws://${WebSocketHost}:${host}/api/hollowGlass/api/talk/largenScreen`;
const handleMessage4 = (data) => {
  hollowBigStorageCageUsage.value = data.hollowBigStorageCageUsage[0];
};
 
 
const tableDatad = ref([]);
const patternUsage = async () => {
  try {
@@ -99,12 +91,10 @@
  thickness: '',
  films: ''
})
 
 
// 点击下方弹窗
const handlehistorical = (row) => {
  blindb.value = true;
  // historical()
  patternUsage()
};
// 在组件挂载时设置默认时间范围
onMounted(() => {
@@ -139,7 +129,6 @@
  console.log("关闭了")
  closeWebSocket();
});
 
const numBoxes = ref(5);
const numBoxes2 = ref(5); 
const numBoxes3 = ref(5);
@@ -154,12 +143,10 @@
const maxX4 = 60; // 终点X坐标
const maxY4 = 0; // 终点Y坐标
const delayFrames = 600; // 每个 div 的延迟帧数
 
const boxes = ref([]);
const boxes2 = ref([]);
const boxes3 = ref([]);
const boxes4 = ref([]);
 
// 初始化 div 数据
const boxStart = () => {
  boxes.value = [];
@@ -197,7 +184,6 @@
  });
}
}
 
const boxStart3 = () => {
  boxes3.value = [];
  for (let i = 0; i < numBoxes3.value; i++) {
@@ -216,7 +202,6 @@
  });
}
}
 
const boxStart4 = () => {
  boxes4.value = [];
  for (let i = 0; i < numBoxes4.value; i++) {
@@ -235,15 +220,12 @@
  });
}
}
 
 
const animate = () => {
  boxes.value.forEach((box) => {
    if (box.delay > 0) {
      box.delay--;
      return;
    }
    
    if (box.direction === 'up') {
      box.y -= speed;
      if (box.y <= maxY) {
@@ -258,19 +240,16 @@
        box.direction = 'up';
      }
    }
 
    box.style = {
      ...box.style,
      transform: `translate(${box.x}px, ${box.y}px)`
    };
  });
 
  boxes2.value.forEach((box) => {
    if (box.delay > 0) {
      box.delay--;
      return;
    }
    
    if (box.direction === 'up') {
      box.y -= speed;
      if (box.y <= maxY2) {
@@ -290,13 +269,11 @@
      transform: `translate(${box.x}px, ${box.y}px)`
    };
  });
 
  boxes3.value.forEach((box) => {
    if (box.delay > 0) {
      box.delay--;
      return;
    }
    
    if (box.direction === 'up') {
      box.y -= speed;
      if (box.y <= maxY3) {
@@ -317,13 +294,11 @@
      transform: `translate(${box.x}px, ${box.y}px)`
    };
  });
 
  boxes4.value.forEach((box) => {
    if (box.delay > 0) {
      box.delay--;
      return;
    }
    
    if (box.direction === 'right') {
      box.x += speed;
      if (box.x >= maxX4) {
@@ -337,10 +312,8 @@
      transform: `translate(${box.x}px, ${box.y}px)`
    };
  });
 
  requestAnimationFrame(animate);
};
 
</script>
<template>
  <div style="height: 500px;">
@@ -430,10 +403,10 @@
  <!-- 点击下方弹窗 -->
  <el-dialog v-model="blindb" top="10vh" width="90%">
    <div style="display: flex;">
      <el-input v-model="ptnusage.width" placeholder="请输入宽度" style="width: 270px;margin-left: 10px;" clearable></el-input>
      <el-input v-model="ptnusage.height" placeholder="请输入高度" style="width: 270px;margin-left: 10px;" clearable></el-input>
      <el-input v-model="ptnusage.thickness" placeholder="请输入厚度" style="width: 270px;margin-left: 10px;" clearable></el-input>
      <el-input v-model="ptnusage.films" placeholder="请输入膜系" style="width: 270px;margin-left: 10px;" clearable></el-input>
    <el-input v-model="ptnusage.width" style="margin-left: 10px;margin-bottom: 10px;width: 270px;" clearable :placeholder="$t('screendisplay.pwidth')" />
    <el-input v-model="ptnusage.height" style="margin-left: 10px;margin-bottom: 10px;width: 270px;" clearable :placeholder="$t('screendisplay.pheight')" />
    <el-input v-model="ptnusage.thickness" style="margin-left: 10px;margin-bottom: 10px;width: 270px;" clearable :placeholder="$t('searchOrder.inthickness')" />
    <el-input v-model="ptnusage.films" style="margin-left: 10px;margin-bottom: 10px;width: 270px;" clearable :placeholder="$t('film.infilms')" />
      <!-- <el-select :placeholder="$t('basicData.coatingtypes')" clearable style="width: 270px;margin-left: 10px;"
        v-model="taskStat">
        <el-option v-for="item in optionsa" :key="item.value" :label="item.label" :value="item.value" />
@@ -458,14 +431,14 @@
    </div>
    <el-table ref="table" style="margin-top: 20px;height: 650px;" :data="tableDatad"
      :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }">
      <el-table-column prop="patternWidth" align="center" :label="$t('宽')" min-width="80" />
      <el-table-column prop="patternHeight" align="center" :label="$t('高')" min-width="80" />
      <el-table-column prop="patternThickness" align="center" :label="$t('厚度')" min-width="80" />
      <el-table-column prop="filmsId" align="center" :label="$t('膜系')" min-width="120" />
      <el-table-column prop="totalCount" align="center" :label="$t('总数量')" min-width="120" />
      <el-table-column prop="count" align="center" :label="$t('笼内数量')" min-width="120" />
      <el-table-column prop="finishCount" align="center" :label="$t('上片数量')" min-width="120" />
      <el-table-column prop="damageCount" align="center" :label="$t('破损数量')" min-width="120" />
      <el-table-column prop="patternWidth" align="center" :label="$t('basicData.width')" min-width="80" />
      <el-table-column prop="patternHeight" align="center" :label="$t('basicData.height')" min-width="80" />
      <el-table-column prop="patternThickness" align="center" :label="$t('basicData.thickness')" min-width="80" />
      <el-table-column prop="filmsId" align="center" :label="$t('basicData.coatingtypes')" min-width="120" />
      <el-table-column prop="totalCount" align="center" :label="$t('searchOrder.allnumber')" min-width="120" />
      <el-table-column prop="count" align="center" :label="$t('searchOrder.cagesnumber')" min-width="120" />
      <el-table-column prop="finishCount" align="center" :label="$t('screendisplay.upnumber')" min-width="120" />
      <el-table-column prop="damageCount" align="center" :label="$t('hellow.damagenumber')" min-width="120" />
    </el-table>
  </el-dialog>
  <el-dialog v-model="blinda" top="5vh" width="85%">
@@ -507,19 +480,16 @@
  line-height: 20px;
  margin-left: 100px;
}
 
#dta {
  display: block;
  float: left;
  line-height: 20px;
  margin-left: 80%;
}
 
#dialog-footer {
  text-align: center;
  margin-top: -15px;
}
 
#message {
  text-align: center;
  align-items: center;
@@ -529,11 +499,9 @@
  background-color: #337ecc;
  margin-left: 28%;
}
 
#awatch {
  height: 460px;
}
 
.img-screen {
  max-width: 48%;
  max-height: 100%;
@@ -550,7 +518,6 @@
  height: 0; 
  padding-bottom: 50%;  */
}
 
.clickable-area {
  cursor: pointer;
  /* 指示这是一个可点击的区域 */
@@ -559,11 +526,9 @@
  line-height: 95px;
  /* 如果需要，使文本垂直居中 */
}
 
/* .awatch{
  height: 460px;
  /* max-width: 100%; */
 
.box {
  transition: transform 0.016s linear;
}