refactor(styles, views): enhance drawer component styling and streamline input layouts

- Added specific styles for the `.el-drawer__header`, `.el-drawer__body`, and `.el-drawer__footer` in `element-override.scss` to improve the visual structure of drawer components.
- Streamlined input components in `lss/index.vue` by consolidating attributes for better readability and consistency.
- Updated pagination and table components for improved layout and user experience across the application.

src/assets/styles/theme/element-override.scss

@@ -227,6 +227,28 @@
 // 抽屉
 .el-drawer {
   --el-drawer-bg-color: var(--bg-container);
+
+  .el-drawer__header {
+    margin-bottom: 0;
+    padding: 16px 20px;
+    border-bottom: 1px solid #e5e7eb;
+  }
+
+  .el-drawer__body {
+    padding: 16px 0;
+  }
+
+  .el-descriptions {
+    .el-descriptions__label {
+      width: 100px;
+      font-weight: 600;
+    }
+  }
+}
+
+.el-drawer__footer {
+  padding-left: 0 !important;
+  padding-right: 0 !important;
 }
 
 // 消息

src/views/lss/index.vue

@@ -235,7 +235,7 @@
                 </el-form-item>
               </el-form>
             </div>
-            <el-table :data="cameraList" stripe size="small" border>
+            <el-table :data="cameraList" stripe :height="cameraTableHeight">
               <template #empty>
                 <el-empty :description="t('暂无关联设备')" />
               </template>
@@ -293,11 +293,10 @@
               <el-pagination
                 v-model:current-page="cameraCurrentPage"
                 v-model:page-size="cameraPageSize"
-                :page-sizes="[10, 15, 20, 50]"
+                :page-sizes="[10, 15, 20, 50, 100]"
                 :total="cameraTotal"
-                layout="total, sizes, prev, pager, next"
+                layout="total, sizes, prev, pager, next, jumper"
                 background
-                small
                 @size-change="handleCameraSizeChange"
                 @current-change="handleCameraPageChange"
               />
@@ -373,7 +372,7 @@
                 </el-form-item>
               </el-form>
             </div>
-            <el-table :data="cameraList" stripe size="small" border>
+            <el-table :data="cameraList" stripe>
               <template #empty>
                 <el-empty :description="t('暂无关联设备')" />
               </template>
@@ -586,7 +585,9 @@
       <template #footer>
         <div class="drawer-footer">
           <el-button @click="cameraDialogVisible = false">{{ t('取消') }}</el-button>
-          <el-button type="primary" :loading="cameraSubmitting" @click="handleSubmitCamera">{{ t('更新') }}</el-button>
+          <el-button type="primary" :loading="cameraSubmitting" @click="handleSubmitCamera">
+            {{ isEditCamera ? t('更新') : t('添加') }}
+          </el-button>
         </div>
       </template>
     </el-drawer>
@@ -871,6 +872,11 @@ const cameraCurrentPage = ref(1)
 const cameraPageSize = ref(15)
 const cameraTotal = ref(0)
 
+// 摄像头表格高度 (视口高度 - 顶部导航 - tabs - 搜索栏 - 分页 - padding)
+const cameraTableHeight = computed(() => {
+  return 'calc(100vh - 238px)'
+})
+
 // 摄像头搜索表单
 const cameraSearchForm = reactive({
   cameraId: '',
@@ -1477,26 +1483,6 @@ onMounted(() => {
   color: #f56c6c;
 }
 
-// 抽屉样式
-:deep(.el-drawer) {
-  .el-drawer__header {
-    margin-bottom: 0;
-    padding: 16px 20px;
-    border-bottom: 1px solid #e5e7eb;
-  }
-
-  .el-drawer__body {
-    padding: 16px;
-  }
-
-  .el-descriptions {
-    .el-descriptions__label {
-      width: 100px;
-      font-weight: 600;
-    }
-  }
-}
-
 // LSS 编辑抽屉样式
 .lss-edit-drawer {
   :deep(.el-drawer__body) {