优化登录页UI、新增占满布局类

frontend/src/views/admin/AuditLogs.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="page">
-    <el-card shadow="never" class="main-content-card unified-shell">
+    <div class="main-content-flat unified-shell">
       <div class="audit-toolbar">
         <el-form :inline="true" :model="filters" class="filter-form">
           <el-form-item label="" class="filter-item-form">
@@ -60,7 +60,7 @@
         </el-form>
       </div>
       <div class="unified-section table-section">
-        <el-table :data="logs" v-loading="loading" style="width: 100%" stripe>
+        <el-table :data="logs" v-loading="loading" class="audit-table" style="width: 100%" stripe>
           <el-table-column prop="timestamp" :label="TEXT.modules.adminAuditLogs.columns.time" width="180" align="center">
             <template #default="scope">
               <span class="text-gray-500">{{ displayDateTime(scope.row.timestamp) }}</span>
@@ -115,7 +115,7 @@
           />
         </div>
       </div>
-    </el-card>
+    </div>
 
     <el-drawer
       v-model="detailVisible"
@@ -425,21 +425,35 @@ onMounted(async () => {
 .page {
   display: flex;
   flex-direction: column;
+  gap: 0;
+}
+
+.main-content-flat {
+  width: 100%;
+  background: transparent;
+  border: 0;
+  border-radius: 0;
+  box-shadow: none;
+  padding: 0;
+}
+
+.main-content-flat :deep(.el-card__body) {
+  padding: 0;
 }
 
 .table-section {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding: 0;
 }
 
 .audit-toolbar {
-  padding: 12px 16px;
+  padding: 10px 16px;
+  border-bottom: 1px solid var(--unified-shell-divider);
 }
 
 .filter-form {
   display: flex;
   width: 100%;
-  gap: 10px;
+  gap: 8px;
   align-items: center;
   flex-wrap: nowrap;
 }
@@ -451,15 +465,15 @@ onMounted(async () => {
 }
 
 .filter-select-comp {
-  width: 140px;
+  width: 132px;
 }
 
 .filter-select-result {
-  width: 100px;
+  width: 96px;
 }
 
 .date-range-picker-comp {
-  width: 260px !important;
+  width: 248px !important;
 }
 
 .filter-spacer {
@@ -509,9 +523,14 @@ onMounted(async () => {
 }
 
 .pagination-wrap {
-  margin-top: 14px;
+  margin-top: 10px;
   display: flex;
   justify-content: flex-end;
+  padding: 0 0 6px;
+}
+
+.audit-table :deep(.el-table__inner-wrapper::before) {
+  display: none;
 }
 
 .drawer-header {