From f17b5cf4523af56c67ff7d8330b6a8dde4d19458 Mon Sep 17 00:00:00 2001
From: songshankun <songshankun@foxmail.com>
Date: 星期五, 22 九月 2023 20:33:49 +0800
Subject: [PATCH] style: 表格样式细节调整

---
 src/components/makepager/TableCommonView.vue |   81 +++++++++++++++++++++++++++++++++-------
 1 files changed, 67 insertions(+), 14 deletions(-)

diff --git a/src/components/makepager/TableCommonView.vue b/src/components/makepager/TableCommonView.vue
index d130723..ca6a5e6 100644
--- a/src/components/makepager/TableCommonView.vue
+++ b/src/components/makepager/TableCommonView.vue
@@ -6,16 +6,22 @@
       :data="tableList.tableInfomation"
       tooltip-effect="dark"
       style="width: 100%"
+      :height="'calc(100% - 0px)'"
+      :max-height="tableList.maxHeight"
       :lazy="tableList.lazy"
-      :show-summary="showSummary.show"
-      :summary-method="getSummaries"
-      :span-method="arraySpanMethod"
+      size="mini"
       @selection-change="handleSelectionChange"
-      :header-cell-style="{ background: '#ECF4FF', color: '#666' }"
+      :header-cell-style="{ background: '#f1f3f8', color: '#000009' , 'font-size': '14px'}"
+      :highlight-current-row="tableList.highlight"
+      :row-class-name="tableRowClassName"
+      @row-click="tableRowClick"
+      :row-key="tableList.key"
+      :default-expand-all="tableList.isDefaultExpandAll"
+      :tree-props="{ children: 'child', hasChildren: 'hasChildren' }"
     >
-      <el-table-column v-if="tableList.selectBox" type="selection" width="40"> </el-table-column>
-      <el-table-column v-if="tableList.selectIndex" type="index" label="搴忓彿" width="50"> </el-table-column>
-      <el-table-column
+      <el-table-column align="center" v-if="tableList.selectBox" type="selection" width="40"> </el-table-column>
+      <el-table-column align="center" v-if="tableList.selectIndex" type="index" label="搴忓彿" width="50"> </el-table-column>
+      <el-table-column align="center"
         v-for="(item, i) in tableList.tableColumn"
         :key="i"
         :prop="item.prop"
@@ -33,7 +39,7 @@
               ? "--"
               : dateFormat("YYYY-mm-dd HH:MM:SS", scope.row[item.prop])
           }}</span>
-          <span v-else-if="item.isClick && scope.row[item.prop]" class="sel-name" @click="selNameClick(scope.row)">{{
+          <span v-else-if="item.isClick && scope.row[item.prop]" class="sel-name" @click="selCommonClick(scope.row)">{{
             scope.row[item.prop]
           }}</span>
           <span v-else-if="item.isFirst">{{ scope.row[item.prop] ? "鏄�" : "鍚�" }}</span>
@@ -118,8 +124,16 @@
         return {
           show: false,
           sumProp: [],
-          mergeNumber: 1
+          mergeNumber: 1,
+          totalName: "鏈〉鎬昏"
         }
+      }
+    },
+    // 閫変腑鐨勬牱寮�
+    selectClassRow: {
+      type: Object,
+      default: () => {
+        return {}
       }
     }
   },
@@ -127,6 +141,7 @@
     return {}
   },
   computed: {},
+  mounted() {},
   methods: {
     handleReserve(row) {
       return row._id ? row._id : row.id
@@ -159,7 +174,7 @@
         const sums = []
         columns.forEach((column, index) => {
           if (index === this.showSummary.mergeNumber) {
-            sums[index] = "鏈〉鎬昏"
+            sums[index] = this.showSummary.totalName
           }
           const values = data.map((item) => Number(item[column.property]))
           if (this.showSummary.sumProp.includes(column.property)) {
@@ -261,6 +276,18 @@
     // 鍏叡璇︽儏
     selCommonClick(row) {
       this.$emit("selCommonClick", row)
+    },
+    // 鍗曢�夎鐩稿叧
+    tableRowClassName({ row }) {
+      if (Object.keys(this.selectClassRow).length > 0) {
+        if (row.id == this.selectClassRow.id) {
+          return "onSelect"
+        }
+      }
+      this.$emit("tableRowClassName", row)
+    },
+    tableRowClick(row) {
+      this.$emit("tableRowClick", row)
     }
   }
 }
@@ -270,8 +297,9 @@
 <style lang="scss" scoped>
 .table-view {
   // margin-top: 20px;
-  margin-right: 10px;
+  // margin-right: 10px;
   // margin-bottom: 40px;
+  height: 100%;
   .blue {
     width: 70px;
     text-align: center;
@@ -305,9 +333,34 @@
   }
 }
 ::v-deep {
-  .el-table__footer-wrapper tbody td.el-table__cell {
-    background-color: #fff;
-    text-align: right;
+  .el-table__footer-wrapper {
+    tbody td.el-table__cell {
+      background-color: #fff;
+      font-weight: bold;
+    }
+  }
+}
+
+::v-deep .el-table .cell {
+  font-size: 12px;
+  line-height: 17px;
+  font-family: PingFangSC;
+  color: rgba(0, 0, 0, 0.9);
+  .el-button--text {
+    width: auto;
+    height: auto;
+    font-family: PingFangSC-Medium, sans-serif;
+  }
+}
+::v-deep .el-table .el-table__cell {
+  padding: 6px 0 !important;
+  height: 35px;
+  text-align: center;
+}
+
+::v-deep{
+  .el-table .cell .el-button--text.el-button--small{
+    padding: 4px 0;
   }
 }
 </style>

--
Gitblit v1.8.0