Merge remote-tracking branch 'origin/master'

zhoushihao

2025-02-26 a8c1dd008f9a096cb01774f17a8bceda5aafed88

Merge remote-tracking branch 'origin/master'

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

@@ -24,7 +24,7 @@
      @click="showDialog(rect.glassId)"  
      :style="{ position: 'absolute', 
      top: `${rect.y}px`, left: `${rect.x}px`, width: `${rect.width}px`, height: `${rect.height}px`,
      backgroundColor: rect.isActive ? '#ADFF2F' : getRectColor(rect.state)
      backgroundColor: rect.isActive ? '#ADFF2F' : getRectColor(rect.status)
       }"  
    >
     <div  class="centered-text">
@@ -36,11 +36,11 @@
   </div>
      </el-scrollbar>
      <el-dialog v-model="blind" top="30vh" width="15%" style="text-align: center;" @close="handleDialogClose">
        <el-button :disabled="currentGlassRect?.state === 8 || currentGlassRect?.state === 9" type="warning"
        <el-button :disabled="currentGlassRect?.status === 8 || currentGlassRect?.status === 9" type="warning"
                   plain :icon="Delete" @click="handleDamage(currentGlassId)" style="width: 140px;margin-left: 10px;">
          {{ $t('order.dilapidation') }}
        </el-button>
        <el-button :disabled="currentGlassRect?.state === 9 || currentGlassRect?.state === 8" type="danger"
        <el-button :disabled="currentGlassRect?.status === 9 || currentGlassRect?.status === 8" type="danger"
                   plain @click="handleManualTake(currentGlassId)" style="width: 140px;margin-top: 10px;">
          <el-icon class="el-icon--right">
            <Upload/>
@@ -95,7 +95,7 @@
  const response = await request.post('/temperingGlass/temperingGlassInfo/updateTemperingState', {
      glassId: currentGlassId.value,
      line: 4001,
      state: 8,
      status: 8,
      workingProcedure: '钢化',
    })
    if (response.code == 200) {
@@ -117,7 +117,7 @@
  const response = await request.post('/temperingGlass/temperingGlassInfo/updateTemperingState', {
      glassId: currentGlassId.value,
      line: 4001,
      state: 9,
      status: 9,
      workingProcedure: '钢化',
    })
    if (response.code == 200) {
@@ -193,6 +193,8 @@
};
const handleCurrentChange = async(val: number) => {  
  currentPage.value = val;
  console.log(currentPage.value);
  
    const response = await request.post('/temperingGlass/temperingGlassInfo/selectTemperingGlass', {
      engineerId: engineerId.value,
      temperingLayoutId: currentPage.value
@@ -232,30 +234,33 @@
  }
    }); 
    adjustedRects.value = adjustedRectsData;
       currentPage.value = 1;
    } 
};
function getRectColor(state: number): string {
  switch (state) {
function getRectColor(status: number): string {
  switch (status) {
    case -1:
      return '#CDAF95';
    case 0:
      return '#e1f3d8';
    case 100:
      return '#c8c9cc';
    case 110:
      return '#b3e19d';
    case 120:
      return '#f89898';
      return '#7AC5CD';
    case 1:
      return '#95d475';
    case 2:
      return 'lightblue';
    case 3:
      return '#eebe77';
    case 4:
      return '#CD6090';
    case 8:
      return '#911005';
    case 9:
      return '#f3d19e';
      return '#4682B4';
  }
}
// 更新矩形状态  
function updateRectStatus(glassId: string, status: number) {  
  adjustedRects.value.forEach(rect => {  
    if (rect.glassId === glassId) {  
      rect.state = status; // 更新矩形的状态  
      rect.status = status; // 更新矩形的状态  
    }  
  });  
}

 UI-Project/src/views/ReportWork/reportWork.vue

@@ -2,41 +2,50 @@
  <div style="height: 600px;">
    <div style="display: flex; flex-direction: row; align-items: center; margin-top: 20px;">  
    <span style="margin-left: 10px;" class="demonstration">{{ $t('reportmanage.productiontime') }}</span>
    <el-date-picker style="margin-left: 10px;"  v-model="timeRange" type="daterange" format="YYYY/MM/DD" value-format="YYYY-MM-DD"
      :start-placeholder="$t('reportmanage.starttime')" :end-placeholder="$t('reportmanage.endtime')" :default-time="defaultTime" />
      <el-date-picker style="margin-left: 10px;" v-model="timeRange" type="daterange" format="YYYY/MM/DD"
        value-format="YYYY-MM-DD" :start-placeholder="$t('reportmanage.starttime')"
        :end-placeholder="$t('reportmanage.endtime')" :default-time="defaultTime" />
    <el-select v-model="report.type" :placeholder="$t('reportmanage.ctype')" style="margin-left: 10px;" >
      <el-option :label="$t('reportmanage.all')" value="0"></el-option>
      <el-option :label="$t('reportmanage.completed')" value="1"></el-option>
        <!-- <el-option :label="$t('reportmanage.all')" value="0"></el-option> -->
        <!-- <el-option :label="$t('reportmanage.completed')" value="1"></el-option> -->
      <el-option :label="$t('reportmanage.broke')" value="8"></el-option>
      <el-option :label="$t('reportmanage.takeout')" value="9"></el-option>
    </el-select>
    <el-select v-model="report.status" :placeholder="$t('reportmanage.cstate')" style="margin-left: 10px;" >
      <el-option :label="$t('reportmanage.all')" value="0"></el-option>
        <!-- <el-option :label="$t('reportmanage.all')" value="0"></el-option> -->
      <el-option :label="$t('reportmanage.dreportwork')" value="1"></el-option>
      <el-option :label="$t('reportmanage.pendingwork')" value="2"></el-option>
        <!-- <el-option :label="$t('reportmanage.pendingwork')" value="2"></el-option> -->
      <el-option :label="$t('reportmanage.reportwork')" value="3"></el-option>
    </el-select>
    <el-select v-model="report.workingProcedure" :placeholder="$t('reportmanage.cprocess')" style="margin-left: 10px;" >
      <el-select v-model="report.workingProcedure" :placeholder="$t('reportmanage.cprocess')"
        style="margin-left: 10px;">
      <el-option :label="$t('reportmanage.all')" value="0"></el-option>
      <el-option :label="$t('reportmanage.incise')" value="切割"></el-option>
      <el-option :label="$t('reportmanage.edging')" value="磨边"></el-option>
      <el-option :label="$t('reportmanage.steel')" value="钢化"></el-option>
    </el-select>
    <el-button type="primary" style="margin-left: 10px;" @click="selectReportData()">{{ $t('reportmanage.inquire') }}</el-button>
    <el-button type="success" style="margin-left: 10px;" @click="handleConfirm">{{ $t('reportmanage.signingwork') }}</el-button>
      <el-button type="primary" style="margin-left: 10px;" @click="selectReportData()">{{ $t('reportmanage.inquire')
        }}</el-button>
      <el-button type="success" style="margin-left: 10px;" :disabled="(!selectedStatus)" @click="handleConfirm">{{
        $t('reportmanage.signingwork')
        }}</el-button>
  </div>
    <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="730" ref="table" :data="reportData"
        <el-table height="740" ref="table" :data="reportData"
      :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }">
      <el-table-column prop="teamsGroupsName" align="center" :label="$t('reportmanage.reporteam')" min-width="120" />
      <el-table-column prop="deviceName" align="center" :label="$t('reportmanage.reportingequipment')" min-width="120" />
          <el-table-column prop="teamsGroupsName" align="center" :label="$t('reportmanage.reporteam')"
            min-width="120" />
          <el-table-column prop="deviceName" align="center" :label="$t('reportmanage.reportingequipment')"
            min-width="120" />
      <el-table-column prop="line" align="center" :label="$t('reportmanage.line')" min-width="120" />
      <el-table-column prop="workingProcedure" align="center" :label="$t('reportmanage.process')" min-width="120" />
      <el-table-column prop="glassId" align="center" :label="$t('reportmanage.glassID')" min-width="130" />
      <el-table-column prop="engineerId" align="center" :label="$t('reportmanage.projectnumber')" min-width="120" />
      <el-table-column prop="temperingLayoutId" align="center" :label="$t('reportmanage.layoutID')" min-width="120" />
      <el-table-column prop="damageTime" align="center" :label="$t('reportmanage.productiontime')" min-width="230" />
          <el-table-column prop="temperingLayoutId" align="center" :label="$t('reportmanage.layoutID')"
            min-width="120" />
          <el-table-column prop="damageTime" align="center" :label="$t('reportmanage.productiontime')"
            min-width="230" />
      <el-table-column prop="type" align="center" :label="$t('reportmanage.type')" min-width="120" />
      <el-table-column prop="status" align="center" :label="$t('reportmanage.state')" min-width="120" />
      <el-table-column prop="processId" align="center" :label="$t('reportmanage.processcards')" min-width="140" />
@@ -44,89 +53,64 @@
      <el-table-column prop="technologyNumber" align="center" :label="$t('reportmanage.layer')" min-width="120" />
      <el-table-column prop="breakageType" align="center" :label="$t('reportmanage.typebreakage')" min-width="180">
        <template #default="{ row }">  
        <el-select  
           v-model="selectValuesa[row.id]"
           filterable  
           :placeholder="$t('reportmanage.pcausebreakage')"
           clearable  
           @input="handleInputChangea($event, row.id)"
         >  
         <el-option  
            v-for="item in selectOptionsa"  
            :key="item.basicName"  
            :label="item.basicName"  
            :value="item.basicName"  
         />  
              <el-select v-model="row.breakageType" filterable :placeholder="$t('reportmanage.pcausebreakage')" :disabled="selectedType"
                clearable @input="handleInputChangea($event, row.id)">
                <el-option v-for="item in selectOptionsa" :key="item.basicName" :label="item.basicName"
                  :value="item.basicName" />
         </el-select>  
         </template>
      </el-table-column>
      <el-table-column prop="breakageReason" align="center" :label="$t('reportmanage.causebreakage')" min-width="180">
          <el-table-column prop="breakageReason" align="center" :label="$t('reportmanage.causebreakage')"
            min-width="180">
        <template #default="{ row }">  
        <el-select  
             v-model="selectValuesb[row.id]"
             filterable  
             :placeholder="$t('reportmanage.ptypebreakage')"
             clearable  
             @input="handleInputChangea($event, row.id)"
           >  
         <el-option  
            v-for="item in selectOptionsb"  
            :key="item.basicName"  
            :label="item.basicName"  
            :value="item.basicName"  
         />  
              <el-select v-model="row.breakageReason" filterable :placeholder="$t('reportmanage.ptypebreakage')" :disabled="selectedType"
                clearable @input="handleInputChangea($event, row.id)">
                <el-option v-for="item in selectOptionsb" :key="item.basicName" :label="item.basicName"
                  :value="item.basicName" />
       </el-select>  
       </template>
      </el-table-column>
      <el-table-column align="center" :label="$t('reportmanage.responsibleprocess')" min-width="120">
        <template #default="{ row }">  
        <span>{{ '切割磨边钢化' }}</span>  
      </template>  
      </el-table-column>
      <el-table-column prop="responsiblePersonnel" align="center" :label="$t('reportmanage.responsiblepersonnel')" min-width="180">
        <template #default="{ row }">
          <el-input :placeholder="$t('reportmanage.presponsiblepersonnel')" v-model="inputValuesa[row.id]" autocomplete="off" />
        </template>
      </el-table-column>
      <el-table-column prop="responsibleTeam" align="center" :label="$t('reportmanage.responsibleteam')" min-width="180">
        <template #default="{ row }">  
        <el-select  
             v-model="selectValuesc[row.id]"
             filterable  
             :placeholder="$t('reportmanage.presponsibleteam')"
             clearable  
             @input="handleInputChangea($event, row.id)"
        >  
          <el-option  
             v-for="item in selectOptionsc"  
             :key="item.basicName"  
             :label="item.basicName"  
             :value="item.basicName"  
          />  
              <el-select v-model="row.responsibleProcess" filterable :placeholder="$t('reportmanage.ptypebreakage')" :disabled="selectedType"
                clearable @input="handleInputChangea($event, row.id)">
                <el-option value="切割" label="切割"></el-option>
                <el-option value="磨边" label="磨边"></el-option>
                <el-option value="钢化" label="钢化"></el-option>
        </el-select>  
        </template>
      </el-table-column>
      <el-table-column prop="responsibleEquipment" align="center" :label="$t('reportmanage.responsibleequipment')" min-width="180">
          <el-table-column prop="responsiblePersonnel" align="center" :label="$t('reportmanage.responsiblepersonnel')"
            min-width="180">
        <template #default="{ row }">  
        <el-select  
              v-model="selectValuesd[row.id]"
              filterable  
              :placeholder="$t('reportmanage.presponsibleequipment')"
              clearable  
              @input="handleInputChangea($event, row.id)"
            >  
         <el-option  
            v-for="item in selectOptionsd"  
            :key="item.basicName"  
            :label="item.basicName"  
            :value="item.basicName"  
         />  
              <el-input :placeholder="$t('reportmanage.presponsiblepersonnel')" v-model="row.responsiblePersonnel" :disabled="selectedType"
                autocomplete="off" />
            </template>
          </el-table-column>
          <el-table-column prop="responsibleTeam" align="center" :label="$t('reportmanage.responsibleteam')"
            min-width="180">
            <template #default="{ row }">
              <el-select v-model="row.responsibleTeam" filterable :placeholder="$t('reportmanage.presponsibleteam')" :disabled="selectedType"
                clearable @input="handleInputChangea($event, row.id)">
                <el-option v-for="item in selectOptionsc" :key="item.basicName" :label="item.basicName"
                  :value="item.basicName" />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column prop="responsibleEquipment" align="center" :label="$t('reportmanage.responsibleequipment')" :disabled="selectedType"
            min-width="180">
            <template #default="{ row }">
              <el-select v-model="row.responsibleEquipment" filterable
                :placeholder="$t('reportmanage.presponsibleequipment')" clearable  :disabled="selectedType"
                @input="handleInputChangea($event, row.id)">
                <el-option v-for="item in selectOptionsd" :key="item.basicName" :label="item.basicName"
                  :value="item.basicName" />
       </el-select>  
       </template>
      </el-table-column>
      <el-table-column prop="remark" align="center" :label="$t('reportmanage.remark')" min-width="180">
        <template #default="{ row }">
          <el-input :placeholder="$t('reportmanage.premark')" v-model="inputValuesb[row.id]" autocomplete="off" />
              <el-input :placeholder="$t('reportmanage.premark')" v-model="row.remark" autocomplete="off" :disabled="selectedType" />
        </template>
      </el-table-column>
    </el-table>
@@ -144,12 +128,23 @@
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
const report = ref({
  type: '0',
  status: '0',
  type: '8',
  status: '1',
  workingProcedure: '0',
});
const reportData = ref([])
const timeRange = ref(["2022-01-01", "2025-01-01"])
const endDate = new Date();
const startDate = new Date();
startDate.setDate(endDate.getDate() - 7);  // 获取一个星期前的时间
// 格式化为 "YYYY-MM-DD" 格式
const formatDate = (date) => {
  const year = date.getFullYear();
  const month = String(date.getMonth() + 1).padStart(2, '0');
  const day = String(date.getDate()).padStart(2, '0');
  return `${year}-${month}-${day}`;
};

const timeRange = ref([formatDate(startDate), formatDate(endDate)]);
const selectOptionsa = ref([]);
const selectOptionsb = ref([]);
const selectOptionsc = ref([]);
@@ -158,32 +153,70 @@
const selectValuesb = reactive({});
const selectValuesc = reactive({});
const selectValuesd = reactive({});
const selectValuese = reactive({});
const inputValuesa = reactive({});
const inputValuesb = reactive({});

const selectedType = ref(true);
const selectedStatus = ref(false);


// 查询数据
const selectReportData = async () => {
  const response = await request.post("/cacheVerticalGlass/damage/selectDamage", {
    startTime: timeRange.value[0],
    endTime: timeRange.value[1],
    endTime: timeRange.value[1]+" 23:59:59",
    type: report.value.type,
    status: report.value.status,
    workingProcedure: report.value.workingProcedure
  })
  if (report.value.type == 8) {
    selectedType.value = false;
  }else{
    selectedType.value = true;
  }
  if (report.value.status == 1&&(report.value.type == 8||report.value.type == 1)) {
    selectedStatus.value = true;
  }else{
    selectedStatus.value = false;
  }
  if (response.code === 200) {
    reportData.value = response.data;
    ElMessage.success(response.message);

  } else {
    ElMessage.error(response.message);
  }

  // const responses = await request.post("/cacheVerticalGlass/damage/insertDamage", {
  //   glassId:"P24081502|1|1",
  //   line:"1001",
  //   workingProcedure:"切割",
  //   remark:"",
  //   status:"0"
  // })
};
// 报工
const handleConfirm = async () => {
  const hasEmptyOrNullBreakType = reportData.value.some(
    item => item.breakageType === null || item.breakageType === ''
      || item.breakageReason === null || item.breakageReason === ''
      || item.responsibleProcess === null || item.responsibleProcess === ''
      || item.responsibleTeam === null || item.responsibleTeam === ''
      || item.responsibleEquipment === null || item.responsibleEquipment === ''
  );
  if (hasEmptyOrNullBreakType&&selectedType.value==false) {
    // 如果找到了未选择项，显示错误信息
    ElMessage.error('请填写所有玻璃的破损信息');
  } else {
  const response = await request.post("/cacheVerticalGlass/damage/submitDamage", reportData.value)
  if (response.code === 200) {
    ElMessage.success(response.message);
  } else {
    ElMessage.error(response.message);
  }
  }

};
const fetchTableData = async () => {  
  try {  
@@ -210,18 +243,37 @@
  selectValuesb[rowId] = value;  
  selectValuesc[rowId] = value;  
  selectValuesd[rowId] = value;  
  selectValuese[rowId] = value;
  inputValuesa[rowId] = value;  
  inputValuesb[rowId] = value;  
};
fetchTableData();  
let socket = null;
// const socketUrl = `ws://${WebSocketHost}:${host}/api/temperingGlass/api/talk/screen`;
// const handleMessage = (data) => {
// adjustedRects.value = data.device[0].map(rect => ({  
//       ...rect, 
//       completed: rect.completedQuantity,
//       breakage: rect.breakageQuantity,
//       thisProcess: rect.thisProcess,
//     })); 
// };
// let socket;
onMounted(() => {
  // socket = new WebSocket(socketUrl);
  // socket.onmessage = (event) => {
  //   const data = JSON.parse(event.data);

  //   // updateCharts();
  // };
  // };  
});
onUnmounted(() => {
  socket.close();
});
onMounted(() => {
  fetchTableData();
  // socket = initializeWebSocket(socketUrl, handleMessage);
});
  onUnmounted(() => {
    if (socket) {
@@ -233,4 +285,5 @@
  closeWebSocket();
});
</script>

<style scoped></style>

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

@@ -43,13 +43,17 @@
const diaodu = ref('')
const flowCardId = ref('')
const filmsId = ref('')
const adjustedRects = ref([]);
const project = ref([]);
const adjust = ref([]);
const adjusta = ref([]);
const adjustedRects = ref([]);
const adjustedRectsa = ref([]);
const adjustedRectsb = ref([]);
const adjustedRectsc = ref([]);
const subRectsCounts = ref([]);
const subRectsCountsa = ref([]);
const subRectsCountsb = ref([]);
const subRectsCountsc = ref([]);
const currentRow = reactive({}); // 当前行的数据 
const currentPage2 = ref(1)
const inputValuesa = reactive({});
@@ -840,31 +844,168 @@
  ganghua.value = ''
  }
  if(data.bigStorageCageInfos!=null){
    window.localStorage.setItem('length', data.bigStorageCageInfos[0][1].length)
  let length = window.localStorage.getItem('length')
  adjustedRects.value = data.bigStorageCageInfos[0][1].map(rect => ({  
            ...rect, 
            height: 20/length,
            top: 29/length
  adjustedRects.value = data.bigStorageCageInfos[0][1].map((rect, index) => ({
    id: index + 1,
    height: 20/55,
    top: 53/55,
          })); 
adjustedRectsa.value = data.bigStorageCageInfos[0][2].map(rect => ({  
            ...rect, 
            height: 20/length,
            top: 29/length
subRectsCounts.value = data.bigStorageCageInfos[0][1].map(rect => rect.count);
adjustedRectsa.value = data.bigStorageCageInfos[0][2].map((rect, index) => ({
    id: index + 1,
    height: 20/55,
    top: 53/55,
          })); 
adjustedRectsb.value = data.bigStorageCageInfos[0][3].map(rect => ({  
            ...rect, 
            height: 20/length,
            top: 29/length
subRectsCountsa.value = data.bigStorageCageInfos[0][2].map(rect => rect.count);
adjustedRectsb.value = data.bigStorageCageInfos[0][3].map((rect, index) => ({
    id: index + 1,
    height: 20/55,
    top: 53/55,
          })); 
adjustedRectsc.value = data.bigStorageCageInfos[0][4].map(rect => ({  
            ...rect, 
            height: 20/length,
            top: 29/length
subRectsCountsb.value = data.bigStorageCageInfos[0][3].map(rect => rect.count);
adjustedRectsc.value = data.bigStorageCageInfos[0][4].map((rect, index) => ({
    id: index + 1,
    height: 20/55,
    top: 53/55,
          }));
subRectsCountsc.value = data.bigStorageCageInfos[0][4].map(rect => rect.count);
  }else{
    adjustedRects.value = ''
    adjustedRects.value = '',
    adjustedRectsa.value = '',
    adjustedRectsb.value = '',
    adjustedRectsc.value = ''
  }
};
// 计算每个大矩形的样式
const rectStyle = (rect, index) => ({
  position: 'absolute',
  width: '170px',
  left: '0px',
  top: `${index*rect.top}px`,
  height: `${rect.height}px`,
});
// 计算每个小矩形的样式和数量
const getSubRects = (rectIndex) => {
  const count = subRectsCounts.value[rectIndex];
  const subRects = [];
  for (let i = 0; i < count; i++) {
    subRects.push({});
  }
  return subRects;
};
// 计算每个小矩形的样式
const subRectStyle = (rectIndex, subIndex) => {
  const width = '18px';
  const marginLeft = '8px';
  const totalWidth = 6 * (parseInt(width) + parseInt(marginLeft));
  const left = `${(subIndex * (parseInt(width) + parseInt(marginLeft))) / totalWidth * 100}%`;
  return {
    position: 'absolute',
    width,
    height: '100%',
    marginLeft,
    top: '0px',
    backgroundColor: '#911005',
    left,
  };
};
// 计算每个大矩形的样式
const rectStylea = (rect, index) => ({
  position: 'absolute',
  width: '170px',
  left: '0px',
  top: `${index*rect.top}px`,
  height: `${rect.height}px`,
});
// 计算每个小矩形的样式和数量
const getSubRectsa = (rectIndex) => {
  const count = subRectsCountsa.value[rectIndex];
  const subRects = [];
  for (let i = 0; i < count; i++) {
    subRects.push({});
  }
  return subRects;
};
// 计算每个小矩形的样式
const subRectStylea = (rectIndex, subIndex) => {
  const width = '18px';
  const marginLeft = '8px';
  const totalWidth = 6 * (parseInt(width) + parseInt(marginLeft));
  const left = `${(subIndex * (parseInt(width) + parseInt(marginLeft))) / totalWidth * 100}%`;
  return {
    position: 'absolute',
    width,
    height: '100%',
    marginLeft,
    top: '0px',
    backgroundColor: '#911005',
    left,
  };
};
// 计算每个大矩形的样式
const rectStyleb = (rect, index) => ({
  position: 'absolute',
  width: '170px',
  left: '0px',
  top: `${index*rect.top}px`,
  height: `${rect.height}px`,
});
// 计算每个小矩形的样式和数量
const getSubRectsb = (rectIndex) => {
  const count = subRectsCountsb.value[rectIndex];
  const subRects = [];
  for (let i = 0; i < count; i++) {
    subRects.push({});
  }
  return subRects;
};
// 计算每个小矩形的样式
const subRectStyleb = (rectIndex, subIndex) => {
  const width = '18px';
  const marginLeft = '8px';
  const totalWidth = 6 * (parseInt(width) + parseInt(marginLeft));
  const left = `${(subIndex * (parseInt(width) + parseInt(marginLeft))) / totalWidth * 100}%`;
  return {
    position: 'absolute',
    width,
    height: '100%',
    marginLeft,
    top: '0px',
    backgroundColor: '#911005',
    left,
  };
};
// 计算每个大矩形的样式
const rectStylec = (rect, index) => ({
  position: 'absolute',
  width: '170px',
  left: '0px',
  top: `${index*rect.top}px`,
  height: `${rect.height}px`,
});
// 计算每个小矩形的样式和数量
const getSubRectsc = (rectIndex) => {
  const count = subRectsCountsc.value[rectIndex];
  const subRects = [];
  for (let i = 0; i < count; i++) {
    subRects.push({});
  }
  return subRects;
};
// 计算每个小矩形的样式
const subRectStylec = (rectIndex, subIndex) => {
  const width = '18px';
  const marginLeft = '8px';
  const totalWidth = 6 * (parseInt(width) + parseInt(marginLeft));
  const left = `${(subIndex * (parseInt(width) + parseInt(marginLeft))) / totalWidth * 100}%`;
  return {
    position: 'absolute',
    width,
    height: '100%',
    marginLeft,
    top: '0px',
    backgroundColor: '#911005',
    left,
  };
};
onMounted(() => {
  socket = initializeWebSocket(socketUrl, handleMessage);
@@ -1027,111 +1168,39 @@
    </div>
    <div style="position: relative;">
    <div v-show="cell1" style="width: 170px;height: 53px;position: relative;top:63px;left: 585px;">
      <div v-for="(rect, rectIndex) in adjustedRects" :key="rect.id" :style="rectStyle(rect, rectIndex)">
      <div  
      v-for="(rect, index) in adjustedRects"  
      :key="rect"  
      :style="{
       position: 'absolute',
       width: '200px',
       left: '0px',
       top: index*rect.top+`px`,
       height: `${rect.height}px`,
       }"  
    >
    <div  
      v-for="(rects, index) in rect.bigStorageCageDetails"  
      :key="rects"  
      :style="{
        float:'left',
       width: '18px',
       height: `${rect.height}px`,
       backgroundColor: '#911005',
       top: '0px',
       marginRight: rects.gap/5000*227+'px'
       }"  
    >
      </div>
      v-for="(subRect, subIndex) in getSubRects(rectIndex)"
      :key="subIndex"
      :style="subRectStyle(rectIndex, subIndex)"
    ></div>
    </div>
    </div>
 <div v-show="cell2" style="width: 170px;height: 53px;position: relative;top:67px;left: 585px;">
    <div v-for="(rect, rectIndex) in adjustedRectsa" :key="rect.id" :style="rectStylea(rect, rectIndex)">
  <div  
      v-for="(rect, index) in adjustedRectsa"  
      :key="rect.id"  
      :style="{
       position: 'absolute',
       width: '227px',
       left: '0px',
       top: index*rect.top+`px`,
       height: `${rect.height}px`,
       }"  
    >
    <div  
      v-for="(rects, index) in rect.bigStorageCageDetails"  
      :key="rects"  
      :style="{
        float:'left',
       width: '18px',
       height: `${rect.height}px`,
       backgroundColor: '#911005',
       top: '0px',
       marginRight: rects.gap/5000*227+'px'
       }"  
    >
      </div>
      v-for="(subRect, subIndex) in getSubRectsa(rectIndex)"
      :key="subIndex"
      :style="subRectStylea(rectIndex, subIndex)"
    ></div>
    </div>
    </div>
  <div v-show="cell3" style="width: 170px;height: 53px;position: relative;top:72px;left: 585px;">
    <div v-for="(rect, rectIndex) in adjustedRectsb" :key="rect.id" :style="rectStyleb(rect, rectIndex)">
    <div  
      v-for="(rect, index) in adjustedRectsb"  
      :key="rect.id"  
      :style="{
       position: 'absolute',
       width: '227px',
       left: '0px',
       top: index*rect.top+`px`,
       height: `${rect.height}px`,
       }"  
    >
    <div  
      v-for="(rects, index) in rect.bigStorageCageDetails"  
      :key="rects"  
      :style="{
        float:'left',
       width: '18px',
       height: `${rect.height}px`,
       backgroundColor: '#911005',
       top: '0px',
       marginRight: rects.gap/5000*227+'px'
       }"  
    >
      </div>
      v-for="(subRect, subIndex) in getSubRectsb(rectIndex)"
      :key="subIndex"
      :style="subRectStyleb(rectIndex, subIndex)"
    ></div>
    </div>
    </div>
  <div v-show="cell4" style="width: 170px;height: 53px;position: relative;top:77px;left: 585px;">
    <div v-for="(rect, rectIndex) in adjustedRectsc" :key="rect.id" :style="rectStylec(rect, rectIndex)">
    <div  
      v-for="(rect, index) in adjustedRectsc"  
      :key="rect.id"  
      :style="{
       position: 'absolute',
       width: '227px',
       left: '0px',
       top: index*rect.top+`px`,
       height: `${rect.height}px`,
       }"  
    >
    <div  
      v-for="(rects, index) in rect.bigStorageCageDetails"  
      :key="rects"  
      :style="{
        float:'left',
       width: '18px',
       height: `${rect.height}px`,
       backgroundColor: '#911005',
       top: '0px',
       marginRight: rects.gap/5000*227+'px'
       }"  
    >
      </div>
      v-for="(subRect, subIndex) in getSubRectsc(rectIndex)"
      :key="subIndex"
      :style="subRectStylec(rectIndex, subIndex)"
    ></div>
    </div>
    </div>
</div>

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

@@ -1096,8 +1096,8 @@
    const allPageData = data;
    const currentPageKeyValue = currentPageKey.value;
    const currentPageData = allPageData[currentPageKeyValue];
    if (data.free0neReguestEntity != null) {
    freeone.value = data.free0neReguestEntity == 1 ? 'green' : '#911005';
    if (data.freeOneRequestEntity != null) {
    freeone.value = data.freeOneRequestEntity == 1 ? 'green' : '#911005';
  }
    // if (currentPageData && Array.isArray(currentPageData) && currentPageData.length > 0) {
    //   tableDataa.value = currentPageData[0];

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

@@ -30,35 +30,8 @@
  </div>
     
    <div id="dotClass">
      <!-- <div style="margin-bottom: -5px;margin-left: 5px;"> -->
        <!-- <el-form> -->
          <!-- <el-row> -->
            <!-- <el-col :span="4">
              <div  style="font-size: 15px;">
                <el-form-item :label="$t('hellow.currenttask')" style="width: 14vw">
                  {{ temperingtotal }}
                </el-form-item>
              </div>
            </el-col> -->
            <!-- <el-col :span="5">
              <div style="font-size: 15px;">
                <el-form-item :label="$t('hellow.claimednumber')" style="width: 14vw">
                  {{ glasstotal }}
                </el-form-item>
              </div>
            </el-col> -->
            <!-- <el-col :span="4">
              <div style="font-size: 15px;">
                <el-form-item :label="$t('hellow.linenumber')" style="width: 14vw">
                  {{ fulltotals }}
                </el-form-item>
              </div>
            </el-col> -->
            <div style="margin-left: 70px;">{{ $t('hellow.freetwo') }}</div>
        <i :style="{ marginTop: '2px', backgroundColor: freetwo, width: '18px', height: '18px', borderRadius: '50%', display: 'block' }"></i>
          <!-- </el-row> -->
        <!-- </el-form> -->
      <!-- </div> -->
       </div>
      <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;">
        <el-table height="650" ref="table" :data="tableDataa"
@@ -598,8 +571,8 @@
    const allPageData = data;
    const currentPageKeyValue = currentPageKey.value;
    const currentPageData = allPageData[currentPageKeyValue];
    if (data.freeTwoReqvestEntity != null) {
    freetwo.value = data.freeTwoReqvestEntity[0] == true ? 'green' : '#911005';
    if (data.freeTwoRequestEntity != null) {
    freetwo.value = data.freeTwoRequestEntity[0] == true ? 'green' : '#911005';
  }
    // if (currentPageData && Array.isArray(currentPageData) && currentPageData.length > 0) {
    //   tableDataa.value = currentPageData[0];

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

@@ -309,14 +309,14 @@
  if (data.outInkageEntity != null) {
    outInkageEntity.value = data.outInkageEntity[0] == true ? 'green' : '#911005';
  }
  if (data.freeTwoReqvestEntity != null) {
    freetwo.value = data.freeTwoReqvestEntity[0] == true ? 'green' : '#911005';
  if (data.freeTwoRequestEntity != null) {
    freetwo.value = data.freeTwoRequestEntity[0] == true ? 'green' : '#911005';
  }
  if (data.outRequestEntity != null) {
    outRequestEntity.value = data.outRequestEntity == 1 ? 'green' : '#911005';
  }
  if (data.free0neReguestEntity != null) {
    freeone.value = data.free0neReguestEntity == 1 ? 'green' : '#911005';
  if (data.freeOneRequestEntity != null) {
    freeone.value = data.freeOneRequestEntity == 1 ? 'green' : '#911005';
  }
  if(data.bigStorageCageDetailsOutTask!=null){
    tableDatac.value = data.bigStorageCageDetailsOutTask[0]

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

@@ -12,13 +12,37 @@
const blindb = ref(false)
const {t} = useI18n()
let language = ref(localStorage.getItem('lang') || 'zh')
const tableData = ref([])
const timeRange = ref([])

let socket = null;
const socketUrl = `ws://${WebSocketHost}:${host}/api/cacheGlass/api/talk/edgTasks`;
const rawGlassStorageDetailList = ref([])
const socketUrl = `ws://${WebSocketHost}:${host}/api/glassStorage/api/talk/largenScreen`;
const handleMessage = (data) => {
  tableData.value = data.edgTasks[0]
  rawGlassStorageDetailList.value = data.rawGlassStorageDetailList[0]
};

let socket1 = null;
const edgOneTasks = ref([])
const edgTwoTasks = ref([])
const engineeringOne = ref([])
const engineeringTow = ref([])
const socketUrl1 = `ws://${WebSocketHost}:${host}/api/cacheGlass/api/talk/largenScreen`;
const handleMessage1 = (data) => {
  edgOneTasks.value = data.edgOneTasks[0];
  edgTwoTasks.value = data.edgTwoTasks[0];
  engineeringOne.value = data.engineeringOne[0];
  engineeringTow.value = data.engineeringTow[0];
};

let socket2 = null;
const temperingTaskType = ref([])
const temperingGlassInfoList = ref([])
const socketUrl2 = `ws://${WebSocketHost}:${host}/api/temperingGlass/api/talk/largenScreen`;
const handleMessage2 = (data) => {
  temperingTaskType.value = data.temperingTaskType[0];
  temperingGlassInfoList.value = data.temperingGlassInfoList[0];
};


const handleBinda = async (row) => {  
  blinda.value = true;
  await fetchFlowCardId(row.orderId);
@@ -48,10 +72,12 @@
// 在组件挂载时设置默认时间范围
onMounted(() => {
  socket = initializeWebSocket(socketUrl, handleMessage);
  socket1 = initializeWebSocket(socketUrl1, handleMessage1);
  socket2 = initializeWebSocket(socketUrl2, handleMessage2);
  const endTime = dayjs().startOf('minute'); // 当前时间，精确到分钟
  const startTime = endTime.subtract(1, 'day').startOf('minute'); // 当前时间的前一天，精确到分钟
  // 设置时间范围为 [开始时间, 结束时间]
  timeRange.value = [startTime.format('YYYY-MM-DD HH:mm:ss'), endTime.format('YYYY-MM-DD HH:mm:ss')];
  // timeRange.value = [startTime.format('YYYY-MM-DD HH:mm:ss'), endTime.format('YYYY-MM-DD HH:mm:ss')];
});
// onMounted(() => {
//   socket = initializeWebSocket(socketUrl, handleMessage);
@@ -59,6 +85,8 @@
  onUnmounted(() => {
    if (socket) {
      closeWebSocket(socket);
    closeWebSocket(socket1);
    closeWebSocket(socket2);
    }
  });
onBeforeUnmount(() => {
@@ -69,28 +97,21 @@
<template>
  <div style="height: 500px;">
<div class="awatch">
    <img src="../../assets/screen.png" alt="Screen" style="max-width: 48%; max-height: 100%; margin-top: 50px; float: left; position: relative;" />
    <div 
      class="clickable-area" 
      @click="handlehistorical"
      style="position: relative; width: 175px; height: 240px; top: 570px; left: 310px;"
    ></div>
      <img src="../../assets/screen.png" alt="Screen"
        style="max-width: 48%; max-height: 100%; margin-top: 50px; float: left; position: relative;" />
      <div class="clickable-area" @click="handlehistorical"
        style="position: relative; width: 175px; height: 240px; top: 570px; left: 310px;"></div>
    </div>
    <div style="height: 190px;width: 48%;float: right;">
    <el-table height="500" ref="table"
      @selection-change="handleSelectionChange"
      :data="tableDatac" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
      <el-table height="500" ref="table" @selection-change="handleSelectionChange" :data="tableDatac"
        :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }">
        <el-table-column prop="orderId" align="center" :label="$t('large.orderId')" min-width="50" />
        <el-table-column prop="customerName" align="center" :show-overflow-tooltip="true" :label="$t('large.customerName')" min-width="90" />
        <el-table-column prop="customerName" align="center" :show-overflow-tooltip="true"
          :label="$t('large.customerName')" min-width="90" />
        <el-table-column prop="project" align="center" :label="$t('large.project')" min-width="50" />
        <el-table-column prop="area" align="center" :label="$t('large.are')" min-width="50" />
        <el-table-column prop="quantity" align="center" :label="$t('large.quantity')" min-width="50" />
        <el-table-column
          align="center"
          :label="$t('large.warehousing')"
          min-width="50"
          prop="warehousing"
        >
        <el-table-column align="center" :label="$t('large.warehousing')" min-width="50" prop="warehousing">
        <template #default="scope">  
      <el-tag :type="getStatusType(scope.row.warehousing)">  
        {{ getStatusText(scope.row.warehousing) }}  
@@ -121,12 +142,12 @@
                :value="item.value"
              />
          </el-select>
          <span class="demonstration" style="margin-left: 20px;margin-top: 3px;">{{ $t('workOrder.time') }}</span>
          <!-- <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-date-picker
            <!-- <el-date-picker
              v-model="timeRange"
              type="datetimerange"
              range-separator="至"
@@ -134,34 +155,25 @@
              style="margin-left: 15px;"
              value-format="YYYY-MM-DD hh:mm:ss"
              :end-placeholder="$t('reportmanage.endtime')">
            </el-date-picker>
            </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 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"
          >
      <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"
          >
      <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) }}  
@@ -178,9 +190,8 @@
    </template>
  </el-dialog>
<el-dialog v-model="blinda" top="5vh" width="85%">
  <el-table height="650" ref="table" 
      @selection-change="handleSelectionChange"
      :data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}">
    <el-table height="650" ref="table" @selection-change="handleSelectionChange" :data="tableData"
      :header-cell-style="{ background: '#F2F3F5 ', color: '#1D2129' }">
        <el-table-column prop="orderId" fixed align="center" :label="$t('large.orderId')" min-width="110" />
        <el-table-column prop="project"  align="center" :label="$t('large.project')" min-width="110" />
        <el-table-column prop="processId"  align="center" :label="$t('large.cardnumber')" min-width="110" />
@@ -193,16 +204,9 @@
        <el-table-column prop="numberPatches"  align="center" :label="$t('large.numberpatches')" min-width="110" />
        <el-table-column prop="receivedQuantity"  align="center" :label="$t('large.innumber')" min-width="110" />
        <el-table-column prop="terminationStatus"  align="center" :label="$t('large.productstatus')" min-width="110" />
        <el-table-column
          align="center"
            :label="$t('large.productstatus')"
            min-width="80"
            prop="terminationStatus"
          >
      <el-table-column align="center" :label="$t('large.productstatus')" min-width="80" prop="terminationStatus">
          <template #default="scope">  
          <el-tag  
            :type="scope.row.terminationStatus === 0 ? 'success' : 'danger'"  
          >  
          <el-tag :type="scope.row.terminationStatus === 0 ? 'success' : 'danger'">
            {{ scope.row.terminationStatus === 0 ? $t('large.right') : $t('large.stop') }}
          </el-tag>  
        </template> 
@@ -218,12 +222,25 @@
</el-dialog>
</template>
<style scoped>
#dt { display:block; float:left;line-height: 20px;margin-left: 100px;}
#dta { display:block; float:left;line-height: 20px;margin-left: 80%;}
#dt {
  display: block;
  float: left;
  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;
@@ -233,14 +250,20 @@
   background-color: #337ecc;
   margin-left: 28%;
}

#awatch{
  height: 460px;
}

.clickable-area {
  cursor: pointer; /* 指示这是一个可点击的区域 */
  text-align: center; /* 如果需要，可以在div中添加文本并居中 */
  line-height: 95px; /* 如果需要，使文本垂直居中 */
  cursor: pointer;
  /* 指示这是一个可点击的区域 */
  text-align: center;
  /* 如果需要，可以在div中添加文本并居中 */
  line-height: 95px;
  /* 如果需要，使文本垂直居中 */
}

/* .awatch{
  height: 460px;
  /* max-width: 100%; */

 hangzhoumesParent/common/servicebase/src/main/java/com/mes/glassinfo/entity/GlassInfo.java

@@ -162,6 +162,10 @@
     * 除膜方式
     */
    private Integer filmRemove;
    /**
     * 状态
     */
    private Integer status;


}

 hangzhoumesParent/common/servicebase/src/main/java/com/mes/temperingglass/service/impl/TemperingGlassInfoServiceImpl.java

@@ -4,6 +4,7 @@
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.core.conditions.update.LambdaUpdateWrapper;
import com.github.yulichang.base.MPJBaseServiceImpl;
import com.github.yulichang.query.MPJQueryWrapper;
import com.mes.glassinfo.entity.GlassInfo;
import com.mes.glassinfo.mapper.GlassInfoMapper;
import com.mes.temperingglass.entity.TemperingGlassInfo;
@@ -150,10 +151,18 @@

    @Override
    public List<GlassInfo> selectTemperingGlass(GlassInfo glassInfo) {
        QueryWrapper<GlassInfo> wrapper = new QueryWrapper<>();
        wrapper.eq("engineer_id", glassInfo.getEngineerId())
                .eq("tempering_layout_id", glassInfo.getTemperingLayoutId())
                .select("engineer_id,tempering_layout_id,width,height,tempering_feed_sequence,x_coordinate,y_coordinate,angle,glass_id");
        return glassInfoMapper.selectList(wrapper);
        List<GlassInfo> glassInfos = null;
        glassInfos = glassInfoMapper.selectJoinList(GlassInfo.class, new MPJQueryWrapper<GlassInfo>()
                .select("IFNULL(b.status, 0) AS status,engineer_id,tempering_layout_id,width,height,tempering_feed_sequence,x_coordinate,y_coordinate,angle,t.glass_id,t.flow_card_id")
                .leftJoin("(SELECT glass_id, MAX(status) AS status FROM damage GROUP BY glass_id) b\n" +
                        "ON t.glass_id = b.glass_id")
                .eq("engineer_id", glassInfo.getEngineerId())
                .eq("tempering_layout_id", glassInfo.getTemperingLayoutId()));
        return glassInfos;
//        QueryWrapper<GlassInfo> wrapper = new QueryWrapper<>();
//        wrapper.eq("engineer_id", glassInfo.getEngineerId())
//                .eq("tempering_layout_id", glassInfo.getTemperingLayoutId())
//                .select("engineer_id,tempering_layout_id,width,height,tempering_feed_sequence,x_coordinate,y_coordinate,angle,glass_id");
//        return glassInfoMapper.selectList(wrapper);
    }
}

 hangzhoumesParent/moduleService/TemperingGlassModule/src/main/resources/application.yml

@@ -14,3 +14,13 @@
mes:
  width: 2800
  height: 5000
kangaroohy:
  milo:
    enabled: false
    primary: default
    config:
      default:
        endpoint: opc.tcp://10.153.19.150:49320
        security-policy: basic256sha256
        username: admin
        password: 1qaz2wsx3edc4rfv