可视化系统下方表格高度变高，钢化前新增打印功能（样式正在完善）

wangfei

2024-08-22 a9c266890270e55a5840411b6d0fd4fe43494af8

可视化系统下方表格高度变高，钢化前新增打印功能（样式正在完善）

 UI-Project/src/lang/zh.js

@@ -247,6 +247,22 @@
        intofurnace:'进炉中',
        beforefurnace:'进炉前',
        outfurnace:'已出炉玻璃',
        print:'拿走打印',
        printing:'打印',
        projectnumber:'请输入工程号',
        inquire:'查询',
        project:'工程号',
        awayprocess:'拿走工序',
        awayequipment:'拿走设备',
        awayteam:'拿走班组',
        flowcard:'流程卡',
        layer:'层号',
        temperinglayout:'炉号',
        temperingfeed:'片序',
        width:'宽',
        height:'高',
        thickness:'厚',
        glasstakeout:'玻璃拿走清单',
    },
    reportWork:{
        lowerbit:'下片位',
@@ -424,7 +440,7 @@
        customerName: '客户名称',
        project: '项目名称',
        are: '面积',
        quantity: '包装方式',
        quantity: '数量',
        warehousing: '状态',
        deliveryDate: '送货时间',
        notstocked: '未入库',

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

@@ -1,30 +1,88 @@
<script setup>
import {Search} from "@element-plus/icons-vue";
import {reactive} from "vue";
import {useRouter} from "vue-router"
import request from "@/utils/request"
import { ref, onMounted, onBeforeUnmount } from 'vue';  
import { ref, onMounted, onBeforeUnmount,nextTick  } from 'vue';  
import { WebSocketHost ,host} from '@/utils/constants'
import { ElMessage, ElMessageBox } from 'element-plus'
import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService';
  import { useI18n } from 'vue-i18n'
  import { useRouter } from 'vue-router'
  const { t } = useI18n()
  let language = ref(localStorage.getItem('lang') || 'zh')
const dialogFormVisible = ref(false)
const dialogFormVisiblea = ref(true)
const dialogFormVisibleb = ref(false)
const dialogFormVisiblec = ref(false)
const blind1 = ref(false)
const blind2 = ref(false)
const blinda = ref(false)
const blindb = ref(false)
const dialogVisible = ref(false)
const width = ref();
const height = ref();
const adjustedRects1 = ref([]);
const adjustedRects2 = ref([]);
const adjustedRectsa = ref([]);
const adjustedRectsb = ref([]);
const tableData = ref([])
const engineerId = ref('')
const router = useRouter()
const currentGlassId = ref(null);
const currenttemperingFeedSequence = ref(null);
onMounted(async () => {  
  try {  
    const response = await request.post('/loadGlass/damage/selectDamagePrint', {
    type: 9,
    workingProcedure: '钢化',
    })
    if (response.code === 200) {  
          tableData.value = response.data
          console.log(response.data);
    } else {  
      ElMessage.warning(res.msg)
    }  
  } catch (error) {  
    // console.error('Error fetching rects :', error);  
  }  
}); 
const selectReportData = async () => {
  let postData = {  
    type: 9,  
    workingProcedure: '钢化',  
    ...(engineerId.value !== '' && { engineerId: engineerId.value }),  
  };  
  const response = await request.post("/loadGlass/damage/selectDamagePrint", postData)
  if (response.code === 200) {
    tableData.value = response.data;
    ElMessage.success(response.message);
  } else {
    ElMessage.error(response.message);
  }
};
const printing = async () => {
  let postData = {  
    type: 9,  
    workingProcedure: '钢化',  
    ...(engineerId.value !== '' && { engineerId: engineerId.value }),  
  };  
  console.log(engineerId.value);
  
  const response = await request.post("/loadGlass/damage/selectDamagePrintDetails", postData)
  if (response.code === 200) {
  dialogVisible.value = true;
    tableData.value = response.data; 
    await nextTick(); 
  window.print();  
} else {
    ElMessage.error(response.message);
  }
};
const printTable = () => {  
  // 这里可以添加一些CSS样式来优化打印效果  
  // 例如，可以添加一个隐藏的打印样式表  
  window.print();  
};  
const socketUrl = `ws://${WebSocketHost}:${host}/api/temperingGlass/api/talk/temperingGlass`;
const handleMessage = (data) => {  
  if (data.intoGlass2 && data.intoGlass2.length > 0) {  
@@ -399,9 +457,10 @@
</script>
<template>
  <div style="margin-top: 10px;">
     <el-button style="margin-left: 15px;" id="searchButton" type="primary" @click="dialogFormVisiblea = true;dialogFormVisible = false;dialogFormVisibleb = false;" >{{ $t('processCard.beforefurnace') }}</el-button>
     <el-button style="margin-left: 15px;" id="searchButton" type="primary" @click="dialogFormVisible = true;dialogFormVisiblea = false;dialogFormVisibleb = false;">{{ $t('processCard.intofurnace') }}</el-button>
    <el-button  id="searchButton" type="success" @click="dialogFormVisibleb = true;dialogFormVisible = false;dialogFormVisiblea = false">{{ $t('processCard.outfurnace') }}</el-button>
     <el-button style="margin-left: 15px;" id="searchButton" type="primary" @click="dialogFormVisiblea = true;dialogFormVisible = false;dialogFormVisibleb = false;dialogFormVisiblec = false;" >{{ $t('processCard.beforefurnace') }}</el-button>
     <el-button style="margin-left: 15px;" id="searchButton" type="primary" @click="dialogFormVisible = true;dialogFormVisiblea = false;dialogFormVisibleb = false;dialogFormVisiblec = false;">{{ $t('processCard.intofurnace') }}</el-button>
    <el-button  id="searchButton" type="success" @click="dialogFormVisibleb = true;dialogFormVisible = false;dialogFormVisiblea = false;dialogFormVisiblec = false;">{{ $t('processCard.outfurnace') }}</el-button>
    <el-button  id="searchButton" type="info" @click="dialogFormVisiblec = true;dialogFormVisibleb = false;dialogFormVisible = false;dialogFormVisiblea = false">{{ $t('processCard.print') }}</el-button>
<div v-if="dialogFormVisible" >
    <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;height: 600px;" v-loading="loading">
<div style="width: 49%;float: left;background-color: #f4f4f5;height: 550px;">
@@ -517,7 +576,32 @@
   </div>
   </el-card>
</div>
<div v-if="dialogFormVisiblec">
  <!-- 打印 -->
  <el-card style="flex: 1;margin-left: 10px;margin-top: 10px;margin-right: 10px;height: 600px;" v-loading="loading">
    <div style="display: flex; flex-direction: row; align-items: center; margin-top: 5px;margin-left: 10px;">  
    <el-input :placeholder="$t('processCard.projectnumber')" v-model="engineerId" autocomplete="off" style="width: 300px;"/>
    <el-button type="primary" style="margin-left: 10px;" @click="selectReportData()">{{ $t('processCard.inquire') }}</el-button>
    <el-button type="info" style="margin-left: 10px;" @click="printing()">{{ $t('processCard.printing') }}</el-button>
  </div>
 
    <el-card style="flex: 1;margin-left: 10px;margin-top: 15px;" v-loading="loading">
      <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;">
    <el-table
    height="350"
     ref="table" 
     :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"
      :data="tableData"
    >
      <el-table-column prop="engineerId" :label="$t('processCard.project')" width="200" align="center"/>
      <el-table-column prop="workingProcedure" :label="$t('processCard.awayprocess')" align="center"/>
      <el-table-column prop="deviceName" :label="$t('processCard.awayequipment')" align="center"/>
      <el-table-column prop="teamsGroupsName" :label="$t('processCard.awayteam')" align="center"/>
    </el-table>
      </div>
      </el-card>
   </el-card>
</div>
<el-dialog v-model="blind1" top="30vh" width="15%" style="text-align: center;" @close="handleDialogClose1">
        <el-button type="warning" plain :icon="Delete" @click="handleDamage1"  style="width: 140px;margin-left: 10px;">
          {{ $t('order.dilapidation') }}
@@ -538,6 +622,26 @@
          {{ $t('order.dilapidation') }}
        </el-button>
  </el-dialog> 
  <el-dialog  
      v-model="dialogVisible"
      width="100%" 
      :title="$t('processCard.glasstakeout')"
      top="0vh"
      >  
      <el-table  
        :data="tableData"  
        style="width: 100%;height: 860px"  
      >  
      <el-table-column prop="flowCardId" :label="$t('processCard.flowcard')" width="140" align="center"/>
      <el-table-column prop="layer" :label="$t('processCard.layer')" align="center" width="80"/>
      <el-table-column prop="engineerId" :label="$t('processCard.project')" align="center" width="110"/>
      <el-table-column prop="temperingLayoutId" :label="$t('processCard.temperinglayout')" align="center" width="80"/>
      <el-table-column prop="temperingFeedSequence" :label="$t('processCard.temperingfeed')" align="center" width="80"/>
      <el-table-column prop="width" :label="$t('processCard.width')" align="center" width="80"/>
      <el-table-column prop="height" :label="$t('processCard.height')" align="center" width="80"/>
      <el-table-column prop="thickness" :label="$t('processCard.thickness')" align="center" width="80"/>
      </el-table>  
    </el-dialog>  
  </div>
</template>
<style scoped>

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

@@ -1,6 +1,6 @@
<template>  
  <el-card style="flex: 1;margin-left: 1px;margin-top: 10px;margin-right: 1px;" v-loading="loading">
    <el-scrollbar height="600px">
    <el-scrollbar height="800px">
<div id="top" style="height: 150px;display: flex;">  
  <div class="echarts-container">
  <div v-for="(processData, index) in processesData" :key="index" class="echarts-item">
@@ -70,8 +70,8 @@
      </el-table>
</div>  -->
</div>
<div id="bottom" style="margin-top: 10px;height: 190px;background-color: #911005;">
<el-table height="190" ref="table"
<div id="bottom" style="margin-top: 10px;height: 190px;">
<el-table height="390" 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" />