style: 添加全局element-plus样式文件

src/styles/element-plus.scss

+// element-plus 全局样式
+
+/* 表格 */
+// .el-table {
+//   // 表格边框
+//   border: 1px solid #ebeef5;
+//   border-radius: 4px;
+
+//   // 表格背景色
+//   background-color: #fff;
+
+//   // 表格字体
+//   font-size: 14px;
+//   color: #606266;
+
+//   // 表格宽度
+//   width: 100%;
+
+//   // 表格阴影
+//   box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+
+//   /* 表头样式 */
+//   .el-table__header th {
+//     // 表头单元格背景
+//     background-color: #e1e3e6;
+
+//     // 表头文字颜色
+//     color: #909399;
+
+//     // 表头字体加粗
+//     font-weight: bold;
+
+//     // 表头单元格padding
+//     padding: 12px 0;
+//   }
+
+//   /* 行样式 */
+//   .el-table__body {
+//     tr {
+//       // 行高
+//       height: 48px;
+//       // background-color: rgb(239, 236, 236);
+
+//       // 行悬停效果
+//       &:hover {
+//         td {
+//           background-color: #acc3e588 !important;
+//         }
+//       }
+
+//       // 斑马纹效果
+//       &.el-table__row--striped {
+//         td {
+//           background-color: #fafafa !important;
+//         }
+
+//         &:hover {
+//           td {
+//             background-color: #f0f2f5 !important;
+//           }
+//         }
+//       }
+//     }
+
+//     // 单元格样式
+//     td {
+//       // 单元格padding
+//       padding: 12px 0;
+
+//       // 单元格边框
+//       border-bottom: 1px solid #ebeef5;
+
+//       // 单元格文字对齐
+//       &.is-center {
+//         text-align: center;
+//       }
+//       &.is-right {
+//         text-align: right;
+//       }
+//     }
+//   }
+
+//   /* 当前行高亮(需要开启 highlight-current-row 属性) */
+//   .el-table__body tr.current-row {
+//     td {
+//       background-color: #73abebdf !important;
+//     }
+
+//     &:hover {
+//       td {
+//         background-color: #0572eedf !important;
+//       }
+//     }
+//   }
+
+//   /* 选中行样式 */
+//   .el-table__body tr.el-table__row--selected {
+//     td {
+//       background-color: #92eb65 !important;
+//     }
+//   }
+// }
+
+/* 通过css变量修改el-table样式 */
+// .el-table {
+//   // 表头
+//   --el-table-header-bg-color: #f5f7fa;
+//   --el-table-header-text-color: #909399;
+
+//   // 边框样式
+//   --el-table-border: none;
+//   --el-table-border-color: #dcdfe6;
+
+//   /* 行样式 */
+//   --el-table-tr-bg-color: #f7cdcd; // 行背景色
+//   --el-table-row-hover-bg-color: #f5f7fa;
+//   --el-table-current-row-bg-color: #ecf5ff;
+//   --el-table-text-color: #606266;
+
+//   /* 斑马纹样式(需要开启 highlight-current-row 属性) */
+//   --el-fill-color-lighter: #c6f4c6;
+
+//   /* 展开行样式(需要开启 preserve-expanded-content 属性) */
+//   --el-table-expanded-cell-bg-color: transparent;
+// }

src/styles/index.scss

@@ -2,6 +2,7 @@
 @use './FormCreate/index.scss';
 @use './theme.scss';
 @use 'element-plus/theme-chalk/dark/css-vars.css';
+@use './element-plus.scss';
 
 .reset-margin [class*='el-icon'] + span {
   margin-left: 2px !important;