feat: 系统管理-租户管理 表格中的操作按钮样式更新

src/views/system/tenant/tenant.vue

@@ -28,31 +28,43 @@
       </el-button>
 
       <el-table :data="tenantTable" class="tenant-info-table" row-key="id" default-expand-all>
-        <el-table-column prop="tenantName" align="center" width="200" label="租户名称" />
-        <el-table-column prop="tenantCode" align="center" label="租户编码" />
-        <el-table-column align="center" width="100" label="状态">
+        <el-table-column prop="tenantName" label="租户名称" />
+        <el-table-column prop="tenantCode" label="租户编码" />
+        <el-table-column label="状态">
           <template #default="scope">
             <div class="">
               {{ TENANT_STATUS_LABEL[scope.row.isDisabled] }}
             </div>
           </template>
         </el-table-column>
-        <el-table-column prop="startTime" align="center" width="200" label="生效时间" />
-        <el-table-column prop="endTime" align="center" width="200" label="失效时间" />
+        <el-table-column prop="startTime" label="生效时间" />
+        <el-table-column prop="endTime" label="失效时间" />
         <el-table-column align="center" label="操作">
           <template #default="scope">
             <div class="operations">
-              <el-button
+              <div
                 v-if="scope.row.parentId === 0 || scope.row.parentId === null"
-                type="primary"
+                class="add-next-level"
                 @click="openAddTenantDrawer('add', scope.row)"
               >
                 添加下一级
-              </el-button>
-              <el-button type="primary" @click="openAddTenantDrawer('edit', scope.row)">
-                编辑
-              </el-button>
-              <el-button type="primary" @click="handleDelete(scope.row.id)"> 删除 </el-button>
+              </div>
+
+              <div v-if="scope.row.parentId === 0 || scope.row.parentId === null" class="separator">
+                |
+              </div>
+
+              <img
+                class="operation-img"
+                src="@/assets/icons/edit.png"
+                @click="openAddTenantDrawer('edit', scope.row)"
+              />
+
+              <img
+                class="operation-img"
+                src="@/assets/icons/delete.png"
+                @click="handleDelete(scope.row.id)"
+              />
             </div>
           </template>
         </el-table-column>
@@ -194,6 +206,33 @@
         // .el-button {
         //   width: 30px;
         // }
+        .operations {
+          display: flex;
+          justify-content: center;
+          align-items: center;
+
+          .add-next-level {
+            height: 22px;
+            font-size: 14px;
+            color: #1890ff;
+            line-height: 22px;
+            cursor: pointer;
+            margin-right: 14px;
+          }
+
+          .separator {
+            width: 1px;
+            color: #e9e9e9;
+            margin-right: 14px;
+          }
+
+          .operation-img {
+            height: 16px;
+            width: 16px;
+            margin-right: 10px;
+            cursor: pointer;
+          }
+        }
       }
     }
   }