From 4eeaec1eddd5ef2be4b79423154fa2dce81d5566 Mon Sep 17 00:00:00 2001
From: 黄何裕 <1053952480@qq.com>
Date: 星期五, 26 七月 2024 15:28:09 +0800
Subject: [PATCH] 大屏重构

---
 src/views/screen/components/screen-table/index.vue |   95 +++++++++++++++++++++++++----------------------
 1 files changed, 51 insertions(+), 44 deletions(-)

diff --git a/src/views/screen/components/screen-table/index.vue b/src/views/screen/components/screen-table/index.vue
index 01e715d..2cf0b6d 100644
--- a/src/views/screen/components/screen-table/index.vue
+++ b/src/views/screen/components/screen-table/index.vue
@@ -1,13 +1,22 @@
 <template>
   <div class="table-container">
-    <wrapper-title :title="'鍖哄煙璁惧鏁版嵁'" :path="'/monitorServe/recovery'"></wrapper-title>
+    <!-- <wrapper-title
+      :title="'鍖哄煙璁惧鏁版嵁'"
+      :path="'/monitorServe/recovery'"
+    ></wrapper-title> -->
     <div class="table-content" ref="tabContent">
       <div class="table-wrapper">
-        <el-table :data="tableData" border :height="tableHeight" :max-height="tableHeight" class="rank-table">
+        <el-table
+          :data="tableData"
+          border
+          :height="tableHeight"
+          :max-height="tableHeight"
+          class="rank-table"
+        >
           <el-table-column prop="name" label="鍦板尯" align="center" width="100">
           </el-table-column>
 
-          <el-table-column label="浜鸿劯璁惧姝e父鐜�" align="center">
+          <el-table-column label="浜鸿劯璁惧" align="center">
             <template slot-scope="scope">
               <el-tooltip placement="top">
                 <div slot="content">
@@ -25,7 +34,7 @@
             </template>
           </el-table-column>
 
-          <el-table-column label="杞﹁締璁惧姝e父鐜�" align="center">
+          <el-table-column label="杞﹁締璁惧" align="center">
             <template slot-scope="scope">
               <el-tooltip placement="top">
                 <div slot="content">
@@ -43,7 +52,7 @@
             </template>
           </el-table-column>
 
-          <el-table-column label="瑙嗛璁惧姝e父鐜�" align="center">
+          <el-table-column label="瑙嗛璁惧" align="center">
             <template slot-scope="scope">
               <el-tooltip placement="top">
                 <div slot="content">
@@ -63,67 +72,66 @@
         </el-table>
       </div>
     </div>
-
   </div>
 </template>
 
 <script>
-import WrapperTitle from '../wrapper-title/index';
+import WrapperTitle from "../wrapper-title/index";
 
 export default {
-  name: 'ScreenTable',
+  name: "ScreenTable",
 
   components: {
-    WrapperTitle
+    WrapperTitle,
   },
   data() {
     return {
       tableHeight: 40,
       tableData: [
         {
-          name: '瀵岄『鍘�',
+          name: "瀵岄『鍘�",
           data1: 1123,
           data2: 1123,
-          data3: 1123
+          data3: 1123,
         },
         {
-          name: '鑽e幙',
+          name: "鑽e幙",
           data1: 1123,
           data2: 1123,
-          data3: 1123
+          data3: 1123,
         },
         {
-          name: '楂樻柊鍖�',
+          name: "楂樻柊鍖�",
           data1: 1123,
           data2: 1123,
-          data3: 1123
+          data3: 1123,
         },
         {
-          name: '鑷祦浜曞尯',
+          name: "鑷祦浜曞尯",
           data1: 1123,
           data2: 1123,
-          data3: 1123
+          data3: 1123,
         },
         {
-          name: '璐′簳鍖�',
+          name: "璐′簳鍖�",
           data1: 1123,
           data2: 1123,
-          data3: 1123
+          data3: 1123,
         },
         {
-          name: '澶у畨鍖�',
+          name: "澶у畨鍖�",
           data1: 1123,
           data2: 1123,
-          data3: 1123
+          data3: 1123,
         },
         {
-          name: '娌挎哗鍖�',
+          name: "娌挎哗鍖�",
           data1: 1123,
           data2: 1123,
-          data3: 1123
+          data3: 1123,
         },
-      ]
-    }
+      ],
+    };
   },
   methods: {
     computedHeight() {
@@ -131,21 +139,21 @@
         setTimeout(() => {
           const content = this.$refs.tabContent;
           this.tableHeight = content.offsetHeight;
-        })
-      })
-    }
+        });
+      });
+    },
   },
   mounted() {
     this.computedHeight();
-  }
-}
+  },
+};
 </script>
 
 <style lang="scss" scoped>
 .table-container {
   width: 100%;
   // flex: 1;
-  height: 350px;
+  height: 240px;
   position: relative;
 
   display: flex;
@@ -153,16 +161,12 @@
 
   .table-content {
     flex: 1;
-    background: rgba(67, 102, 155, 0.3);
-    border: 1px solid rgba(47, 91, 157, 0.8);
-    // position: absolute;
-    // width: 100%;
-    // top: 0;
-    // bottom: 0;
+    // background: url("../../../../assets/images/screen/cardBg.png");
+    // background-size: cover !important;
+    // background-repeat: no-repeat !important;
+    // background-position: center center !important;
   }
 }
-
-
 
 .rank-table {
   background-color: transparent !important;
@@ -181,7 +185,6 @@
 ::v-deep .el-table .el-table__header-wrapper th,
 .el-table .el-table__fixed-header-wrapper th {
   background-color: transparent !important;
-
 }
 
 ::v-deep .el-table--group,
@@ -198,8 +201,8 @@
   border-color: #56739e99 !important;
 }
 
-::v-deep .el-table th.el-table__cell>.cell {
-  color: #447ED6;
+::v-deep .el-table th.el-table__cell > .cell {
+  color: #447ed6;
 }
 
 ::v-deep .el-scrollbar__bar.is-vertical {
@@ -212,7 +215,11 @@
   background-color: transparent !important;
 }
 
-::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
+::v-deep
+  .el-table--enable-row-hover
+  .el-table__body
+  tr:hover
+  > td.el-table__cell {
   background-color: #447ed648;
 }
 
@@ -239,4 +246,4 @@
     color: #e20c0c;
   }
 }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.8.0