租户列表美化

src/views/saas/tenant/index.vue

@@ -116,6 +116,7 @@
               <el-button
                 size="mini"
                 type="text"
+                class="action-text-btn"
                 icon="el-icon-edit"
                 @click="handleUpdate(scope.row)"
                 v-hasPermi="['tenant:tenant:edit']"
@@ -123,6 +124,7 @@
               <el-button
                 size="mini"
                 type="text"
+                class="action-text-btn"
                 icon="el-icon-delete"
                 @click="handleDelete(scope.row)"
                 v-hasPermi="['tenant:tenant:remove']"
@@ -130,6 +132,7 @@
               <el-button
                 size="mini"
                 type="text"
+                class="action-text-btn"
                 icon="el-icon-edit"
                 @click="handleMenuChange(scope.row,'sys')"
                 v-hasPermi="['tenant:tenant:edit']"
@@ -137,6 +140,7 @@
               <el-button
                 size="mini"
                 type="text"
+                class="action-text-btn"
                 icon="el-icon-edit"
                 @click="handleComMenuChange(scope.row,'com')"
                 v-hasPermi="['tenant:tenant:edit']"
@@ -207,8 +211,8 @@
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
+        <el-button type="primary" class="dialog-btn" @click="submitForm">确 定</el-button>
+        <el-button class="dialog-btn" @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
 
@@ -232,8 +236,8 @@
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitFormMenu">确 定</el-button>
-        <el-button @click="cancelMenu">取 消</el-button>
+        <el-button type="primary" class="dialog-btn" @click="submitFormMenu">确 定</el-button>
+        <el-button class="dialog-btn" @click="cancelMenu">取 消</el-button>
       </div>
     </el-dialog>
   </div>
@@ -656,33 +660,14 @@ export default {
   flex-wrap: wrap;
 }
 
-.tenant-page .search-form ::v-deep .el-form-item {
-  margin-bottom: 12px;
+.search-form {
+  margin-bottom: 4px;
 }
 
 .table-card {
   padding: 14px 14px 12px;
 }
 
-.tenant-page .tenant-table ::v-deep .el-table__header th {
-  background: linear-gradient(180deg, #f7faff, #f3f8ff);
-  color: #2f3f5c;
-  font-weight: 600;
-  height: 44px;
-}
-
-.tenant-page .tenant-table ::v-deep .el-table__body tr:hover > td {
-  background: #f7fbff !important;
-}
-
-.tenant-page .tenant-table ::v-deep .el-table__body td {
-  padding: 10px 0;
-}
-
-.tenant-page .tenant-table ::v-deep .el-table__body tr.current-row > td {
-  background: #eef6ff !important;
-}
-
 .table-action-group {
   display: flex;
   flex-wrap: wrap;
@@ -690,7 +675,7 @@ export default {
   gap: 6px 8px;
 }
 
-.tenant-page .table-action-group ::v-deep .el-button--text {
+.action-text-btn {
   background: #f5f8ff;
   border: 1px solid #e7eefb;
   border-radius: 999px;
@@ -698,44 +683,24 @@ export default {
   line-height: 1.2;
 }
 
-.tenant-page .tenant-dialog ::v-deep .el-dialog {
-  border-radius: 14px;
-  overflow: hidden;
-}
-
-.tenant-page .tenant-dialog ::v-deep .el-dialog__header {
-  background: linear-gradient(90deg, #f5f9ff, #ffffff);
-  border-bottom: 1px solid #edf1f7;
-}
-
-.tenant-page .tenant-dialog ::v-deep .el-dialog__body {
-  padding: 20px 24px 12px;
-}
-
 .tenant-data-form {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
 }
 
-.tenant-page .tenant-data-form ::v-deep .el-form-item {
+.tenant-data-form .el-form-item {
   width: calc(50% - 10px);
 }
 
-.tenant-page .tenant-data-form ::v-deep .el-input__inner,
-.tenant-page .tenant-data-form ::v-deep .el-date-editor.el-input,
-.tenant-page .tenant-data-form ::v-deep .el-date-editor.el-input__inner {
-  width: 100%;
-}
-
-.tenant-page .tenant-data-form ::v-deep .el-radio-group {
+.tenant-data-form .el-radio-group {
   width: 100%;
   min-height: 34px;
   display: flex;
   align-items: center;
 }
 
-.tenant-page .tenant-dialog ::v-deep .dialog-footer .el-button {
+.dialog-btn {
   min-width: 84px;
   border-radius: 8px;
 }