update table 的距离问题

src/views/3DOverview/components/LeftContentEquipmentCheck.vue

@@ -2,7 +2,7 @@
   <div class="left-content-equipment-check">
     <!-- <TechyFakeTable :table-props="tableProps" :table-data="tableData" />
     <TechyFakeTable :table-props="tableProps2" :table-data="tableData2" /> -->
-    <div class="el-table-wrapper">
+    <div class="el-table-wrapper fix-table">
       <!-- <TechyTable key="table-1" :showIndex="false" :table-config="tableProps" :table-data="tableData"></TechyTable> -->
       <el-table
         key="LeftContentEquipmentCheck1"
@@ -10,10 +10,10 @@
         :data="tableData"
         :header-cell-style="{ background: 'rgba(79,114,136,0.29)' }"
       >
-        <el-table-column label="设备名称" prop="eqName" />
-        <el-table-column label="所属产线" prop="pl" />
-        <el-table-column label="提示等级" prop="warningLevel" />
-        <el-table-column label="提示等级" prop="checkContent" />
+        <el-table-column label="设备名称" prop="eqName" align="center" />
+        <el-table-column label="所属产线" prop="pl" align="center" />
+        <el-table-column label="提示等级" prop="warningLevel" align="center" />
+        <el-table-column label="提示等级" prop="checkContent" align="center" />
       </el-table>
     </div>
     <!-- <div class="el-table-wrapper">
@@ -73,6 +73,12 @@ export default {
 </script>
 
 <style scoped>
+.fix-table >>> .el-table td .cell {
+  width: 60% !important;
+  margin: auto;
+  text-align: left;
+}
+
 .left-content-equipment-check {
   height: calc(100% - 32px);
   display: flex;

src/views/3DOverview/components/LeftContentOrder.vue

@@ -2,7 +2,7 @@
   <div class="left-content-equipment-check">
     <!-- <TechyFakeTable :table-props="tableProps" :table-data="tableData" />
     <TechyFakeTable :table-props="tableProps2" :table-data="tableData2" /> -->
-    <div class="el-table-wrapper">
+    <div class="el-table-wrapper fix-table">
       <!-- <TechyTable key="table-1" :showIndex="false" :table-config="tableProps" :table-data="tableData"></TechyTable> -->
       <el-table
         key="LeftContentOrder1"
@@ -10,10 +10,22 @@
         :data="tableData"
         :header-cell-style="{ background: 'rgba(79,114,136,0.29)' }"
       >
-        <el-table-column label="订单编号" prop="orderCode" :show-overflow-tooltip="true" :resizable="true" />
-        <el-table-column label="客户名称" prop="clientName" :show-overflow-tooltip="true" :resizable="true" />
-        <el-table-column label="规格" prop="specs" :resizable="true" />
-        <el-table-column label="完成度" prop="finished" :resizable="true">
+        <el-table-column
+          label="订单编号"
+          prop="orderCode"
+          :show-overflow-tooltip="true"
+          :resizable="true"
+          align="center"
+        />
+        <el-table-column
+          label="客户名称"
+          prop="clientName"
+          :show-overflow-tooltip="true"
+          :resizable="true"
+          align="center"
+        />
+        <el-table-column label="规格" prop="specs" :resizable="true" align="center" />
+        <el-table-column label="完成度" prop="finished" :resizable="true" align="center">
           <template slot-scope="scope">
             <el-progress
               class="lb-progress-bar"
@@ -79,6 +91,12 @@ export default {
 </script>
 
 <style scoped>
+.fix-table >>> .el-table td .cell {
+  width: 70% !important;
+  margin: auto;
+  text-align: left;
+}
+
 .left-content-equipment-check {
   display: flex;
   gap: calc(100vw / 1920 * 16);
@@ -144,11 +162,11 @@ export default {
 }
 
 .lb-progress-bar {
-  left: 40px;
+  left: 30px;
   display: flex;
 }
 .lb-progress-bar >>> .el-progress__text {
   color: #fff9;
-  left: -70%;
+  left: -75%;
 }
 </style>

src/views/3DOverview/components/RightContentAlert.vue

@@ -1,17 +1,17 @@
 <template>
   <div class="right-content-alert">
-    <div class="el-table-wrapper">
+    <div class="el-table-wrapper fix-table">
       <el-table
         key="RightContentAlertTable"
         border
         :data="tableData"
         :header-cell-style="{ background: 'rgba(79,114,136,0.29)' }"
       >
-        <el-table-column label="设备名称" prop="eqName" :show-overflow-tooltip="true" :resizable="true" />
-        <el-table-column label="所属产线" prop="plName" :show-overflow-tooltip="true" :resizable="true" />
-        <el-table-column label="故障等级" prop="level" :resizable="true" />
-        <el-table-column label="故障内容" prop="content" :resizable="true" />
-        <el-table-column label="累计时间(min)" prop="duration" :resizable="true" />
+        <el-table-column label="设备名称" prop="eqName" :show-overflow-tooltip="true" :resizable="true" align="center" />
+        <el-table-column label="所属产线" prop="plName" :show-overflow-tooltip="true" :resizable="true" align="center" />
+        <el-table-column label="故障等级" prop="level" :resizable="true" align="center" />
+        <el-table-column label="故障内容" prop="content" :resizable="true" align="center" />
+        <el-table-column label="累计时间(min)" prop="duration" :resizable="true" align="center" :width="128" />
       </el-table>
     </div>
   </div>
@@ -42,6 +42,12 @@ export default {
 </script>
 
 <style scoped>
+.fix-table >>> .el-table td .cell {
+  width: 80% !important;
+  margin: auto;
+  text-align: left;
+}
+
 .right-content-alert {
   height: calc(100% - 32px);
   display: flex;