追溯界面调整

src/views/retrospect/product/index.vue

@@ -99,12 +99,15 @@
         >导出</el-button>
       </el-form-item>
     </el-form>
-    <div class="table-wrap">
+    <div class="table-wrap" ref="tableHeightRef">
       <el-table
         v-loading="loading"
         :data="tableData"
         @cell-click="cellClick"
         border
+        v-if="tableHeight"
+        :height="tableHeight"
+        highlight-current-row
       >
         <el-table-column
           :label="getColumnName('OM_SerialOrder-SerialOrderId')"
@@ -132,8 +135,8 @@
     </div>
     <div class="details-wrap">
       <p class="details-title">明细过程数据</p>
-      <div class="details-table-wrap">
-        <el-table v-loading="loading" :data="tableDetailsData" border>
+      <div class="details-table-wrap" ref="tableDetailsHeightRef">
+        <el-table v-loading="loading" :data="tableDetailsData" v-if="tableDetailsHeight" :height="tableDetailsHeight" border>
           <el-table-column
             v-for="item in detailsHeaders"
             :key="item"
@@ -173,20 +176,23 @@ export default {
       headers:[],
       tableData:[],
       detailsHeaders:[
-        'SerialOrderOPTrace-PO',
-        'SerialOrderOPTrace-WorkOrderId',
         'SerialOrderOPTrace-ArtId',
-        'SerialOrderOPTrace-RecvData',
+        'SerialOrderOPTrace-WorkOrderId',
         'SerialOrderOPTrace-SerialOrderId',
-        'SerialOrderOPTrace-Status',
-        'SerialOrderOPTrace-StepDesc',
+        'SerialOrderOPTrace-PO',
         'SerialOrderOPTrace-WorkPlaceId',
-        'SerialOrderOPTrace-ExecuteTime',
+        'SerialOrderOPTrace-StepDesc',
+        'SerialOrderOPTrace-RecvData',
+        'SerialOrderOPTrace-Status',
         'SerialOrderOPTrace-Remark1',
+        'SerialOrderOPTrace-ExecuteTime',
+        
       ],
       tableDetailsData:[],
       loading:false,
-      cellItem:{}
+      cellItem:{},
+      tableHeight:0,
+      tableDetailsHeight:0
     }
   },
   created(){
@@ -197,7 +203,19 @@ export default {
     }
     this.getPotrace();
   },
+  mounted(){
+    this.setTableHeight();
+    this.setTableDetailsHeight();
+  },
   methods:{
+    // tableHeight高度
+    setTableHeight(){
+      this.tableHeight = (this.$refs.tableHeightRef.offsetHeight-5) || 400;
+    },
+    // tableHeight高度
+    setTableDetailsHeight(){
+      this.tableDetailsHeight = (this.$refs.tableDetailsHeightRef.offsetHeight-5) || 360;
+    },
     // 导出文件
     exportExcel() {
       exportheadexcel(this.formData).then((res) => {