diff --git a/frontend/index.html b/frontend/index.html
index 9ad9cd07..0ee429f4 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -59,38 +59,37 @@
     }
 
     .loading-container .loading-container-item {
-          position: relative;
-          display: inline-block;
-          width: 60px;
-          height: 60px;
-          vertical-align: middle;
-          border-radius: 50%;
-        }
+      position: relative;
+      display: inline-block;
+      width: 60px;
+      height: 60px;
+      vertical-align: middle;
+      border-radius: 50%;
+    }
     .loading-container .loading-container-outter {
-          position: absolute;
-          width: 100%;
-          height: 100%;
-          border: 4px solid #2d8cf0;
-          border-bottom: 0;
-          border-left-color: transparent;
-          border-radius: 50%;
-          animation: loader-outter 1s cubic-bezier(0.42, 0.61, 0.58, 0.41) infinite;
-        }
-    
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      border: 4px solid #2d8cf0;
+      border-bottom: 0;
+      border-left-color: transparent;
+      border-radius: 50%;
+      animation: loader-outter 1s cubic-bezier(0.42, 0.61, 0.58, 0.41) infinite;
+    }
+
     .loading-container .loading-container-inner {
-          position: absolute;
-          top: calc(50% - 20px);
-          left: calc(50% - 20px);
-          width: 40px;
-          height: 40px;
-          border: 4px solid #87bdff;
-          border-right: 0;
-          border-top-color: transparent;
-          border-radius: 50%;
-          animation: loader-inner 1s cubic-bezier(0.42, 0.61, 0.58, 0.41) infinite;
-        }
+      position: absolute;
+      top: calc(50% - 20px);
+      left: calc(50% - 20px);
+      width: 40px;
+      height: 40px;
+      border: 4px solid #87bdff;
+      border-right: 0;
+      border-top-color: transparent;
+      border-radius: 50%;
+      animation: loader-inner 1s cubic-bezier(0.42, 0.61, 0.58, 0.41) infinite;
+    }
 
-  
     @-webkit-keyframes loader-outter {
       0% {
         -webkit-transform: rotate(0deg);
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 567706f1..7a5f3ff6 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -29,5 +29,4 @@ const showWatermark = computed(() => settingsStore.showWatermark);
 const fontColor = computed(() => {
   return settingsStore.theme === ThemeMode.DARK ? "rgba(255, 255, 255, .15)" : "rgba(0, 0, 0, .15)";
 });
-
 </script>
diff --git a/frontend/src/api/module_application/job.ts b/frontend/src/api/module_application/job.ts
index e2f4900f..dc191282 100644
--- a/frontend/src/api/module_application/job.ts
+++ b/frontend/src/api/module_application/job.ts
@@ -117,7 +117,6 @@ const JobAPI = {
       responseType: "blob",
     });
   },
-
 };
 
 export default JobAPI;
diff --git a/frontend/src/api/module_generator/demo.ts b/frontend/src/api/module_generator/demo.ts
index 55258151..ef70a8d9 100644
--- a/frontend/src/api/module_generator/demo.ts
+++ b/frontend/src/api/module_generator/demo.ts
@@ -12,7 +12,7 @@ const ExampleAPI = {
   },
 
   getExampleDetail(query: number) {
-    return request<ApiResponse<ExampleTable>>({ 
+    return request<ApiResponse<ExampleTable>>({
       url: `${API_PATH}/detail/${query}`,
       method: "get",
     });
diff --git a/frontend/src/api/module_generator/gencode.ts b/frontend/src/api/module_generator/gencode.ts
index e1551d4b..1c6d4122 100644
--- a/frontend/src/api/module_generator/gencode.ts
+++ b/frontend/src/api/module_generator/gencode.ts
@@ -7,97 +7,97 @@ const GencodeAPI = {
   listTable(query: GenTablePageQuery) {
     return request<ApiResponse<PageResult<GenTableSchema[]>>>({
       url: `${API_PATH}/list`,
-      method: 'get',
-      params: query
-    })
+      method: "get",
+      params: query,
+    });
   },
 
   // 查询db数据库列表
   listDbTable(query: DBTablePageQuery) {
     return request<ApiResponse<PageResult<DBTableSchema[]>>>({
       url: `${API_PATH}/db/list`,
-      method: 'get',
-      params: query
-    })
+      method: "get",
+      params: query,
+    });
   },
 
   // 导入表
   importTable(table_names: string[]) {
     return request<ApiResponse>({
       url: `${API_PATH}/import`,
-      method: 'post',
-      data: table_names
-    })
+      method: "post",
+      data: table_names,
+    });
   },
 
   // 查询表详细信息
   getGenTableDetail(table_id: number) {
     return request<ApiResponse<GenTableSchema>>({
       url: `${API_PATH}/detail/${table_id}`,
-      method: 'get'
-    })
+      method: "get",
+    });
   },
 
   // 创建表
   createTable(sql: string) {
     return request<ApiResponse>({
       url: `${API_PATH}/create`,
-      method: 'post',
-      data: sql
-    })
+      method: "post",
+      data: sql,
+    });
   },
 
   // 更新表信息
   updateTable(data: GenTableSchema, table_id: number) {
     return request<ApiResponse>({
       url: `${API_PATH}/update/${table_id}`,
-      method: 'put',
-      data
-    })
+      method: "put",
+      data,
+    });
   },
 
   // 删除表数据
   deleteTable(table_ids: number[]) {
     return request<ApiResponse>({
       url: `${API_PATH}/delete`,
-      method: 'delete',
-      data: table_ids
-    })
+      method: "delete",
+      data: table_ids,
+    });
   },
 
   // 批量生成代码
   batchGenCode(table_names: string[]) {
     return request<Blob>({
       url: `${API_PATH}/batch/output`,
-      method: 'patch',
+      method: "patch",
       data: table_names,
-      responseType: 'blob'
-    })
+      responseType: "blob",
+    });
   },
 
   // 生成代码到指定路径
   genCodeToPath(table_name: string) {
     return request<ApiResponse>({
       url: `${API_PATH}/output/${table_name}`,
-      method: 'post'
-    })
+      method: "post",
+    });
   },
 
   // 预览生成代码
   previewTable(id: number) {
     return request<ApiResponse<Record<string, string>>>({
       url: `${API_PATH}/preview/${id}`,
-      method: 'get'
-    })
+      method: "get",
+    });
   },
 
   // 同步数据库
   syncDb(table_name: string) {
     return request<ApiResponse>({
       url: `${API_PATH}/sync_db/${table_name}`,
-      method: 'post'
-    })
-  }
+      method: "post",
+    });
+  },
 };
 
 export default GencodeAPI;
@@ -219,4 +219,3 @@ export interface GenTableColumnSchema {
   /** 功能描述 */
   description?: string;
 }
-
diff --git a/frontend/src/api/module_monitor/resource.ts b/frontend/src/api/module_monitor/resource.ts
index 2e98fe8b..dc5867ef 100644
--- a/frontend/src/api/module_monitor/resource.ts
+++ b/frontend/src/api/module_monitor/resource.ts
@@ -15,7 +15,6 @@ export const ResourceAPI = {
     });
   },
 
-
   /**
    * 上传文件
    * @param formData 文件数据
@@ -118,8 +117,6 @@ export const ResourceAPI = {
 
 export default ResourceAPI;
 
-
-
 /**
  * 资源列表查询参数
  */
diff --git a/frontend/src/api/module_system/menu.ts b/frontend/src/api/module_system/menu.ts
index e7e8f30c..13ff7143 100644
--- a/frontend/src/api/module_system/menu.ts
+++ b/frontend/src/api/module_system/menu.ts
@@ -80,7 +80,7 @@ export interface MenuTable {
   hidden?: boolean;
   always_show?: boolean;
   title?: string;
-  params?: { key: string; value: string; }[];
+  params?: { key: string; value: string }[];
   affix?: boolean;
   status?: boolean;
   description?: string;
diff --git a/frontend/src/api/module_system/tenant.ts b/frontend/src/api/module_system/tenant.ts
index 043d22f7..6f81de1e 100644
--- a/frontend/src/api/module_system/tenant.ts
+++ b/frontend/src/api/module_system/tenant.ts
@@ -12,7 +12,7 @@ const TenantAPI = {
   },
 
   detail(query: number) {
-    return request<ApiResponse<ObjTable>>({ 
+    return request<ApiResponse<ObjTable>>({
       url: `${API_PATH}/detail/${query}`,
       method: "get",
     });
diff --git a/frontend/src/api/module_system/user.ts b/frontend/src/api/module_system/user.ts
index 155920d4..47df580a 100644
--- a/frontend/src/api/module_system/user.ts
+++ b/frontend/src/api/module_system/user.ts
@@ -250,7 +250,7 @@ export interface UserForm {
   id?: number;
   username?: string;
   name?: string;
-  dept_id?:  number;
+  dept_id?: number;
   dept_name?: string;
   role_ids?: number[];
   role_names?: string[];
diff --git a/frontend/src/components/CURD/ExportModal.vue b/frontend/src/components/CURD/ExportModal.vue
index c9e01dba..546fd5aa 100644
--- a/frontend/src/components/CURD/ExportModal.vue
+++ b/frontend/src/components/CURD/ExportModal.vue
@@ -26,7 +26,11 @@
           </el-form-item>
           <el-form-item label="数据源" prop="origin">
             <el-select v-model="exportsFormData.origin">
-              <el-option label="当前数据 (当前页的数据)" :value="ExportsOriginEnum.CURRENT" :disabled="!pageData?.length" />
+              <el-option
+                label="当前数据 (当前页的数据)"
+                :value="ExportsOriginEnum.CURRENT"
+                :disabled="!pageData?.length"
+              />
               <el-option
                 label="选中数据 (所有选中的数据)"
                 :value="ExportsOriginEnum.SELECTED"
@@ -113,9 +117,8 @@ const exportsFormRules: FormRules = {
   origin: [{ required: true, message: "请选择数据源" }],
 };
 
-
 // 表格列
-const cols = computed(() => 
+const cols = computed(() =>
   props.contentConfig.cols.map((col) => {
     if (col.initFn) {
       col.initFn(col);
@@ -177,25 +180,28 @@ function handleExports() {
       }
     });
     worksheet.columns = columns;
-    
+
     if (exportsFormData.origin === ExportsOriginEnum.REMOTE) {
       if (props.contentConfig.exportsAction) {
         const lastFormData = props.queryParams ?? {};
-        props.contentConfig.exportsAction(lastFormData).then((res) => {
-          worksheet.addRows(res);
-          workbook.xlsx
-            .writeBuffer()
-            .then((buffer) => {
-              saveXlsx(buffer, filename as string);
-            })
-            .catch((error) => {
-              console.error("导出远程数据失败:", error);
-              ElMessage.error("导出远程数据失败");
-            });
-        }).catch((error) => {
-          console.error("获取远程数据失败:", error);
-          ElMessage.error("获取远程数据失败");
-        });
+        props.contentConfig
+          .exportsAction(lastFormData)
+          .then((res) => {
+            worksheet.addRows(res);
+            workbook.xlsx
+              .writeBuffer()
+              .then((buffer) => {
+                saveXlsx(buffer, filename as string);
+              })
+              .catch((error) => {
+                console.error("导出远程数据失败:", error);
+                ElMessage.error("导出远程数据失败");
+              });
+          })
+          .catch((error) => {
+            console.error("获取远程数据失败:", error);
+            ElMessage.error("获取远程数据失败");
+          });
       } else {
         ElMessage.error("未配置exportsAction");
       }
diff --git a/frontend/src/components/CURD/ImportModal.vue b/frontend/src/components/CURD/ImportModal.vue
index 6cc1a270..726b3b52 100644
--- a/frontend/src/components/CURD/ImportModal.vue
+++ b/frontend/src/components/CURD/ImportModal.vue
@@ -1,43 +1,54 @@
 <template>
   <div>
     <!-- 导入弹窗 -->
-    <el-dialog 
-      v-model="importModalVisible" 
-      :align-center="true" 
-      :title="props.title" 
-      :width="props.width" 
+    <el-dialog
+      v-model="importModalVisible"
+      :align-center="true"
+      :title="props.title"
+      :width="props.width"
       style="padding-right: 0"
-      @close="handleClose">
+      @close="handleClose"
+    >
       <!-- 滚动 -->
       <el-scrollbar :max-height="props.maxHeight">
         <!-- 表单 -->
-        <el-form 
-          ref="importFormRef" 
-          style="padding-right: var(--el-dialog-padding-primary)" 
-          :model="importFormData" 
-          :rules="importFormRules">
+        <el-form
+          ref="importFormRef"
+          style="padding-right: var(--el-dialog-padding-primary)"
+          :model="importFormData"
+          :rules="importFormRules"
+        >
           <el-form-item prop="files">
-            <el-upload 
-              ref="uploadRef" 
-              v-model:file-list="importFormData.files" 
-              class="w-full" 
-              :accept="props.accept" 
-              :drag="true" 
-              :limit="props.limit" 
-              :auto-upload="false" 
+            <el-upload
+              ref="uploadRef"
+              v-model:file-list="importFormData.files"
+              class="w-full"
+              :accept="props.accept"
+              :drag="true"
+              :limit="props.limit"
+              :auto-upload="false"
               :on-exceed="handleFileExceed"
             >
               <el-icon class="el-icon--upload"><upload-filled /></el-icon>
               <div class="el-upload__text">
-                {{ props.dropText || '将文件拖到此处，或' }}
-                <em>{{ props.browseText || '点击上传' }}</em>
+                {{ props.dropText || "将文件拖到此处，或" }}
+                <em>{{ props.browseText || "点击上传" }}</em>
               </div>
               <template #tip>
                 <div class="el-upload__tip flex flex-wrap gap-2">
                   <el-text v-if="props.note" type="warning" class="mx-1">{{ props.note }}</el-text>
-                  <el-text v-if="props.fileTypeWarning" type="danger" class="mx-1">{{ props.fileTypeWarning }}</el-text>
-                  <el-link v-if="props.showTemplateDownload" class="mx-1" type="primary" icon="download" underline="never" @click="handleDownloadTemplate">
-                    {{ props.templateDownloadText || '下载模板' }}
+                  <el-text v-if="props.fileTypeWarning" type="danger" class="mx-1">
+                    {{ props.fileTypeWarning }}
+                  </el-text>
+                  <el-link
+                    v-if="props.showTemplateDownload"
+                    class="mx-1"
+                    type="primary"
+                    icon="download"
+                    underline="never"
+                    @click="handleDownloadTemplate"
+                  >
+                    {{ props.templateDownloadText || "下载模板" }}
                   </el-link>
                 </div>
               </template>
@@ -47,14 +58,14 @@
       </el-scrollbar>
       <template #footer>
         <div style="padding-right: var(--el-dialog-padding-primary)">
-          <el-button @click="handleClose">{{ props.cancelButtonText || '取 消' }}</el-button>
+          <el-button @click="handleClose">{{ props.cancelButtonText || "取 消" }}</el-button>
           <el-button
             type="primary"
             :disabled="importFormData.files.length === 0 || loading"
             @click="handleUpload"
           >
             <el-icon v-if="loading"><Loading /></el-icon>
-            {{ props.confirmButtonText || '确 定' }}
+            {{ props.confirmButtonText || "确 定" }}
           </el-button>
         </div>
       </template>
@@ -157,7 +168,8 @@ const props = withDefaults(defineProps<ImportModalProps>(), {
   title: "导入数据",
   width: "600px",
   maxHeight: "60vh",
-  accept: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel",
+  accept:
+    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel",
   limit: 1,
   showTemplateDownload: true,
   note: "注意事项：",
@@ -169,7 +181,7 @@ const props = withDefaults(defineProps<ImportModalProps>(), {
 // 定义模型值（控制弹窗显示/隐藏）
 const importModalVisible = defineModel<boolean>("modelValue", {
   required: true,
-  default: false
+  default: false,
 });
 
 // 定义事件
@@ -195,12 +207,12 @@ const loading = ref(false);
 const importFormData = reactive<{
   files: UploadUserFile[];
 }>({
-  files: []
+  files: [],
 });
 
 // 表单规则
 const importFormRules = {
-  files: [{ required: true, message: "文件不能为空", trigger: "blur" }]
+  files: [{ required: true, message: "文件不能为空", trigger: "blur" }],
 };
 
 // 文件超出个数限制
@@ -264,7 +276,7 @@ const handleUpload = async () => {
     formData.append(props.uploadFileName, file);
 
     // 添加额外参数
-    Object.keys(props.uploadData).forEach(key => {
+    Object.keys(props.uploadData).forEach((key) => {
       formData.append(key, props.uploadData[key]);
     });
 
@@ -288,6 +300,6 @@ const handleClose = () => {
 
 // 提供给父组件的方法
 defineExpose({
-  handleClose
+  handleClose,
 });
 </script>
diff --git a/frontend/src/components/CURD/PageSearch.vue b/frontend/src/components/CURD/PageSearch.vue
index b629b90c..b34ee48c 100644
--- a/frontend/src/components/CURD/PageSearch.vue
+++ b/frontend/src/components/CURD/PageSearch.vue
@@ -1,7 +1,16 @@
 <template>
   <div v-show="visible">
     <el-card v-bind="cardAttrs">
-      <el-form ref="queryFormRef" :model="queryParams" v-bind="formAttrs" :class="isGrid" @submit.prevent="handleQuery">
+      <!-- 搜索表单区域 -->
+      <el-form
+        ref="queryFormRef"
+        label-suffix=":"
+        v-bind="formAttrs"
+        :model="queryParams"
+        :class="isGrid"
+        :inline="true"
+        @submit.prevent="handleQuery"
+      >
         <template v-for="(item, index) in formItems" :key="item.prop">
           <el-form-item
             v-show="isExpand ? true : index < showNumber"
@@ -19,14 +28,14 @@
               </span>
             </template>
 
-            <el-cascader
+            <ElCascader
               v-if="item.type === 'cascader'"
               v-model.trim="queryParams[item.prop]"
               v-bind="{ style: { width: '100%' }, ...item.attrs }"
               v-on="item.events || {}"
             />
             <component
-              :is="componentMap.get(item.type)"
+              :is="getCustomComponent(item.type) || componentMap.get(item.type)"
               v-else
               v-model.trim="queryParams[item.prop]"
               v-bind="{ style: { width: '100%' }, ...item.attrs }"
@@ -37,13 +46,56 @@
                   <el-option :label="opt.label" :value="opt.value" />
                 </template>
               </template>
+              <!-- 自定义组件的插槽支持 -->
+              <template v-if="getCustomComponent(item.type) && item.slotName">
+                <template v-for="slot in Object.keys($slots)" :key="slot">
+                  <slot :name="slot"></slot>
+                </template>
+              </template>
             </component>
           </el-form-item>
         </template>
 
         <el-form-item :class="{ 'col-[auto/-1] justify-self-end': searchConfig?.grid === 'right' }">
-          <el-button icon="search" type="primary" @click="handleQuery">搜索</el-button>
-          <el-button icon="refresh" @click="handleReset">重置</el-button>
+          <!-- 自定义按钮组 -->
+          <template v-if="searchConfig?.customButtons && searchConfig.customButtons.length > 0">
+            <template v-for="button in searchConfig.customButtons" :key="button.key">
+              <el-button
+                v-if="!button.perm || hasPermission(button.perm)"
+                v-bind="button.attrs"
+                @click="handleCustomButtonClick(button)"
+              >
+                {{ button.text }}
+              </el-button>
+            </template>
+          </template>
+
+          <!-- 默认搜索/重置按钮 -->
+          <template v-else>
+            <!-- 搜索按钮 -->
+            <el-button
+              v-if="
+                !searchConfig?.showSearchButton ||
+                hasPermission(searchConfig.searchButtonPerm || [])
+              "
+              icon="search"
+              type="primary"
+              @click="handleQuery"
+            >
+              搜索
+            </el-button>
+            <!-- 重置按钮 -->
+            <el-button
+              v-if="
+                !searchConfig?.showResetButton || hasPermission(searchConfig.resetButtonPerm || [])
+              "
+              icon="refresh"
+              @click="handleReset"
+            >
+              重置
+            </el-button>
+          </template>
+
           <!-- 展开/收起 -->
           <template v-if="isExpandable && formItems.length > showNumber">
             <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
@@ -51,6 +103,17 @@
               <component :is="isExpand ? ArrowUp : ArrowDown" class="w-4 h-4 ml-2" />
             </el-link>
           </template>
+          <!-- 显示/隐藏搜索区域 -->
+          <el-tooltip v-if="searchConfig?.showToggle" content="搜索显示/隐藏">
+            <el-button
+              v-if="!searchConfig?.togglePerm || hasPermission(searchConfig.togglePerm)"
+              class="ml-3"
+              type="info"
+              icon="search"
+              circle
+              @click="toggleVisible"
+            />
+          </el-tooltip>
         </el-form-item>
       </el-form>
     </el-card>
@@ -59,9 +122,26 @@
 
 <script setup lang="ts">
 import type { IObject, IForm, ISearchConfig, ISearchComponent } from "./types";
-import { ArrowUp, ArrowDown } from "@element-plus/icons-vue";
+import { ArrowUp, ArrowDown, QuestionFilled } from "@element-plus/icons-vue";
 import type { FormInstance } from "element-plus";
 import InputTag from "@/components/InputTag/index.vue";
+import { getCurrentInstance } from "vue";
+import {
+  ElInput,
+  ElSelect,
+  ElCascader,
+  ElInputNumber,
+  ElDatePicker,
+  ElTimePicker,
+  ElTimeSelect,
+  ElTreeSelect,
+  ElInputTag,
+  ElRadioGroup,
+  ElCheckboxGroup,
+  ElSwitch,
+  ElRate,
+  ElSlider,
+} from "element-plus";
 
 // 定义接收的属性
 const props = defineProps<{ searchConfig: ISearchConfig }>();
@@ -69,7 +149,13 @@ const props = defineProps<{ searchConfig: ISearchConfig }>();
 const emit = defineEmits<{
   queryClick: [queryParams: IObject];
   resetClick: [queryParams: IObject];
+  dateRangeChange: [prop: string, range: [Date, Date] | [string, string] | [null, null]];
+  customButtonClick: [buttonKey: string, queryParams: IObject];
 }>();
+
+// 时间范围处理相关
+const dateRangeRefs = ref<Record<string, any>>({});
+
 // 组件映射表
 const componentMap = new Map<ISearchComponent, any>([
   // @ts-ignore
@@ -82,9 +168,19 @@ const componentMap = new Map<ISearchComponent, any>([
   ["time-select", markRaw(ElTimeSelect)], // @ts-ignore
   ["tree-select", markRaw(ElTreeSelect)], // @ts-ignore
   ["input-tag", markRaw(ElInputTag)], // @ts-ignore
-  ["custom-tag", markRaw(InputTag)],
+  ["custom-tag", markRaw(InputTag)], // @ts-ignore
+  ["radio", markRaw(ElRadioGroup)], // @ts-ignore
+  ["checkbox", markRaw(ElCheckboxGroup)], // @ts-ignore
+  ["switch", markRaw(ElSwitch)], // @ts-ignore
+  ["rate", markRaw(ElRate)], // @ts-ignore
+  ["slider", markRaw(ElSlider)], // @ts-ignore
 ]);
 
+// 自定义组件映射（从searchConfig中获取）
+const getCustomComponent = (componentName: string) => {
+  return props.searchConfig?.customComponents?.[componentName] || null;
+};
+
 // 存储表单实例
 const queryFormRef = ref<FormInstance>();
 // 存储查询参数
@@ -120,13 +216,51 @@ const isGrid = computed(() =>
 const getTooltipProps = (tips: string | IObject) => {
   return typeof tips === "string" ? { content: tips } : tips;
 };
+
+// 显示/隐藏搜索区域
+const toggleVisible = () => {
+  visible.value = !visible.value;
+};
+
 // 查询/重置操作
 const handleQuery = () => emit("queryClick", queryParams);
 const handleReset = () => {
   queryFormRef.value?.resetFields();
+  // 重置所有时间范围组件
+  Object.values(dateRangeRefs.value).forEach((ref) => {
+    if (ref && typeof ref.reset === "function") {
+      ref.reset();
+    }
+  });
   emit("resetClick", queryParams);
 };
 
+// 处理时间范围变化
+const handleDateRangeChange = (
+  prop: string,
+  range: [Date, Date] | [string, string] | [null, null]
+) => {
+  emit("dateRangeChange", prop, range);
+};
+
+// 处理自定义按钮点击
+const handleCustomButtonClick = (button: any) => {
+  // 如果配置了自定义处理器，优先使用
+  if (button.handler && typeof button.handler === "function") {
+    button.handler(queryParams, getCurrentInstance());
+  }
+  // 触发自定义事件
+  emit("customButtonClick", button.key, queryParams);
+};
+
+// 权限控制检查
+const hasPermission = (perm: string | string[]): boolean => {
+  if (!perm || !props.searchConfig?.permPrefix) return true;
+  // 这里应该根据实际的权限系统来实现
+  // 暂时返回 true，实际项目中需要对接权限系统
+  return true;
+};
+
 onMounted(() => {
   formItems.forEach((item) => {
     if (item?.initFn) {
@@ -145,8 +279,6 @@ onMounted(() => {
 defineExpose({
   // 获取分页数据
   getQueryParams: () => queryParams,
-  // 显示/隐藏 SearchForm
-  toggleVisible: () => (visible.value = !visible.value),
 });
 </script>
 
diff --git a/frontend/src/components/CURD/types.ts b/frontend/src/components/CURD/types.ts
index fd9d87ef..909c1618 100644
--- a/frontend/src/components/CURD/types.ts
+++ b/frontend/src/components/CURD/types.ts
@@ -19,8 +19,23 @@ export type IObject = Record<string, any>;
  */
 type DateComponent = "date-picker" | "time-picker" | "time-select" | "custom-tag" | "input-tag";
 type InputComponent = "input" | "select" | "input-number" | "cascader" | "tree-select";
-type OtherComponent = "text" | "radio" | "checkbox" | "switch" | "icon-select" | "custom";
-export type ISearchComponent = DateComponent | InputComponent;
+type OtherComponent =
+  | "text"
+  | "radio"
+  | "checkbox"
+  | "switch"
+  | "rate"
+  | "slider"
+  | "icon-select"
+  | "custom";
+export type ISearchComponent =
+  | DateComponent
+  | InputComponent
+  | "radio"
+  | "checkbox"
+  | "switch"
+  | "rate"
+  | "slider";
 export type IComponentType = DateComponent | InputComponent | OtherComponent;
 
 /**
@@ -87,6 +102,33 @@ export interface ISearchConfig {
   form?: IForm;
   /** 自适应网格布局(使用时表单不要添加 style: { width: "200px" }) */
   grid?: boolean | "left" | "right";
+  /** 自定义组件映射 */
+  customComponents?: Record<string, any>;
+  /** 是否显示搜索按钮(默认：true) */
+  showSearchButton?: boolean;
+  /** 是否显示重置按钮(默认：true) */
+  showResetButton?: boolean;
+  /** 搜索按钮权限 */
+  searchButtonPerm?: string | string[];
+  /** 重置按钮权限 */
+  resetButtonPerm?: string | string[];
+  /** 是否显示搜索区域切换按钮(默认：false) */
+  showToggle?: boolean;
+  /** 搜索区域切换按钮权限 */
+  togglePerm?: string | string[];
+  /** 自定义按钮组 */
+  customButtons?: Array<{
+    /** 按钮唯一标识 */
+    key: string;
+    /** 按钮文本 */
+    text: string;
+    /** 按钮属性 */
+    attrs?: IObject;
+    /** 按钮权限 */
+    perm?: string | string[];
+    /** 点击事件处理函数 */
+    handler?: (params: IObject, instance: any) => void;
+  }>;
 }
 
 /**
@@ -105,13 +147,13 @@ export interface IContentConfig<T = any> {
   pagePosition?: "left" | "right";
   /** pagination组件属性 */
   pagination?:
-  | boolean
-  | Partial<
-    Omit<
-      PaginationProps,
-      "v-model:page-size" | "v-model:current-page" | "total" | "currentPage"
-    >
-  >;
+    | boolean
+    | Partial<
+        Omit<
+          PaginationProps,
+          "v-model:page-size" | "v-model:current-page" | "total" | "currentPage"
+        >
+      >;
   /** 列表的网络请求函数(需返回promise) */
   indexAction: (queryParams: T) => Promise<any>;
   /** 默认的分页相关的请求参数 */
@@ -173,17 +215,17 @@ export interface IContentConfig<T = any> {
     show?: boolean;
     /** 模板类型 */
     templet?:
-    | "image"
-    | "list"
-    | "url"
-    | "switch"
-    | "input"
-    | "price"
-    | "percent"
-    | "icon"
-    | "date"
-    | "tool"
-    | "custom";
+      | "image"
+      | "list"
+      | "url"
+      | "switch"
+      | "input"
+      | "price"
+      | "percent"
+      | "icon"
+      | "date"
+      | "tool"
+      | "custom";
     /** image模板相关参数 */
     imageWidth?: number;
     /** image模板相关参数 */
@@ -270,7 +312,7 @@ export type IFormItems<T = IComponentType> = Array<{
   /** 属性 */
   attrs?: IObject;
   /** 选项 */
-  options?: Array<{ label: string; value: any;[key: string]: any }> | Ref<any[]>;
+  options?: Array<{ label: string; value: any; [key: string]: any }> | Ref<any[]>;
   /** 规则 */
   rules?: FormItemRule[];
   /** 初始值 */
diff --git a/frontend/src/components/CURD/usePage.ts b/frontend/src/components/CURD/usePage.ts
index bf836331..0005a30d 100644
--- a/frontend/src/components/CURD/usePage.ts
+++ b/frontend/src/components/CURD/usePage.ts
@@ -55,7 +55,9 @@ function usePage() {
       }
     } catch (error) {
       console.error("打开新增模态框失败:", error);
-      ElMessage.error("打开新增模态框失败: " + (error instanceof Error ? error.message : String(error)));
+      ElMessage.error(
+        "打开新增模态框失败: " + (error instanceof Error ? error.message : String(error))
+      );
     }
   }
 
@@ -84,7 +86,9 @@ function usePage() {
       }
     } catch (error) {
       console.error("打开编辑模态框失败:", error);
-      ElMessage.error("打开编辑模态框失败: " + (error instanceof Error ? error.message : String(error)));
+      ElMessage.error(
+        "打开编辑模态框失败: " + (error instanceof Error ? error.message : String(error))
+      );
     }
   }
 
@@ -113,7 +117,9 @@ function usePage() {
       }
     } catch (error) {
       console.error("打开查看模态框失败:", error);
-      ElMessage.error("打开查看模态框失败: " + (error instanceof Error ? error.message : String(error)));
+      ElMessage.error(
+        "打开查看模态框失败: " + (error instanceof Error ? error.message : String(error))
+      );
     }
   }
 
@@ -153,7 +159,9 @@ function usePage() {
       searchRef.value?.toggleVisible();
     } catch (error) {
       console.error("切换搜索栏失败:", error);
-      ElMessage.error("切换搜索栏失败: " + (error instanceof Error ? error.message : String(error)));
+      ElMessage.error(
+        "切换搜索栏失败: " + (error instanceof Error ? error.message : String(error))
+      );
     }
   }
 
@@ -190,7 +198,9 @@ function usePage() {
       handleSubmitClick();
     } catch (error) {
       console.error("处理更多操作失败:", error);
-      ElMessage.error("处理更多操作失败: " + (error instanceof Error ? error.message : String(error)));
+      ElMessage.error(
+        "处理更多操作失败: " + (error instanceof Error ? error.message : String(error))
+      );
     }
   }
 
diff --git a/frontend/src/components/DatePicker/index.vue b/frontend/src/components/DatePicker/index.vue
index 805b0860..6982b4d0 100644
--- a/frontend/src/components/DatePicker/index.vue
+++ b/frontend/src/components/DatePicker/index.vue
@@ -15,67 +15,66 @@
 </template>
 
 <script setup lang="ts">
-
 // 定义组件属性
 defineProps({
   modelValue: {
     type: Array as unknown as () => [Date, Date] | [],
-    default: () => []
-  }
-})
+    default: () => [],
+  },
+});
 
 // 定义事件
-const emit = defineEmits(['update:model-value'])
+const emit = defineEmits(["update:model-value"]);
 
 // 快捷选项配置
 const shortcuts = [
   {
-    text: '近一天',
+    text: "近一天",
     value: () => {
-      const end = new Date()
-      const start = new Date()
+      const end = new Date();
+      const start = new Date();
       // 修正：起始时间为当前时间往前 24 小时
-      start.setTime(start.getTime() - 3600 * 1000 * 24)
-      return [start, end]
-    }
+      start.setTime(start.getTime() - 3600 * 1000 * 24);
+      return [start, end];
+    },
   },
   {
-    text: '近三天',
+    text: "近三天",
     value: () => {
-      const end = new Date()
-      const start = new Date()
-      start.setTime(start.getTime() - 3600 * 1000 * 24 * 3)
-      return [start, end]
-    }
+      const end = new Date();
+      const start = new Date();
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
+      return [start, end];
+    },
   },
   {
-    text: '近一周',
+    text: "近一周",
     value: () => {
-      const end = new Date()
-      const start = new Date()
-      start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
-      return [start, end]
-    }
+      const end = new Date();
+      const start = new Date();
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+      return [start, end];
+    },
   },
   {
-    text: '近一个月',
+    text: "近一个月",
     value: () => {
-      const end = new Date()
-      const start = new Date()
-      start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
-      return [start, end]
-    }
+      const end = new Date();
+      const start = new Date();
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+      return [start, end];
+    },
   },
   {
-    text: '近三个月',
+    text: "近三个月",
     value: () => {
-      const end = new Date()
-      const start = new Date()
-      start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
-      return [start, end]
-    }
-  }
-]
+      const end = new Date();
+      const start = new Date();
+      start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+      return [start, end];
+    },
+  },
+];
 </script>
 
 <style lang="scss" scoped>
diff --git a/frontend/src/components/Frame/index.vue b/frontend/src/components/Frame/index.vue
index b312d230..f0ac15c6 100644
--- a/frontend/src/components/Frame/index.vue
+++ b/frontend/src/components/Frame/index.vue
@@ -1,34 +1,29 @@
 <!-- 自定义 iframe 组件 -->
 <template>
   <div v-loading="loading" :style="'height:' + height">
-    <iframe 
-      :src="url" 
-      frameborder="0" 
-      width="100%"
-      height="100%"
-      scrolling="auto" />
+    <iframe :src="url" frameborder="0" width="100%" height="100%" scrolling="auto" />
   </div>
 </template>
 
 <script setup>
-import { ref, computed, onMounted } from 'vue';
+import { ref, computed, onMounted } from "vue";
 
 const props = defineProps({
   src: {
     type: String,
-    required: true
-  }
-})
+    required: true,
+  },
+});
 
-const height = ref(document.documentElement.clientHeight - 94.5 + "px;")
-const loading = ref(true)
-const url = computed(() => props.src)
+const height = ref(document.documentElement.clientHeight - 94.5 + "px;");
+const loading = ref(true);
+const url = computed(() => props.src);
 
 onMounted(() => {
   setTimeout(() => {
     loading.value = false;
   }, 300);
-})
+});
 </script>
 
 <style lang="scss" scoped>
diff --git a/frontend/src/components/Guide/index.vue b/frontend/src/components/Guide/index.vue
index 91648412..7e68002c 100644
--- a/frontend/src/components/Guide/index.vue
+++ b/frontend/src/components/Guide/index.vue
@@ -1,10 +1,6 @@
 <!-- 引导页 -->
 <template>
-  <el-tour
-    v-model="open"
-    :show-close="false"
-    @change="handleChange"
-  >
+  <el-tour v-model="open" :show-close="false" @change="handleChange">
     <el-tour-step
       v-for="(step, index) in steps"
       :key="index"
@@ -13,11 +9,11 @@
       :description="step.description"
       :prev-button-props="{
         children: t('common.prevLabel'),
-        onClick: handlePrevClick
+        onClick: handlePrevClick,
       }"
       :next-button-props="{
         children: nextBtnName(index),
-        onClick: handleNextClick
+        onClick: handleNextClick,
       }"
       :placement="step.placement"
     />
@@ -42,56 +38,55 @@ const props = defineProps({
   },
   teleport: {
     type: [String, Object] as PropType<string | HTMLElement | null>,
-    default: 'body',
-  }
+    default: "body",
+  },
 });
 
-const emit = defineEmits(['update:modelValue', 'change', 'prev', 'next', 'skip']);
+const emit = defineEmits(["update:modelValue", "change", "prev", "next", "skip"]);
 
 const open = computed({
   get: () => props.modelValue,
-  set: (val) => emit('update:modelValue', val),
+  set: (val) => emit("update:modelValue", val),
 });
 
 interface TourStep {
   target: string;
   title: string;
   description: string;
-  placement: 'top' | 'bottom' | 'left' | 'right';
-} 
+  placement: "top" | "bottom" | "left" | "right";
+}
 
 const layout = settingStore.layout;
 
 const menuTarget = (): string => {
-  if (layout === 'left') {
-    return '.layout__sidebar';
-  } else if (layout === 'top') {
-    return '.layout__header-left';
+  if (layout === "left") {
+    return ".layout__sidebar";
+  } else if (layout === "top") {
+    return ".layout__header-left";
   } else {
-    return '.layout__header-menu';
+    return ".layout__header-menu";
   }
 };
 
-
 // 内置引导步骤数据
 const steps: TourStep[] = [
   {
     target: menuTarget(),
     title: t("common.menu"),
     description: t("common.menuDes"),
-    placement: layout === 'left' ? 'right' : 'bottom'
+    placement: layout === "left" ? "right" : "bottom",
   },
   {
     target: ".navbar-actions",
     title: t("common.tool"),
     description: t("common.toolDes"),
-    placement: "bottom"
+    placement: "bottom",
   },
   {
     target: ".tags-container",
     title: t("common.tagsView"),
     description: t("common.tagsViewDes"),
-    placement: "bottom"
+    placement: "bottom",
   },
 ];
 
@@ -101,33 +96,32 @@ const currentStep = ref(0);
 // 动态设置下一步按钮名称
 const nextBtnName = computed(() => (index: number) => {
   if (index === steps.length - 1) {
-    return t('common.doneLabel');
+    return t("common.doneLabel");
   }
-  return t('common.nextLabel');
+  return t("common.nextLabel");
 });
 
 // 步数切换时触发
 function handleChange(step: number) {
   currentStep.value = step;
-  emit('change', step);
+  emit("change", step);
 }
 
 // 点击跳过按钮时触发
 function handleSkip() {
   open.value = false;
-  emit('skip');
+  emit("skip");
 }
 
 // 点击上一步按钮时触发
 function handlePrevClick() {
-  emit('prev');
+  emit("prev");
 }
 
 // 点击下一步按钮时触发
 function handleNextClick() {
-  emit('next');
+  emit("next");
 }
-
 </script>
 
 <style scoped>
@@ -137,5 +131,4 @@ function handleNextClick() {
   justify-content: flex-end;
   margin-right: 5px;
 }
-
 </style>
diff --git a/frontend/src/components/IntervalTab/index.vue b/frontend/src/components/IntervalTab/index.vue
index 75e2b752..8eeba257 100644
--- a/frontend/src/components/IntervalTab/index.vue
+++ b/frontend/src/components/IntervalTab/index.vue
@@ -1,33 +1,58 @@
 <template>
-  <el-form :model="crontabValueObj" ref="formRef" label-width="auto" label-suffix=":" :inline="true" class="interval-tab-form">
+  <el-form
+    ref="formRef"
+    :model="crontabValueObj"
+    label-width="auto"
+    label-suffix=":"
+    :inline="true"
+    class="interval-tab-form"
+  >
     <el-form-item label="秒" prop="second" class="form-item">
       <el-select v-model="crontabValueObj.second" placeholder="秒" clearable>
         <el-option label="每秒" value="*">*</el-option>
-        <el-option v-for="second in seconds" :key="second" :label="second" :value="second.toString()">{{ second }}</el-option>
+        <el-option
+          v-for="second in seconds"
+          :key="second"
+          :label="second"
+          :value="second.toString()"
+        >
+          {{ second }}
+        </el-option>
       </el-select>
     </el-form-item>
     <el-form-item label="分" prop="min" class="form-item">
       <el-select v-model="crontabValueObj.min" placeholder="分" clearable>
         <el-option label="每分" value="*">*</el-option>
-        <el-option v-for="min in minutes" :key="min" :label="min" :value="min.toString()">{{min}}</el-option>
+        <el-option v-for="min in minutes" :key="min" :label="min" :value="min.toString()">
+          {{ min }}
+        </el-option>
       </el-select>
     </el-form-item>
     <el-form-item label="时" prop="hour" class="form-item">
       <el-select v-model="crontabValueObj.hour" placeholder="时" clearable>
         <el-option label="每时" value="*">*</el-option>
-        <el-option v-for="hour in hours" :key="hour" :label="hour" :value="hour.toString()">{{hour}}</el-option>
+        <el-option v-for="hour in hours" :key="hour" :label="hour" :value="hour.toString()">
+          {{ hour }}
+        </el-option>
       </el-select>
     </el-form-item>
     <el-form-item label="天" prop="day" class="form-item">
       <el-select v-model="crontabValueObj.day" placeholder="天" clearable>
         <el-option label="每天" value="*">*</el-option>
-        <el-option v-for="day in days" :key="day" :label="day" :value="day">{{day}}</el-option>
+        <el-option v-for="day in days" :key="day" :label="day" :value="day">{{ day }}</el-option>
       </el-select>
     </el-form-item>
     <el-form-item label="周" prop="week" class="form-item">
       <el-select v-model="crontabValueObj.week" placeholder="周" clearable>
         <el-option label="每周" value="*">*</el-option>
-        <el-option v-for="week in weekOptions" :key="week.value" :label="week.label" :value="week.value">{{week.label}}</el-option>
+        <el-option
+          v-for="week in weekOptions"
+          :key="week.value"
+          :label="week.label"
+          :value="week.value"
+        >
+          {{ week.label }}
+        </el-option>
       </el-select>
     </el-form-item>
 
@@ -39,7 +64,6 @@
 </template>
 
 <script lang="ts" setup>
-
 // 定义接口，增强类型安全
 interface CrontabValue {
   second: string;
@@ -61,8 +85,8 @@ const props = defineProps<{
 
 // 定义emits
 const emit = defineEmits<{
-  (e: 'confirm', value: string): void;
-  (e: 'cancel'): void;
+  (e: "confirm", value: string): void;
+  (e: "cancel"): void;
 }>();
 
 const formRef = ref();
@@ -94,7 +118,7 @@ const weekOptions: WeekOption[] = [
   { value: "4", label: "周四" },
   { value: "5", label: "周五" },
   { value: "6", label: "周六" },
-  { value: "7", label: "周日" }
+  { value: "7", label: "周日" },
 ];
 
 // 初始化时设置cron值
@@ -109,30 +133,30 @@ const handleConfirm = () => {
   // 简单验证
   const obj = crontabValueObj.value;
   if (!obj.second || !obj.min || !obj.hour || !obj.day || !obj.week) {
-    ElMessage.warning('请完善所有时间选项');
+    ElMessage.warning("请完善所有时间选项");
     return;
   }
 
   const cronStr = `${obj.second} ${obj.min} ${obj.hour} ${obj.day} ${obj.week}`;
-  emit('confirm', cronStr);
+  emit("confirm", cronStr);
 };
 
 // 设置cron表达式的值
 const setCron = (cronStr: string) => {
   if (!cronStr) return;
-  const parts = cronStr.split(' ');
+  const parts = cronStr.split(" ");
   if (parts.length !== 5) {
-    ElMessage.warning('无效的cron表达式格式');
+    ElMessage.warning("无效的cron表达式格式");
     return;
   }
 
   const [second, min, hour, day, week] = parts;
   crontabValueObj.value = {
-    second: second || '*',
-    min: min || '*',
-    hour: hour || '*',
-    day: day || '*',
-    week: week || '*'
+    second: second || "*",
+    min: min || "*",
+    hour: hour || "*",
+    day: day || "*",
+    week: week || "*",
   };
 };
 
@@ -172,4 +196,4 @@ defineExpose({ setCron });
     width: calc(50% - 8px);
   }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/frontend/src/components/JsonPretty/index.vue b/frontend/src/components/JsonPretty/index.vue
index 967f9606..1fd5b70f 100644
--- a/frontend/src/components/JsonPretty/index.vue
+++ b/frontend/src/components/JsonPretty/index.vue
@@ -13,18 +13,18 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue';
-import VueJsonPretty from 'vue-json-pretty';
-import 'vue-json-pretty/lib/styles.css';
+import { computed } from "vue";
+import VueJsonPretty from "vue-json-pretty";
+import "vue-json-pretty/lib/styles.css";
 
 const props = defineProps({
-  value: { type: [String, Object, Array, Number, Boolean], default: '' },
-  height: { type: String, default: '240px' },
+  value: { type: [String, Object, Array, Number, Boolean], default: "" },
+  height: { type: String, default: "240px" },
 });
 
 const parsed = computed(() => {
   const v: any = props.value;
-  if (typeof v === 'string') {
+  if (typeof v === "string") {
     try {
       return JSON.parse(v);
     } catch {
@@ -34,10 +34,10 @@ const parsed = computed(() => {
   return v;
 });
 
-const isJson = computed(() => typeof parsed.value === 'object' && parsed.value !== null);
+const isJson = computed(() => typeof parsed.value === "object" && parsed.value !== null);
 const displayText = computed(() => {
   const v: any = props.value;
-  return typeof v === 'string' ? v : JSON.stringify(v, null, 2);
+  return typeof v === "string" ? v : JSON.stringify(v, null, 2);
 });
 </script>
 
@@ -54,7 +54,9 @@ const displayText = computed(() => {
   white-space: pre-wrap;
   word-break: break-word;
   margin: 0;
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-family:
+    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
+    monospace;
   font-size: 12px;
 }
 </style>
diff --git a/frontend/src/components/MenuSearch/index.vue b/frontend/src/components/MenuSearch/index.vue
index 4fd06e7e..2036b54d 100644
--- a/frontend/src/components/MenuSearch/index.vue
+++ b/frontend/src/components/MenuSearch/index.vue
@@ -296,7 +296,8 @@ function loadRoutes(routes: RouteRecordRaw[], parentPath = "") {
       : `${parentPath}${parentPath.endsWith("/") ? "" : "/"}${route.path}`;
 
     // 检查是否需要排除
-    if (excludedRoutes.value.includes(route.path) || isExternal(route.path) || route.meta?.hidden) return;
+    if (excludedRoutes.value.includes(route.path) || isExternal(route.path) || route.meta?.hidden)
+      return;
 
     // 处理有子路由的情况
     if (route.children) {
@@ -316,7 +317,7 @@ function loadRoutes(routes: RouteRecordRaw[], parentPath = "") {
       }
       // 递归处理子路由
       loadRoutes(route.children, path);
-    } 
+    }
     // 处理没有子路由但有title的情况
     else if (route.meta?.title) {
       const title = route.meta.title === "dashboard" ? "首页" : route.meta.title;
diff --git a/frontend/src/components/Notification/index.vue b/frontend/src/components/Notification/index.vue
index c5887c7f..56866001 100644
--- a/frontend/src/components/Notification/index.vue
+++ b/frontend/src/components/Notification/index.vue
@@ -13,11 +13,11 @@
           <div v-for="(item, index) in noticeList" :key="index" class="w-400px py-3">
             <div class="flex-y-center">
               <el-tag :type="item.notice_type === '1' ? 'primary' : 'warning'">
-                {{ item.notice_type === '1' ? '通知' : '公告' }}
+                {{ item.notice_type === "1" ? "通知" : "公告" }}
               </el-tag>
 
               <!-- truncated: 超出部分省略 -->
-              <el-text size="small" class="w-200px cursor-pointer !ml-2 !flex-1" truncated > 
+              <el-text size="small" class="w-200px cursor-pointer !ml-2 !flex-1" truncated>
                 {{ item.notice_content }}
               </el-text>
 
@@ -28,7 +28,7 @@
             </div>
           </div>
           <el-divider />
-          
+
           <div class="flex-x-between">
             <el-link type="primary" underline="never" @click="handleViewMoreNotice">
               <span class="text-xs">查看更多</span>
@@ -36,7 +36,12 @@
                 <ArrowRight />
               </el-icon>
             </el-link>
-            <el-link v-if="noticeList.length > 0" type="primary" underline="never" @click="handleMarkAllAsRead">
+            <el-link
+              v-if="noticeList.length > 0"
+              type="primary"
+              underline="never"
+              @click="handleMarkAllAsRead"
+            >
               <span class="text-xs">全部已读</span>
             </el-link>
           </div>
@@ -50,7 +55,12 @@
     </template>
   </el-dropdown>
 
-  <el-dialog v-model="noticeDialogVisible" :title="noticeDetail?.notice_title ?? '通知详情'" width="800px" custom-class="notification-detail">
+  <el-dialog
+    v-model="noticeDialogVisible"
+    :title="noticeDetail?.notice_title ?? '通知详情'"
+    width="800px"
+    custom-class="notification-detail"
+  >
     <div v-if="noticeDetail" class="p-x-20px">
       <div class="flex-y-center mb-16px text-13px text-color-secondary">
         <span class="flex-y-center">
@@ -89,7 +99,7 @@ const noticeDetail = ref<NoticeTable | null>(null);
  * 获取我的通知公告
  */
 async function featchMyNotice() {
-  await noticeStore.getNotice()
+  await noticeStore.getNotice();
   noticeList.value = noticeStore.noticeList;
 }
 
@@ -100,7 +110,9 @@ function handleViewMoreNotice() {
 
 // 全部已读：将这些公告禁用（status=false），刷新后不再出现
 function handleMarkAllAsRead() {
-  const ids = noticeList.value.map((item) => item.id).filter((id): id is number => id !== undefined);
+  const ids = noticeList.value
+    .map((item) => item.id)
+    .filter((id): id is number => id !== undefined);
   NoticeAPI.batchAvailableNotice({ ids, status: false }).then(async () => {
     await noticeStore.getNotice();
     noticeList.value = noticeStore.noticeList;
@@ -110,8 +122,6 @@ function handleMarkAllAsRead() {
 onMounted(() => {
   featchMyNotice();
 });
-
-
 </script>
 
 <style lang="scss" scoped></style>
diff --git a/frontend/src/components/OperationColumn/index.vue b/frontend/src/components/OperationColumn/index.vue
index b5d007ea..eb5c1354 100644
--- a/frontend/src/components/OperationColumn/index.vue
+++ b/frontend/src/components/OperationColumn/index.vue
@@ -49,8 +49,8 @@ const calculateWidth = () => {
 
 // 计算最终宽度
 const finalWidth = computed(() => {
-  const widthNum = typeof props.width === 'number' ? props.width : Number(props.width);
-  const minWidthNum = typeof props.minWidth === 'number' ? props.minWidth : Number(props.minWidth);
+  const widthNum = typeof props.width === "number" ? props.width : Number(props.width);
+  const minWidthNum = typeof props.minWidth === "number" ? props.minWidth : Number(props.minWidth);
   return widthNum || operationWidth.value || minWidthNum;
 });
 
diff --git a/frontend/src/components/SizeSelect/index.vue b/frontend/src/components/SizeSelect/index.vue
index e4993724..a329289d 100644
--- a/frontend/src/components/SizeSelect/index.vue
+++ b/frontend/src/components/SizeSelect/index.vue
@@ -1,4 +1,4 @@
-  <!-- 布局大小 -->
+<!-- 布局大小 -->
 <template>
   <el-tooltip :content="t('sizeSelect.tooltip')" effect="dark" placement="bottom">
     <el-dropdown trigger="click" @command="handleSizeChange">
diff --git a/frontend/src/components/TableSelect/index.vue b/frontend/src/components/TableSelect/index.vue
index fc992d1d..aeed5054 100644
--- a/frontend/src/components/TableSelect/index.vue
+++ b/frontend/src/components/TableSelect/index.vue
@@ -35,7 +35,7 @@
       <!-- 弹出框内容 -->
       <div ref="popoverContentRef">
         <!-- 表单 -->
-        <el-form ref="formRef" :model="queryParams" :inline="true" >
+        <el-form ref="formRef" :model="queryParams" :inline="true">
           <template v-for="item in selectConfig.formItems" :key="item.prop">
             <el-form-item :label="item.label" :prop="item.prop">
               <!-- Input 输入框 -->
@@ -156,7 +156,9 @@ export interface ISelectConfig<T = any> {
   // 占位符
   placeholder?: string;
   // popover组件属性
-  popover?: Partial<Omit<PopoverProps, "visible" | "v-model:visible">> & { width?: number | string };
+  popover?: Partial<Omit<PopoverProps, "visible" | "v-model:visible">> & {
+    width?: number | string;
+  };
   // 列表的网络请求函数(需返回promise)
   indexAction: (_queryParams: T) => Promise<any>;
   // 主键名(跨页选择必填,默认为id)
diff --git a/frontend/src/components/Upload/SingleImageUpload.vue b/frontend/src/components/Upload/SingleImageUpload.vue
index e2852fc9..9cd1cf1b 100644
--- a/frontend/src/components/Upload/SingleImageUpload.vue
+++ b/frontend/src/components/Upload/SingleImageUpload.vue
@@ -25,9 +25,9 @@
             :preview-teleported="true"
             @click.stop="handleImageClick"
           />
-          <el-icon 
-            v-if="!props.disabled" 
-            class="single-upload__delete-btn" 
+          <el-icon
+            v-if="!props.disabled"
+            class="single-upload__delete-btn"
             @click.stop="handleDelete"
           >
             <CircleCloseFilled />
@@ -49,7 +49,7 @@
 <script setup lang="ts">
 import { ref, watch } from "vue";
 import { UploadRawFile, UploadRequestOptions, ElMessage, type UploadUserFile } from "element-plus";
-import ParamsAPI from '@/api/module_system/params';
+import ParamsAPI from "@/api/module_system/params";
 
 const props = defineProps({
   /**
@@ -96,7 +96,7 @@ const props = defineProps({
       };
     },
   },
-  
+
   /**
    * 是否禁用
    */
@@ -104,7 +104,7 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
-  
+
   /**
    * 是否显示提示信息
    */
@@ -112,7 +112,7 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
-  
+
   /**
    * 提示文本
    */
@@ -120,7 +120,7 @@ const props = defineProps({
     type: String,
     default: "",
   },
-  
+
   /**
    * 是否启用图片预览功能
    */
@@ -143,10 +143,12 @@ watch(
   () => modelValue.value,
   (newVal) => {
     if (newVal) {
-      internalFileList.value = [{
-        name: newVal.split('/').pop() || 'image',
-        url: newVal
-      }];
+      internalFileList.value = [
+        {
+          name: newVal.split("/").pop() || "image",
+          url: newVal,
+        },
+      ];
     } else {
       internalFileList.value = [];
     }
@@ -171,10 +173,10 @@ watch(
  * 定义组件触发的事件
  */
 const emit = defineEmits<{
-  (e: 'success', fileInfo: UploadFilePath): void;
-  (e: 'error', error: any): void;
-  (e: 'input', value: string): void;
-  (e: 'update:modelValue', value: string): void;
+  (e: "success", fileInfo: UploadFilePath): void;
+  (e: "error", error: any): void;
+  (e: "input", value: string): void;
+  (e: "update:modelValue", value: string): void;
 }>();
 
 /**
@@ -218,7 +220,7 @@ async function handleUpload(options: UploadRequestOptions) {
   try {
     const file = options.file;
     const formData = new FormData();
-    
+
     formData.append(props.name, file);
 
     // 处理附加参数
@@ -234,7 +236,7 @@ async function handleUpload(options: UploadRequestOptions) {
       onSuccess(fileInfo);
       return fileInfo;
     } else {
-      const errorMsg = response.data.msg || '上传失败';
+      const errorMsg = response.data.msg || "上传失败";
       ElMessage.error(errorMsg);
       throw new Error(errorMsg);
     }
@@ -259,9 +261,14 @@ function handleDelete() {
 function handleImageClick(event: Event) {
   // 阻止事件冒泡
   event.stopPropagation();
-  
+
   // 如果启用了预览功能，则触发预览
-  if (props.enablePreview && internalFileList.value && internalFileList.value.length > 0 && internalFileList.value[0].url) {
+  if (
+    props.enablePreview &&
+    internalFileList.value &&
+    internalFileList.value.length > 0 &&
+    internalFileList.value[0].url
+  ) {
     // Element Plus的el-image组件会自动处理preview-src-list的预览功能
     // 这里只需要阻止冒泡即可
   }
@@ -274,17 +281,19 @@ function handleImageClick(event: Event) {
  */
 const onSuccess = (fileInfo: UploadFilePath) => {
   // 更新绑定的值为文件URL
-  const newFileList = [{
-    name: fileInfo.file_name,
-    url: fileInfo.file_url
-  }];
-  
+  const newFileList = [
+    {
+      name: fileInfo.file_name,
+      url: fileInfo.file_url,
+    },
+  ];
+
   internalFileList.value = newFileList;
-  
+
   // 触发事件
-  emit('success', fileInfo);
-  emit('input', fileInfo.file_url);
-  emit('update:modelValue', fileInfo.file_url);
+  emit("success", fileInfo);
+  emit("input", fileInfo.file_url);
+  emit("update:modelValue", fileInfo.file_url);
 };
 
 /**
@@ -292,8 +301,8 @@ const onSuccess = (fileInfo: UploadFilePath) => {
  */
 const onError = (error: any) => {
   console.error("图片上传失败:", error);
-  ElMessage.error('图片上传失败，请重试');
-  emit('error', error);
+  ElMessage.error("图片上传失败，请重试");
+  emit("error", error);
 };
 </script>
 
@@ -308,7 +317,7 @@ const onError = (error: any) => {
   position: relative;
   width: v-bind("props.style.width ?? '150px'");
   height: v-bind("props.style.height ?? '150px'");
-  
+
   &:hover {
     .single-upload__delete-btn {
       display: block;
@@ -337,7 +346,7 @@ const onError = (error: any) => {
       color: #ff4500;
     }
   }
-  
+
   &__add-btn {
     font-size: 28px;
     color: #8c939d;
diff --git a/frontend/src/components/WangEditor/index.vue b/frontend/src/components/WangEditor/index.vue
index 1eaadc5f..b28b1260 100644
--- a/frontend/src/components/WangEditor/index.vue
+++ b/frontend/src/components/WangEditor/index.vue
@@ -50,10 +50,10 @@ const FileAPI = {
     // 这里应该是实际的文件上传逻辑
     // 暂时返回一个mock数据
     return Promise.resolve({
-      url: 'https://example.com/image.jpg',
-      name: file.name
+      url: "https://example.com/image.jpg",
+      name: file.name,
     });
-  }
+  },
 };
 
 defineProps({
diff --git a/frontend/src/directives/permission/index.ts b/frontend/src/directives/permission/index.ts
index 49d67380..245dcbe2 100644
--- a/frontend/src/directives/permission/index.ts
+++ b/frontend/src/directives/permission/index.ts
@@ -21,7 +21,10 @@ export const hasPerm: Directive = {
     const userPrems = useUserStore().prems;
 
     // 超级管理员拥有所有权限，如果是"*:*:*"权限标识，则不需要进行权限校验
-    if ((roles && roles.map((role) => role.code).includes(ROLE_ROOT)) || requiredPerms.includes("*:*:*")) {
+    if (
+      (roles && roles.map((role) => role.code).includes(ROLE_ROOT)) ||
+      requiredPerms.includes("*:*:*")
+    ) {
       return;
     }
 
@@ -55,8 +58,12 @@ export const hasRole: Directive = {
 
     // 检查是否有对应角色权限
     const hasAuth = Array.isArray(requiredRoles)
-      ? requiredRoles.some((role) => roles ? roles.map((role) => role.code).includes(role) : false)
-      : roles ? roles.map((role) => role.code).includes(requiredRoles) : false;
+      ? requiredRoles.some((role) =>
+          roles ? roles.map((role) => role.code).includes(role) : false
+        )
+      : roles
+        ? roles.map((role) => role.code).includes(requiredRoles)
+        : false;
 
     // 如果没有权限，移除元素
     if (!hasAuth && el.parentNode) {
diff --git a/frontend/src/enums/api/result.enum.ts b/frontend/src/enums/api/result.enum.ts
index c95d2e27..57666691 100644
--- a/frontend/src/enums/api/result.enum.ts
+++ b/frontend/src/enums/api/result.enum.ts
@@ -24,5 +24,4 @@ export const enum ResultEnum {
    * 令牌已过期
    */
   TOKEN_EXPIRED = 10401,
-
 }
diff --git a/frontend/src/lang/package/en.ts b/frontend/src/lang/package/en.ts
index a3e76049..4b7315b5 100644
--- a/frontend/src/lang/package/en.ts
+++ b/frontend/src/lang/package/en.ts
@@ -16,53 +16,53 @@ export default {
     back: "Back",
     close: "Close",
     refresh: "Refresh",
-    inputText: 'Please enter',
-    selectText: 'Please select',
-    startTimeText: 'Start Time',
-    endTimeText: 'End Time',
-    login: 'Login',
-    required: 'This field is required',
-    loginOut: 'Logout',
-    document: 'Project Documentation',
-    reminder: 'Reminder',
-    loginOutMessage: 'Are you sure you want to log out?',
-    ok: 'OK',
-    reload: 'Reload',
-    closeTab: 'Close Tab',
-    closeTheLeftTab: 'Close Left Tabs',
-    closeTheRightTab: 'Close Right Tabs',
-    closeOther: 'Close Other Tabs',
-    closeAll: 'Close All Tabs',
-    prevLabel: 'Previous',
-    nextLabel: 'Next',
-    skipLabel: 'Skip',
-    doneLabel: 'Done',
-    menu: 'Menu',
-    menuDes: 'Menu rendered based on route structure',
-    collapse: 'Collapse/Expand',
-    collapseDes: 'Expand and collapse the menu bar',
-    tagsView: 'Tags View',
-    tagsViewDes: 'Used to record route history',
-    tool: 'Tool',
-    toolDes: 'Used to customize system settings',
-    shrink: 'Collapse',
-    expand: 'Expand',
-    delMessage: 'Delete selected data?',
-    delWarning: 'Warning',
-    delOk: 'OK',
-    delCancel: 'Cancel',
-    delNoData: 'Please select data to delete',
-    delSuccess: 'Deleted successfully',
-    fullscreen: 'Fullscreen',
-    size: 'Size',
-    columnSetting: 'Column Settings',
-    lengthRange: 'Length must be between {min} and {max} characters',
-    notSpace: 'Cannot contain spaces',
-    notSpecialCharacters: 'Cannot contain special characters',
-    isEqual: 'The two inputs are inconsistent',
-    setting: 'Settings',
-    copySuccess: 'Copy successfully',
-    copyFailed: 'Copy failed',
+    inputText: "Please enter",
+    selectText: "Please select",
+    startTimeText: "Start Time",
+    endTimeText: "End Time",
+    login: "Login",
+    required: "This field is required",
+    loginOut: "Logout",
+    document: "Project Documentation",
+    reminder: "Reminder",
+    loginOutMessage: "Are you sure you want to log out?",
+    ok: "OK",
+    reload: "Reload",
+    closeTab: "Close Tab",
+    closeTheLeftTab: "Close Left Tabs",
+    closeTheRightTab: "Close Right Tabs",
+    closeOther: "Close Other Tabs",
+    closeAll: "Close All Tabs",
+    prevLabel: "Previous",
+    nextLabel: "Next",
+    skipLabel: "Skip",
+    doneLabel: "Done",
+    menu: "Menu",
+    menuDes: "Menu rendered based on route structure",
+    collapse: "Collapse/Expand",
+    collapseDes: "Expand and collapse the menu bar",
+    tagsView: "Tags View",
+    tagsViewDes: "Used to record route history",
+    tool: "Tool",
+    toolDes: "Used to customize system settings",
+    shrink: "Collapse",
+    expand: "Expand",
+    delMessage: "Delete selected data?",
+    delWarning: "Warning",
+    delOk: "OK",
+    delCancel: "Cancel",
+    delNoData: "Please select data to delete",
+    delSuccess: "Deleted successfully",
+    fullscreen: "Fullscreen",
+    size: "Size",
+    columnSetting: "Column Settings",
+    lengthRange: "Length must be between {min} and {max} characters",
+    notSpace: "Cannot contain spaces",
+    notSpecialCharacters: "Cannot contain special characters",
+    isEqual: "The two inputs are inconsistent",
+    setting: "Settings",
+    copySuccess: "Copy successfully",
+    copyFailed: "Copy failed",
   },
   // Menu internationalization
   route: {
@@ -113,7 +113,7 @@ export default {
       },
       agree: {
         required: "Please agree to the User Agreement",
-      }
+      },
     },
     otherLoginMethods: "Other",
     resetPassword: "Reset password",
@@ -132,8 +132,8 @@ export default {
     logout: "Logout",
     document: "Document",
     gitee: "Gitee",
-    lock: 'Lock',
-    unlock: 'Unlock',
+    lock: "Lock",
+    unlock: "Unlock",
     profile: "User Profile",
     config: "Config Center",
     tour: "Project Tour",
@@ -143,16 +143,16 @@ export default {
     closeRight: "Close Right",
     closeOther: "Close Other",
     closeAll: "Close All",
-    refreshCache: 'Refresh Cache',
+    refreshCache: "Refresh Cache",
   },
-    lock: {
-    lockScreen: 'Lock screen',
-    lockPassword: 'Lock screen password',
-    unlock: 'Click to unlock',
-    backToLogin: 'Back to login',
-    entrySystem: 'Entry the system',
-    placeholder: 'Please enter the lock screen password',
-    message: 'Lock screen password error'
+  lock: {
+    lockScreen: "Lock screen",
+    lockPassword: "Lock screen password",
+    unlock: "Click to unlock",
+    backToLogin: "Back to login",
+    entrySystem: "Entry the system",
+    placeholder: "Please enter the lock screen password",
+    message: "Lock screen password error",
   },
   sizeSelect: {
     tooltip: "Layout Size",
@@ -208,8 +208,8 @@ export default {
   },
   error: {
     noPermission: `Sorry, you don't have permission to access this page.`,
-    pageError: 'Sorry, the page you visited does not exist.',
-    networkError: 'Sorry, the server reported an error.',
-    returnToHome: 'Return to home'
+    pageError: "Sorry, the page you visited does not exist.",
+    networkError: "Sorry, the server reported an error.",
+    returnToHome: "Return to home",
   },
 };
diff --git a/frontend/src/lang/package/zh-cn.ts b/frontend/src/lang/package/zh-cn.ts
index 80db419e..7c76524b 100644
--- a/frontend/src/lang/package/zh-cn.ts
+++ b/frontend/src/lang/package/zh-cn.ts
@@ -16,53 +16,53 @@ export default {
     back: "返回",
     close: "关闭",
     refresh: "刷新",
-    inputText: '请输入',
-    selectText: '请选择',
-    startTimeText: '开始时间',
-    endTimeText: '结束时间',
-    login: '登录',
-    required: '该项为必填项',
-    loginOut: '退出系统',
-    document: '项目文档',
-    reminder: '温馨提示',
-    loginOutMessage: '是否退出本系统？',
-    ok: '确定',
-    reload: '重新加载',
-    closeTab: '关闭标签页',
-    closeTheLeftTab: '关闭左侧标签页',
-    closeTheRightTab: '关闭右侧标签页',
-    closeOther: '关闭其它标签页',
-    closeAll: '关闭全部标签页',
-    prevLabel: '上一步',
-    nextLabel: '下一步',
-    skipLabel: '跳过',
-    doneLabel: '结束',
-    menu: '菜单',
-    menuDes: '以路由的结构渲染的菜单栏',
-    collapse: '展开缩收',
-    collapseDes: '展开和缩放菜单栏',
-    tagsView: '标签页',
-    tagsViewDes: '用于记录路由历史记录',
-    tool: '工具',
-    toolDes: '用于设置定制系统',
-    shrink: '收起',
-    expand: '展开',
-    delMessage: '是否删除所选中数据？',
-    delWarning: '提示',
-    delOk: '确定',
-    delCancel: '取消',
-    delNoData: '请选择需要删除的数据',
-    delSuccess: '删除成功',
-    fullscreen: '全屏',
-    size: '尺寸',
-    columnSetting: '列设置',
-    lengthRange: '长度在 {min} 到 {max} 个字符',
-    notSpace: '不能包含空格',
-    notSpecialCharacters: '不能包含特殊字符',
-    isEqual: '两次输入不一致',
-    setting: '设置',
-    copySuccess: '复制成功',
-    copyFailed: '复制失败',
+    inputText: "请输入",
+    selectText: "请选择",
+    startTimeText: "开始时间",
+    endTimeText: "结束时间",
+    login: "登录",
+    required: "该项为必填项",
+    loginOut: "退出系统",
+    document: "项目文档",
+    reminder: "温馨提示",
+    loginOutMessage: "是否退出本系统？",
+    ok: "确定",
+    reload: "重新加载",
+    closeTab: "关闭标签页",
+    closeTheLeftTab: "关闭左侧标签页",
+    closeTheRightTab: "关闭右侧标签页",
+    closeOther: "关闭其它标签页",
+    closeAll: "关闭全部标签页",
+    prevLabel: "上一步",
+    nextLabel: "下一步",
+    skipLabel: "跳过",
+    doneLabel: "结束",
+    menu: "菜单",
+    menuDes: "以路由的结构渲染的菜单栏",
+    collapse: "展开缩收",
+    collapseDes: "展开和缩放菜单栏",
+    tagsView: "标签页",
+    tagsViewDes: "用于记录路由历史记录",
+    tool: "工具",
+    toolDes: "用于设置定制系统",
+    shrink: "收起",
+    expand: "展开",
+    delMessage: "是否删除所选中数据？",
+    delWarning: "提示",
+    delOk: "确定",
+    delCancel: "取消",
+    delNoData: "请选择需要删除的数据",
+    delSuccess: "删除成功",
+    fullscreen: "全屏",
+    size: "尺寸",
+    columnSetting: "列设置",
+    lengthRange: "长度在 {min} 到 {max} 个字符",
+    notSpace: "不能包含空格",
+    notSpecialCharacters: "不能包含特殊字符",
+    isEqual: "两次输入不一致",
+    setting: "设置",
+    copySuccess: "复制成功",
+    copyFailed: "复制失败",
   },
   // 菜单国际化
   route: {
@@ -113,7 +113,7 @@ export default {
       },
       agree: {
         required: "请先勾选同意用户协议",
-      }
+      },
     },
     otherLoginMethods: "其他",
     resetPassword: "重置密码",
@@ -132,8 +132,8 @@ export default {
     logout: "退出登录",
     document: "项目文档",
     gitee: "项目地址",
-    lock: '锁定屏幕',
-    unlock: '解锁屏幕',
+    lock: "锁定屏幕",
+    unlock: "解锁屏幕",
     profile: "个人中心",
     config: "配置中心",
     tour: "项目引导",
@@ -143,17 +143,17 @@ export default {
     closeRight: "关闭右侧",
     closeOther: "关闭其他",
     closeAll: "关闭所有",
-    refreshCache: '刷新缓存',
+    refreshCache: "刷新缓存",
   },
   lock: {
-    lockScreen: '锁定屏幕',
-    lockPassword: '锁屏密码',
-    unlock: '点击解锁',
-    backToLogin: '返回登录',
-    entrySystem: '进入系统',
-    placeholder: '请输入锁屏密码',
-    required: '请输入必填项',
-    message: '锁屏密码错误'
+    lockScreen: "锁定屏幕",
+    lockPassword: "锁屏密码",
+    unlock: "点击解锁",
+    backToLogin: "返回登录",
+    entrySystem: "进入系统",
+    placeholder: "请输入锁屏密码",
+    required: "请输入必填项",
+    message: "锁屏密码错误",
   },
   sizeSelect: {
     tooltip: "布局大小",
@@ -210,8 +210,8 @@ export default {
   },
   error: {
     noPermission: `抱歉，您无权访问此页面。`,
-    pageError: '抱歉，您访问的页面不存在。',
-    networkError: '抱歉，服务器报告错误。',
-    returnToHome: '返回首页'
+    pageError: "抱歉，您访问的页面不存在。",
+    networkError: "抱歉，服务器报告错误。",
+    returnToHome: "返回首页",
   },
 };
diff --git a/frontend/src/layouts/components/Menu/MixTopMenu.vue b/frontend/src/layouts/components/Menu/MixTopMenu.vue
index ea471b7e..2b0d11b5 100644
--- a/frontend/src/layouts/components/Menu/MixTopMenu.vue
+++ b/frontend/src/layouts/components/Menu/MixTopMenu.vue
@@ -58,51 +58,53 @@ const topMenus = ref<RouteRecordRaw[]>([]);
 
 // 处理后的顶部菜单列表 - 智能显示唯一子菜单的标题
 const processedTopMenus = computed(() => {
-  return topMenus.value
-    .map((route) => {
-      // 如果路由本身设置了hidden=true，直接返回null
-      if (route.meta?.hidden === true) {
-        return null;
-      }
-
-      // 如果路由设置了 alwaysShow=true，或者没有子菜单，直接返回原路由
-      if (route.meta?.alwaysShow || !route.children || route.children.length === 0) {
-        return route;
-      }
-
-      // 过滤出非隐藏的子菜单
-      const visibleChildren = route.children.filter((child) => !child.meta?.hidden);
-
-      // 如果没有可见子菜单，返回null
-      if (visibleChildren.length === 0) {
-        return null;
-      }
-
-      // 如果只有一个非隐藏的子菜单，显示子菜单的信息
-      if (visibleChildren.length === 1) {
-        const onlyChild = visibleChildren[0];
-        // 检查子菜单是否应该显示在顶部菜单
-        if (onlyChild.meta?.hidden !== true) {
-          return {
-            ...route,
-            meta: {
-              ...route.meta,
-              title: onlyChild.meta?.title || route.meta?.title,
-              icon: onlyChild.meta?.icon || route.meta?.icon,
-            },
-            // 使用子菜单的path确保路由匹配正确
-            path: onlyChild.path
-          };
+  return (
+    topMenus.value
+      .map((route) => {
+        // 如果路由本身设置了hidden=true，直接返回null
+        if (route.meta?.hidden === true) {
+          return null;
         }
-        // 如果子菜单应该隐藏，则不显示该顶级菜单
-        return null;
-      }
 
-      // 其他情况返回原路由
-      return route;
-    })
-    // 过滤掉null值
-    .filter((route) => route !== null);
+        // 如果路由设置了 alwaysShow=true，或者没有子菜单，直接返回原路由
+        if (route.meta?.alwaysShow || !route.children || route.children.length === 0) {
+          return route;
+        }
+
+        // 过滤出非隐藏的子菜单
+        const visibleChildren = route.children.filter((child) => !child.meta?.hidden);
+
+        // 如果没有可见子菜单，返回null
+        if (visibleChildren.length === 0) {
+          return null;
+        }
+
+        // 如果只有一个非隐藏的子菜单，显示子菜单的信息
+        if (visibleChildren.length === 1) {
+          const onlyChild = visibleChildren[0];
+          // 检查子菜单是否应该显示在顶部菜单
+          if (onlyChild.meta?.hidden !== true) {
+            return {
+              ...route,
+              meta: {
+                ...route.meta,
+                title: onlyChild.meta?.title || route.meta?.title,
+                icon: onlyChild.meta?.icon || route.meta?.icon,
+              },
+              // 使用子菜单的path确保路由匹配正确
+              path: onlyChild.path,
+            };
+          }
+          // 如果子菜单应该隐藏，则不显示该顶级菜单
+          return null;
+        }
+
+        // 其他情况返回原路由
+        return route;
+      })
+      // 过滤掉null值
+      .filter((route) => route !== null)
+  );
 });
 
 /**
diff --git a/frontend/src/layouts/components/NavBar/components/LockDialog.vue b/frontend/src/layouts/components/NavBar/components/LockDialog.vue
index a97b128d..d9aa34a3 100644
--- a/frontend/src/layouts/components/NavBar/components/LockDialog.vue
+++ b/frontend/src/layouts/components/NavBar/components/LockDialog.vue
@@ -13,7 +13,7 @@
       <!-- <span class="lock-dialog-name">{{ t('navbar.lock') }}</span> -->
       <span class="lock-dialog-name">{{ userStore.basicInfo.name }}</span>
     </div>
-    <el-form ref="lockFormRef" :model="form" :rules="rules" >
+    <el-form ref="lockFormRef" :model="form" :rules="rules">
       <el-form-item :label="t('lock.lockPassword')" prop="password">
         <el-input
           v-model="form.password"
@@ -25,63 +25,61 @@
       </el-form-item>
     </el-form>
     <template #footer>
-      <el-button type="primary" @click="handleLock">{{ t('navbar.lock') }}</el-button>
+      <el-button type="primary" @click="handleLock">{{ t("navbar.lock") }}</el-button>
     </template>
   </el-dialog>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed } from 'vue'
-import { useLockStore } from '@/store'
-import { useI18n } from 'vue-i18n'
-import type { FormInstance, FormRules } from 'element-plus'
+import { ref, reactive, computed } from "vue";
+import { useLockStore } from "@/store";
+import { useI18n } from "vue-i18n";
+import type { FormInstance, FormRules } from "element-plus";
 
 import { useUserStore } from "@/store/modules/user.store";
 const userStore = useUserStore();
 
-const { t } = useI18n()
-const lockStore = useLockStore()
+const { t } = useI18n();
+const lockStore = useLockStore();
 
 const props = defineProps({
   modelValue: {
-    type: Boolean
-  }
-})
+    type: Boolean,
+  },
+});
 
-const emit = defineEmits(['update:modelValue'])
+const emit = defineEmits(["update:modelValue"]);
 
 const dialogVisible = computed({
   get: () => props.modelValue,
   set: (val) => {
-    emit('update:modelValue', val)
-  }
-})
+    emit("update:modelValue", val);
+  },
+});
 
-const dialogTitle = ref(t('lock.lockScreen'))
-const lockFormRef = ref<FormInstance>()
+const dialogTitle = ref(t("lock.lockScreen"));
+const lockFormRef = ref<FormInstance>();
 const form = reactive({
-  password: ''
-})
+  password: "",
+});
 
 const rules: FormRules = {
-  password: [
-    { required: true, message: t('lock.required'), trigger: 'blur' }
-  ]
-}
+  password: [{ required: true, message: t("lock.required"), trigger: "blur" }],
+};
 
 // 优化后的锁定逻辑
 const handleLock = async () => {
   try {
-    await lockFormRef.value?.validate()
-    dialogVisible.value = false
+    await lockFormRef.value?.validate();
+    dialogVisible.value = false;
     lockStore.setLockInfo({
       isLock: true,
-      password: form.password
-    })
+      password: form.password,
+    });
   } catch {
     // 验证失败时不执行任何操作
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
diff --git a/frontend/src/layouts/components/NavBar/components/LockPage.vue b/frontend/src/layouts/components/NavBar/components/LockPage.vue
index 34c89801..f39e772d 100644
--- a/frontend/src/layouts/components/NavBar/components/LockPage.vue
+++ b/frontend/src/layouts/components/NavBar/components/LockPage.vue
@@ -1,24 +1,22 @@
 <template>
   <div class="lockpage">
-    <div
-      v-show="showDate"
-      class="unlock-container"
-      @click="handleShowForm(false)"
-    >
+    <div v-show="showDate" class="unlock-container" @click="handleShowForm(false)">
       <el-icon><Lock /></el-icon>
-      <span>{{ t('lock.unlock') }}</span>
+      <span>{{ t("lock.unlock") }}</span>
     </div>
 
     <div class="time-container w-screen h-screen">
       <div class="hour-container mr-5 md:mr-20 w-2/5 h-2/5 md:h-4/5">
         <span>{{ hour }}</span>
-        <span v-show="showDate" class="meridiem  absolute left-5 top-5 text-md xl:text-xl">{{ meridiem }}</span>
+        <span v-show="showDate" class="meridiem absolute left-5 top-5 text-md xl:text-xl">
+          {{ meridiem }}
+        </span>
       </div>
       <div class="minute-container w-2/5 h-2/5 md:h-4/5">
         <span>{{ minute }}</span>
       </div>
     </div>
-    
+
     <transition name="fade-slide">
       <div v-show="!showDate" class="entry-wrapper">
         <div class="entry-content">
@@ -36,7 +34,7 @@
             @keydown.enter="unLock"
           />
           <span v-if="errMsg" class="error-message">
-            {{ t('lock.message') }}
+            {{ t("lock.message") }}
           </span>
           <div class="button-group">
             <el-button
@@ -47,7 +45,7 @@
               :disabled="loading"
               @click="handleShowForm(true)"
             >
-              {{ t('common.back') }}
+              {{ t("common.back") }}
             </el-button>
             <el-button
               type="primary"
@@ -57,7 +55,7 @@
               :disabled="loading"
               @click="goLogin"
             >
-              {{ t('lock.backToLogin') }}
+              {{ t("lock.backToLogin") }}
             </el-button>
             <el-button
               type="primary"
@@ -67,7 +65,7 @@
               :disabled="loading"
               @click="unLock()"
             >
-              {{ t('lock.entrySystem') }}
+              {{ t("lock.entrySystem") }}
             </el-button>
           </div>
         </div>
@@ -76,78 +74,73 @@
 
     <div class="date-container">
       <div v-show="!showDate" class="time-display">
-        {{ hour }}:{{ minute }} <span class="meridiem-display">{{ meridiem }}</span>
+        {{ hour }}:{{ minute }}
+        <span class="meridiem-display">{{ meridiem }}</span>
       </div>
       <div class="full-date">{{ year }}/{{ month }}/{{ day }} {{ week }}</div>
     </div>
   </div>
 </template>
 
-
 <script lang="ts" setup>
-import { ref } from 'vue'
-import { useRouter } from 'vue-router'
+import { ref } from "vue";
+import { useRouter } from "vue-router";
 import { useUserStore, useLockStore } from "@/store";
-import { ElInput } from 'element-plus';
-import { useNow } from '@/utils/dateUtil'
-import { useTagsViewStore } from '@/store'
-
+import { ElInput } from "element-plus";
+import { useNow } from "@/utils/dateUtil";
+import { useTagsViewStore } from "@/store";
 
 const route = useRoute();
 const router = useRouter();
 const userStore = useUserStore();
-const tagsViewStore = useTagsViewStore()
+const tagsViewStore = useTagsViewStore();
 
+const { replace } = useRouter();
 
-const { replace } = useRouter()
+const password = ref("");
+const loading = ref(false);
+const errMsg = ref(false);
+const showDate = ref(true);
 
-const password = ref('')
-const loading = ref(false)
-const errMsg = ref(false)
-const showDate = ref(true)
+const lockStore = useLockStore();
 
+const { hour, month, minute, meridiem, year, day, week } = useNow(true);
 
-const lockStore = useLockStore()
-
-const { hour, month, minute, meridiem, year, day, week } = useNow(true)
-
-const { t } = useI18n()
+const { t } = useI18n();
 
 // 解锁
 async function unLock() {
   if (!password.value) {
-    return
+    return;
   }
-  const pwd = password.value
+  const pwd = password.value;
   try {
-    loading.value = true
-    const res = await lockStore.unLock(pwd)
-    errMsg.value = !res
+    loading.value = true;
+    const res = await lockStore.unLock(pwd);
+    errMsg.value = !res;
   } finally {
-    loading.value = false
+    loading.value = false;
   }
 }
 
 // 返回登录
 async function goLogin() {
-  await userStore.logout().catch(() => {})
-  userStore.resetAllState()
-  tagsViewStore.delAllViews()
+  await userStore.logout().catch(() => {});
+  userStore.resetAllState();
+  tagsViewStore.delAllViews();
   router.push(`/login?redirect=${route.fullPath}`);
-  lockStore.resetLockInfo()
-  replace('/login')
+  lockStore.resetLockInfo();
+  replace("/login");
 }
 
-
-
-const passwordInputRef = ref<InstanceType<typeof ElInput>>()
+const passwordInputRef = ref<InstanceType<typeof ElInput>>();
 
 function handleShowForm(show = false) {
-  showDate.value = show
+  showDate.value = show;
   if (!show) {
     requestAnimationFrame(() => {
-      passwordInputRef.value?.focus()
-    })
+      passwordInputRef.value?.focus();
+    });
   }
 }
 </script>
@@ -160,7 +153,7 @@ function handleShowForm(show = false) {
   left: 0;
   inset: 0;
   display: flex;
-  width: 100%;;
+  width: 100%;
   height: 100%;
   background-color: black;
   backdrop-filter: blur(8px);
@@ -193,7 +186,6 @@ function handleShowForm(show = false) {
     }
   }
 
-
   .time-container {
     display: flex;
     justify-content: center;
@@ -214,7 +206,7 @@ function handleShowForm(show = false) {
       align-items: center;
       font-size: 220px;
     }
-    
+
     .minute-container {
       display: flex;
       justify-content: center;
@@ -240,7 +232,6 @@ function handleShowForm(show = false) {
     font-size: 1.25rem;
   }
 
-
   .entry-wrapper {
     position: absolute;
     top: 0;
@@ -313,11 +304,11 @@ function handleShowForm(show = false) {
     width: 100%;
     color: #d1d5db;
     text-align: center;
-    
+
     @media (min-width: 1280px) {
       font-size: 1.25rem;
     }
-    
+
     @media (min-width: 1536px) {
       font-size: 1.875rem;
     }
@@ -326,7 +317,7 @@ function handleShowForm(show = false) {
   .time-display {
     font-size: 3rem;
     margin-bottom: 1rem;
-    
+
     .meridiem-display {
       font-size: 1.875rem;
     }
diff --git a/frontend/src/layouts/components/NavBar/components/NavbarActions.vue b/frontend/src/layouts/components/NavBar/components/NavbarActions.vue
index 57a5adc2..e6cbc909 100644
--- a/frontend/src/layouts/components/NavBar/components/NavbarActions.vue
+++ b/frontend/src/layouts/components/NavBar/components/NavbarActions.vue
@@ -21,7 +21,6 @@
       <div v-if="settingStore.showLangSelect" class="navbar-actions__item">
         <LangSelect />
       </div>
-
     </template>
 
     <!-- 通知 -->
@@ -67,7 +66,7 @@
               <el-icon><Lock /></el-icon>
               {{ t("navbar.lock") }}
             </el-dropdown-item>
-            <el-dropdown-item  @click="logout">
+            <el-dropdown-item @click="logout">
               <el-icon><SwitchButton /></el-icon>
               {{ t("navbar.logout") }}
             </el-dropdown-item>
@@ -76,7 +75,7 @@
       </el-dropdown>
     </div>
   </div>
-  
+
   <!-- 引导 -->
   <Guide v-if="guideVisible" v-model="guideVisible" @skip="handleGuideExit" />
 
@@ -89,8 +88,7 @@
   </teleport>
 
   <!-- 配置中心抽屉 -->
-  <ConfigInfoDrawer v-model="drawerVisible"/>
-  
+  <ConfigInfoDrawer v-model="drawerVisible" />
 </template>
 
 <script setup lang="ts">
@@ -108,11 +106,10 @@ import Fullscreen from "@/components/Fullscreen/index.vue";
 import SizeSelect from "@/components/SizeSelect/index.vue";
 import LangSelect from "@/components/LangSelect/index.vue";
 import Notification from "@/components/Notification/index.vue";
-import LockDialog from './LockDialog.vue'
-import LockPage from './LockPage.vue'
-import Guide from '@/components/Guide/index.vue'
-import ConfigInfoDrawer from "@/views/module_system/param/components/ConfigInfoDrawer.vue"
-
+import LockDialog from "./LockDialog.vue";
+import LockPage from "./LockPage.vue";
+import Guide from "@/components/Guide/index.vue";
+import ConfigInfoDrawer from "@/views/module_system/param/components/ConfigInfoDrawer.vue";
 
 const { t } = useI18n();
 const appStore = useAppStore();
@@ -131,7 +128,6 @@ function handleProfileClick() {
   router.push({ name: "Profile" });
 }
 
-
 const drawerVisible = ref(false);
 /**
  * 打开配置中心页面
@@ -140,29 +136,28 @@ function handleConfigClick() {
   drawerVisible.value = true;
 }
 
-
 /**
  * 项目文档
  */
 function handleDocumentClick() {
-  window.open('https://service.fastapiadmin.com', '_blank');
+  window.open("https://service.fastapiadmin.com", "_blank");
 }
 
 /**
  * Gitee 项目地址
  */
 function handleGiteeClick() {
-  window.open('https://gitee.com/tao__tao/FastapiAdmin')
+  window.open("https://gitee.com/tao__tao/FastapiAdmin");
 }
 
 /**
- * 项目引导 
+ * 项目引导
  */
 // 使用ref而不是computed，以便可以修改引导可见性
 // 使用 computed 实现双向绑定，减少 watch 的使用
 const guideVisible = computed({
   get: () => appStore.guideVisible,
-  set: (newValue) => appStore.showGuide(newValue)
+  set: (newValue) => appStore.showGuide(newValue),
 });
 
 function handleTourClick() {
@@ -177,27 +172,29 @@ function handleTourClick() {
 // 引导结束（点击跳过或最后一步完成关闭）后，自动关闭下次登录的自动展示
 function handleGuideExit() {
   // 关闭自动展示开关，确保下次登录不再自动开启
-  settingStore.updateSetting('showGuide', false);
+  settingStore.updateSetting("showGuide", false);
 }
 
 // 监听引导关闭（从 true -> false），也同步关闭自动展示开关
-watch(() => guideVisible.value, (val, oldVal) => {
-  if (oldVal && !val) {
-    settingStore.updateSetting('showGuide', false);
+watch(
+  () => guideVisible.value,
+  (val, oldVal) => {
+    if (oldVal && !val) {
+      settingStore.updateSetting("showGuide", false);
+    }
   }
-});
+);
 
 /**
  * 锁屏
  */
-const lockStore = useLockStore()
-const getIsLock = computed(() => lockStore.getLockInfo?.isLock ?? false)
-const dialogVisible = ref<boolean>(false)
+const lockStore = useLockStore();
+const getIsLock = computed(() => lockStore.getLockInfo?.isLock ?? false);
+const dialogVisible = ref<boolean>(false);
 // 锁定屏幕
 const handlelockScreen = () => {
-  dialogVisible.value = true
-}
-
+  dialogVisible.value = true;
+};
 
 // 根据主题和侧边栏配色方案选择样式类
 const navbarActionsClass = computed(() => {
@@ -234,15 +231,16 @@ function logout() {
     cancelButtonText: "取消",
     type: "warning",
     lockScroll: false,
-  }).then(() => {
-    userStore.logout().then(() => {
-      router.push(`/login`);
+  })
+    .then(() => {
+      userStore.logout().then(() => {
+        router.push(`/login`);
+      });
+    })
+    .catch(() => {
+      ElMessageBox.close();
     });
-  }).catch(() => {
-    ElMessageBox.close();
-  });
 }
-
 </script>
 
 <style lang="scss" scoped>
diff --git a/frontend/src/layouts/components/Settings/index.vue b/frontend/src/layouts/components/Settings/index.vue
index 1f12590e..d1fd79d1 100644
--- a/frontend/src/layouts/components/Settings/index.vue
+++ b/frontend/src/layouts/components/Settings/index.vue
@@ -80,12 +80,9 @@
             <div class="color-options">
               <!-- 预设颜色选项 -->
               <div
-                v-for="(color) in displayColorPresets"
+                v-for="color in displayColorPresets"
                 :key="color"
-                :class="[
-                  'color-option',
-                  { 'is-active': selectedThemeColor === color }
-                ]"
+                :class="['color-option', { 'is-active': selectedThemeColor === color }]"
                 :style="{ backgroundColor: color }"
                 @click="handleColorSelect(color)"
               >
@@ -108,9 +105,8 @@
         </div>
       </section>
 
-
       <!-- 导航主题 -->
-      <section v-if="!isDark" class="config-section ">
+      <section v-if="!isDark" class="config-section">
         <el-divider>{{ t("settings.navigation") }}</el-divider>
         <div class="config-item flex-x-between">
           <span class="text-xs">{{ t("settings.sidebarColorScheme") }}</span>
@@ -171,7 +167,7 @@
           <span class="text-xs">{{ t("settings.showNotification") }}</span>
           <el-switch v-model="settingsStore.showNotification" />
         </div>
-        
+
         <!-- 修改此部分为引导开关，关闭以后登录以后不再启动引导 -->
         <div class="flex-x-between">
           <span class="text-xs">{{ t("settings.showGuide") }}</span>
@@ -216,8 +212,6 @@
       </div>
     </div>
   </el-drawer>
-
-  
 </template>
 
 <script setup lang="ts">
@@ -312,7 +306,6 @@ const handleColorSelect = (color: string) => {
   selectedThemeColor.value = color;
 };
 
-
 /**
  * 复制当前配置
  */
@@ -742,21 +735,21 @@ const handleCloseDrawer = () => {
   }
 
   .color-picker-wrapper {
-      .custom-color-picker {
-        :deep(.el-color-picker__trigger) {
-          width: 22px;
-          height: 22px;
-          border: 2px solid var(--el-border-color-light);
-          border-radius: 6px;
-          transition: all 0.3s var(--el-transition-duration);
-          box-shadow: var(--el-box-shadow-light);
+    .custom-color-picker {
+      :deep(.el-color-picker__trigger) {
+        width: 22px;
+        height: 22px;
+        border: 2px solid var(--el-border-color-light);
+        border-radius: 6px;
+        transition: all 0.3s var(--el-transition-duration);
+        box-shadow: var(--el-box-shadow-light);
 
-          &:hover {
-            transform: translateY(-2px) scale(1.05);
-            box-shadow: var(--el-box-shadow);
-            border-color: var(--el-color-primary-light-3);
-          }
+        &:hover {
+          transform: translateY(-2px) scale(1.05);
+          box-shadow: var(--el-box-shadow);
+          border-color: var(--el-color-primary-light-3);
         }
+      }
 
       :deep(.el-color-picker__color) {
         border: none;
@@ -774,7 +767,6 @@ const handleCloseDrawer = () => {
   }
 }
 
-
 /* 深色模式适配 */
 .dark {
   .theme-color-selector {
@@ -804,7 +796,6 @@ const handleCloseDrawer = () => {
   }
 }
 
-
 /* 复制配置对话框样式 */
 :deep(.copy-config-dialog) {
   .el-message-box__content {
@@ -813,4 +804,3 @@ const handleCloseDrawer = () => {
   }
 }
 </style>
-
diff --git a/frontend/src/layouts/components/TagsView/index.vue b/frontend/src/layouts/components/TagsView/index.vue
index 8a92d79b..83c7ebc1 100644
--- a/frontend/src/layouts/components/TagsView/index.vue
+++ b/frontend/src/layouts/components/TagsView/index.vue
@@ -10,16 +10,20 @@
       <el-scrollbar ref="scrollbarRef" class="scroll-container" @wheel="handleScroll">
         <VueDraggable v-model="visitedViews" :animation="150">
           <router-link
-            v-for="tag in displayedViews" :key="tag.fullPath"
-            :class="['tags-item', { active: tagsViewStore.isActive(tag) }]" :to="{ path: tag.path, query: tag.query }"
+            v-for="tag in displayedViews"
+            :key="tag.fullPath"
+            :class="['tags-item', { active: tagsViewStore.isActive(tag) }]"
+            :to="{ path: tag.path, query: tag.query }"
             @click="tagSwitchSource = 'tab'"
-            @click.middle="handleMiddleClick(tag)">
+            @click.middle="handleMiddleClick(tag)"
+          >
             <!-- 为所有标签添加右键菜单 -->
-            <el-dropdown 
+            <el-dropdown
               v-if="tagsViewStore.isActive(tag)"
               trigger="contextmenu"
               @visible-change="(visible) => onContextMenuVisibleChange(visible, tag)"
-              @click.stop>
+              @click.stop
+            >
               <span class="tag-text">{{ translateRouteTitle(tag.title) }}</span>
               <template #dropdown>
                 <el-dropdown-menu>
@@ -32,7 +36,8 @@
 
                   <el-dropdown-item
                     :disabled="tag.affix || visitedViews.length <= 1"
-                    @click="closeSelectedTag(tag)">
+                    @click="closeSelectedTag(tag)"
+                  >
                     <el-icon>
                       <Close />
                     </el-icon>
@@ -41,7 +46,8 @@
 
                   <el-dropdown-item
                     :disabled="isFirstView || !tagsViewStore.isActive(tag)"
-                    @click="closeLeftTags">
+                    @click="closeLeftTags"
+                  >
                     <el-icon>
                       <Back />
                     </el-icon>
@@ -50,7 +56,8 @@
 
                   <el-dropdown-item
                     :disabled="isLastView || !tagsViewStore.isActive(tag)"
-                    @click="closeRightTags">
+                    @click="closeRightTags"
+                  >
                     <el-icon>
                       <Right />
                     </el-icon>
@@ -59,16 +66,15 @@
 
                   <el-dropdown-item
                     :disabled="visitedViews.length <= 1 || !tagsViewStore.isActive(tag)"
-                    @click="closeOtherTags">
+                    @click="closeOtherTags"
+                  >
                     <el-icon>
                       <Remove />
                     </el-icon>
                     {{ t("navbar.closeOther") }}
                   </el-dropdown-item>
 
-                  <el-dropdown-item
-                    :disabled="visitedViews.length <= 1"
-                    @click="closeAllTags(tag)">
+                  <el-dropdown-item :disabled="visitedViews.length <= 1" @click="closeAllTags(tag)">
                     <el-icon>
                       <Minus />
                     </el-icon>
@@ -81,21 +87,24 @@
                       <Star v-if="!isQuickLinkExists(tag)" />
                       <StarFilled v-else />
                     </el-icon>
-                    {{ isQuickLinkExists(tag) ? '取消收藏' : '收藏' }}
+                    {{ isQuickLinkExists(tag) ? "取消收藏" : "收藏" }}
                   </el-dropdown-item>
                 </el-dropdown-menu>
               </template>
             </el-dropdown>
             <span v-else class="tag-text">{{ translateRouteTitle(tag.title) }}</span>
-            
-            <span v-if="!tag.affix" class="tag-close-btn" @click.prevent.stop="closeSelectedTag(tag)">
+
+            <span
+              v-if="!tag.affix"
+              class="tag-close-btn"
+              @click.prevent.stop="closeSelectedTag(tag)"
+            >
               <el-icon>
                 <Close />
               </el-icon>
             </span>
           </router-link>
         </VueDraggable>
-
       </el-scrollbar>
     </nav>
 
@@ -146,7 +155,10 @@
             {{ t("navbar.closeRight") }}
           </el-dropdown-item>
 
-          <el-dropdown-item :disabled="visitedViews.length <= 1" @click="handleAction('closeOther')">
+          <el-dropdown-item
+            :disabled="visitedViews.length <= 1"
+            @click="handleAction('closeOther')"
+          >
             <el-icon>
               <Remove />
             </el-icon>
@@ -172,7 +184,7 @@ import { translateRouteTitle } from "@/utils/i18n";
 import { refreshAppCaches, usePermissionStore, useTagsViewStore } from "@/store";
 import { VueDraggable } from "vue-draggable-plus";
 import { quickStartManager } from "@/utils/quickStartManager";
-import { ElMessage } from 'element-plus';
+import { ElMessage } from "element-plus";
 
 const { t } = useI18n();
 
@@ -183,12 +195,11 @@ const route = useRoute();
 const permissionStore = usePermissionStore();
 const tagsViewStore = useTagsViewStore();
 
-
 const { visitedViews } = storeToRefs(tagsViewStore);
 
 // 简单的标签显示逻辑
 const displayedViews = computed(() => {
-  return visitedViews.value
+  return visitedViews.value;
 });
 
 // 当前选中的标签
@@ -203,7 +214,7 @@ const activeTag = computed(() => {
 const scrollbarRef = ref();
 
 // 标签切换来源跟踪
-const tagSwitchSource = ref<'menu' | 'tab' | null>(null);
+const tagSwitchSource = ref<"menu" | "tab" | null>(null);
 
 // 路由映射缓存，提升查找性能
 const routePathMap = computed(() => {
@@ -282,14 +293,14 @@ const addCurrentTag = () => {
   if (!route.meta?.title) return;
 
   // 检查标签是否已存在
-  const existingTag = visitedViews.value.find(tag => tag.path === route.path);
+  const existingTag = visitedViews.value.find((tag) => tag.path === route.path);
 
   if (existingTag) {
     // 如果标签已存在，根据来源决定是否移动位置
     if (!existingTag.affix) {
-      if (tagSwitchSource.value === 'menu') {
+      if (tagSwitchSource.value === "menu") {
         // 通过菜单点击：移动到最新位置
-        const index = visitedViews.value.findIndex(tag => tag.path === route.path);
+        const index = visitedViews.value.findIndex((tag) => tag.path === route.path);
         if (index !== -1) {
           const tag = visitedViews.value.splice(index, 1)[0];
           visitedViews.value.push(tag);
@@ -312,7 +323,7 @@ const addCurrentTag = () => {
   }
 
   // 根据来源决定是否滚动
-  if (tagSwitchSource.value === 'menu') {
+  if (tagSwitchSource.value === "menu") {
     // 通过菜单点击：滚动到最新标签
     nextTick(() => {
       autoScrollToLatestTag();
@@ -359,7 +370,6 @@ const handleMiddleClick = (tag: TagView) => {
  * 处理滚轮事件（优化后）
  */
 const handleScroll = (event: WheelEvent) => {
-
   const scrollWrapper = scrollbarRef.value?.wrapRef;
   if (!scrollWrapper) return;
 
@@ -373,8 +383,20 @@ const handleScroll = (event: WheelEvent) => {
   const deltaX = event.deltaX || 0;
 
   // 计算新的滚动位置
-  const newScrollLeft = Math.max(0, Math.min(scrollWrapper.scrollWidth - scrollWrapper.clientWidth, scrollWrapper.scrollLeft + deltaX));
-  const newScrollTop = Math.max(0, Math.min(scrollWrapper.scrollHeight - scrollWrapper.clientHeight, scrollWrapper.scrollTop + deltaY));
+  const newScrollLeft = Math.max(
+    0,
+    Math.min(
+      scrollWrapper.scrollWidth - scrollWrapper.clientWidth,
+      scrollWrapper.scrollLeft + deltaX
+    )
+  );
+  const newScrollTop = Math.max(
+    0,
+    Math.min(
+      scrollWrapper.scrollHeight - scrollWrapper.clientHeight,
+      scrollWrapper.scrollTop + deltaY
+    )
+  );
 
   scrollbarRef.value.setScrollLeft(newScrollLeft);
   scrollbarRef.value.setScrollTop(newScrollTop); // 新增垂直滚动支持
@@ -493,35 +515,35 @@ const handleAction = async (action: string) => {
   if (!currentTag) return;
 
   switch (action) {
-    case 'refresh':
+    case "refresh":
       refreshSelectedTag(currentTag);
       break;
-    case 'close':
+    case "close":
       closeSelectedTag(currentTag);
       break;
-    case 'closeRight':
+    case "closeRight":
       closeRightTags();
       break;
-    case 'closeLeft':
+    case "closeLeft":
       closeLeftTags();
       break;
-    case 'closeOther':
+    case "closeOther":
       closeOtherTags();
       break;
-    case 'closeAll':
+    case "closeAll":
       closeAllTags(currentTag);
       break;
-    case 'refreshCache':
+    case "refreshCache":
       try {
         // 1) 刷新服务端缓存（用户/权限/配置/公告/按需字典）并重建路由
         await refreshAppCaches();
         // 2) 软刷新当前页面，重新加载组件
         refreshSelectedTag(currentTag);
         // 3) 提示成功
-        ElMessage.success(t('navbar.refreshCache') + '完成');
+        ElMessage.success(t("navbar.refreshCache") + "完成");
       } catch (error) {
-        console.error('刷新缓存失败:', error);
-        ElMessage.error('刷新失败');
+        console.error("刷新缓存失败:", error);
+        ElMessage.error("刷新失败");
       }
       break;
     default:
@@ -553,7 +575,7 @@ const toggleQuickStart = (tag: TagView) => {
     if (isExists) {
       // 取消收藏：找到对应的链接并删除
       const links = quickStartManager.getQuickLinks();
-      const targetLink = links.find(link => link.href === href);
+      const targetLink = links.find((link) => link.href === href);
       if (targetLink?.id) {
         quickStartManager.removeQuickLink(targetLink.id);
         ElMessage.success(`已取消收藏：${tag.title}`);
@@ -565,8 +587,8 @@ const toggleQuickStart = (tag: TagView) => {
       ElMessage.success(`已收藏：${tag.title}`);
     }
   } catch (error) {
-    console.error('Failed to toggle quick start:', error);
-    ElMessage.error('操作失败');
+    console.error("Failed to toggle quick start:", error);
+    ElMessage.error("操作失败");
   }
 };
 
@@ -581,102 +603,105 @@ const isQuickLinkExists = (tag: TagView): boolean => {
  * 向左滚动标签页
  */
 const scrollLeft = () => {
-  const scrollWrapper = scrollbarRef.value?.wrapRef
-  if (!scrollWrapper) return
+  const scrollWrapper = scrollbarRef.value?.wrapRef;
+  if (!scrollWrapper) return;
 
-  const newScrollLeft = Math.max(0, scrollWrapper.scrollLeft - 200)
-  scrollbarRef.value.setScrollLeft(newScrollLeft)
-}
+  const newScrollLeft = Math.max(0, scrollWrapper.scrollLeft - 200);
+  scrollbarRef.value.setScrollLeft(newScrollLeft);
+};
 
 /**
  * 向右滚动标签页
  */
 const scrollRight = () => {
-  const scrollWrapper = scrollbarRef.value?.wrapRef
-  if (!scrollWrapper) return
+  const scrollWrapper = scrollbarRef.value?.wrapRef;
+  if (!scrollWrapper) return;
 
-  const maxScrollLeft = scrollWrapper.scrollWidth - scrollWrapper.clientWidth
-  const newScrollLeft = Math.min(maxScrollLeft, scrollWrapper.scrollLeft + 200)
-  scrollbarRef.value.setScrollLeft(newScrollLeft)
+  const maxScrollLeft = scrollWrapper.scrollWidth - scrollWrapper.clientWidth;
+  const newScrollLeft = Math.min(maxScrollLeft, scrollWrapper.scrollLeft + 200);
+  scrollbarRef.value.setScrollLeft(newScrollLeft);
 
   // 如果滚动到最右边，重置滚动状态以允许下次自动滚动
   if (newScrollLeft >= maxScrollLeft - 1) {
-    scrollState.value.hasScrolledToLatest = false
+    scrollState.value.hasScrolledToLatest = false;
   }
-}
+};
 
 /**
  * 重置滚动状态
  */
 const resetScrollState = () => {
-  scrollState.value.hasScrolledToLatest = false
-  scrollState.value.isContainerFull = false
-}
+  scrollState.value.hasScrolledToLatest = false;
+  scrollState.value.isContainerFull = false;
+};
 
 // 滚动状态跟踪
 const scrollState = ref({
   hasScrolledToLatest: false, // 是否已经滚动到最新标签
-  isContainerFull: false      // 容器是否已满
-})
+  isContainerFull: false, // 容器是否已满
+});
 
 /**
  * 自动滚动到最新标签或确保当前激活标签可见
  */
 const autoScrollToLatestTag = () => {
-  const scrollWrapper = scrollbarRef.value?.wrapRef
-  if (!scrollWrapper) return
+  const scrollWrapper = scrollbarRef.value?.wrapRef;
+  if (!scrollWrapper) return;
 
   // 获取容器宽度和内容宽度
-  const containerWidth = scrollWrapper.clientWidth
-  const contentWidth = scrollWrapper.scrollWidth
+  const containerWidth = scrollWrapper.clientWidth;
+  const contentWidth = scrollWrapper.scrollWidth;
 
   // 判断容器是否已满（内容宽度是否超过容器宽度）
-  const isContainerFull = contentWidth > containerWidth
+  const isContainerFull = contentWidth > containerWidth;
 
   // 查找当前激活的标签元素
-  const activeTagElement = document.querySelector('.tags-item.active')
-  
+  const activeTagElement = document.querySelector(".tags-item.active");
+
   if (activeTagElement) {
     // 将Element类型断言为HTMLElement类型以访问offsetWidth属性
     const activeHtmlElement = activeTagElement as HTMLElement;
     // 计算激活标签的位置信息
-    const activeTagRect = activeHtmlElement.getBoundingClientRect()
-    const containerRect = scrollWrapper.getBoundingClientRect()
-    
+    const activeTagRect = activeHtmlElement.getBoundingClientRect();
+    const containerRect = scrollWrapper.getBoundingClientRect();
+
     // 计算标签相对于容器的位置
-    const tagLeft = activeTagRect.left - containerRect.left + scrollWrapper.scrollLeft
-    const tagRight = tagLeft + activeHtmlElement.offsetWidth
-    
+    const tagLeft = activeTagRect.left - containerRect.left + scrollWrapper.scrollLeft;
+    const tagRight = tagLeft + activeHtmlElement.offsetWidth;
+
     // 检查标签是否完全在可见区域内
-    if (tagLeft < scrollWrapper.scrollLeft || tagRight > scrollWrapper.scrollLeft + containerWidth) {
+    if (
+      tagLeft < scrollWrapper.scrollLeft ||
+      tagRight > scrollWrapper.scrollLeft + containerWidth
+    ) {
       // 如果标签不在可见区域内，滚动到使标签居中的位置
-      const targetScrollLeft = tagLeft - (containerWidth - activeHtmlElement.offsetWidth) / 2
-      const maxScrollLeft = contentWidth - containerWidth
-      const minScrollLeft = 0
-      const clampedScrollLeft = Math.max(minScrollLeft, Math.min(maxScrollLeft, targetScrollLeft))
-      
-      scrollbarRef.value.setScrollLeft(clampedScrollLeft)
-      scrollState.value.hasScrolledToLatest = true
-      scrollState.value.isContainerFull = isContainerFull
-      return
+      const targetScrollLeft = tagLeft - (containerWidth - activeHtmlElement.offsetWidth) / 2;
+      const maxScrollLeft = contentWidth - containerWidth;
+      const minScrollLeft = 0;
+      const clampedScrollLeft = Math.max(minScrollLeft, Math.min(maxScrollLeft, targetScrollLeft));
+
+      scrollbarRef.value.setScrollLeft(clampedScrollLeft);
+      scrollState.value.hasScrolledToLatest = true;
+      scrollState.value.isContainerFull = isContainerFull;
+      return;
     }
   }
 
   // 如果没有找到激活标签或激活标签已经在可见区域内，则使用原来的逻辑
   if (isContainerFull && !scrollState.value.hasScrolledToLatest) {
     // 计算需要滚动到的位置，确保最新标签在右侧可见
-    const maxScrollLeft = contentWidth - containerWidth
-    scrollbarRef.value.setScrollLeft(maxScrollLeft)
-    scrollState.value.hasScrolledToLatest = true
-    scrollState.value.isContainerFull = true
+    const maxScrollLeft = contentWidth - containerWidth;
+    scrollbarRef.value.setScrollLeft(maxScrollLeft);
+    scrollState.value.hasScrolledToLatest = true;
+    scrollState.value.isContainerFull = true;
   } else if (!isContainerFull) {
     // 如果内容宽度不超过容器宽度，滚动到最左边
-    scrollbarRef.value.setScrollLeft(0)
+    scrollbarRef.value.setScrollLeft(0);
     // 重置滚动状态
-    scrollState.value.hasScrolledToLatest = false
-    scrollState.value.isContainerFull = false
+    scrollState.value.hasScrolledToLatest = false;
+    scrollState.value.isContainerFull = false;
   }
-}
+};
 
 // 监听路由变化
 watch(
@@ -684,7 +709,7 @@ watch(
   () => {
     // 如果没有设置来源，则默认为菜单点击
     if (tagSwitchSource.value === null) {
-      tagSwitchSource.value = 'menu';
+      tagSwitchSource.value = "menu";
     }
     addCurrentTag();
     updateCurrentTag();
@@ -700,7 +725,7 @@ watch(
   () => visitedViews.value.length,
   () => {
     // 只有在通过菜单添加新标签时才滚动
-    if (tagSwitchSource.value === 'menu') {
+    if (tagSwitchSource.value === "menu") {
       nextTick(() => {
         autoScrollToLatestTag();
       });
@@ -721,9 +746,9 @@ watch(
 // 初始化
 onMounted(() => {
   initAffixTags();
-  
+
   // 监听容器大小变化
-  const tagsContainer = document.querySelector('.tags-container');
+  const tagsContainer = document.querySelector(".tags-container");
   if (tagsContainer && window.ResizeObserver) {
     resizeObserver = new ResizeObserver(() => {
       // 强制重新计算 displayedViews
@@ -741,7 +766,6 @@ onUnmounted(() => {
     resizeObserver.disconnect();
   }
 });
-
 </script>
 
 <style lang="scss" scoped>
@@ -764,7 +788,6 @@ onUnmounted(() => {
     height: $tags-view-height;
     cursor: pointer;
     border: 1px solid var(--el-border-color-light);
-    
 
     &:hover {
       background-color: var(--el-fill-color-light);
@@ -860,7 +883,6 @@ onUnmounted(() => {
 
         &:hover {
           color: var(--el-color-white);
-
         }
       }
     }
diff --git a/frontend/src/layouts/views/MixLayout.vue b/frontend/src/layouts/views/MixLayout.vue
index 90347448..a52ea139 100644
--- a/frontend/src/layouts/views/MixLayout.vue
+++ b/frontend/src/layouts/views/MixLayout.vue
@@ -3,7 +3,6 @@
     <!-- 顶部菜单栏 -->
     <div class="layout__header">
       <div class="layout__header-content">
-
         <!-- 顶部菜单区域 -->
         <div class="layout__header-menu">
           <!-- Logo区域 -->
@@ -119,7 +118,8 @@ watch(
   () => route.path,
   (newPath) => {
     // 获取顶级路径
-    const topMenuPath = newPath.split("/").filter(Boolean).length > 1 ? newPath.match(/^\/[^/]+/)?.[0] || "/" : "/";
+    const topMenuPath =
+      newPath.split("/").filter(Boolean).length > 1 ? newPath.match(/^\/[^/]+/)?.[0] || "/" : "/";
 
     // 如果当前路径属于当前激活的顶部菜单
     if (newPath.startsWith(activeTopMenuPath.value)) {
diff --git a/frontend/src/main.ts b/frontend/src/main.ts
index d76f8578..08404a19 100644
--- a/frontend/src/main.ts
+++ b/frontend/src/main.ts
@@ -40,13 +40,13 @@ const setTitleAndFavicon = async () => {
     }
 
     if (webLogo) {
-      const loadingLogo = document.querySelector('.loading-container-logo');
+      const loadingLogo = document.querySelector(".loading-container-logo");
       if (loadingLogo instanceof HTMLImageElement) {
         loadingLogo.src = webLogo;
       }
     }
   } catch (error) {
-    console.error('获取配置数据失败:', error);
+    console.error("获取配置数据失败:", error);
   }
 };
 
diff --git a/frontend/src/plugins/download.ts b/frontend/src/plugins/download.ts
index 94464f60..f0a3b103 100644
--- a/frontend/src/plugins/download.ts
+++ b/frontend/src/plugins/download.ts
@@ -1,95 +1,98 @@
-import axios, { AxiosResponse } from 'axios'
-import { ElLoading, ElMessage } from 'element-plus'
-import { saveAs as fileSaverSaveAs } from 'file-saver'
-import { Auth } from '@/utils/auth'
-import errorCode from '@/utils/errorCode'
-import { blobValidate } from '@/utils/common'
+import axios, { AxiosResponse } from "axios";
+import { ElLoading, ElMessage } from "element-plus";
+import { saveAs as fileSaverSaveAs } from "file-saver";
+import { Auth } from "@/utils/auth";
+import errorCode from "@/utils/errorCode";
+import { blobValidate } from "@/utils/common";
 
-const baseURL = import.meta.env.VITE_APP_BASE_API
-let downloadLoadingInstance: any
+const baseURL = import.meta.env.VITE_APP_BASE_API;
+let downloadLoadingInstance: any;
 
 interface DownloadUtil {
-  name(name: string, isDelete?: boolean): void
-  resource(resource: string): void
-  zip(url: string, name: string): void
-  saveAs(text: Blob | string, name: string, opts?: any): void
-  printErrMsg(data: Blob): Promise<void>
+  name(name: string, isDelete?: boolean): void;
+  resource(resource: string): void;
+  zip(url: string, name: string): void;
+  saveAs(text: Blob | string, name: string, opts?: any): void;
+  printErrMsg(data: Blob): Promise<void>;
 }
 
 const download: DownloadUtil = {
   name(name: string, isDelete: boolean = true): void {
-    const url = baseURL + "/common/download?fileName=" + encodeURIComponent(name) + "&delete=" + isDelete
+    const url =
+      baseURL + "/common/download?fileName=" + encodeURIComponent(name) + "&delete=" + isDelete;
     axios({
-      method: 'get',
-      url: url,
-      responseType: 'blob',
-      headers: { 'Authorization': 'Bearer ' + Auth.getAccessToken() }
+      method: "get",
+      url,
+      responseType: "blob",
+      headers: { Authorization: "Bearer " + Auth.getAccessToken() },
     }).then((res: AxiosResponse<Blob>) => {
-      const isBlob = blobValidate(res.data)
+      const isBlob = blobValidate(res.data);
       if (isBlob) {
-        const blob = new Blob([res.data])
-        download.saveAs(blob, decodeURIComponent(res.headers['download-filename']))
+        const blob = new Blob([res.data]);
+        download.saveAs(blob, decodeURIComponent(res.headers["download-filename"]));
       } else {
-        download.printErrMsg(res.data)
+        download.printErrMsg(res.data);
       }
-    })
+    });
   },
 
   resource(resource: string): void {
-    const url = baseURL + "/common/download/resource?resource=" + encodeURIComponent(resource)
+    const url = baseURL + "/common/download/resource?resource=" + encodeURIComponent(resource);
     axios({
-      method: 'get',
-      url: url,
-      responseType: 'blob',
-      headers: { 'Authorization': 'Bearer ' + Auth.getAccessToken() }
+      method: "get",
+      url,
+      responseType: "blob",
+      headers: { Authorization: "Bearer " + Auth.getAccessToken() },
     }).then((res: AxiosResponse<Blob>) => {
-      const isBlob = blobValidate(res.data)
+      const isBlob = blobValidate(res.data);
       if (isBlob) {
-        const blob = new Blob([res.data])
-        download.saveAs(blob, decodeURIComponent(res.headers['download-filename']))
+        const blob = new Blob([res.data]);
+        download.saveAs(blob, decodeURIComponent(res.headers["download-filename"]));
       } else {
-        download.printErrMsg(res.data)
+        download.printErrMsg(res.data);
       }
-    })
+    });
   },
 
   zip(url: string, name: string): void {
-    const fullUrl = baseURL + url
-    downloadLoadingInstance = ElLoading.service({ 
-      text: "正在下载数据，请稍候", 
-      background: "rgba(0, 0, 0, 0.7)" 
-    })
+    const fullUrl = baseURL + url;
+    downloadLoadingInstance = ElLoading.service({
+      text: "正在下载数据，请稍候",
+      background: "rgba(0, 0, 0, 0.7)",
+    });
     axios({
-      method: 'get',
+      method: "get",
       url: fullUrl,
-      responseType: 'blob',
-      headers: { 'Authorization': 'Bearer ' + Auth.getAccessToken() }
-    }).then((res: AxiosResponse<Blob>) => {
-      const isBlob = blobValidate(res.data)
-      if (isBlob) {
-        const blob = new Blob([res.data], { type: 'application/zip' })
-        download.saveAs(blob, name)
-      } else {
-        download.printErrMsg(res.data)
-      }
-      downloadLoadingInstance.close()
-    }).catch((r: any) => {
-      console.error(r)
-      ElMessage.error('下载文件出现错误，请联系管理员！')
-      downloadLoadingInstance.close()
+      responseType: "blob",
+      headers: { Authorization: "Bearer " + Auth.getAccessToken() },
     })
+      .then((res: AxiosResponse<Blob>) => {
+        const isBlob = blobValidate(res.data);
+        if (isBlob) {
+          const blob = new Blob([res.data], { type: "application/zip" });
+          download.saveAs(blob, name);
+        } else {
+          download.printErrMsg(res.data);
+        }
+        downloadLoadingInstance.close();
+      })
+      .catch((r: any) => {
+        console.error(r);
+        ElMessage.error("下载文件出现错误，请联系管理员！");
+        downloadLoadingInstance.close();
+      });
   },
 
   saveAs(text: Blob | string, name: string, opts?: any): void {
-    fileSaverSaveAs(text, name, opts)
+    fileSaverSaveAs(text, name, opts);
   },
 
   async printErrMsg(data: Blob): Promise<void> {
-    const resText = await data.text()
-    const rspObj = JSON.parse(resText)
-    const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
-    ElMessage.error(errMsg)
-  }
-}
+    const resText = await data.text();
+    const rspObj = JSON.parse(resText);
+    const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode["default"];
+    ElMessage.error(errMsg);
+  },
+};
 
-export default download
+export default download;
diff --git a/frontend/src/plugins/index.ts b/frontend/src/plugins/index.ts
index 719120aa..4597ba59 100644
--- a/frontend/src/plugins/index.ts
+++ b/frontend/src/plugins/index.ts
@@ -7,7 +7,7 @@ import { setupStore } from "@/store";
 import { setupElIcons } from "./icons";
 import { setupPermission } from "./permission";
 import { InstallCodeMirror } from "codemirror-editor-vue3";
-import ElementPlus from 'element-plus'
+import ElementPlus from "element-plus";
 
 export default {
   install(app: App<Element>) {
diff --git a/frontend/src/plugins/permission.ts b/frontend/src/plugins/permission.ts
index f13bd4d9..64cf028f 100644
--- a/frontend/src/plugins/permission.ts
+++ b/frontend/src/plugins/permission.ts
@@ -14,15 +14,15 @@ export function setupPermission() {
     try {
       const isLoggedIn = Auth.isLoggedIn();
 
-    if (isLoggedIn) {
-      // 如果已登录但访问登录页，重定向到首页
-      if (to.path === "/login") {
-        next({ path: "/" });
-        return;
-      }
+      if (isLoggedIn) {
+        // 如果已登录但访问登录页，重定向到首页
+        if (to.path === "/login") {
+          next({ path: "/" });
+          return;
+        }
 
-      // 处理已登录用户的路由访问
-      await handleAuthenticatedUser(to, from, next);
+        // 处理已登录用户的路由访问
+        await handleAuthenticatedUser(to, from, next);
       } else {
         // 未登录用户的处理
         if (whiteList.includes(to.path)) {
@@ -32,7 +32,7 @@ export function setupPermission() {
           NProgress.done();
         }
       }
-    }catch (error) {
+    } catch (error) {
       // 错误处理：重置状态并跳转登录
       console.error("Route guard error:", error);
       await useUserStore().resetAllState();
@@ -62,9 +62,9 @@ async function handleAuthenticatedUser(
     // 检查路由是否已生成
     if (!permissionStore.isRouteGenerated) {
       if (!userStore.basicInfo?.roles?.length) {
-          await userStore.getUserInfo();
-        }
-      
+        await userStore.getUserInfo();
+      }
+
       const dynamicRoutes = await permissionStore.generateRoutes();
       // 添加路由到路由器
       dynamicRoutes.forEach((route: RouteRecordRaw) => {
@@ -95,7 +95,7 @@ async function handleAuthenticatedUser(
     // 强制跳转到登录页
     next("/login");
     NProgress.done();
-  } 
+  }
   router.afterEach(() => {
     NProgress.done();
   });
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index 755996e4..84af1266 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -42,7 +42,7 @@ export const constantRoutes: RouteRecordRaw[] = [
   },
   {
     path: "/:pathMatch(.*)*",
-    component: () => import('@/views/error/404.vue'),
+    component: () => import("@/views/error/404.vue"),
     meta: { hidden: true, title: "404" },
   },
   // 以下内容必须放在后面
diff --git a/frontend/src/store/index.ts b/frontend/src/store/index.ts
index 2f56f2dc..5426b78d 100644
--- a/frontend/src/store/index.ts
+++ b/frontend/src/store/index.ts
@@ -1,10 +1,10 @@
 import type { App } from "vue";
 import { createPinia } from "pinia";
-import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
+import piniaPluginPersistedstate from "pinia-plugin-persistedstate";
 
 const store = createPinia();
 
-store.use(piniaPluginPersistedstate)
+store.use(piniaPluginPersistedstate);
 
 // 全局注册 store
 export function setupStore(app: App<Element>) {
diff --git a/frontend/src/store/modules/config.store.ts b/frontend/src/store/modules/config.store.ts
index bccaeffe..37add232 100644
--- a/frontend/src/store/modules/config.store.ts
+++ b/frontend/src/store/modules/config.store.ts
@@ -41,9 +41,9 @@ export const useConfigStore = defineStore("config", {
         }
       });
       this.isConfigLoaded = true;
-    }
+    },
   },
-  persist: true
+  persist: true,
 });
 
 export function useConfigStoreHook() {
diff --git a/frontend/src/store/modules/dict.store.ts b/frontend/src/store/modules/dict.store.ts
index 37ed39e1..45b8d5b5 100644
--- a/frontend/src/store/modules/dict.store.ts
+++ b/frontend/src/store/modules/dict.store.ts
@@ -14,13 +14,13 @@ export const useDictStore = defineStore("dict", {
     // 获取指定类型的字典数据，确保返回数组
     // 获取指定类型的字典数据，确保返回有效的数组且项包含必需属性
     getDictArray() {
-      return (type: string): Array<{dict_value: string; dict_label: string}> => {
-        return (this.dictData[type] || []).filter(
-          item => item.dict_value !== undefined && item.dict_label !== undefined
-        ).map(item => ({
-          dict_value: item.dict_value!, 
-          dict_label: item.dict_label!
-        }));
+      return (type: string): Array<{ dict_value: string; dict_label: string }> => {
+        return (this.dictData[type] || [])
+          .filter((item) => item.dict_value !== undefined && item.dict_label !== undefined)
+          .map((item) => ({
+            dict_value: item.dict_value!,
+            dict_label: item.dict_label!,
+          }));
       };
     },
   },
@@ -33,17 +33,20 @@ export const useDictStore = defineStore("dict", {
           if (!this.dictData[type]) {
             const response = await DictAPI.getInitDict(type);
             // 确保数据格式正确
-            this.dictData[type] = (response.data.data as DictDataTable[] || []).filter(
-              item => item.dict_value !== undefined && item.dict_label !== undefined
+            this.dictData[type] = ((response.data.data as DictDataTable[]) || []).filter(
+              (item) => item.dict_value !== undefined && item.dict_label !== undefined
             );
             this.isLoaded = true;
           }
         }
         // 返回请求的字典数据
-        return types.reduce((result, type) => {
-          result[type] = this.getDictArray(type);
-          return result;
-        }, {} as Record<string, DictDataTable[]>);
+        return types.reduce(
+          (result, type) => {
+            result[type] = this.getDictArray(type);
+            return result;
+          },
+          {} as Record<string, DictDataTable[]>
+        );
       } catch (error) {
         console.error("获取字典数据失败", error);
         return {};
diff --git a/frontend/src/store/modules/lock.store.ts b/frontend/src/store/modules/lock.store.ts
index 70ff87f2..3c981f11 100644
--- a/frontend/src/store/modules/lock.store.ts
+++ b/frontend/src/store/modules/lock.store.ts
@@ -1,48 +1,48 @@
-import { defineStore } from 'pinia'
-import { store } from '../index'
+import { defineStore } from "pinia";
+import { store } from "../index";
 
 interface lockInfo {
-  isLock?: boolean
-  password?: string
+  isLock?: boolean;
+  password?: string;
 }
 
 interface LockState {
-  lockInfo: lockInfo
+  lockInfo: lockInfo;
 }
 
-export const useLockStore = defineStore('lock', {
+export const useLockStore = defineStore("lock", {
   state: (): LockState => {
     return {
       lockInfo: {
         // isLock: false, // 是否锁定屏幕
         // password: '' // 锁屏密码
-      }
-    }
+      },
+    };
   },
   getters: {
     getLockInfo(): lockInfo {
-      return this.lockInfo
-    }
+      return this.lockInfo;
+    },
   },
   actions: {
     setLockInfo(lockInfo: lockInfo) {
-      this.lockInfo = lockInfo
+      this.lockInfo = lockInfo;
     },
     resetLockInfo() {
-      this.lockInfo = {}
+      this.lockInfo = {};
     },
     unLock(password: string) {
       if (this.lockInfo?.password === password) {
-        this.resetLockInfo()
-        return true
+        this.resetLockInfo();
+        return true;
       } else {
-        return false
+        return false;
       }
-    }
+    },
   },
-  persist: true
-})
+  persist: true,
+});
 
 export const useLockStoreWithOut = () => {
-  return useLockStore(store)
-}
+  return useLockStore(store);
+};
diff --git a/frontend/src/store/modules/notice.store.ts b/frontend/src/store/modules/notice.store.ts
index f77a0e68..20a27f0d 100644
--- a/frontend/src/store/modules/notice.store.ts
+++ b/frontend/src/store/modules/notice.store.ts
@@ -15,7 +15,9 @@ export const useNoticeStore = defineStore("notice", {
       const items = response.data.data.items || [];
       // 过滤掉已读的通知
       const readSet = new Set(this.readIds);
-      const filtered = items.filter((item) => item.id !== undefined && !readSet.has(item.id as number));
+      const filtered = items.filter(
+        (item) => item.id !== undefined && !readSet.has(item.id as number)
+      );
       this.noticeList = filtered;
       this.total = filtered.length;
       this.isNoticeLoaded = true;
@@ -32,13 +34,17 @@ export const useNoticeStore = defineStore("notice", {
     },
     // 标记当前列表全部为已读
     markAllAsRead(ids: number[] = []) {
-      const targets = ids.length ? ids : this.noticeList.map((item) => item.id!).filter((id): id is number => id !== undefined);
+      const targets = ids.length
+        ? ids
+        : this.noticeList.map((item) => item.id!).filter((id): id is number => id !== undefined);
       const readSet = new Set(this.readIds);
       targets.forEach((id) => {
         if (!readSet.has(id)) this.readIds.push(id);
       });
       // 同步过滤当前列表
-      this.noticeList = this.noticeList.filter((item) => item.id !== undefined && !this.readIds.includes(item.id as number));
+      this.noticeList = this.noticeList.filter(
+        (item) => item.id !== undefined && !this.readIds.includes(item.id as number)
+      );
       this.total = this.noticeList.length;
     },
     clearUserInfo() {
diff --git a/frontend/src/store/modules/permission.store.ts b/frontend/src/store/modules/permission.store.ts
index 1bb69b23..8ec1d4f7 100644
--- a/frontend/src/store/modules/permission.store.ts
+++ b/frontend/src/store/modules/permission.store.ts
@@ -6,7 +6,6 @@ import { MenuTable } from "@/api/module_system/menu";
 const modules = import.meta.glob("../../views/**/**.vue");
 const Layout = () => import("@/layouts/index.vue");
 
-
 export interface Meta {
   /** 【目录】只有一个子路由是否始终显示 */
   alwaysShow?: boolean;
@@ -21,7 +20,7 @@ export interface Meta {
   /** 排序 */
   order?: number;
   /** 参数 */
-  params?: { key: string; value: string; }[];
+  params?: { key: string; value: string }[];
   /** 是否固定路由 */
   affix?: boolean;
 }
@@ -43,32 +42,31 @@ export interface RouteVO {
 }
 
 export const generator = (routers: MenuTable[]): RouteVO[] => {
-    return routers.map((item) => {
-      const currentRouter: RouteVO = {
-        children: [],
-        path: item.route_path,
-        name: item.route_name,
-        component: item.component_path,
-        redirect: item.redirect,
-        meta: {
-          title: item.title,
-          icon: item.icon || undefined,
-          keepAlive: item.keep_alive,
-          hidden: item.hidden,
-          order: item.order,
-          alwaysShow: item.always_show,
-          params: item.params,
-          affix: item.affix,
-        },
-      };
-      if (item.children && item.children.length > 0) {
-        currentRouter.children = item.children ? generator(item.children) : [];
-      }
-      return currentRouter;
-    });
+  return routers.map((item) => {
+    const currentRouter: RouteVO = {
+      children: [],
+      path: item.route_path,
+      name: item.route_name,
+      component: item.component_path,
+      redirect: item.redirect,
+      meta: {
+        title: item.title,
+        icon: item.icon || undefined,
+        keepAlive: item.keep_alive,
+        hidden: item.hidden,
+        order: item.order,
+        alwaysShow: item.always_show,
+        params: item.params,
+        affix: item.affix,
+      },
+    };
+    if (item.children && item.children.length > 0) {
+      currentRouter.children = item.children ? generator(item.children) : [];
+    }
+    return currentRouter;
+  });
 };
 
-
 export const usePermissionStore = defineStore("permission", () => {
   // 存储所有路由，包括静态路由和动态路由
   const routes = ref<RouteRecordRaw[]>([]);
@@ -82,7 +80,7 @@ export const usePermissionStore = defineStore("permission", () => {
    *
    * @returns Promise<RouteRecordRaw[]> 解析后的动态路由列表
    */
-  async function generateRoutes():Promise<RouteRecordRaw[]> {
+  async function generateRoutes(): Promise<RouteRecordRaw[]> {
     try {
       const userStore = useUserStore();
       // 确保获取用户信息和路由列表
@@ -96,7 +94,7 @@ export const usePermissionStore = defineStore("permission", () => {
       const dynamicRoutes = transformRoutes(data);
 
       routes.value = [...constantRoutes, ...dynamicRoutes];
-      
+
       isRouteGenerated.value = true;
 
       return dynamicRoutes;
@@ -157,17 +155,16 @@ const transformRoutes = (routes: RouteVO[]): RouteRecordRaw[] => {
     const normalizedRoute = { ...route } as RouteRecordRaw;
 
     // 处理组件路径映射
-    normalizedRoute.component =
-      !normalizedRoute.component
-        ? Layout
-        : modules[`../../views/${normalizedRoute.component}.vue`] ||
-          modules["../../views/error/404.vue"];
+    normalizedRoute.component = !normalizedRoute.component
+      ? Layout
+      : modules[`../../views/${normalizedRoute.component}.vue`] ||
+        modules["../../views/error/404.vue"];
 
     // 递归处理子路由
     if (normalizedRoute.children && normalizedRoute.children.length > 0) {
       normalizedRoute.children = transformRoutes(route.children);
     }
-    
+
     return normalizedRoute;
   });
 };
diff --git a/frontend/src/store/modules/settings.store.ts b/frontend/src/store/modules/settings.store.ts
index 0d071b01..09d30456 100644
--- a/frontend/src/store/modules/settings.store.ts
+++ b/frontend/src/store/modules/settings.store.ts
@@ -13,7 +13,7 @@ interface SettingsState {
   showWatermark: boolean;
   showSettings: boolean;
   showGuide: boolean; // 引导功能开关
-  
+
   // 桌面端工具显示设置
   showMenuSearch: boolean;
   showFullscreen: boolean;
@@ -39,21 +39,48 @@ export const useSettingsStore = defineStore("setting", () => {
   const settingsVisible = ref<boolean>(false);
 
   // 🎯 界面显示设置 - 持久化
-  const showTagsView = useStorage<boolean>(SETTINGS_KEYS.SHOW_TAGS_VIEW, defaultSettings.showTagsView);
+  const showTagsView = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_TAGS_VIEW,
+    defaultSettings.showTagsView
+  );
   const showAppLogo = useStorage<boolean>(SETTINGS_KEYS.SHOW_APP_LOGO, defaultSettings.showAppLogo);
-  const showWatermark = useStorage<boolean>(SETTINGS_KEYS.SHOW_WATERMARK, defaultSettings.showWatermark);
-  const showSettings = useStorage<boolean>(SETTINGS_KEYS.SHOW_SETTINGS, defaultSettings.showSettings);
+  const showWatermark = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_WATERMARK,
+    defaultSettings.showWatermark
+  );
+  const showSettings = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_SETTINGS,
+    defaultSettings.showSettings
+  );
   const showGuide = useStorage<boolean>(SETTINGS_KEYS.SHOW_GUIDE, defaultSettings.showGuide); // 引导功能开关
 
   // 🎯 桌面端工具设置 - 持久化
-  const showMenuSearch = useStorage<boolean>(SETTINGS_KEYS.SHOW_MENU_SEARCH, defaultSettings.showMenuSearch);
-  const showFullscreen = useStorage<boolean>(SETTINGS_KEYS.SHOW_FULLSCREEN, defaultSettings.showFullscreen);
-  const showSizeSelect = useStorage<boolean>(SETTINGS_KEYS.SHOW_SIZE_SELECT, defaultSettings.showSizeSelect);
-  const showLangSelect = useStorage<boolean>(SETTINGS_KEYS.SHOW_LANG_SELECT, defaultSettings.showLangSelect);
-  const showNotification = useStorage<boolean>(SETTINGS_KEYS.SHOW_NOTIFICATION, defaultSettings.showNotification);
+  const showMenuSearch = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_MENU_SEARCH,
+    defaultSettings.showMenuSearch
+  );
+  const showFullscreen = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_FULLSCREEN,
+    defaultSettings.showFullscreen
+  );
+  const showSizeSelect = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_SIZE_SELECT,
+    defaultSettings.showSizeSelect
+  );
+  const showLangSelect = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_LANG_SELECT,
+    defaultSettings.showLangSelect
+  );
+  const showNotification = useStorage<boolean>(
+    SETTINGS_KEYS.SHOW_NOTIFICATION,
+    defaultSettings.showNotification
+  );
 
   // 🎯 布局和主题设置 - 持久化
-  const sidebarColorScheme = useStorage<string>(SETTINGS_KEYS.SIDEBAR_COLOR_SCHEME, defaultSettings.sidebarColorScheme);
+  const sidebarColorScheme = useStorage<string>(
+    SETTINGS_KEYS.SIDEBAR_COLOR_SCHEME,
+    defaultSettings.sidebarColorScheme
+  );
   const layout = useStorage<LayoutMode>(SETTINGS_KEYS.LAYOUT, defaultSettings.layout as LayoutMode);
   const themeColor = useStorage<string>(SETTINGS_KEYS.THEME_COLOR, defaultSettings.themeColor);
   const theme = useStorage<ThemeMode>(SETTINGS_KEYS.THEME, defaultSettings.theme);
@@ -140,14 +167,14 @@ export const useSettingsStore = defineStore("setting", () => {
     showWatermark.value = defaultSettings.showWatermark;
     showSettings.value = defaultSettings.showSettings;
     showGuide.value = defaultSettings.showGuide;
-    
+
     // 桌面端工具设置
     showMenuSearch.value = defaultSettings.showMenuSearch;
     showFullscreen.value = defaultSettings.showFullscreen;
     showSizeSelect.value = defaultSettings.showSizeSelect;
     showLangSelect.value = defaultSettings.showLangSelect;
     showNotification.value = defaultSettings.showNotification;
-    
+
     // 布局和主题设置
     sidebarColorScheme.value = defaultSettings.sidebarColorScheme;
     layout.value = defaultSettings.layout as LayoutMode;
@@ -158,21 +185,21 @@ export const useSettingsStore = defineStore("setting", () => {
   return {
     // 🎯 基础状态
     settingsVisible,
-    
+
     // 🎯 界面显示状态
     showTagsView,
     showAppLogo,
     showWatermark,
     showSettings,
     showGuide,
-    
+
     // 🎯 桌面端工具状态
     showMenuSearch,
     showFullscreen,
     showSizeSelect,
     showLangSelect,
     showNotification,
-    
+
     // 🎯 布局和主题状态
     sidebarColorScheme,
     layout,
diff --git a/frontend/src/store/modules/tags-view.store.ts b/frontend/src/store/modules/tags-view.store.ts
index 1054f2c0..9bc82ae4 100644
--- a/frontend/src/store/modules/tags-view.store.ts
+++ b/frontend/src/store/modules/tags-view.store.ts
@@ -1,6 +1,5 @@
 // tags缓存
 export const useTagsViewStore = defineStore("tagsView", () => {
-  
   const visitedViews = ref<TagView[]>([]);
   const cachedViews = ref<string[]>([]);
   const router = useRouter();
diff --git a/frontend/src/store/modules/user.store.ts b/frontend/src/store/modules/user.store.ts
index ecea1eb2..f57b5b90 100644
--- a/frontend/src/store/modules/user.store.ts
+++ b/frontend/src/store/modules/user.store.ts
@@ -1,7 +1,7 @@
 import { store, useTagsViewStore, usePermissionStoreHook, useDictStoreHook } from "@/store";
 
-import AuthAPI, {type LoginFormData } from "@/api/module_system/auth";
-import UserAPI, {type UserInfo }  from "@/api/module_system/user";
+import AuthAPI, { type LoginFormData } from "@/api/module_system/auth";
+import UserAPI, { type UserInfo } from "@/api/module_system/user";
 import type { MenuTable } from "@/api/module_system/menu";
 import { Auth } from "@/utils/auth";
 
@@ -48,10 +48,10 @@ export const useUserStore = defineStore("user", {
       // 设置路由后自动更新权限
       this.setPermissions(routers);
     },
-    
+
     setPermissions(menus: MenuTable[]) {
       this.prems = []; // 先清空现有权限
-      
+
       // 确保 basicInfo.roles 存在，避免空值错误
       if (!this.basicInfo.roles) {
         return;
@@ -59,13 +59,13 @@ export const useUserStore = defineStore("user", {
 
       // 合并所有角色的菜单列表，使用数组扁平化方法简化代码并过滤undefined
       const roleMenus = this.basicInfo.roles
-        .filter(role => role.menus && role.menus.length > 0)
-        .flatMap(role => role.menus)
+        .filter((role) => role.menus && role.menus.length > 0)
+        .flatMap((role) => role.menus)
         .filter((menu): menu is MenuTable => menu !== undefined);
-      
+
       // 合并传入的菜单和角色菜单
       const allMenus = [...menus, ...roleMenus];
-      
+
       const permissionSet = new Set<string>();
       const collect = (items: MenuTable[]) => {
         items.forEach((item) => {
@@ -73,14 +73,14 @@ export const useUserStore = defineStore("user", {
           if (item.permission) {
             permissionSet.add(item.permission);
           }
-          
+
           // 递归收集子菜单的权限，确保子菜单不包含undefined
           if (item.children && item.children.length > 0) {
             collect(item.children.filter((child): child is MenuTable => child !== undefined));
           }
         });
       };
-      
+
       // 收集所有权限
       collect(allMenus);
       this.prems = Array.from(permissionSet);
@@ -93,17 +93,21 @@ export const useUserStore = defineStore("user", {
       this.routeList = [];
       this.hasGetRoute = false;
     },
-    
+
     // 登录
     async login(LoginFormData: LoginFormData) {
-      const response =  await AuthAPI.login(LoginFormData)
+      const response = await AuthAPI.login(LoginFormData);
       this.rememberMe = LoginFormData.remember;
-      Auth.setTokens(response.data.data.access_token, response.data.data.refresh_token, this.rememberMe);
+      Auth.setTokens(
+        response.data.data.access_token,
+        response.data.data.refresh_token,
+        this.rememberMe
+      );
     },
 
     // 登出
     async logout() {
-      await AuthAPI.logout({token: Auth.getAccessToken()});
+      await AuthAPI.logout({ token: Auth.getAccessToken() });
       this.resetAllState();
     },
 
@@ -118,7 +122,7 @@ export const useUserStore = defineStore("user", {
       // 清除标签视图
       useTagsViewStore().delAllViews();
       // 重置字典
-      useDictStoreHook().clearDictData()
+      useDictStoreHook().clearDictData();
 
       return Promise.resolve();
     },
@@ -132,24 +136,26 @@ export const useUserStore = defineStore("user", {
       }
 
       return new Promise<void>((resolve, reject) => {
-        AuthAPI.refreshToken({refresh_token: refreshToken})
+        AuthAPI.refreshToken({ refresh_token: refreshToken })
           .then((response) => {
             // 更新令牌，保持当前记住我状态
-            Auth.setTokens(response.data.data.access_token, response.data.data.refresh_token, Auth.getRememberMe());
+            Auth.setTokens(
+              response.data.data.access_token,
+              response.data.data.refresh_token,
+              Auth.getRememberMe()
+            );
             resolve();
           })
           .catch((error) => {
             reject(error);
           });
       });
-    }
+    },
   },
 
-  persist: true
-
+  persist: true,
 });
 
-
 /**
  * 在组件外部使用UserStore的钩子函数
  * @see https://pinia.vuejs.org/core-concepts/outside-component-usage.html
diff --git a/frontend/src/types/vue3-cron-plus.d.ts b/frontend/src/types/vue3-cron-plus.d.ts
index c51701a9..d0f1f7c4 100644
--- a/frontend/src/types/vue3-cron-plus.d.ts
+++ b/frontend/src/types/vue3-cron-plus.d.ts
@@ -1,8 +1,8 @@
 declare module "vue3-cron-plus" {
   import { DefineComponent } from "vue";
-  
+
   export const vue3CronPlus: DefineComponent<{}, {}, any>;
-  
+
   export default vue3CronPlus;
 }
 
diff --git a/frontend/src/utils/common.ts b/frontend/src/utils/common.ts
index d99e39e8..34e9b810 100644
--- a/frontend/src/utils/common.ts
+++ b/frontend/src/utils/common.ts
@@ -1,5 +1,5 @@
 // 问候语：根据当前小时返回不同问候语
-export function greetings () {
+export function greetings() {
   // 当前时间（用于计算问候语）
   const currentDate = new Date();
   const hours = currentDate.getHours();
@@ -16,7 +16,7 @@ export function greetings () {
   } else {
     return "偷偷向银河要了一把碎星，只等你闭上眼睛撒入你的梦中，晚安🌛！";
   }
-};
+}
 
 export function getRangeDate(startDate: string | number | Date, endDate: string | number | Date) {
   const targetArr = [];
@@ -37,27 +37,19 @@ export function getRangeDate(startDate: string | number | Date, endDate: string
     if (startDateInfo.month !== endDateInfo.month) {
       //同年，不同月份
       //获取开始时间所在月的月底日期
-      const startMax = new Date(
-        startDateInfo.year,
-        startDateInfo.month,
-        0
-      ).getDate();
+      const startMax = new Date(startDateInfo.year, startDateInfo.month, 0).getDate();
       const endNum = startMax - startDateInfo.day + endDateInfo.day;
       for (let i = startDateInfo.day; i <= startDateInfo.day + endNum; i++) {
         if (i > startMax) {
           targetArr.push(
             `${endDateInfo.year}-${
-              endDateInfo.month < 10
-                ? "0" + endDateInfo.month
-                : endDateInfo.month
+              endDateInfo.month < 10 ? "0" + endDateInfo.month : endDateInfo.month
             }-${i - startMax < 10 ? "0" + (i - startMax) : i - startMax}`
           );
         } else {
           targetArr.push(
             `${startDateInfo.year}-${
-              startDateInfo.month < 10
-                ? "0" + startDateInfo.month
-                : startDateInfo.month
+              startDateInfo.month < 10 ? "0" + startDateInfo.month : startDateInfo.month
             }-${i < 10 ? "0" + i : i}`
           );
         }
@@ -67,20 +59,14 @@ export function getRangeDate(startDate: string | number | Date, endDate: string
       for (let i = startDateInfo.day; i <= endDateInfo.day; i++) {
         targetArr.push(
           `${startDateInfo.year}-${
-            startDateInfo.month < 10
-              ? "0" + startDateInfo.month
-              : startDateInfo.month
+            startDateInfo.month < 10 ? "0" + startDateInfo.month : startDateInfo.month
           }-${i < 10 ? "0" + i : i}`
         );
       }
     }
   } else {
     //不同年   【既然不同年那肯定也不同月】
-    const startMax = new Date(
-      startDateInfo.year,
-      startDateInfo.month,
-      0
-    ).getDate();
+    const startMax = new Date(startDateInfo.year, startDateInfo.month, 0).getDate();
     const endNum = startMax - startDateInfo.day + endDateInfo.day;
     for (let i = startDateInfo.day; i <= startDateInfo.day + endNum; i++) {
       if (i > startMax) {
@@ -92,9 +78,7 @@ export function getRangeDate(startDate: string | number | Date, endDate: string
       } else {
         targetArr.push(
           `${startDateInfo.year}-${
-            startDateInfo.month < 10
-              ? "0" + startDateInfo.month
-              : startDateInfo.month
+            startDateInfo.month < 10 ? "0" + startDateInfo.month : startDateInfo.month
           }-${i < 10 ? "0" + i : i}`
         );
       }
@@ -131,17 +115,17 @@ export function listToTree(list: any[]) {
 
 // 加载部门选项
 export function formatTree(nodes: any[]): any[] {
-  return nodes.map(node => {
+  return nodes.map((node) => {
     const formattedNode = {
       value: node.id,
       label: node.name,
-      disabled: node.status === false || String(node.status) === 'false'
+      disabled: node.status === false || String(node.status) === "false",
     };
-    
+
     if (node.children && node.children.length > 0) {
       Object.assign(formattedNode, { children: formatTree(node.children) });
     }
-    
+
     return formattedNode;
   });
 }
@@ -160,6 +144,5 @@ export function isEmpty(obj: string | null | undefined) {
 
 // 验证是否为blob格式
 export function blobValidate(data: Blob): boolean {
-  return data.type !== 'application/json'
+  return data.type !== "application/json";
 }
-
diff --git a/frontend/src/utils/dateUtil.ts b/frontend/src/utils/dateUtil.ts
index 1263574b..d26de942 100644
--- a/frontend/src/utils/dateUtil.ts
+++ b/frontend/src/utils/dateUtil.ts
@@ -1,73 +1,73 @@
-import { reactive, toRefs } from 'vue'
-import { tryOnMounted, tryOnUnmounted } from '@vueuse/core'
-import dayjs from 'dayjs'
+import { reactive, toRefs } from "vue";
+import { tryOnMounted, tryOnUnmounted } from "@vueuse/core";
+import dayjs from "dayjs";
 
-const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm:ss'
-const DATE_FORMAT = 'YYYY-MM-DD'
+const DATE_TIME_FORMAT = "YYYY-MM-DD HH:mm:ss";
+const DATE_FORMAT = "YYYY-MM-DD";
 
 export function formatToDateTime(date?: dayjs.ConfigType, format = DATE_TIME_FORMAT): string {
-  return dayjs(date).format(format)
+  return dayjs(date).format(format);
 }
 
 export function formatToDate(date?: dayjs.ConfigType, format = DATE_FORMAT): string {
-  return dayjs(date).format(format)
+  return dayjs(date).format(format);
 }
 
 export const useNow = (immediate = true) => {
-  let timer: ReturnType<typeof setInterval>
+  let timer: ReturnType<typeof setInterval>;
 
   const state = reactive({
     year: 0,
     month: 0,
-    week: '',
+    week: "",
     day: 0,
-    hour: '',
-    minute: '',
+    hour: "",
+    minute: "",
     second: 0,
-    meridiem: ''
-  })
+    meridiem: "",
+  });
 
   const update = () => {
-    const now = dayjs()
+    const now = dayjs();
 
-    const h = now.format('HH')
-    const m = now.format('mm')
-    const s = now.get('s')
+    const h = now.format("HH");
+    const m = now.format("mm");
+    const s = now.get("s");
 
-    state.year = now.get('y')
-    state.month = now.get('M') + 1
-    state.week = '星期' + ['日', '一', '二', '三', '四', '五', '六'][now.day()]
-    state.day = now.get('date')
-    state.hour = h
-    state.minute = m
-    state.second = s
+    state.year = now.get("y");
+    state.month = now.get("M") + 1;
+    state.week = "星期" + ["日", "一", "二", "三", "四", "五", "六"][now.day()];
+    state.day = now.get("date");
+    state.hour = h;
+    state.minute = m;
+    state.second = s;
 
-    state.meridiem = now.format('A')
-  }
+    state.meridiem = now.format("A");
+  };
 
   function start() {
-    update()
-    clearInterval(timer)
-    timer = setInterval(() => update(), 1000)
+    update();
+    clearInterval(timer);
+    timer = setInterval(() => update(), 1000);
   }
 
   function stop() {
-    clearInterval(timer)
+    clearInterval(timer);
   }
 
   tryOnMounted(() => {
     if (immediate) {
-      start()
+      start();
     }
-  })
+  });
 
   tryOnUnmounted(() => {
-    stop()
-  })
+    stop();
+  });
 
   return {
     ...toRefs(state),
     start,
-    stop
-  }
-}
+    stop,
+  };
+};
diff --git a/frontend/src/utils/errorCode.ts b/frontend/src/utils/errorCode.ts
index ff7f33a5..4680c54d 100644
--- a/frontend/src/utils/errorCode.ts
+++ b/frontend/src/utils/errorCode.ts
@@ -3,10 +3,10 @@ interface ErrorCodeMap {
 }
 
 const errorCode: ErrorCodeMap = {
-  '401': '认证失败，无法访问系统资源',
-  '403': '当前操作没有权限',
-  '404': '访问资源不存在',
-  'default': '系统未知错误，请反馈给管理员'
-}
+  "401": "认证失败，无法访问系统资源",
+  "403": "当前操作没有权限",
+  "404": "访问资源不存在",
+  default: "系统未知错误，请反馈给管理员",
+};
 
-export default errorCode
+export default errorCode;
diff --git a/frontend/src/utils/index.ts b/frontend/src/utils/index.ts
index f65e2f7b..91ce0df4 100644
--- a/frontend/src/utils/index.ts
+++ b/frontend/src/utils/index.ts
@@ -60,61 +60,61 @@ export function formatGrowthRate(growthRate: number) {
 //表单生成相关
 
 export function isNumberStr(str: string): boolean {
-  return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str)
+  return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str);
 }
 
 export function titleCase(str: string): string {
-  return str.replace(/([A-Z])/g, ' $1').replace(/^./, function(str) { return str.toUpperCase(); })
+  return str.replace(/([A-Z])/g, " $1").replace(/^./, function (str) {
+    return str.toUpperCase();
+  });
 }
- 
+
 export function makeMap(str: string, expectsLowerCase?: boolean) {
-  const map = Object.create(null)
-  const list = str.split(',')
+  const map = Object.create(null);
+  const list = str.split(",");
   for (let i = 0; i < list.length; i++) {
-    map[list[i]] = true
+    map[list[i]] = true;
   }
-  return expectsLowerCase
-    ? (val: string) => map[val.toLowerCase()]
-    : (val: string) => map[val]
+  return expectsLowerCase ? (val: string) => map[val.toLowerCase()] : (val: string) => map[val];
 }
 
 export const beautifierConf = {
   html: {
-    indent_size: '2',
-    indent_char: ' ',
-    max_preserve_newlines: '-1',
+    indent_size: "2",
+    indent_char: " ",
+    max_preserve_newlines: "-1",
     preserve_newlines: false,
     keep_array_indentation: false,
     break_chained_methods: false,
-    indent_scripts: 'separate',
-    brace_style: 'end-expand',
+    indent_scripts: "separate",
+    brace_style: "end-expand",
     space_before_conditional: true,
     unescape_strings: false,
     jslint_happy: false,
     end_with_newline: true,
-    wrap_line_length: '110',
+    wrap_line_length: "110",
     indent_inner_html: true,
     comma_first: false,
     e4x: true,
-    indent_empty_lines: true
+    indent_empty_lines: true,
   },
   js: {
-    indent_size: '2',
-    indent_char: ' ',
-    max_preserve_newlines: '-1',
+    indent_size: "2",
+    indent_char: " ",
+    max_preserve_newlines: "-1",
     preserve_newlines: false,
     keep_array_indentation: false,
     break_chained_methods: false,
-    indent_scripts: 'normal',
-    brace_style: 'end-expand',
+    indent_scripts: "normal",
+    brace_style: "end-expand",
     space_before_conditional: true,
     unescape_strings: false,
     jslint_happy: true,
     end_with_newline: true,
-    wrap_line_length: '110',
+    wrap_line_length: "110",
     indent_inner_html: true,
     comma_first: false,
     e4x: true,
-    indent_empty_lines: true
-  }
-}
+    indent_empty_lines: true,
+  },
+};
diff --git a/frontend/src/utils/quickStartManager.ts b/frontend/src/utils/quickStartManager.ts
index c586360b..73e3a665 100644
--- a/frontend/src/utils/quickStartManager.ts
+++ b/frontend/src/utils/quickStartManager.ts
@@ -1,4 +1,4 @@
-import { ElMessage } from 'element-plus';
+import { ElMessage } from "element-plus";
 
 // 快速链接数据类型
 export interface QuickLink {
@@ -10,7 +10,7 @@ export interface QuickLink {
 
 // 快速开始管理器类
 class QuickStartManager {
-  private storageKey = 'quick-start-links';
+  private storageKey = "quick-start-links";
   private listeners: Array<(links: QuickLink[]) => void> = [];
 
   // 获取所有快速链接
@@ -19,7 +19,7 @@ class QuickStartManager {
       const stored = localStorage.getItem(this.storageKey);
       return stored ? JSON.parse(stored) : this.getDefaultLinks();
     } catch (error) {
-      console.error('Failed to load quick links:', error);
+      console.error("Failed to load quick links:", error);
       return this.getDefaultLinks();
     }
   }
@@ -35,16 +35,16 @@ class QuickStartManager {
       localStorage.setItem(this.storageKey, JSON.stringify(links));
       this.notifyListeners(links);
     } catch (error) {
-      console.error('Failed to save quick links:', error);
+      console.error("Failed to save quick links:", error);
     }
   }
 
   // 添加快速链接
   addQuickLink(link: QuickLink): void {
     const links = this.getQuickLinks();
-    
+
     // 检查是否已存在相同路径的链接
-    const existingIndex = links.findIndex(l => l.href === link.href);
+    const existingIndex = links.findIndex((l) => l.href === link.href);
     if (existingIndex !== -1) {
       // 更新现有链接
       links[existingIndex] = { ...links[existingIndex], ...link };
@@ -53,15 +53,15 @@ class QuickStartManager {
       // 添加新链接
       links.push(link);
     }
-    
+
     this.saveQuickLinks(links);
   }
 
   // 删除快速链接
   removeQuickLink(id: string): void {
     const links = this.getQuickLinks();
-    const filteredLinks = links.filter(link => link.id !== id);
-    
+    const filteredLinks = links.filter((link) => link.id !== id);
+
     if (filteredLinks.length < links.length) {
       this.saveQuickLinks(filteredLinks);
     }
@@ -74,13 +74,13 @@ class QuickStartManager {
   // 从路由或菜单信息创建快速链接
   createQuickLinkFromRoute(route: any, customTitle?: string): QuickLink {
     // 确定最终使用的标题 - 优先使用route.title
-    const finalTitle = customTitle || route.title || route.name || '未命名页面';
+    const finalTitle = customTitle || route.title || route.name || "未命名页面";
 
     return {
       title: finalTitle,
       icon: route.icon,
       href: route.fullPath || route.path,
-      id: `route-${route.path.replace(/\//g, '-')}-${Date.now()}`
+      id: `route-${route.path.replace(/\//g, "-")}-${Date.now()}`,
     };
   }
 
@@ -99,11 +99,11 @@ class QuickStartManager {
 
   // 通知所有监听器
   private notifyListeners(links: QuickLink[]): void {
-    this.listeners.forEach(callback => {
+    this.listeners.forEach((callback) => {
       try {
         callback(links);
       } catch (error) {
-        console.error('Error in quick start listener:', error);
+        console.error("Error in quick start listener:", error);
       }
     });
   }
@@ -111,10 +111,9 @@ class QuickStartManager {
   // 检查链接是否已存在
   isLinkExists(href: string): boolean {
     const links = this.getQuickLinks();
-    return links.some(link => link.href === href);
+    return links.some((link) => link.href === href);
   }
 }
 
 // 创建全局实例
 export const quickStartManager = new QuickStartManager();
-
diff --git a/frontend/src/utils/request.ts b/frontend/src/utils/request.ts
index 9cb20ba0..0790de2e 100644
--- a/frontend/src/utils/request.ts
+++ b/frontend/src/utils/request.ts
@@ -1,4 +1,9 @@
-import axios, { type InternalAxiosRequestConfig, type AxiosResponse, type AxiosInstance, type AxiosError} from "axios";
+import axios, {
+  type InternalAxiosRequestConfig,
+  type AxiosResponse,
+  type AxiosInstance,
+  type AxiosError,
+} from "axios";
 import qs from "qs";
 import { useUserStoreHook } from "@/store/modules/user.store";
 import { ResultEnum } from "@/enums/api/result.enum";
@@ -18,7 +23,8 @@ const httpRequest: AxiosInstance = axios.create({
 /**
  * 请求拦截器 - 添加 Authorization 头
  */
-httpRequest.interceptors.request.use((config: InternalAxiosRequestConfig) => {
+httpRequest.interceptors.request.use(
+  (config: InternalAxiosRequestConfig) => {
     const accessToken = Auth.getAccessToken();
 
     // 如果 Authorization 设置为 no-auth，则不携带 Token
@@ -39,7 +45,8 @@ httpRequest.interceptors.request.use((config: InternalAxiosRequestConfig) => {
 /**
  * 响应拦截器 - 统一处理响应和错误
  */
-httpRequest.interceptors.response.use((response: AxiosResponse<ApiResponse>) => {
+httpRequest.interceptors.response.use(
+  (response: AxiosResponse<ApiResponse>) => {
     // 如果响应是二进制流，则直接返回（用于文件下载、Excel 导出等）
     if (response.config.responseType === "blob") {
       return response;
@@ -54,21 +61,22 @@ httpRequest.interceptors.response.use((response: AxiosResponse<ApiResponse>) =>
     }
 
     // 如果请求不是 GET 请求，请求成功时显示成功提示
-    if (response.config.method?.toUpperCase() !== 'GET') {
+    if (response.config.method?.toUpperCase() !== "GET") {
       ElMessage.success(data.msg);
     }
-    
+
     return response;
-  }, async (error: AxiosError<ApiResponse>) => {
+  },
+  async (error: AxiosError<ApiResponse>) => {
     const data = error.response?.data;
-    
+
     // 处理blob类型的错误响应
-    if (error.response?.config.responseType === 'blob' && error.response.data instanceof Blob) {
+    if (error.response?.config.responseType === "blob" && error.response.data instanceof Blob) {
       try {
         // 将blob转换为JSON
         const text = await new Response(error.response.data).text();
         const jsonData: ApiResponse = JSON.parse(text);
-        
+
         if (jsonData.code === ResultEnum.ERROR) {
           ElMessage.error(jsonData.msg || "请求错误");
           return Promise.reject(new Error(jsonData.msg || "请求错误"));
@@ -95,12 +103,12 @@ httpRequest.interceptors.response.use((response: AxiosResponse<ApiResponse>) =>
     } else if (data?.code === ResultEnum.EXCEPTION) {
       ElMessage.error(data.msg || "服务异常");
       return Promise.reject(new Error(data.msg || "服务异常"));
-    }  else {
+    } else {
       ElMessage.error(error.message || "请求异常");
       return Promise.reject(new Error(error.message || "请求异常"));
     }
   }
-);  
+);
 
 /**
  * 重定向到登录页面
diff --git a/frontend/src/utils/storage.ts b/frontend/src/utils/storage.ts
index 7a3d4862..49c52a83 100644
--- a/frontend/src/utils/storage.ts
+++ b/frontend/src/utils/storage.ts
@@ -1,64 +1,400 @@
-/**
- * 存储工具类
- * 提供localStorage和sessionStorage操作方法
- */
-export class Storage {
-  /**
-   * localStorage 存储
-   */
-  static set(key: string, value: any): void {
-    localStorage.setItem(key, JSON.stringify(value));
-  }
+<!-- 角色授权 -->
+<template>
+  <!-- 分配权限弹窗 -->
+  <el-drawer
+    v-model="drawerVisible"
+    :title="'【' + props.roleName + '】权限分配'"
+    :size="drawerSize"
+  >
+    <el-container>
+      <!-- 数据权限 -->
+      <el-aside>
+        <div class="border-r-1 border-r-[#f0f0f0] b-r-solid h-[100%] p-[20px] box-border">
+          <div class="flex items-center">
+            <div style="display: flex; gap: 10px">
+              <div style="width: 10px; background-color: #409eff"></div>
+              <div>
+                <span style="font-size: 16px">数据授权</span>
+                <el-tooltip placement="right">
+                  <template #content>
+                    <span>授权用户可操作的数据范围</span>
+                  </template>
+                  <el-icon class="ml-1 inline-block cursor-pointer">
+                    <QuestionFilled />
+                  </el-icon>
+                </el-tooltip>
+              </div>
+            </div>
+          </div>
+          <div class="mt-3">
+            <el-form ref="dataFormRef" :model="permissionState">
+              <el-form-item prop="data_scope">
+                <el-select v-model="permissionState.data_scope">
+                  <el-option :key="1" label="仅本人数据权限" :value="1" />
+                  <el-option :key="2" label="本部门数据权限" :value="2" />
+                  <el-option :key="3" label="本部门及以下数据权限" :value="3" />
+                  <el-option :key="4" label="全部数据权限" :value="4" />
+                  <el-option :key="5" label="自定义数据权限" :value="5" />
+                </el-select>
+              </el-form-item>
+            </el-form>
 
-  static get<T>(key: string, defaultValue?: T): T {
-    const value = localStorage.getItem(key);
-    if (!value) return defaultValue as T;
+            <div
+              v-if="permissionState.data_scope === 5 && deptTreeData.length"
+              class="mt-5 max-h-[60vh] b-1 b-solid b-[#e5e7eb] p-10px overflow-auto box-border"
+            >
+              <el-input v-model="deptFilterText" placeholder="部门名称" />
+              <el-tree
+                ref="deptTreeRef"
+                node-key="value"
+                show-checkbox
+                :data="deptTreeData"
+                :filter-node-method="handleFilter"
+                default-expand-all
+                :highlight-current="true"
+                :check-strictly="!parentChildLinked"
+                style="height: calc(100% - 60px); overflow-y: auto; margin-top: 10px"
+                @check="deptTreeCheck"
+              >
+                <template #empty>
+                  <el-empty :image-size="80" description="暂无数据" />
+                </template>
+              </el-tree>
+            </div>
+          </div>
+        </div>
+      </el-aside>
 
-    try {
-      return JSON.parse(value);
-    } catch {
-      // 如果解析失败，返回原始字符串
-      return value as unknown as T;
+      <!-- 菜单权限 -->
+      <el-main>
+        <div style="display: flex; gap: 10px">
+          <div style="width: 10px; background-color: #409eff"></div>
+          <div>
+            <span style="font-size: 16px">菜单授权</span>
+            <el-tooltip placement="right">
+              <template #content>
+                <span>授权用户可操作的菜单权限</span>
+              </template>
+              <el-icon class="ml-1 inline-block cursor-pointer">
+                <QuestionFilled />
+              </el-icon>
+            </el-tooltip>
+          </div>
+        </div>
+        <div class="mt-3 flex-x-between">
+          <el-input v-model="permFilterText" placeholder="菜单名称" />
+          <div class="flex-center ml-5">
+            <el-button type="primary" size="small" plain @click="togglePermTree">
+              <template #icon>
+                <Switch />
+              </template>
+              {{ isExpanded ? "收缩" : "展开" }}
+            </el-button>
+            <el-checkbox
+              v-model="parentChildLinked"
+              class="ml-5"
+              @change="handleParentChildLinkedChange"
+            >
+              父子联动
+            </el-checkbox>
+
+            <el-tooltip placement="bottom">
+              <template #content>
+                如果只需勾选菜单权限，不需要勾选子菜单或者按钮权限，请关闭父子联动
+              </template>
+              <el-icon class="ml-1 color-[--el-color-primary] inline-block cursor-pointer">
+                <QuestionFilled />
+              </el-icon>
+            </el-tooltip>
+          </div>
+        </div>
+
+        <div class="mt-5 max-h-[65vh] b-1 b-solid b-[#e5e7eb] p-10px overflow-auto box-border">
+          <el-tree
+            ref="permTreeRef"
+            node-key="value"
+            show-checkbox
+            :data="menuTreeData"
+            :filter-node-method="handleFilter"
+            default-expand-all
+            :highlight-current="true"
+            :check-strictly="!parentChildLinked"
+            style="height: calc(100% - 60px); overflow: auto; margin-top: 10px"
+            @check="menuTreeCheck"
+          >
+            <template #empty>
+              <el-empty :image-size="80" description="暂无数据" />
+            </template>
+          </el-tree>
+        </div>
+      </el-main>
+    </el-container>
+
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="handleCancel">取 消</el-button>
+        <el-button type="primary" @click.stop="handleDrawerSave">确 定</el-button>
+      </div>
+    </template>
+  </el-drawer>
+</template>
+
+<script setup lang="ts">
+// 添加 props 来接收 dictType
+const props = defineProps({
+  roleName: {
+    type: String,
+    required: true,
+  },
+  roleId: {
+    type: Number,
+    required: true,
+  },
+  modelValue: {
+    type: Boolean,
+    required: true,
+  },
+});
+
+import { listToTree, formatTree } from "@/utils/common";
+import RoleAPI, {
+  permissionDataType,
+  permissionDeptType,
+  permissionMenuType,
+} from "@/api/module_system/role";
+import DeptAPI from "@/api/module_system/dept";
+import MenuAPI from "@/api/module_system/menu";
+import type { TreeInstance } from "element-plus";
+import { useAppStore } from "@/store/modules/app.store";
+import { DeviceEnum } from "@/enums/settings/device.enum";
+import { useUserStore } from "@/store";
+
+const appStore = useAppStore();
+const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "800px" : "90%"));
+const emit = defineEmits(["update:modelValue", "saved"]);
+
+const permTreeRef = ref<TreeInstance>();
+const deptTreeRef = ref<TreeInstance>();
+const deptFilterText = ref("");
+const permFilterText = ref("");
+const dataFormRef = ref();
+const drawerVisible = computed({
+  get() {
+    return props.modelValue;
+  },
+  set(value) {
+    emit("update:modelValue", value);
+  },
+});
+const isExpanded = ref(true);
+const parentChildLinked = ref(false);
+const loading = ref<boolean>(false);
+const deptTreeData = ref<permissionDeptType[]>([]);
+const menuTreeData = ref<permissionMenuType[]>([]);
+const permissionState = ref<permissionDataType>({
+  role_ids: [],
+  menu_ids: [],
+  data_scope: 1,
+  dept_ids: [],
+});
+
+// 初始化方法,用于打开抽屉并加载数据
+const init = async () => {
+  loading.value = true;
+
+  try {
+    // 获取全部部门树
+    const deptResponse = await DeptAPI.getDeptList();
+    deptTreeData.value = formatTree(listToTree(deptResponse.data.data));
+
+    // 获取全部菜单树
+    const menuResponse = await MenuAPI.getMenuList();
+    menuTreeData.value = formatTree(listToTree(menuResponse.data.data));
+
+    // 获取角色详情
+    const roleResponse = await RoleAPI.getRoleDetail(props.roleId);
+
+    // 更新权限状态
+    permissionState.value = {
+      role_ids: [props.roleId],
+      menu_ids: roleResponse.data.data.menus?.map((menu) => menu.id) || [],
+      data_scope: roleResponse.data.data.data_scope || 1,
+      dept_ids: roleResponse.data.data.depts?.map((dept) => dept.id) || [],
+    };
+
+    // 根据保存的权限数据判断是否应该开启父子联动
+    parentChildLinked.value = checkParentChildLinked(
+      permissionState.value.menu_ids,
+      menuTreeData.value
+    );
+
+    // 回显菜单树选中项
+    if (permTreeRef.value) {
+      await permTreeRef.value.setCheckedKeys(permissionState.value.menu_ids);
     }
-  }
 
-  static remove(key: string): void {
-    localStorage.removeItem(key);
-  }
-
-  /**
-   * localStorage 清空
-   */
-  static clear(): void {
-    localStorage.clear();
-  }
-
-  /**
-   * sessionStorage 存储
-   */
-  static sessionSet(key: string, value: any): void {
-    sessionStorage.setItem(key, JSON.stringify(value));
-  }
-
-  static sessionGet<T>(key: string, defaultValue?: T): T {
-    const value = sessionStorage.getItem(key);
-    if (!value) return defaultValue as T;
-
-    try {
-      return JSON.parse(value);
-    } catch {
-      // 如果解析失败，返回原始字符串
-      return value as unknown as T;
+    // 修改：增加对 deptTreeRef.value 的存在性判断，并添加日志
+    if (permissionState.value.data_scope === 5 && deptTreeRef.value) {
+      // await 一定不能丢，否则到导致初始化时候deptTreeRef.value 为 undefined
+      await deptTreeRef.value.setCheckedKeys(permissionState.value.dept_ids);
     }
+  } catch (error: any) {
+    ElMessage.error("获取权限数据失败: " + error.message);
+  } finally {
+    loading.value = false;
+    // handleCancel()
   }
+};
 
-  static sessionRemove(key: string): void {
-    sessionStorage.removeItem(key);
-  }
-  /**
-   * sessionStorage 清空
-   */
-  static sessionClear(): void {
-    sessionStorage.clear();
+// 取消按钮处理函数
+function handleCancel() {
+  drawerVisible.value = false;
+}
+
+// 保存权限分配
+async function handleDrawerSave() {
+  try {
+    if (props.roleId === 1) {
+      ElMessage.warning("系统默认角色，不可操作");
+      return;
+    }
+    loading.value = true;
+
+    // 构造提交数据
+    const submitData: permissionDataType = {
+      role_ids: [props.roleId],
+      menu_ids: (permTreeRef.value?.getCheckedKeys() || []).map((key) => Number(key)),
+      data_scope: permissionState.value.data_scope,
+      dept_ids: (deptTreeRef.value?.getCheckedKeys() || []).map((key) => Number(key)),
+    };
+
+    await RoleAPI.setPermission(submitData);
+
+    // 更新全局用户状态，刷新权限信息
+    const userStore = useUserStore();
+    await userStore.getUserInfo();
+
+    drawerVisible.value = false;
+    emit("saved");
+  } catch (error: any) {
+    console.error(error);
+  } finally {
+    loading.value = false;
   }
 }
+
+// 部门树选择回调
+const deptTreeCheck = (checkedIds: number[]) => {
+  permissionState.value.dept_ids = checkedIds;
+};
+
+// 菜单选择变更回调
+const menuTreeCheck = (checkedIds: number[]) => {
+  permissionState.value.menu_ids = checkedIds;
+};
+
+// 展开/收缩 菜单权限树
+function togglePermTree() {
+  isExpanded.value = !isExpanded.value;
+  if (permTreeRef.value) {
+    Object.values(permTreeRef.value.store.nodesMap).forEach((node: any) => {
+      if (isExpanded.value) {
+        node.expand();
+      } else {
+        node.collapse();
+      }
+    });
+  }
+}
+
+// 部门筛选
+watch(deptFilterText, (val) => {
+  deptTreeRef.value!.filter(val);
+});
+
+// 菜单筛选
+watch(permFilterText, (val) => {
+  permTreeRef.value!.filter(val);
+});
+
+// 树节点过滤
+function handleFilter(value: string, data: { [key: string]: any }) {
+  if (!value) return true;
+  return data.label.includes(value);
+}
+
+// 检查权限数据是否遵循父子联动模式
+function checkParentChildLinked(menuIds: number[], menuTreeData: permissionMenuType[]): boolean {
+  if (!menuIds.length || !menuTreeData.length) return false;
+
+  // 创建一个映射来快速查找菜单项
+  const menuMap = new Map<number, permissionMenuType>();
+  const buildMenuMap = (menus: permissionMenuType[]) => {
+    menus.forEach((menu) => {
+      menuMap.set(menu.id, menu);
+      if (menu.children) {
+        buildMenuMap(menu.children);
+      }
+    });
+  };
+  buildMenuMap(menuTreeData);
+
+  let hasParentChildConflict = false;
+
+  // 检查每个选中的菜单项
+  for (const menuId of menuIds) {
+    const menu = menuMap.get(menuId);
+    if (!menu) continue;
+
+    // 如果选中了父菜单，检查是否有子菜单未被选中
+    if (menu.children && menu.children.length > 0) {
+      const hasUnselectedChildren = menu.children.some((child) => !menuIds.includes(child.id));
+      if (hasUnselectedChildren) {
+        hasParentChildConflict = true;
+        break; // 发现冲突，直接返回false
+      }
+    }
+
+    // 如果选中了子菜单，检查父菜单是否也被选中
+    const parentMenu = findParentMenu(menuId, menuTreeData);
+    if (parentMenu && !menuIds.includes(parentMenu.id)) {
+      hasParentChildConflict = true;
+      break; // 发现冲突，直接返回false
+    }
+  }
+
+  // 如果没有发现父子冲突，说明是父子联动模式
+  return !hasParentChildConflict;
+}
+
+// 查找父菜单
+function findParentMenu(
+  menuId: number,
+  menuTreeData: permissionMenuType[]
+): permissionMenuType | null {
+  for (const menu of menuTreeData) {
+    if (menu.children) {
+      for (const child of menu.children) {
+        if (child.id === menuId) {
+          return menu;
+        }
+        // 递归查找更深层的父菜单
+        const found = findParentMenu(menuId, [child]);
+        if (found) return found;
+      }
+    }
+  }
+  return null;
+}
+
+// 父子菜单节点是否联动
+function handleParentChildLinkedChange(val: any) {
+  parentChildLinked.value = val;
+}
+
+onMounted(async () => {
+  await init();
+});
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/frontend/src/views/current/profile.vue b/frontend/src/views/current/profile.vue
index f3af872b..f430ce94 100644
--- a/frontend/src/views/current/profile.vue
+++ b/frontend/src/views/current/profile.vue
@@ -10,114 +10,115 @@
             </div>
           </template>
           <div class="user-info-header">
-            <div class="avatar-alert mb-10px"> 
+            <div class="avatar-alert mb-10px">
               <!-- 提示：头像上传成功后请点击“保存更改”按钮才会生效 -->
-              <el-alert type="info" show-icon :closable="false" title="头像上传，点击“保存更改”按钮使其生效" />
+              <el-alert
+                type="info"
+                show-icon
+                :closable="false"
+                title="头像上传，点击“保存更改”按钮使其生效"
+              />
             </div>
-            
+
             <div class="avatar-wrapper">
-              <el-avatar 
-                v-if="infoFormState.avatar"
-                :src="infoFormState.avatar" 
-                :size="120"
-              />
-              <el-avatar 
-                v-else
-                icon="UserFilled" 
-                :size="120"
-              />
-                
+              <el-avatar v-if="infoFormState.avatar" :src="infoFormState.avatar" :size="120" />
+              <el-avatar v-else icon="UserFilled" :size="120" />
+
               <el-upload
-                  ref="uploadRef"
-                  v-model:file-list="fileList"
-                  class="el-upload"
-                  name="file"
-                  :show-file-list="false"
-                  :before-upload="handleBeforeUpload"
-                  :http-request="handleUpload"
-                  :disabled="loading"
-                  :limit="1"
-                  :auto-upload="false"
-                  @change="handleFileChange"
-                >
-                  <template #trigger>
-                      <el-button v-hasPerm="['module_system:user:update']" type="primary" :icon="Camera" class="upload-trigger"/>
-                    </template>
-                </el-upload>
+                ref="uploadRef"
+                v-model:file-list="fileList"
+                class="el-upload"
+                name="file"
+                :show-file-list="false"
+                :before-upload="handleBeforeUpload"
+                :http-request="handleUpload"
+                :disabled="loading"
+                :limit="1"
+                :auto-upload="false"
+                @change="handleFileChange"
+              >
+                <template #trigger>
+                  <el-button
+                    v-hasPerm="['module_system:user:update']"
+                    type="primary"
+                    :icon="Camera"
+                    class="upload-trigger"
+                  />
+                </template>
+              </el-upload>
             </div>
             <span class="user-name">
               {{ infoFormState.name }}
             </span>
 
-            <el-text>{{infoFormState.roles?.map(item => item.name).join('、')}}</el-text>
+            <el-text>{{ infoFormState.roles?.map((item) => item.name).join("、") }}</el-text>
           </div>
 
           <el-divider />
 
-          <el-descriptions :column="1"  border>
-
+          <el-descriptions :column="1" border>
             <el-descriptions-item>
               <template #label>
-                <div class="cell-item"> 
+                <div class="cell-item">
                   <el-icon :style="iconStyle">
                     <User />
                   </el-icon>
-                  <span >账号</span>
+                  <span>账号</span>
                 </div>
               </template>
-              <span >{{ infoFormState.username }}</span>
+              <span>{{ infoFormState.username }}</span>
             </el-descriptions-item>
             <el-descriptions-item>
               <template #label>
-                <div class="cell-item"> 
+                <div class="cell-item">
                   <el-icon :style="iconStyle">
                     <Coordinate />
                   </el-icon>
-                  <span >部门</span>
+                  <span>部门</span>
                 </div>
               </template>
-              <span >{{ infoFormState.dept?.name }}</span>
+              <span>{{ infoFormState.dept?.name }}</span>
             </el-descriptions-item>
             <el-descriptions-item>
               <template #label>
-                <div class="cell-item"> 
+                <div class="cell-item">
                   <el-icon :style="iconStyle">
                     <OfficeBuilding />
                   </el-icon>
-                  <span >岗位</span>
+                  <span>岗位</span>
                 </div>
               </template>
-              <span >{{infoFormState.positions?.map(item => item.name).join('、')}}</span>
+              <span>{{ infoFormState.positions?.map((item) => item.name).join("、") }}</span>
             </el-descriptions-item>
             <el-descriptions-item>
               <template #label>
-                <div class="cell-item"> 
+                <div class="cell-item">
                   <el-icon :style="iconStyle">
                     <Phone />
                   </el-icon>
-                  <span >手机</span>
+                  <span>手机</span>
                 </div>
               </template>
-              <span >{{ infoFormState.mobile }}</span>
+              <span>{{ infoFormState.mobile }}</span>
             </el-descriptions-item>
             <el-descriptions-item>
               <template #label>
-                <div class="cell-item"> 
+                <div class="cell-item">
                   <el-icon :style="iconStyle">
                     <Message />
                   </el-icon>
-                  <span >邮箱</span>
+                  <span>邮箱</span>
                 </div>
               </template>
-              <span >{{ infoFormState.email }}</span>
+              <span>{{ infoFormState.email }}</span>
             </el-descriptions-item>
             <el-descriptions-item>
               <template #label>
-                <div class="cell-item"> 
+                <div class="cell-item">
                   <el-icon :style="iconStyle">
                     <Clock />
                   </el-icon>
-                  <span >加入时间</span>
+                  <span>加入时间</span>
                 </div>
               </template>
               <span>{{ infoFormState.created_at }}</span>
@@ -138,30 +139,65 @@
                 <span>基本设置</span>
               </template>
               <div>
-                <el-form ref="infoFormRef" :model="infoFormState" :rules="rules"  label-width="80px" label-suffix=":">
-                  
+                <el-form
+                  ref="infoFormRef"
+                  :model="infoFormState"
+                  :rules="rules"
+                  label-width="80px"
+                  label-suffix=":"
+                >
                   <el-form-item label="用户名" prop="name">
-                    <el-input v-model="infoFormState.name" placeholder="请输入用户名" prefix-icon="User" clearable style="width: 240px;" />
+                    <el-input
+                      v-model="infoFormState.name"
+                      placeholder="请输入用户名"
+                      prefix-icon="User"
+                      clearable
+                      style="width: 240px"
+                    />
                   </el-form-item>
 
                   <el-form-item label="手机号" prop="mobile">
-                    <el-input v-model="infoFormState.mobile" placeholder="请输入手机号码" prefix-icon="Phone" clearable style="width: 240px;" />
+                    <el-input
+                      v-model="infoFormState.mobile"
+                      placeholder="请输入手机号码"
+                      prefix-icon="Phone"
+                      clearable
+                      style="width: 240px"
+                    />
                   </el-form-item>
 
                   <el-form-item label="邮箱" prop="email">
-                    <el-input v-model="infoFormState.email" placeholder="请输入邮箱" prefix-icon="Message" clearable style="width: 240px;" />
+                    <el-input
+                      v-model="infoFormState.email"
+                      placeholder="请输入邮箱"
+                      prefix-icon="Message"
+                      clearable
+                      style="width: 240px"
+                    />
                   </el-form-item>
 
                   <el-form-item label="性别" prop="gender">
                     <el-radio-group v-model="infoFormState.gender">
-                      <el-radio v-for="item in dictDataStore['sys_user_sex']" :key="item.dict_value" :value="item.dict_value" >
+                      <el-radio
+                        v-for="item in dictDataStore['sys_user_sex']"
+                        :key="item.dict_value"
+                        :value="item.dict_value"
+                      >
                         {{ item.dict_label }}
                       </el-radio>
                     </el-radio-group>
                   </el-form-item>
 
                   <el-form-item>
-                    <el-button v-hasPerm="['module_system:user:update']" type="primary" :loading="infoSubmitting" icon="edit" @click="handleSave">保存更改</el-button>
+                    <el-button
+                      v-hasPerm="['module_system:user:update']"
+                      type="primary"
+                      :loading="infoSubmitting"
+                      icon="edit"
+                      @click="handleSave"
+                    >
+                      保存更改
+                    </el-button>
                   </el-form-item>
                 </el-form>
               </div>
@@ -175,9 +211,23 @@
                 <span>安全设置</span>
               </template>
               <div>
-                <el-form ref="passwordFormRef" :model="passwordFormState" :rules="resetPasswordRules"  label-width="120px" label-suffix=":">
+                <el-form
+                  ref="passwordFormRef"
+                  :model="passwordFormState"
+                  :rules="resetPasswordRules"
+                  label-width="120px"
+                  label-suffix=":"
+                >
                   <el-form-item label="当前密码" prop="old_password">
-                    <el-input v-model.trim="passwordFormState.old_password" :placeholder="t('login.password')" type="password" prefix-icon="Unlock" show-password clearable style="width: 240px;">
+                    <el-input
+                      v-model.trim="passwordFormState.old_password"
+                      :placeholder="t('login.password')"
+                      type="password"
+                      prefix-icon="Unlock"
+                      show-password
+                      clearable
+                      style="width: 240px"
+                    >
                       <template #prefix>
                         <Lock />
                       </template>
@@ -185,7 +235,15 @@
                   </el-form-item>
 
                   <el-form-item label="新密码" prop="new_password">
-                    <el-input v-model.trim="passwordFormState.new_password" type="password" :placeholder="t('login.newPassword')" prefix-icon="Unlock" show-password clearable style="width: 240px;">
+                    <el-input
+                      v-model.trim="passwordFormState.new_password"
+                      type="password"
+                      :placeholder="t('login.newPassword')"
+                      prefix-icon="Unlock"
+                      show-password
+                      clearable
+                      style="width: 240px"
+                    >
                       <template #prefix>
                         <Key />
                       </template>
@@ -193,7 +251,15 @@
                   </el-form-item>
 
                   <el-form-item label="确认新密码" prop="confirm_password">
-                    <el-input v-model.trim="passwordFormState.confirm_password" type="password" :placeholder="t('login.message.password.confirm')" prefix-icon="Lock" show-password clearable style="width: 240px;">
+                    <el-input
+                      v-model.trim="passwordFormState.confirm_password"
+                      type="password"
+                      :placeholder="t('login.message.password.confirm')"
+                      prefix-icon="Lock"
+                      show-password
+                      clearable
+                      style="width: 240px"
+                    >
                       <template #prefix>
                         <Check />
                       </template>
@@ -201,7 +267,15 @@
                   </el-form-item>
 
                   <el-form-item>
-                    <el-button v-hasPerm="['current:profile:change_password']" type="primary" :loading="passwordChanging" icon="edit" @click="handlePasswordChange">更新密码</el-button>
+                    <el-button
+                      v-hasPerm="['current:profile:change_password']"
+                      type="primary"
+                      :loading="passwordChanging"
+                      icon="edit"
+                      @click="handlePasswordChange"
+                    >
+                      更新密码
+                    </el-button>
                   </el-form-item>
                 </el-form>
               </div>
@@ -214,14 +288,20 @@
 </template>
 
 <script lang="ts" setup>
-import type { FormInstance, UploadRequestOptions, UploadFile, ElUpload, ComponentSize } from 'element-plus'
-import UserAPI, { type InfoFormState, type PasswordFormState } from '@/api/module_system/user';
+import type {
+  FormInstance,
+  UploadRequestOptions,
+  UploadFile,
+  ElUpload,
+  ComponentSize,
+} from "element-plus";
+import UserAPI, { type InfoFormState, type PasswordFormState } from "@/api/module_system/user";
 import { useUserStore, useDictStore } from "@/store";
 import { useUserStoreHook } from "@/store/modules/user.store";
-import { Camera } from '@element-plus/icons-vue';
-import { ElMessage } from 'element-plus';
+import { Camera } from "@element-plus/icons-vue";
+import { ElMessage } from "element-plus";
 import { useI18n } from "vue-i18n";
-import { nextTick } from 'vue';
+import { nextTick } from "vue";
 import router from "@/router";
 
 const { t } = useI18n();
@@ -233,23 +313,22 @@ const loading = ref<boolean>(false);
 
 const dictDataStore = computed(() => dictStore.dictData);
 
-
-const size = ref<ComponentSize>('default')
+const size = ref<ComponentSize>("default");
 
 const iconStyle = computed(() => {
   const marginMap = {
-    large: '8px',
-    default: '6px',
-    small: '4px',
-  }
+    large: "8px",
+    default: "6px",
+    small: "4px",
+  };
   return {
-    marginRight: marginMap[size.value || 'default'],
-  }
-})
+    marginRight: marginMap[size.value || "default"],
+  };
+});
 
 // 字典数据
 const getOptions = async () => {
-  return await dictStore.getDict(['sys_user_sex']);;
+  return await dictStore.getDict(["sys_user_sex"]);
 };
 
 // 状态定义
@@ -268,14 +347,14 @@ const infoFormState = reactive<InfoFormState>({
   positions: [],
   roles: [],
   avatar: undefined,
-  created_at: undefined
+  created_at: undefined,
 });
 
 // 修改密码表单
 const passwordFormState = reactive<PasswordFormState>({
-  old_password: '',
-  new_password: '',
-  confirm_password: ''
+  old_password: "",
+  new_password: "",
+  confirm_password: "",
 });
 
 // 头像上传处理优化
@@ -284,15 +363,15 @@ const uploadRef = ref<InstanceType<typeof ElUpload>>();
 
 // 文件上传前校验
 const handleBeforeUpload = (file: File) => {
-  const isImage = file.type.startsWith('image/');
+  const isImage = file.type.startsWith("image/");
   const isLt2M = file.size / 1024 / 1024 < 2;
 
   if (!isImage) {
-    ElMessage.error('只能上传图片文件');
+    ElMessage.error("只能上传图片文件");
     return false;
   }
   if (!isLt2M) {
-    ElMessage.error('上传图片大小不能超过 2MB!');
+    ElMessage.error("上传图片大小不能超过 2MB!");
     return false;
   }
   return true;
@@ -303,39 +382,39 @@ const handleUpload = async (options: UploadRequestOptions) => {
   try {
     const file = options.file;
     const formData = new FormData();
-    formData.append('file', file);
+    formData.append("file", file);
 
     const response = await UserAPI.uploadCurrentUserAvatar(formData);
 
     if (response.data.code === 0 && response.data.data) {
-        const fileUrl = response.data.data.file_url;
-        updateAvatar(fileUrl);
-        options.onSuccess(response);
-        // 重置上传组件状态，允许再次选择上传
-        if (uploadRef.value) {
-          uploadRef.value.clearFiles();
-        }
-        fileList.value = [];
-      } else {
-      const errorMsg = response.data.msg || '上传失败';
+      const fileUrl = response.data.data.file_url;
+      updateAvatar(fileUrl);
+      options.onSuccess(response);
+      // 重置上传组件状态，允许再次选择上传
+      if (uploadRef.value) {
+        uploadRef.value.clearFiles();
+      }
+      fileList.value = [];
+    } else {
+      const errorMsg = response.data.msg || "上传失败";
       ElMessage.error(errorMsg);
       options.onError({
         ...new Error(errorMsg),
         status: response.status || 500,
-        method: 'POST',
-        url: '/system/user/current/avatar/upload'
+        method: "POST",
+        url: "/system/user/current/avatar/upload",
       });
     }
   } catch (error) {
-    ElMessage.error('头像上传失败，请重试');
+    ElMessage.error("头像上传失败，请重试");
     const errorObj = error instanceof Error ? error : new Error(String(error));
     options.onError({
       ...errorObj,
       status: 500,
-      method: 'POST',
-      url: '/system/user/current/avatar/upload'
+      method: "POST",
+      url: "/system/user/current/avatar/upload",
     });
-    console.error('Upload error:', error);
+    console.error("Upload error:", error);
   }
 };
 
@@ -359,20 +438,17 @@ const updateAvatar = (fileUrl: string) => {
     infoFormState.avatar = fileUrl;
     // 确保DOM正确更新
     nextTick(() => {
-      console.log('头像已更新:', infoFormState.avatar);
+      console.log("头像已更新:", infoFormState.avatar);
     });
   } else {
-    ElMessage.error('无效的头像URL');
-    console.error('Invalid fileUrl:', fileUrl);
+    ElMessage.error("无效的头像URL");
+    console.error("Invalid fileUrl:", fileUrl);
   }
 };
 
-
 // 邮箱校验规则优化
 const rules = {
-  name: [
-    { required: true, message: "请输入用户名", trigger: "blur" },
-  ],
+  name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
   mobile: [
     {
       pattern: /^1[3-9]\d{9}$/,
@@ -389,46 +465,45 @@ const rules = {
   ],
 };
 
-
 const resetPasswordRules = {
-    old_password: [
-      {
-        required: true,
-        trigger: "blur",
-        message: t("login.password"),
+  old_password: [
+    {
+      required: true,
+      trigger: "blur",
+      message: t("login.password"),
+    },
+  ],
+  new_password: [
+    {
+      required: true,
+      trigger: "blur",
+      message: t("login.message.password.required"),
+    },
+    {
+      min: 6,
+      message: t("login.message.password.min"),
+      trigger: "blur",
+    },
+  ],
+  confirm_password: [
+    {
+      required: true,
+      trigger: "blur",
+      message: t("login.message.password.required"),
+    },
+    {
+      min: 6,
+      message: t("login.message.password.min"),
+      trigger: "blur",
+    },
+    {
+      validator: (_: any, value: string) => {
+        return value === passwordFormState.new_password;
       },
-    ],
-    new_password: [
-      {
-        required: true,
-        trigger: "blur",
-        message: t("login.message.password.required"),
-      },
-      {
-        min: 6,
-        message: t("login.message.password.min"),
-        trigger: "blur",
-      },
-    ],
-    confirm_password: [
-      {
-        required: true,
-        trigger: "blur",
-        message: t("login.message.password.required"),
-      },
-      {
-        min: 6,
-        message: t("login.message.password.min"),
-        trigger: "blur",
-      },
-      {
-        validator: (_: any, value: string) => {
-          return value === passwordFormState.new_password;
-        },
-        trigger: "blur",
-        message: t("login.message.password.inconformity"),
-      },
-    ],
+      trigger: "blur",
+      message: t("login.message.password.inconformity"),
+    },
+  ],
 };
 
 // 初始化表单
@@ -440,9 +515,9 @@ const initInfoForm = () => {
 // 初始化密码表单
 const initPasswordForm = () => {
   Object.assign(passwordFormState, {
-    old_password: '',
-    new_password: '',
-    confirm_password: ''
+    old_password: "",
+    new_password: "",
+    confirm_password: "",
   });
 };
 
@@ -455,9 +530,9 @@ const handleSave = async () => {
       return;
     }
     // 确保avatar字段被正确处理
-    const response = await UserAPI.updateCurrentUserInfo({...infoFormState});
+    const response = await UserAPI.updateCurrentUserInfo({ ...infoFormState });
     await userStore.setUserInfo(response.data.data);
-    ElMessage.success('个人资料已保存');
+    ElMessage.success("个人资料已保存");
   } finally {
     infoSubmitting.value = false;
   }
@@ -521,7 +596,6 @@ onMounted(async () => {
     position: relative;
 
     .el-upload {
-
       &:hover {
         opacity: 0.8; /* 鼠标悬浮时稍微降低透明度 */
       }
diff --git a/frontend/src/views/dashboard/index.vue b/frontend/src/views/dashboard/index.vue
index e917ac79..723ba582 100644
--- a/frontend/src/views/dashboard/index.vue
+++ b/frontend/src/views/dashboard/index.vue
@@ -7,7 +7,10 @@
       <div class="flex flex-wrap">
         <!-- 左侧问候语区域 -->
         <div class="flex-1 flex items-start">
-          <img class="w80px h80px rounded-full" :src="userStore.basicInfo.avatar + '?imageView2/1/w/80/h/80'" />
+          <img
+            class="w80px h80px rounded-full"
+            :src="userStore.basicInfo.avatar + '?imageView2/1/w/80/h/80'"
+          />
           <div class="ml-5">
             <div class="text-20px font-bold mb-5px">
               {{ timefix }}{{ userStore.basicInfo.name }}，{{ welcome }}
@@ -93,9 +96,7 @@
 
           <div class="flex-x-between mt-2 flex-1">
             <div class="flex-y-center">
-              <span class="text-lg transition-all duration-300 hover:scale-110">
-                9999
-              </span>
+              <span class="text-lg transition-all duration-300 hover:scale-110">9999</span>
               <span v-if="true" class="ml-2 text-xs text-[#67c23a]">
                 <el-icon>
                   <Connection />
@@ -153,7 +154,13 @@
               <div class="flex-x-between mt-2 flex-1">
                 <div class="flex-y-center">
                   <span class="text-lg">{{ Math.round(transitionUvCount) }}</span>
-                  <span :class="['text-xs', 'ml-2', computeGrowthRateClass(visitStatsData.uvGrowthRate)]">
+                  <span
+                    :class="[
+                      'text-xs',
+                      'ml-2',
+                      computeGrowthRateClass(visitStatsData.uvGrowthRate),
+                    ]"
+                  >
                     <el-icon>
                       <Top v-if="visitStatsData.uvGrowthRate > 0" />
                       <Bottom v-else-if="visitStatsData.uvGrowthRate < 0" />
@@ -207,7 +214,13 @@
               <div class="flex-x-between mt-2 flex-1">
                 <div class="flex-y-center">
                   <span class="text-lg">{{ Math.round(transitionPvCount) }}</span>
-                  <span :class="['text-xs', 'ml-2', computeGrowthRateClass(visitStatsData.pvGrowthRate)]">
+                  <span
+                    :class="[
+                      'text-xs',
+                      'ml-2',
+                      computeGrowthRateClass(visitStatsData.pvGrowthRate),
+                    ]"
+                  >
                     <el-icon>
                       <Top v-if="visitStatsData.pvGrowthRate > 0" />
                       <Bottom v-else-if="visitStatsData.pvGrowthRate < 0" />
@@ -250,7 +263,12 @@
           <template #header>
             <div class="flex-x-between">
               <span class="header-title">最新动态</span>
-              <el-link type="primary" underline="never" href="https://gitee.com/tao__tao/FastapiAdmin/releases" target="_blank">
+              <el-link
+                type="primary"
+                underline="never"
+                href="https://gitee.com/tao__tao/FastapiAdmin/releases"
+                target="_blank"
+              >
                 完整记录
                 <el-icon class="link-icon">
                   <TopRight />
@@ -261,7 +279,15 @@
 
           <el-scrollbar height="400px">
             <el-timeline class="p-3">
-              <el-timeline-item v-for="(item, index) in vesionList" :key="index" :timestamp="item.date" placement="top" :color="index === 0 ? '#67C23A' : '#909399'" :hollow="index !== 0" size="large">
+              <el-timeline-item
+                v-for="(item, index) in vesionList"
+                :key="index"
+                :timestamp="item.date"
+                placement="top"
+                :color="index === 0 ? '#67C23A' : '#909399'"
+                :hollow="index !== 0"
+                size="large"
+              >
                 <div class="version-item" :class="{ 'latest-item': index === 0 }">
                   <div>
                     <el-text tag="strong">{{ item.title }}</el-text>
@@ -273,7 +299,12 @@
                   <el-text class="version-content">{{ item.content }}</el-text>
 
                   <div v-if="item.link">
-                    <el-link :type="index === 0 ? 'primary' : 'info'" :href="item.link" target="_blank" underline="never">
+                    <el-link
+                      :type="index === 0 ? 'primary' : 'info'"
+                      :href="item.link"
+                      target="_blank"
+                      underline="never"
+                    >
                       详情
                       <el-icon class="link-icon">
                         <TopRight />
@@ -301,11 +332,10 @@ import { useUserStore } from "@/store/modules/user.store";
 import { formatGrowthRate } from "@/utils";
 import { useTransition } from "@vueuse/core";
 import { Connection, Failed } from "@element-plus/icons-vue";
-import { greetings } from '@/utils/common';
+import { greetings } from "@/utils/common";
 
 const timefix = greetings();
-const welcome = '祝你开心每一天！';
-
+const welcome = "祝你开心每一天！";
 
 interface VersionItem {
   id: string;
@@ -323,7 +353,7 @@ const vesionList = ref<VersionItem[]>([
   {
     id: "1",
     title: "v3.2.1",
-    date: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+    date: dayjs().format("YYYY-MM-DD HH:mm:ss"),
     content: "优化性能，修复若干小bug。",
     link: "https://gitee.com/tao__tao/FastapiAdmin/releases",
     tag: "更新",
@@ -331,7 +361,7 @@ const vesionList = ref<VersionItem[]>([
   {
     id: "2",
     title: "v3.2.0",
-    date: dayjs().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'),
+    date: dayjs().subtract(1, "day").format("YYYY-MM-DD HH:mm:ss"),
     content: "新增用户行为分析功能。",
     link: "https://gitee.com/tao__tao/FastapiAdmin/releases",
     tag: "新功能",
@@ -339,7 +369,7 @@ const vesionList = ref<VersionItem[]>([
   {
     id: "3",
     title: "v3.1.0",
-    date: dayjs().subtract(3, 'day').format('YYYY-MM-DD HH:mm:ss'),
+    date: dayjs().subtract(3, "day").format("YYYY-MM-DD HH:mm:ss"),
     content: "优化权限管理系统。",
     link: "https://gitee.com/tao__tao/FastapiAdmin/releases",
     tag: "优化",
@@ -419,7 +449,9 @@ const updateVisitTrendChartOptions = () => {
     xAxis: {
       type: "category",
       data: Array.from({ length: visitTrendDateRange.value }, (_, index) =>
-        dayjs().subtract(visitTrendDateRange.value - index - 1, "day").format("YYYY-MM-DD")
+        dayjs()
+          .subtract(visitTrendDateRange.value - index - 1, "day")
+          .format("YYYY-MM-DD")
       ),
     },
     yAxis: {
@@ -435,8 +467,9 @@ const updateVisitTrendChartOptions = () => {
       {
         name: "浏览量(PV)",
         type: "line",
-        data: Array.from({ length: visitTrendDateRange.value }, () =>
-          Math.floor(Math.random() * 500) + 100
+        data: Array.from(
+          { length: visitTrendDateRange.value },
+          () => Math.floor(Math.random() * 500) + 100
         ),
         areaStyle: {
           color: "rgba(64, 158, 255, 0.1)",
@@ -452,8 +485,9 @@ const updateVisitTrendChartOptions = () => {
       {
         name: "访客数(UV)",
         type: "line",
-        data: Array.from({ length: visitTrendDateRange.value }, () =>
-          Math.floor(Math.random() * 200) + 50
+        data: Array.from(
+          { length: visitTrendDateRange.value },
+          () => Math.floor(Math.random() * 200) + 50
         ),
         areaStyle: {
           color: "rgba(103, 194, 58, 0.1)",
diff --git a/frontend/src/views/dashboard/workplace.vue b/frontend/src/views/dashboard/workplace.vue
index e25fe22c..30a9697a 100644
--- a/frontend/src/views/dashboard/workplace.vue
+++ b/frontend/src/views/dashboard/workplace.vue
@@ -3,14 +3,15 @@
     <div>
       <ElCard shadow="hover">
         <div class="flex flex-wrap justify-between items-center">
-          <div class="flex items-center  md:mb-0">
+          <div class="flex items-center md:mb-0">
             <ElAvatar size="large" :src="currentUser.avatar" class="mr-20px" />
             <div>
               <div class="text-20px font-bold">
                 {{ timefix }}{{ currentUser.name }}，{{ welcome }}
               </div>
               <el-text>
-                {{ currentUser.username }} | {{ currentUser.dept_name }} | {{ currentUser.description }}
+                {{ currentUser.username }} | {{ currentUser.dept_name }} |
+                {{ currentUser.description }}
               </el-text>
             </div>
           </div>
@@ -31,11 +32,21 @@
           <ElCard shadow="hover" title="进行中的项目">
             <template #header>
               <span class="font-bold">进行中的项目</span>
-              <ElLink href="" type="primary" underline="never" style="float: right">全部项目</ElLink>
+              <ElLink href="" type="primary" underline="never" style="float: right">
+                全部项目
+              </ElLink>
             </template>
             <el-empty v-if="projectNotice.length === 0" :image-size="80" description="暂无数据" />
             <ElRow v-else>
-              <ElCol v-for="item in projectNotice" :key="`card-${item.id}`" :xl="8" :lg="8" :md="12" :sm="24" :xs="24">
+              <ElCol
+                v-for="item in projectNotice"
+                :key="`card-${item.id}`"
+                :xl="8"
+                :lg="8"
+                :md="12"
+                :sm="24"
+                :xs="24"
+              >
                 <ElCard :key="item.id" shadow="hover">
                   <ElDescriptions :column="1">
                     <ElDescriptionsItem>
@@ -47,13 +58,17 @@
 
                     <ElDescriptionsItem>
                       <el-tooltip placement="top" :content="item.description">
-                        <el-text line-clamp=1 class="truncate-text">{{ item.description }}</el-text>
+                        <el-text line-clamp="1" class="truncate-text">
+                          {{ item.description }}
+                        </el-text>
                       </el-tooltip>
                     </ElDescriptionsItem>
 
                     <ElDescriptionsItem>
                       <div class="flex justify-between items-center">
-                        <ElLink :href="item.memberLink" underline="never">{{ item.member || "" }}</ElLink>
+                        <ElLink :href="item.memberLink" underline="never">
+                          {{ item.member || "" }}
+                        </ElLink>
                         <span>{{ item.updatedAt }}</span>
                       </div>
                     </ElDescriptionsItem>
@@ -72,22 +87,38 @@
             </template>
             <el-empty v-if="noticeList.length === 0" :image-size="80" description="暂无数据" />
             <ElTimeline>
-              <ElTimelineItem v-for="(item, index) in noticeList" :key="item.id" :type="index === 0 ? 'primary' : 'info'">
-                <div class="bg-[var(--el-fill-color-light)] rounded-lg p-4 border border-[var(--el-border-color)] hover:shadow-md transition-shadow">
+              <ElTimelineItem
+                v-for="(item, index) in noticeList"
+                :key="item.id"
+                :type="index === 0 ? 'primary' : 'info'"
+              >
+                <div
+                  class="bg-[var(--el-fill-color-light)] rounded-lg p-4 border border-[var(--el-border-color)] hover:shadow-md transition-shadow"
+                >
                   <div class="flex justify-between items-start mb-2">
                     <div class="flex items-center gap-2">
-                      <span class="font-medium text-[var(--el-text-color-primary)]">{{ item.notice_title }}</span>
-                    <el-tag size="small" :type="getNoticeTypeColor(item.notice_type)">
-                      {{ getNoticeTypeText(item.notice_type) }}
+                      <span class="font-medium text-[var(--el-text-color-primary)]">
+                        {{ item.notice_title }}
+                      </span>
+                      <el-tag size="small" :type="getNoticeTypeColor(item.notice_type)">
+                        {{ getNoticeTypeText(item.notice_type) }}
                       </el-tag>
                     </div>
-                    <span class="text-xs text-[var(--el-text-color-regular)]">{{ formatTime(item.created_at) }}</span>
+                    <span class="text-xs text-[var(--el-text-color-regular)]">
+                      {{ formatTime(item.created_at) }}
+                    </span>
+                  </div>
+                  <div class="text-sm text-[var(--el-text-color-regular)] mb-3 line-clamp-2">
+                    {{ item.notice_content }}
                   </div>
-                  <div class="text-sm text-[var(--el-text-color-regular)] mb-3 line-clamp-2">{{ item.notice_content }}</div>
                   <div class="flex justify-between items-center text-xs">
-                    <span class="text-[var(--el-text-color-regular)]">{{ item.creator?.name }} 发布</span>
+                    <span class="text-[var(--el-text-color-regular)]">
+                      {{ item.creator?.name }} 发布
+                    </span>
                     <el-tooltip placement="top" :content="item.description || item.notice_content">
-                      <ElButton target="_blank" type="primary" link @click="goToNotice()">详情↗</ElButton>
+                      <ElButton target="_blank" type="primary" link @click="goToNotice()">
+                        详情↗
+                      </ElButton>
                     </el-tooltip>
                   </div>
                 </div>
@@ -102,10 +133,21 @@
             </template>
             <el-empty v-if="projectNotice.length === 0" :image-size="80" description="暂无数据" />
             <ElRow v-else :gutter="16">
-              <ElCol v-for="item in projectNotice" :key="`members-item-${item.id}`" :span="8" class="mb-3">
-                <ElLink underline="never" :href="item.href" class="flex items-center hover:bg-[var(--el-fill-color-light)] p-2 rounded transition-colors">
+              <ElCol
+                v-for="item in projectNotice"
+                :key="`members-item-${item.id}`"
+                :span="8"
+                class="mb-3"
+              >
+                <ElLink
+                  underline="never"
+                  :href="item.href"
+                  class="flex items-center hover:bg-[var(--el-fill-color-light)] p-2 rounded transition-colors"
+                >
                   <ElAvatar :src="item.avatar" size="small" class="mr-2" />
-                  <span class="text-sm truncate text-[var(--el-text-color-regular)]">{{ item.member }}</span>
+                  <span class="text-sm truncate text-[var(--el-text-color-regular)]">
+                    {{ item.member }}
+                  </span>
                 </ElLink>
               </ElCol>
             </ElRow>
@@ -115,11 +157,14 @@
         <!-- 右侧：快速开始 / 便捷导航 + XX 指数 -->
         <ElCol :xl="8" :lg="8" :md="12" :sm="12" :xs="24">
           <!-- 快速开始 / 便捷导航 -->
-          <ElCard shadow="hover" class="mb-4" >
+          <ElCard shadow="hover" class="mb-4">
             <template #header>
               <div class="flex justify-between items-center">
                 <div class="flex items-center gap-2">
-                  <el-tooltip content="快速访问常用功能，标签右键收藏可添加快捷栏菜单。" placement="top">
+                  <el-tooltip
+                    content="快速访问常用功能，标签右键收藏可添加快捷栏菜单。"
+                    placement="top"
+                  >
                     <el-icon class="cursor-help" size="16">
                       <QuestionFilled />
                     </el-icon>
@@ -130,33 +175,35 @@
                   <el-icon>
                     <Delete />
                   </el-icon>
-                  {{ t('common.clear') }}
+                  {{ t("common.clear") }}
                 </ElButton>
               </div>
             </template>
             <ElRow v-if="quickLinks.length > 0" :gutter="8">
-              <ElCol 
-                v-for="(item, index) in quickLinks" 
-                :key="index"
-                :span="6"
-                class="group mb-4"
-              >
-                <ElButton 
+              <ElCol v-for="(item, index) in quickLinks" :key="index" :span="6" class="group mb-4">
+                <ElButton
                   plain
-                  type="default" 
+                  type="default"
                   class="w-full relative"
                   @click="handleQuickLinkClick(item)"
                 >
-                  <el-icon v-if="item.icon && item.icon.startsWith('el-icon')" :color="getRandomColor()">
+                  <el-icon
+                    v-if="item.icon && item.icon.startsWith('el-icon')"
+                    :color="getRandomColor()"
+                  >
                     <component :is="item.icon.replace('el-icon-', '')" />
                   </el-icon>
-                  <div v-else-if="item.icon" :class="`i-svg:${item.icon} mr-2`" :style="{ color: getRandomColor() }" />
+                  <div
+                    v-else-if="item.icon"
+                    :class="`i-svg:${item.icon} mr-2`"
+                    :style="{ color: getRandomColor() }"
+                  />
                   <div v-else :class="`i-svg:menu mr-2`" :style="{ color: getRandomColor() }" />
-                  
+
                   <span>{{ item.title }}</span>
                   <el-icon
                     color="var(--el-color-danger)"
-                    class="absolute top-0 right-0 opacity-0 group-hover:opacity-100 "
+                    class="absolute top-0 right-0 opacity-0 group-hover:opacity-100"
                     @click.stop="handleDeleteLink(item)"
                   >
                     <CircleClose />
@@ -169,7 +216,13 @@
 
           <!-- XX 指数 -->
           <ElCard class="mb-4 font-bold" header="XX 指数">
-            <ECharts class="chart" :options="chartOptions" height="450px" autoresize :init-options="{ renderer: 'canvas' }" />
+            <ECharts
+              class="chart"
+              :options="chartOptions"
+              height="450px"
+              autoresize
+              :init-options="{ renderer: 'canvas' }"
+            />
           </ElCard>
         </ElCol>
       </ElRow>
@@ -183,16 +236,16 @@ defineOptions({
   inheritAttrs: false,
 });
 
-import { EChartsOption } from 'echarts'
+import { EChartsOption } from "echarts";
 import { useUserStore } from "@/store/index";
-import { greetings } from '@/utils/common';
-import NoticeAPI, { NoticeTable } from '@/api/module_system/notice';
-import { ref, onMounted, reactive } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { useRouter } from 'vue-router';
+import { greetings } from "@/utils/common";
+import NoticeAPI, { NoticeTable } from "@/api/module_system/notice";
+import { ref, onMounted, reactive } from "vue";
+import { useI18n } from "vue-i18n";
+import { useRouter } from "vue-router";
 import { QuestionFilled, Delete, CircleClose } from "@element-plus/icons-vue";
-import { ElMessage, ElMessageBox } from 'element-plus';
-import { quickStartManager, type QuickLink } from '@/utils/quickStartManager';
+import { ElMessage, ElMessageBox } from "element-plus";
+import { quickStartManager, type QuickLink } from "@/utils/quickStartManager";
 
 const userStore = useUserStore();
 const timefix = greetings();
@@ -207,15 +260,15 @@ const quickLinks = ref<QuickLink[]>(quickStartManager.getQuickLinks());
 
 // 格式化时间
 const formatTime = (time: string | undefined) => {
-  if (!time) return '';
+  if (!time) return "";
   const date = new Date(time);
   const now = new Date();
   const diff = now.getTime() - date.getTime();
   const minutes = Math.floor(diff / (1000 * 60));
   const hours = Math.floor(diff / (1000 * 60 * 60));
   const days = Math.floor(diff / (1000 * 60 * 60 * 24));
-  
-  if (minutes < 1) return '刚刚';
+
+  if (minutes < 1) return "刚刚";
   if (minutes < 60) return `${minutes}分钟前`;
   if (hours < 24) return `${hours}小时前`;
   if (days < 7) return `${days}天前`;
@@ -224,7 +277,7 @@ const formatTime = (time: string | undefined) => {
 
 // 跳转通知公告详情页
 const goToNotice = () => {
-  router.push({ name: 'Notice' }).catch(() => {
+  router.push({ name: "Notice" }).catch(() => {
     ElMessage.warning(`公告通知跳转失败，请检查路由配置`);
   });
 };
@@ -232,24 +285,24 @@ const goToNotice = () => {
 // 获取通知类型文本和颜色
 const getNoticeTypeText = (type: string | undefined) => {
   switch (type) {
-    case '1':
-      return '通知';
-    case '2':
-      return '公告';
+    case "1":
+      return "通知";
+    case "2":
+      return "公告";
     default:
-      return '通知';
+      return "通知";
   }
 };
 
 // 获取通知类型对应的标签颜色
 const getNoticeTypeColor = (type: string | undefined) => {
   switch (type) {
-    case '1':
-      return 'primary';
-    case '2':
-      return 'success';
+    case "1":
+      return "primary";
+    case "2":
+      return "success";
     default:
-      return 'primary';
+      return "primary";
   }
 };
 
@@ -259,13 +312,13 @@ const getNoticeList = async () => {
     const response = await NoticeAPI.getNoticeList({
       page_no: 1,
       page_size: 10,
-      status: true // 只获取启用的公告
+      status: true, // 只获取启用的公告
     });
     if (response.data.code === 0) {
       noticeList.value = response.data.data.items;
     }
   } catch (error) {
-    console.error('获取通知公告失败:', error);
+    console.error("获取通知公告失败:", error);
   }
 };
 
@@ -285,48 +338,51 @@ const handleQuickLinkClick = (item: QuickLink) => {
 const getRandomColor = () => {
   // 预定义几个亮且鲜艳的颜色
   const colors = [
-    '#FF5733', '#33FF57', '#3357FF', '#FF33E6', 
-    '#FFFF33', '#33FFFF', '#FF3333', '#5733FF',
-    '#33FFE6', '#E633FF'
+    "#FF5733",
+    "#33FF57",
+    "#3357FF",
+    "#FF33E6",
+    "#FFFF33",
+    "#33FFFF",
+    "#FF3333",
+    "#5733FF",
+    "#33FFE6",
+    "#E633FF",
   ];
   // 随机选择一个颜色返回
   const randomIndex = Math.floor(Math.random() * colors.length);
   return colors[randomIndex];
-}
+};
 // 处理删除链接
 const handleDeleteLink = (item: QuickLink) => {
-  ElMessageBox.confirm(
-    `确定要取消收藏"${item.title}"吗？`,
-    '取消收藏确认',
-    {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    }
-  ).then(() => {
-    if (item.id) {
-      quickStartManager.removeQuickLink(item.id);
-      ElMessage.success(`已取消收藏：${item.title}`);
-    }
-  }).catch(() => {
-    // 用户取消删除
-  });
+  ElMessageBox.confirm(`确定要取消收藏"${item.title}"吗？`, "取消收藏确认", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(() => {
+      if (item.id) {
+        quickStartManager.removeQuickLink(item.id);
+        ElMessage.success(`已取消收藏：${item.title}`);
+      }
+    })
+    .catch(() => {
+      // 用户取消删除
+    });
 };
 
 const clearBookmarks = () => {
-  ElMessageBox.confirm(
-    '确定要清空收藏吗？',
-    '清空收藏确认',
-    {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    }
-  ).then(() => {
-    quickStartManager.clearQuickLinks();
-    ElMessage.success('已清空收藏');
-  }).catch(() => {})
-}
+  ElMessageBox.confirm("确定要清空收藏吗？", "清空收藏确认", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(() => {
+      quickStartManager.clearQuickLinks();
+      ElMessage.success("已清空收藏");
+    })
+    .catch(() => {});
+};
 
 // 监听快速链接变化
 const updateQuickLinks = (links: QuickLink[]) => {
@@ -344,10 +400,12 @@ onUnmounted(() => {
   quickStartManager.removeListener(updateQuickLinks);
 });
 
-const welcome = '祝你开心每一天！';
+const welcome = "祝你开心每一天！";
 
 const currentUser = {
-  avatar: userStore.basicInfo.avatar || "https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png",
+  avatar:
+    userStore.basicInfo.avatar ||
+    "https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png",
   name: userStore.basicInfo.name || "吴彦祖",
   username: userStore.basicInfo.username || "账号信息",
   description: userStore.basicInfo.description || "用户说明",
@@ -418,37 +476,36 @@ const projectNotice = [
   },
 ];
 
-
 const chartOptions = reactive<EChartsOption>({
-  tooltip: { trigger: 'item' },
-  legend: { data: ['个人', '团队', '部门'] },
+  tooltip: { trigger: "item" },
+  legend: { data: ["个人", "团队", "部门"] },
   radar: {
-    shape: 'circle',
+    shape: "circle",
     indicator: [
-      { name: '引用', max: 10 },
-      { name: '热度', max: 10 },
-      { name: '贡献', max: 10 },
-      { name: '产量', max: 10 },
-      { name: '口碑', max: 10 }
-    ]
+      { name: "引用", max: 10 },
+      { name: "热度", max: 10 },
+      { name: "贡献", max: 10 },
+      { name: "产量", max: 10 },
+      { name: "口碑", max: 10 },
+    ],
   },
-  series: [{
-    name: 'Budget vs spending',
-    type: 'radar',
-    areaStyle: {},
-    symbol: 'none',
-    emphasis: { focus: 'self' },
-    data: [
-      { value: [10, 7, 5, 4, 8], name: '个人' },
-      { value: [3, 1, 3, 6, 9], name: '团队' },
-      { value: [4, 7, 5, 6, 1], name: '部门' }
-    ]
-  }]
+  series: [
+    {
+      name: "Budget vs spending",
+      type: "radar",
+      areaStyle: {},
+      symbol: "none",
+      emphasis: { focus: "self" },
+      data: [
+        { value: [10, 7, 5, 4, 8], name: "个人" },
+        { value: [3, 1, 3, 6, 9], name: "团队" },
+        { value: [4, 7, 5, 6, 1], name: "部门" },
+      ],
+    },
+  ],
 });
-
 </script>
 
 <style scoped>
 /* 最小化自定义样式，主要使用UnoCSS和Element Plus内置样式 */
-
 </style>
diff --git a/frontend/src/views/error/401.vue b/frontend/src/views/error/401.vue
index 53cf1a8a..e65925cd 100644
--- a/frontend/src/views/error/401.vue
+++ b/frontend/src/views/error/401.vue
@@ -1,16 +1,18 @@
 <template>
-  <el-result :title="t('error.noPermission')" sub-title="请确认您的权限是否满足操作要求，或者点击下方按钮返回首页。">
+  <el-result
+    :title="t('error.noPermission')"
+    sub-title="请确认您的权限是否满足操作要求，或者点击下方按钮返回首页。"
+  >
     <template #icon>
       <!-- 此处必须img，如果是el-icon则无法识别 @ -->
       <img class="min-w-[23.4375rem] sm:w-120" src="@/assets/images/401.svg" alt="401" />
     </template>
     <template #extra>
-      <el-button round type="primary" @click="back">{{ t('error.returnToHome') }}</el-button>
+      <el-button round type="primary" @click="back">{{ t("error.returnToHome") }}</el-button>
     </template>
   </el-result>
 </template>
 
-
 <script setup lang="ts">
 defineOptions({ name: "Page401" });
 const router = useRouter();
diff --git a/frontend/src/views/error/404.vue b/frontend/src/views/error/404.vue
index 00e5ed28..9a8fa8a1 100644
--- a/frontend/src/views/error/404.vue
+++ b/frontend/src/views/error/404.vue
@@ -1,11 +1,14 @@
 <template>
-  <el-result :title="t('error.pageError')" sub-title="请确认页面网址是否正确，或者点击下方按钮返回首页。">
+  <el-result
+    :title="t('error.pageError')"
+    sub-title="请确认页面网址是否正确，或者点击下方按钮返回首页。"
+  >
     <template #icon>
       <!-- 此处必须img，如果是el-icon则无法识别 @ -->
       <img class="min-w-[23.4375rem] sm:w-120" src="@/assets/images/404.svg" alt="404" />
     </template>
     <template #extra>
-      <el-button round type="primary" @click="back">{{ t('error.returnToHome') }}</el-button>
+      <el-button round type="primary" @click="back">{{ t("error.returnToHome") }}</el-button>
     </template>
   </el-result>
 </template>
diff --git a/frontend/src/views/error/500.vue b/frontend/src/views/error/500.vue
index d829687b..a612ad90 100644
--- a/frontend/src/views/error/500.vue
+++ b/frontend/src/views/error/500.vue
@@ -1,11 +1,14 @@
 <template>
-  <el-result :title="t('error.networkError')" sub-title="请确认您的网络是否正常，或者点击下方按钮返回首页。">
+  <el-result
+    :title="t('error.networkError')"
+    sub-title="请确认您的网络是否正常，或者点击下方按钮返回首页。"
+  >
     <template #icon>
       <!-- 此处必须img，如果是el-icon则无法识别 @ -->
       <img class="min-w-[23.4375rem] sm:w-120" src="@/assets/images/500.svg" alt="500" />
     </template>
     <template #extra>
-      <el-button round type="primary" @click="back">{{ t('error.returnToHome') }}</el-button>
+      <el-button round type="primary" @click="back">{{ t("error.returnToHome") }}</el-button>
     </template>
   </el-result>
 </template>
@@ -18,4 +21,3 @@ const t = useI18n().t;
 </script>
 
 <style lang="scss" scoped></style>
-
diff --git a/frontend/src/views/module_application/ai/index.vue b/frontend/src/views/module_application/ai/index.vue
index be34c139..75594b1f 100644
--- a/frontend/src/views/module_application/ai/index.vue
+++ b/frontend/src/views/module_application/ai/index.vue
@@ -16,8 +16,23 @@
             </el-icon>
             <span class="status-text">{{ connectionStatusText }}</span>
           </div>
-          <el-button v-if="messages.length > 0" v-hasPerm="['ai:mcp:clear']" text :icon="Delete" @click="clearCurrentChat">清空对话</el-button>
-          <el-button v-hasPerm="['ai:mcp:connection']" text :icon="Setting" @click="toggleConnection">{{ isConnected ? '断开连接' : '重新连接' }}</el-button>
+          <el-button
+            v-if="messages.length > 0"
+            v-hasPerm="['ai:mcp:clear']"
+            text
+            :icon="Delete"
+            @click="clearCurrentChat"
+          >
+            清空对话
+          </el-button>
+          <el-button
+            v-hasPerm="['ai:mcp:connection']"
+            text
+            :icon="Setting"
+            @click="toggleConnection"
+          >
+            {{ isConnected ? "断开连接" : "重新连接" }}
+          </el-button>
         </div>
       </div>
 
@@ -30,8 +45,10 @@
               <el-icon size="64"><ChatDotRound /></el-icon>
             </div>
             <h1>FA智能助手</h1>
-            <p class="welcome-subtitle">我是您的专属AI助手，可以帮您回答问题、处理任务和进行智能对话</p>
-            
+            <p class="welcome-subtitle">
+              我是您的专属AI助手，可以帮您回答问题、处理任务和进行智能对话
+            </p>
+
             <div class="example-prompts">
               <div class="prompt-card" @click="setPrompt('请介绍一下FastApiAdmin系统')">
                 <h4>系统介绍</h4>
@@ -55,9 +72,9 @@
 
         <!-- 消息列表 -->
         <div v-else class="messages-list">
-          <div 
-            v-for="message in messages" 
-            :key="message.id" 
+          <div
+            v-for="message in messages"
+            :key="message.id"
             :class="['message-group', message.type]"
           >
             <div class="message-avatar">
@@ -71,11 +88,14 @@
             <div class="message-content">
               <div class="message-header">
                 <strong class="sender-name">
-                  {{ message.type === 'user' ? 'You' : 'FA助手' }}
+                  {{ message.type === "user" ? "You" : "FA助手" }}
                 </strong>
               </div>
               <div class="message-body">
-                <div v-if="message.type === 'assistant' && message.loading" class="typing-indicator">
+                <div
+                  v-if="message.type === 'assistant' && message.loading"
+                  class="typing-indicator"
+                >
                   <div class="typing-dots">
                     <span></span>
                     <span></span>
@@ -85,8 +105,18 @@
                 <div v-else class="message-text" v-html="formatMessage(message.content)"></div>
               </div>
               <div v-if="!message.loading" class="message-actions">
-                <el-button text size="small" :icon="CopyDocument" @click="copyMessage(message.content)"></el-button>
-                <el-button v-if="message.type === 'assistant'" text size="small" :icon="RefreshLeft"></el-button>
+                <el-button
+                  text
+                  size="small"
+                  :icon="CopyDocument"
+                  @click="copyMessage(message.content)"
+                ></el-button>
+                <el-button
+                  v-if="message.type === 'assistant'"
+                  text
+                  size="small"
+                  :icon="RefreshLeft"
+                ></el-button>
               </div>
             </div>
           </div>
@@ -94,13 +124,7 @@
 
         <!-- 错误提示 -->
         <div v-if="error" class="error-banner">
-          <el-alert
-            :title="error"
-            type="error"
-            :closable="true"
-            show-icon
-            @close="error = ''"
-          />
+          <el-alert :title="error" type="error" :closable="true" show-icon @close="error = ''" />
         </div>
       </div>
 
@@ -132,9 +156,7 @@
             </el-button>
           </div>
           <div class="input-footer">
-            <span class="input-hint">
-              按 Enter 发送消息，Shift + Enter 换行
-            </span>
+            <span class="input-hint">按 Enter 发送消息，Shift + Enter 换行</span>
           </div>
         </div>
       </div>
@@ -143,8 +165,8 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, nextTick, computed } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
+import { ref, onMounted, onUnmounted, nextTick, computed } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
 import {
   ChatDotRound,
   User,
@@ -155,262 +177,259 @@ import {
   Warning,
   Setting,
   CopyDocument,
-  RefreshLeft
-} from '@element-plus/icons-vue'
+  RefreshLeft,
+} from "@element-plus/icons-vue";
 
 // 消息接口
 interface ChatMessage {
-  id: string
-  type: 'user' | 'assistant'
-  content: string
-  timestamp: number
-  loading?: boolean
+  id: string;
+  type: "user" | "assistant";
+  content: string;
+  timestamp: number;
+  loading?: boolean;
 }
 
 // 响应式数据
-const messages = ref<ChatMessage[]>([])
-const inputMessage = ref('')
-const sending = ref(false)
-const isConnected = ref(false)
-const connectionStatus = ref<'connected' | 'connecting' | 'disconnected'>('disconnected')
-const error = ref('')
-const messagesContainer = ref<HTMLElement>()
+const messages = ref<ChatMessage[]>([]);
+const inputMessage = ref("");
+const sending = ref(false);
+const isConnected = ref(false);
+const connectionStatus = ref<"connected" | "connecting" | "disconnected">("disconnected");
+const error = ref("");
+const messagesContainer = ref<HTMLElement>();
 
 // WebSocket 连接
-let ws: WebSocket | null = null
-const WS_URL =  import.meta.env.VITE_APP_WS_ENDPOINT + '/api/v1/application/ai/ws/chat'
+let ws: WebSocket | null = null;
+const WS_URL = import.meta.env.VITE_APP_WS_ENDPOINT + "/api/v1/application/ai/ws/chat";
 
 // 计算属性
 const connectionStatusText = computed(() => {
   switch (connectionStatus.value) {
-    case 'connected': return '已连接'
-    case 'connecting': return '连接中...'
-    case 'disconnected': return '未连接'
-    default: return '未知状态'
+    case "connected":
+      return "已连接";
+    case "connecting":
+      return "连接中...";
+    case "disconnected":
+      return "未连接";
+    default:
+      return "未知状态";
   }
-})
-
+});
 
 // WebSocket 连接管理
 const connectWebSocket = () => {
   if (ws?.readyState === WebSocket.OPEN) {
-    return
+    return;
   }
 
-  connectionStatus.value = 'connecting'
-  error.value = ''
+  connectionStatus.value = "connecting";
+  error.value = "";
 
   try {
-    ws = new WebSocket(WS_URL)
+    ws = new WebSocket(WS_URL);
 
     ws.onopen = () => {
-      console.log('WebSocket 连接已建立')
-      isConnected.value = true
-      connectionStatus.value = 'connected'
-      ElMessage.success('连接成功')
-    }
+      console.log("WebSocket 连接已建立");
+      isConnected.value = true;
+      connectionStatus.value = "connected";
+      ElMessage.success("连接成功");
+    };
 
     ws.onmessage = (event) => {
       try {
-        const data = JSON.parse(event.data)
-        handleWebSocketMessage(data)
+        const data = JSON.parse(event.data);
+        handleWebSocketMessage(data);
       } catch (err) {
-        console.error('解析消息失败:', err)
-        handleWebSocketMessage({ content: event.data })
+        console.error("解析消息失败:", err);
+        handleWebSocketMessage({ content: event.data });
       }
-    }
+    };
 
     ws.onclose = (event) => {
-      console.log('WebSocket 连接已关闭', event.code, event.reason)
-      isConnected.value = false
-      connectionStatus.value = 'disconnected'
-    }
+      console.log("WebSocket 连接已关闭", event.code, event.reason);
+      isConnected.value = false;
+      connectionStatus.value = "disconnected";
+    };
 
     ws.onerror = (error) => {
-      console.error('WebSocket 错误:', error)
-      isConnected.value = false
-      connectionStatus.value = 'disconnected'
-      ElMessage.error('连接失败，请检查服务器状态')
-    }
-
+      console.error("WebSocket 错误:", error);
+      isConnected.value = false;
+      connectionStatus.value = "disconnected";
+      ElMessage.error("连接失败，请检查服务器状态");
+    };
   } catch (err) {
-    console.error('创建 WebSocket 连接失败:', err)
-    connectionStatus.value = 'disconnected'
-    error.value = '无法创建连接'
+    console.error("创建 WebSocket 连接失败:", err);
+    connectionStatus.value = "disconnected";
+    error.value = "无法创建连接";
   }
-}
+};
 
 // 断开连接
 const disconnectWebSocket = () => {
   if (ws) {
-    ws.close(1000, '用户主动断开')
-    ws = null
+    ws.close(1000, "用户主动断开");
+    ws = null;
   }
-  isConnected.value = false
-  connectionStatus.value = 'disconnected'
-}
+  isConnected.value = false;
+  connectionStatus.value = "disconnected";
+};
 
 // 切换连接状态
 const toggleConnection = () => {
   if (isConnected.value) {
-    disconnectWebSocket()
-    ElMessage.info('已断开连接')
+    disconnectWebSocket();
+    ElMessage.info("已断开连接");
   } else {
-    connectWebSocket()
+    connectWebSocket();
   }
-}
+};
 
 // 处理 WebSocket 消息
 const handleWebSocketMessage = (data: any) => {
   // 查找最后一个助手消息
-  const lastMessage = messages.value[messages.value.length - 1]
-  
-  if (lastMessage && lastMessage.type === 'assistant' && lastMessage.loading) {
+  const lastMessage = messages.value[messages.value.length - 1];
+
+  if (lastMessage && lastMessage.type === "assistant" && lastMessage.loading) {
     // 更新加载中的消息
-    lastMessage.content = data.content || data.message || '收到回复'
-    lastMessage.loading = false
+    lastMessage.content = data.content || data.message || "收到回复";
+    lastMessage.loading = false;
   } else {
     // 添加新的助手消息
-    addMessage('assistant', data.content || data.message || '收到回复')
+    addMessage("assistant", data.content || data.message || "收到回复");
   }
-  
-  scrollToBottom()
-}
+
+  scrollToBottom();
+};
 
 // 发送消息
 const sendMessage = async () => {
-  const message = inputMessage.value.trim()
+  const message = inputMessage.value.trim();
   if (!message || !isConnected.value || sending.value) {
-    return
+    return;
   }
 
   // 添加用户消息
-  addMessage('user', message)
-  inputMessage.value = ''
-  
+  addMessage("user", message);
+  inputMessage.value = "";
+
   // 添加加载中的助手消息
   const loadingMessage: ChatMessage = {
     id: generateId(),
-    type: 'assistant',
-    content: '',
+    type: "assistant",
+    content: "",
     timestamp: Date.now(),
-    loading: true
-  }
-  messages.value.push(loadingMessage)
+    loading: true,
+  };
+  messages.value.push(loadingMessage);
 
-  sending.value = true
-  scrollToBottom()
+  sending.value = true;
+  scrollToBottom();
 
   try {
     // 发送消息到 WebSocket
     if (ws?.readyState === WebSocket.OPEN) {
       const payload = {
         message,
-        timestamp: Date.now()
-      }
-      ws.send(JSON.stringify(payload))
+        timestamp: Date.now(),
+      };
+      ws.send(JSON.stringify(payload));
     } else {
-      throw new Error('WebSocket 连接未建立')
+      throw new Error("WebSocket 连接未建立");
     }
   } catch (err) {
-    console.error('发送消息失败:', err)
+    console.error("发送消息失败:", err);
     // 移除加载消息并显示错误
-    messages.value.pop()
-    error.value = '发送消息失败，请检查连接状态'
-    ElMessage.error('发送失败')
+    messages.value.pop();
+    error.value = "发送消息失败，请检查连接状态";
+    ElMessage.error("发送失败");
   } finally {
-    sending.value = false
+    sending.value = false;
   }
-}
+};
 
 // 添加消息
-const addMessage = (type: 'user' | 'assistant', content: string) => {
+const addMessage = (type: "user" | "assistant", content: string) => {
   const message: ChatMessage = {
     id: generateId(),
     type,
     content,
-    timestamp: Date.now()
-  }
-  messages.value.push(message)
-  nextTick(() => scrollToBottom())
-}
+    timestamp: Date.now(),
+  };
+  messages.value.push(message);
+  nextTick(() => scrollToBottom());
+};
 
 const clearCurrentChat = async () => {
   try {
-    await ElMessageBox.confirm(
-      '确定要清空当前对话吗？此操作不可恢复。',
-      '确认清空',
-      {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }
-    )
-    
-    messages.value = []
-    ElMessage.success('对话已清空')
+    await ElMessageBox.confirm("确定要清空当前对话吗？此操作不可恢复。", "确认清空", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    });
+
+    messages.value = [];
+    ElMessage.success("对话已清空");
   } catch {
     // 用户取消
   }
-}
+};
 
 // 设置提示词
 const setPrompt = (prompt: string) => {
-  inputMessage.value = prompt
-}
+  inputMessage.value = prompt;
+};
 
 // 复制消息
 const copyMessage = async (content: string) => {
   try {
-    await navigator.clipboard.writeText(content)
-    ElMessage.success('已复制到剪贴板')
+    await navigator.clipboard.writeText(content);
+    ElMessage.success("已复制到剪贴板");
   } catch {
     // 降级方案
-    const textArea = document.createElement('textarea')
-    textArea.value = content
-    document.body.appendChild(textArea)
-    textArea.select()
-    document.execCommand('copy')
-    document.body.removeChild(textArea)
-    ElMessage.success('已复制到剪贴板')
+    const textArea = document.createElement("textarea");
+    textArea.value = content;
+    document.body.appendChild(textArea);
+    textArea.select();
+    document.execCommand("copy");
+    document.body.removeChild(textArea);
+    ElMessage.success("已复制到剪贴板");
   }
-}
-
+};
 
 // 滚动到底部
 const scrollToBottom = () => {
   nextTick(() => {
     if (messagesContainer.value) {
-      messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight
+      messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight;
     }
-  })
-}
+  });
+};
 
 // 格式化消息内容
 const formatMessage = (content: string) => {
-  if (!content) return ''
-  
+  if (!content) return "";
+
   // 简单的 Markdown 支持
   return content
-    .replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
-    .replace(/\*(.*?)\*/g, '<em>$1</em>')
-    .replace(/`(.*?)`/g, '<code>$1</code>')
-    .replace(/\n/g, '<br>')
-}
+    .replace(/\*\*(.*?)\*\*/g, "<strong>$1</strong>")
+    .replace(/\*(.*?)\*/g, "<em>$1</em>")
+    .replace(/`(.*?)`/g, "<code>$1</code>")
+    .replace(/\n/g, "<br>");
+};
 
 // 生成唯一ID
 const generateId = () => {
-  return Date.now().toString(36) + Math.random().toString(36).substr(2)
-}
+  return Date.now().toString(36) + Math.random().toString(36).substr(2);
+};
 
 // 生命周期
 onMounted(() => {
-  connectWebSocket()
-})
+  connectWebSocket();
+});
 
 onUnmounted(() => {
-  disconnectWebSocket()
-})
+  disconnectWebSocket();
+});
 </script>
 
 <style lang="scss" scoped>
@@ -458,9 +477,15 @@ onUnmounted(() => {
         font-size: 12px;
 
         .status-icon {
-          &.connected { color: var(--el-color-success); }
-          &.connecting { color: var(--el-color-warning); }
-          &.disconnected { color: var(--el-color-danger); }
+          &.connected {
+            color: var(--el-color-success);
+          }
+          &.connecting {
+            color: var(--el-color-warning);
+          }
+          &.disconnected {
+            color: var(--el-color-danger);
+          }
         }
 
         .status-text {
@@ -609,7 +634,7 @@ onUnmounted(() => {
 
               :deep(p) {
                 margin: 0 0 12px;
-                
+
                 &:last-child {
                   margin-bottom: 0;
                 }
@@ -619,7 +644,7 @@ onUnmounted(() => {
                 background: var(--el-fill-color-light);
                 padding: 2px 6px;
                 border-radius: 4px;
-                font-family: 'JetBrains Mono', 'Courier New', monospace;
+                font-family: "JetBrains Mono", "Courier New", monospace;
                 font-size: 14px;
               }
 
@@ -644,7 +669,8 @@ onUnmounted(() => {
                 font-style: italic;
               }
 
-              :deep(ul), :deep(ol) {
+              :deep(ul),
+              :deep(ol) {
                 padding-left: 20px;
                 margin: 12px 0;
               }
@@ -671,8 +697,12 @@ onUnmounted(() => {
                   background: var(--el-text-color-secondary);
                   animation: typing 1.4s infinite;
 
-                  &:nth-child(2) { animation-delay: 0.2s; }
-                  &:nth-child(3) { animation-delay: 0.4s; }
+                  &:nth-child(2) {
+                    animation-delay: 0.2s;
+                  }
+                  &:nth-child(3) {
+                    animation-delay: 0.4s;
+                  }
                 }
               }
             }
@@ -774,15 +804,17 @@ onUnmounted(() => {
 }
 
 @keyframes typing {
-  0%, 20% { 
+  0%,
+  20% {
     opacity: 0.4;
     transform: scale(0.8);
   }
-  50% { 
+  50% {
     opacity: 1;
     transform: scale(1);
   }
-  80%, 100% { 
+  80%,
+  100% {
     opacity: 0.4;
     transform: scale(0.8);
   }
diff --git a/frontend/src/views/module_application/job/components/JobLogDrawer.vue b/frontend/src/views/module_application/job/components/JobLogDrawer.vue
index a65a93c6..6742b9dd 100644
--- a/frontend/src/views/module_application/job/components/JobLogDrawer.vue
+++ b/frontend/src/views/module_application/job/components/JobLogDrawer.vue
@@ -1,21 +1,33 @@
 <!-- 任务日志抽屉 -->
 <template>
-  <el-drawer v-model="drawerVisible" :title="'【' + props.jobName + '】任务日志'" :size="drawerSize">
+  <el-drawer
+    v-model="drawerVisible"
+    :title="'【' + props.jobName + '】任务日志'"
+    :size="drawerSize"
+  >
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true" label-suffix=":" @submit.prevent="handleQuery">
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="status" label="执行状态">
-          <el-select v-model="queryFormData.status" placeholder="请选择执行状态" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择执行状态"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option :value="true" label="成功" />
             <el-option :value="false" label="失败" />
           </el-select>
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="执行时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
@@ -44,7 +56,9 @@
       <template #header>
         <div class="card-header">
           <span>
-            <el-tooltip content="任务执行日志记录每次定时任务的执行情况，包括成功、失败状态及错误信息。">
+            <el-tooltip
+              content="任务执行日志记录每次定时任务的执行情况，包括成功、失败状态及错误信息。"
+            >
               <QuestionFilled class="w-4 h-4 mx-1" />
             </el-tooltip>
             任务执行日志列表
@@ -57,7 +71,14 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-button type="warning" icon="delete" @click="handleClearLog">清空日志</el-button>
@@ -82,7 +103,17 @@
       </div>
 
       <!-- 表格区域：任务日志列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" height="460" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        height="460"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
@@ -101,49 +132,116 @@
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column label="执行信息" prop="job_message" min-width="200" show-overflow-tooltip />
-        <el-table-column label="异常信息" prop="exception_info" min-width="250" show-overflow-tooltip />
+        <el-table-column
+          label="执行信息"
+          prop="job_message"
+          min-width="200"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          label="异常信息"
+          prop="exception_info"
+          min-width="250"
+          show-overflow-tooltip
+        />
         <el-table-column label="执行器" prop="job_executor" min-width="120" show-overflow-tooltip />
-        <el-table-column label="调用目标" prop="invoke_target" min-width="200" show-overflow-tooltip />
+        <el-table-column
+          label="调用目标"
+          prop="invoke_target"
+          min-width="200"
+          show-overflow-tooltip
+        />
         <el-table-column label="位置参数" prop="job_args" min-width="150" show-overflow-tooltip />
-        <el-table-column label="关键字参数" prop="job_kwargs" min-width="150" show-overflow-tooltip />
+        <el-table-column
+          label="关键字参数"
+          prop="job_kwargs"
+          min-width="150"
+          show-overflow-tooltip
+        />
         <el-table-column label="触发器" prop="job_trigger" min-width="120" show-overflow-tooltip />
         <el-table-column label="创建时间" prop="create_time" min-width="180" sortable />
         <el-table-column fixed="right" label="操作" align="center" min-width="150">
           <template #default="scope">
-            <el-button type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="2" border label-width="120px">
-          <el-descriptions-item label="日志ID" :span="2">{{ detailFormData.id }}</el-descriptions-item>
-          <el-descriptions-item label="任务名称" :span="2">{{ detailFormData.job_name }}</el-descriptions-item>
-          <el-descriptions-item label="任务组名" :span="2">{{ detailFormData.job_group }}</el-descriptions-item>
+          <el-descriptions-item label="日志ID" :span="2">
+            {{ detailFormData.id }}
+          </el-descriptions-item>
+          <el-descriptions-item label="任务名称" :span="2">
+            {{ detailFormData.job_name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="任务组名" :span="2">
+            {{ detailFormData.job_group }}
+          </el-descriptions-item>
           <el-descriptions-item label="执行状态" :span="2">
             <el-tag :type="detailFormData.status === true ? 'success' : 'danger'">
               {{ detailFormData.status ? "成功" : "失败" }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="执行信息" :span="2">{{ detailFormData.job_message || '-' }}</el-descriptions-item>
-          <el-descriptions-item label="异常信息" :span="2">{{ detailFormData.exception_info || '-' }}</el-descriptions-item>
-          <el-descriptions-item label="执行器" :span="2">{{ detailFormData.job_executor || '-' }}</el-descriptions-item>
-          <el-descriptions-item label="调用目标" :span="2">{{ detailFormData.invoke_target || '-' }}</el-descriptions-item>
-          <el-descriptions-item label="位置参数" :span="2">{{ detailFormData.job_args || '-' }}</el-descriptions-item>
-          <el-descriptions-item label="关键字参数" :span="2">{{ detailFormData.job_kwargs || '-' }}</el-descriptions-item>
-          <el-descriptions-item label="触发器" :span="2">{{ detailFormData.job_trigger || '-' }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{ detailFormData.create_time }}</el-descriptions-item>
+          <el-descriptions-item label="执行信息" :span="2">
+            {{ detailFormData.job_message || "-" }}
+          </el-descriptions-item>
+          <el-descriptions-item label="异常信息" :span="2">
+            {{ detailFormData.exception_info || "-" }}
+          </el-descriptions-item>
+          <el-descriptions-item label="执行器" :span="2">
+            {{ detailFormData.job_executor || "-" }}
+          </el-descriptions-item>
+          <el-descriptions-item label="调用目标" :span="2">
+            {{ detailFormData.invoke_target || "-" }}
+          </el-descriptions-item>
+          <el-descriptions-item label="位置参数" :span="2">
+            {{ detailFormData.job_args || "-" }}
+          </el-descriptions-item>
+          <el-descriptions-item label="关键字参数" :span="2">
+            {{ detailFormData.job_kwargs || "-" }}
+          </el-descriptions-item>
+          <el-descriptions-item label="触发器" :span="2">
+            {{ detailFormData.job_trigger || "-" }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.create_time }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
     </el-dialog>
@@ -164,13 +262,13 @@
 const props = defineProps({
   jobId: {
     type: Number,
-    required: true
+    required: true,
   },
   jobName: {
     type: String,
-    required: true
-  }
-})
+    required: true,
+  },
+});
 
 import JobAPI, { JobLogPageQuery, JobLogTable } from "@/api/module_application/job";
 import { useAppStore } from "@/store/modules/app.store";
@@ -216,7 +314,7 @@ const queryFormData = reactive<JobLogPageQuery>({
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'detail',
+  type: "detail",
 });
 
 // 日期范围临时变量
@@ -235,9 +333,9 @@ function handleDateRangeChange(range: [Date, Date]) {
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -247,11 +345,9 @@ async function loadingData() {
     const response = await JobAPI.getJobLogList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -290,7 +386,7 @@ async function handleCloseDialog() {
 }
 
 // 打开详情弹窗
-async function handleOpenDialog(type: 'detail', id?: number) {
+async function handleOpenDialog(type: "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await JobAPI.getJobLogDetail(id);
@@ -310,21 +406,23 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await JobAPI.deleteJobLog(validIds);
-      // 删除后刷新并清空选择状态
-      handleResetQuery();
-      selectIds.value = [];
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await JobAPI.deleteJobLog(validIds);
+        // 删除后刷新并清空选择状态
+        handleResetQuery();
+        selectIds.value = [];
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 清空日志
@@ -333,19 +431,21 @@ async function handleClearLog() {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await JobAPI.clearJobLog();
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await JobAPI.clearJobLog();
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 打开导出弹窗
@@ -355,22 +455,22 @@ function handleOpenExportsModal() {
 
 // 导出字段
 const exportColumns = [
-  { prop: 'job_name', label: '任务名称' },
-  { prop: 'job_group', label: '任务组名' },
-  { prop: 'status', label: '执行状态' },
-  { prop: 'job_message', label: '执行信息' },
-  { prop: 'exception_info', label: '异常信息' },
-  { prop: 'job_executor', label: '执行器' },
-  { prop: 'invoke_target', label: '调用目标' },
-  { prop: 'job_args', label: '位置参数' },
-  { prop: 'job_kwargs', label: '关键字参数' },
-  { prop: 'job_trigger', label: '触发器' },
-  { prop: 'create_time', label: '创建时间' },
+  { prop: "job_name", label: "任务名称" },
+  { prop: "job_group", label: "任务组名" },
+  { prop: "status", label: "执行状态" },
+  { prop: "job_message", label: "执行信息" },
+  { prop: "exception_info", label: "异常信息" },
+  { prop: "job_executor", label: "执行器" },
+  { prop: "invoke_target", label: "调用目标" },
+  { prop: "job_args", label: "位置参数" },
+  { prop: "job_kwargs", label: "关键字参数" },
+  { prop: "job_trigger", label: "触发器" },
+  { prop: "create_time", label: "创建时间" },
 ];
 
 // 导出配置（用于导出弹窗）
 const curdContentConfig = {
-  permPrefix: 'application:job_log',
+  permPrefix: "application:job_log",
   cols: exportColumns as any,
   exportsAction: async (params: any) => {
     const query: any = { ...params };
@@ -402,7 +502,7 @@ function closeDrawer() {
 // 暴露方法给父组件
 defineExpose({
   openDrawer,
-  closeDrawer
+  closeDrawer,
 });
 
 onMounted(() => {
diff --git a/frontend/src/views/module_application/job/index.vue b/frontend/src/views/module_application/job/index.vue
index 4f4576f0..0cb82abd 100644
--- a/frontend/src/views/module_application/job/index.vue
+++ b/frontend/src/views/module_application/job/index.vue
@@ -11,11 +11,7 @@
         @submit.prevent="handleQuery"
       >
         <el-form-item prop="name" label="任务名称">
-          <el-input
-            v-model="queryFormData.name"
-            placeholder="请输入任务名称"
-            clearable
-          />
+          <el-input v-model="queryFormData.name" placeholder="请输入任务名称" clearable />
         </el-form-item>
         <el-form-item prop="status" label="状态">
           <el-select
@@ -30,30 +26,35 @@
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <el-form-item v-if="isExpand" prop="creator" label="创建人">
           <UserTableSelect
-              v-model="queryFormData.creator"
-              @confirm-click="handleConfirm"
-              @clear-click="handleQuery"
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
           />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_application:job:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_application:job:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_application:job:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_application:job:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
           <!-- 展开/收起 -->
           <template v-if="isExpandable">
-            <el-link
-              class="ml-3"
-              type="primary"
-              underline="never"
-              @click="isExpand = !isExpand"
-            >
+            <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
               {{ isExpand ? "收起" : "展开" }}
               <el-icon>
                 <template v-if="isExpand">
@@ -92,7 +93,9 @@
                 type="success"
                 icon="plus"
                 @click="handleOpenDialog('create')"
-              >新增</el-button>
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-button
@@ -101,7 +104,9 @@
                 icon="delete"
                 :disabled="selectIds.length === 0"
                 @click="handleDelete(selectIds)"
-                >批量删除</el-button>
+              >
+                批量删除
+              </el-button>
             </el-col>
           </el-row>
         </div>
@@ -120,7 +125,13 @@
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="清除">
-                <el-button v-hasPerm="['module_application:job:clear']" type="danger" icon="delete" circle @click="handleClear"/>
+                <el-button
+                  v-hasPerm="['module_application:job:clear']"
+                  type="danger"
+                  icon="delete"
+                  circle
+                  @click="handleClear"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -160,24 +171,29 @@
           </template>
         </el-table-column>
         <el-table-column label="任务名称" prop="name" min-width="140" />
-        <el-table-column label="执行函数" prop="func" min-width="140" >
+        <el-table-column label="执行函数" prop="func" min-width="140">
           <template #default="scope">
-            {{ (dictStore.getDictLabel('sys_job_function',scope.row.func) as any)?.dict_label || scope.row.func }}
+            {{
+              (dictStore.getDictLabel("sys_job_function", scope.row.func) as any)?.dict_label ||
+              scope.row.func
+            }}
           </template>
         </el-table-column>
         <el-table-column label="触发器" prop="trigger" min-width="100" show-overflow-tooltip>
           <template #default="scope">
-            {{ (dictStore.getDictLabel('sys_job_trigger',scope.row.trigger) as any)?.dict_label }}
+            {{ (dictStore.getDictLabel("sys_job_trigger", scope.row.trigger) as any)?.dict_label }}
           </template>
         </el-table-column>
         <el-table-column label="存储器" prop="jobstore" min-width="120" show-overflow-tooltip>
           <template #default="scope">
-            {{ (dictStore.getDictLabel('sys_job_store',scope.row.jobstore) as any)?.dict_label }}
+            {{ (dictStore.getDictLabel("sys_job_store", scope.row.jobstore) as any)?.dict_label }}
           </template>
         </el-table-column>
         <el-table-column label="执行器" prop="executor" min-width="100">
           <template #default="scope">
-            {{ (dictStore.getDictLabel('sys_job_executor',scope.row.executor) as any)?.dict_label }}
+            {{
+              (dictStore.getDictLabel("sys_job_executor", scope.row.executor) as any)?.dict_label
+            }}
           </template>
         </el-table-column>
         <el-table-column label="并发执行" prop="coalesce" min-width="100">
@@ -195,18 +211,8 @@
           </template>
         </el-table-column>
         <el-table-column label="描述" prop="description" min-width="100" />
-        <el-table-column
-          label="创建时间"
-          prop="created_at"
-          min-width="200"
-          sortable
-        />
-        <el-table-column
-          label="更新时间"
-          prop="updated_at"
-          min-width="200"
-          sortable
-        />
+        <el-table-column label="创建时间" prop="created_at" min-width="200" sortable />
+        <el-table-column label="更新时间" prop="updated_at" min-width="200" sortable />
 
         <OperationColumn :list-data-length="pageTableData.length">
           <template #default="scope">
@@ -295,30 +301,50 @@
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
-          <el-descriptions-item label="序号" :span="2">{{
-            detailFormData.id
-          }}</el-descriptions-item>
-          <el-descriptions-item label="任务名称" :span="2">{{
-            detailFormData.name
-          }}</el-descriptions-item>
-          <el-descriptions-item label="任务函数" :span="2">{{
-            (detailFormData.func ? dictStore.getDictLabel('sys_job_function', detailFormData.func) as any : undefined)?.dict_label || detailFormData.func
-          }}</el-descriptions-item>
-          <el-descriptions-item label="存储器" :span="2">{{
-            (detailFormData.jobstore ? dictStore.getDictLabel('sys_job_store', detailFormData.jobstore) as any : undefined)?.dict_label || detailFormData.jobstore
-          }}</el-descriptions-item>
-          <el-descriptions-item label="执行器" :span="2">{{
-            (detailFormData.executor ? dictStore.getDictLabel('sys_job_executor', detailFormData.executor) as any : undefined)?.dict_label || detailFormData.executor
-          }}</el-descriptions-item>
-          <el-descriptions-item label="触发器" :span="2">{{
-            (detailFormData.trigger ? dictStore.getDictLabel('sys_job_trigger', detailFormData.trigger) as any : undefined)?.dict_label || detailFormData.trigger
-          }}</el-descriptions-item>
-          <el-descriptions-item label="位置参数" :span="2">{{
-            detailFormData.args
-          }}</el-descriptions-item>
-          <el-descriptions-item label="关键字参数" :span="2">{{
-            detailFormData.kwargs
-          }}</el-descriptions-item>
+          <el-descriptions-item label="序号" :span="2">
+            {{ detailFormData.id }}
+          </el-descriptions-item>
+          <el-descriptions-item label="任务名称" :span="2">
+            {{ detailFormData.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="任务函数" :span="2">
+            {{
+              (detailFormData.func
+                ? (dictStore.getDictLabel("sys_job_function", detailFormData.func) as any)
+                : undefined
+              )?.dict_label || detailFormData.func
+            }}
+          </el-descriptions-item>
+          <el-descriptions-item label="存储器" :span="2">
+            {{
+              (detailFormData.jobstore
+                ? (dictStore.getDictLabel("sys_job_store", detailFormData.jobstore) as any)
+                : undefined
+              )?.dict_label || detailFormData.jobstore
+            }}
+          </el-descriptions-item>
+          <el-descriptions-item label="执行器" :span="2">
+            {{
+              (detailFormData.executor
+                ? (dictStore.getDictLabel("sys_job_executor", detailFormData.executor) as any)
+                : undefined
+              )?.dict_label || detailFormData.executor
+            }}
+          </el-descriptions-item>
+          <el-descriptions-item label="触发器" :span="2">
+            {{
+              (detailFormData.trigger
+                ? (dictStore.getDictLabel("sys_job_trigger", detailFormData.trigger) as any)
+                : undefined
+              )?.dict_label || detailFormData.trigger
+            }}
+          </el-descriptions-item>
+          <el-descriptions-item label="位置参数" :span="2">
+            {{ detailFormData.args }}
+          </el-descriptions-item>
+          <el-descriptions-item label="关键字参数" :span="2">
+            {{ detailFormData.kwargs }}
+          </el-descriptions-item>
           <el-descriptions-item label="并发执行" :span="2">
             <el-tag :type="detailFormData.coalesce ? 'success' : 'danger'">
               {{ detailFormData.coalesce ? "是" : "否" }}
@@ -329,30 +355,30 @@
               {{ detailFormData.status ? "运行中" : "暂停" }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="最大实例数" :span="2">{{
-            detailFormData.max_instances
-          }}</el-descriptions-item>
-          <el-descriptions-item label="触发器参数" :span="2">{{
-            detailFormData.trigger_args
-          }}</el-descriptions-item>
-          <el-descriptions-item label="开始时间" :span="2">{{
-            detailFormData.start_date
-          }}</el-descriptions-item>
-          <el-descriptions-item label="结束时间" :span="2">{{
-            detailFormData.end_date
-          }}</el-descriptions-item>
-          <el-descriptions-item label="创建人" :span="2">{{
-            detailFormData.creator?.name
-          }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{
-            detailFormData.created_at
-          }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="2">{{
-            detailFormData.updated_at
-          }}</el-descriptions-item>
-          <el-descriptions-item label="描述" :span="4">{{
-            detailFormData.description
-          }}</el-descriptions-item>
+          <el-descriptions-item label="最大实例数" :span="2">
+            {{ detailFormData.max_instances }}
+          </el-descriptions-item>
+          <el-descriptions-item label="触发器参数" :span="2">
+            {{ detailFormData.trigger_args }}
+          </el-descriptions-item>
+          <el-descriptions-item label="开始时间" :span="2">
+            {{ detailFormData.start_date }}
+          </el-descriptions-item>
+          <el-descriptions-item label="结束时间" :span="2">
+            {{ detailFormData.end_date }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="2">
+            {{ detailFormData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="4">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
       <!-- 新增、编辑表单 -->
@@ -366,55 +392,43 @@
           inline
         >
           <el-form-item label="任务名称" prop="name" style="width: 40%">
-            <el-input
-              v-model="formData.name"
-              placeholder="请输入任务名称"
-              :maxlength="50"
-            />
+            <el-input v-model="formData.name" placeholder="请输入任务名称" :maxlength="50" />
           </el-form-item>
           <el-form-item label="任务函数" prop="func" style="width: 40%">
             <el-select v-model="formData.func" placeholder="请选择任务函数">
-                <el-option
-                  v-for="item in dictStore.getDictArray('sys_job_function')"
-                  :key="item.dict_value"
-                  :label="item.dict_label"
-                  :value="item.dict_value"
-                />
-              </el-select>
+              <el-option
+                v-for="item in dictStore.getDictArray('sys_job_function')"
+                :key="item.dict_value"
+                :label="item.dict_label"
+                :value="item.dict_value"
+              />
+            </el-select>
           </el-form-item>
           <el-form-item label="存储器" prop="jobstore" style="width: 40%">
             <el-select v-model="formData.jobstore" placeholder="请选择存储器">
-                <el-option 
-                  v-for="item in dictStore.getDictArray('sys_job_store')"
-                  :key="item.dict_value"
-                  :label="item.dict_label"
-                  :value="item.dict_value"
-                />
-              </el-select>
+              <el-option
+                v-for="item in dictStore.getDictArray('sys_job_store')"
+                :key="item.dict_value"
+                :label="item.dict_label"
+                :value="item.dict_value"
+              />
+            </el-select>
           </el-form-item>
           <el-form-item label="执行器" prop="executor" style="width: 40%">
             <el-select v-model="formData.executor" placeholder="请选择执行器">
-                <el-option 
-                  v-for="item in dictStore.getDictArray('sys_job_executor')"
-                  :key="item.dict_value"
-                  :label="item.dict_label"
-                  :value="item.dict_value"
-                />
-              </el-select>
+              <el-option
+                v-for="item in dictStore.getDictArray('sys_job_executor')"
+                :key="item.dict_value"
+                :label="item.dict_label"
+                :value="item.dict_value"
+              />
+            </el-select>
           </el-form-item>
           <el-form-item label="位置参数" prop="args" style="width: 40%">
-            <el-input
-              v-model="formData.args"
-              placeholder="请输入位置参数"
-              :maxlength="50"
-            />
+            <el-input v-model="formData.args" placeholder="请输入位置参数" :maxlength="50" />
           </el-form-item>
           <el-form-item label="关键字参数" prop="kwargs" style="width: 40%">
-            <el-input
-              v-model="formData.kwargs"
-              placeholder="请输入关键字参数"
-              :maxlength="50"
-            />
+            <el-input v-model="formData.kwargs" placeholder="请输入关键字参数" :maxlength="50" />
           </el-form-item>
           <el-form-item label="并发执行" prop="coalesce" style="width: 40%">
             <el-radio-group v-model="formData.coalesce">
@@ -422,11 +436,7 @@
               <el-radio :value="false">否</el-radio>
             </el-radio-group>
           </el-form-item>
-          <el-form-item
-            label="最大实例数"
-            prop="max_instances"
-            style="width: 40%"
-          >
+          <el-form-item label="最大实例数" prop="max_instances" style="width: 40%">
             <el-input-number
               v-model="formData.max_instances"
               controls-position="right"
@@ -436,13 +446,13 @@
           </el-form-item>
           <el-form-item label="触发器" prop="trigger" style="width: 40%">
             <el-select v-model="formData.trigger" placeholder="请选择触发器">
-                <el-option
-                  v-for="item in dictStore.getDictArray('sys_job_trigger')"
-                  :key="item.dict_value"
-                  :label="item.dict_label"
-                  :value="item.dict_value"
-                />
-              </el-select>
+              <el-option
+                v-for="item in dictStore.getDictArray('sys_job_trigger')"
+                :key="item.dict_value"
+                :label="item.dict_label"
+                :value="item.dict_value"
+              />
+            </el-select>
           </el-form-item>
           <!-- 运行日期、间隔时间或 Cron 表达式 -->
           <el-form-item
@@ -464,9 +474,7 @@
             v-else-if="formData.trigger === 'interval'"
             label="间隔时间"
             prop="trigger_args"
-            :rules="[
-              { required: true, message: '请输入间隔时间', trigger: 'change' },
-            ]"
+            :rules="[{ required: true, message: '请输入间隔时间', trigger: 'change' }]"
             style="width: 40%"
           >
             <el-popover
@@ -532,9 +540,7 @@
             v-if="formData.trigger && formData.trigger != 'date'"
             label="开始日期"
             prop="start_date"
-            :rules="[
-              { required: false, message: '请选择开始日期', trigger: 'blur' },
-            ]"
+            :rules="[{ required: false, message: '请选择开始日期', trigger: 'blur' }]"
             style="width: 40%"
           >
             <el-date-picker
@@ -549,9 +555,7 @@
             v-if="formData.trigger && formData.trigger != 'date'"
             label="结束日期"
             prop="end_date"
-            :rules="[
-              { required: false, message: '请选择结束日期', trigger: 'blur' },
-            ]"
+            :rules="[{ required: false, message: '请选择结束日期', trigger: 'blur' }]"
             style="width: 40%"
           >
             <el-date-picker
@@ -580,12 +584,26 @@
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
           <el-button @click="handleCloseDialog">取消</el-button>
-          <el-button v-if="dialogVisible.type !== 'detail'" type="primary" @click="handleSubmit">确定</el-button>
-          <el-button v-else v-hasPerm="['module_application:job:detail']" type="primary" @click="handleCloseDialog" >确定</el-button>
+          <el-button v-if="dialogVisible.type !== 'detail'" type="primary" @click="handleSubmit">
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['module_application:job:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
         </div>
       </template>
     </el-dialog>
-    <JobLogDrawer v-if="drawerVisible" v-model="drawerVisible" :job-id="currentJobId" :job-name="currentJobName" />
+    <JobLogDrawer
+      v-if="drawerVisible"
+      v-model="drawerVisible"
+      :job-id="currentJobId"
+      :job-name="currentJobName"
+    />
     <ExportModal
       v-model="exportsDialogVisible"
       :content-config="curdContentConfig"
@@ -607,7 +625,7 @@ import IntervalTab from "@/components/IntervalTab/index.vue";
 import { useDictStore } from "@/store/index";
 import { vue3CronPlus } from "vue3-cron-plus";
 import "vue3-cron-plus/dist/index.css"; // 引入样式
-import  JobLogDrawer from "@/views/module_application/job/components/JobLogDrawer.vue"
+import JobLogDrawer from "@/views/module_application/job/components/JobLogDrawer.vue";
 import OperationColumn from "@/components/OperationColumn/index.vue";
 import ExportModal from "@/components/CURD/ExportModal.vue";
 import type { IContentConfig } from "@/components/CURD/types";
@@ -690,7 +708,6 @@ const rules = reactive({
   executor: [{ required: true, message: "请选择执行器", trigger: "blur" }],
 });
 
-
 // 日期范围临时变量
 const dateRange = ref<[Date, Date] | []>([]);
 
@@ -764,7 +781,7 @@ const initialFormData: JobForm = {
   end_date: undefined,
   status: undefined,
   description: undefined,
-}
+};
 
 // 重置表单
 async function resetForm() {
@@ -789,10 +806,7 @@ async function handleCloseDialog() {
 }
 
 // 打开弹窗
-async function handleOpenDialog(
-  type: "create" | "update" | "detail",
-  id?: number
-) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await JobAPI.getJobDetail(id);
@@ -928,25 +942,25 @@ function handleOpenLogDrawer(jobId: number, jobName: string) {
 
 // 导出字段
 const exportColumns = [
-  { prop: 'name', label: '任务名称' },
-  { prop: 'func', label: '执行函数' },
-  { prop: 'trigger', label: '触发器' },
-  { prop: 'jobstore', label: '存储器' },
-  { prop: 'executor', label: '执行器' },
-  { prop: 'coalesce', label: '并发执行' },
-  { prop: 'status', label: '状态' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "name", label: "任务名称" },
+  { prop: "func", label: "执行函数" },
+  { prop: "trigger", label: "触发器" },
+  { prop: "jobstore", label: "存储器" },
+  { prop: "executor", label: "执行器" },
+  { prop: "coalesce", label: "并发执行" },
+  { prop: "status", label: "状态" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导出配置（用于导出弹窗）
 const curdContentConfig = {
-  permPrefix: 'module_application:job',
+  permPrefix: "module_application:job",
   cols: exportColumns as any,
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.status === 'string') query.status = query.status === 'true';
+    if (typeof query.status === "string") query.status = query.status === "true";
     query.page_no = 1;
     query.page_size = 1000;
     const all: any[] = [];
@@ -964,11 +978,15 @@ const curdContentConfig = {
 
 onMounted(async () => {
   // 加载字典数据
-  await dictStore.getDict(['sys_job_function','sys_job_executor','sys_job_store', 'sys_job_trigger']);
+  await dictStore.getDict([
+    "sys_job_function",
+    "sys_job_executor",
+    "sys_job_store",
+    "sys_job_trigger",
+  ]);
   // 加载表格数据
   loadingData();
 });
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/frontend/src/views/module_application/myapp/components/InternalApp.vue b/frontend/src/views/module_application/myapp/components/InternalApp.vue
index 9710bbf8..a6e72f96 100644
--- a/frontend/src/views/module_application/myapp/components/InternalApp.vue
+++ b/frontend/src/views/module_application/myapp/components/InternalApp.vue
@@ -2,9 +2,9 @@
 <template>
   <div class="internal-app-container">
     <div class="internal-app-content">
-      <iframe 
+      <iframe
         ref="iframeRef"
-        :src="appUrl" 
+        :src="appUrl"
         class="internal-app-iframe"
         frameborder="0"
         allowfullscreen
@@ -21,9 +21,9 @@
 </template>
 
 <script setup lang="ts">
-import { useRoute } from 'vue-router';
-import { Loading } from '@element-plus/icons-vue';
-import { useTagsViewStore } from '@/store';
+import { useRoute } from "vue-router";
+import { Loading } from "@element-plus/icons-vue";
+import { useTagsViewStore } from "@/store";
 
 defineOptions({
   name: "InternalApp",
@@ -45,19 +45,22 @@ function handleIframeLoad() {
 }
 
 // 监听路由变化，更新iframe
-watch(() => route.query.url, (newUrl) => {
-  if (newUrl && iframeRef.value) {
-    loading.value = true;
-    iframeRef.value.src = newUrl as string;
+watch(
+  () => route.query.url,
+  (newUrl) => {
+    if (newUrl && iframeRef.value) {
+      loading.value = true;
+      iframeRef.value.src = newUrl as string;
+    }
   }
-});
+);
 
 // 在组件挂载时设置标签标题
 onMounted(() => {
   if (appName.value) {
     // 查找当前标签并更新标题
     nextTick(() => {
-      const currentTag = tagsViewStore.visitedViews.find(tag => tag.path === route.path);
+      const currentTag = tagsViewStore.visitedViews.find((tag) => tag.path === route.path);
       if (currentTag && currentTag.title !== appName.value) {
         tagsViewStore.updateVisitedView({
           ...currentTag,
@@ -71,19 +74,22 @@ onMounted(() => {
 });
 
 // 监听应用名称变化，更新标签标题
-watch(() => appName.value, (newAppName) => {
-  if (newAppName) {
-    const currentTag = tagsViewStore.visitedViews.find(tag => tag.path === route.path);
-    if (currentTag) {
-      tagsViewStore.updateVisitedView({
-        ...currentTag,
-        title: newAppName,
-        fullPath: route.fullPath,
-        query: route.query,
-      });
+watch(
+  () => appName.value,
+  (newAppName) => {
+    if (newAppName) {
+      const currentTag = tagsViewStore.visitedViews.find((tag) => tag.path === route.path);
+      if (currentTag) {
+        tagsViewStore.updateVisitedView({
+          ...currentTag,
+          title: newAppName,
+          fullPath: route.fullPath,
+          query: route.query,
+        });
+      }
     }
   }
-});
+);
 </script>
 
 <style lang="scss" scoped>
@@ -118,13 +124,13 @@ watch(() => appName.value, (newAppName) => {
   align-items: center;
   background: var(--el-bg-color);
   gap: 12px;
-  
+
   .loading-icon {
     font-size: 24px;
     color: var(--el-color-primary);
     animation: rotate 2s linear infinite;
   }
-  
+
   span {
     color: var(--el-text-color-regular);
     font-size: 14px;
diff --git a/frontend/src/views/module_application/myapp/index.vue b/frontend/src/views/module_application/myapp/index.vue
index 358432e7..1dfbe3d4 100644
--- a/frontend/src/views/module_application/myapp/index.vue
+++ b/frontend/src/views/module_application/myapp/index.vue
@@ -1,169 +1,189 @@
 <!-- 我的应用管理 -->
-<template> 
+<template>
   <div class="app-container">
-      <!-- 顶部搜索和操作区域 -->
-      <div class="search-container">
-        <el-form ref="queryFormRef" :model="queryFormData" :inline="true" label-suffix=":" @submit.prevent="handleQuery">
-          <el-form-item prop="name" label="应用名称">
-            <el-input v-model="queryFormData.name" placeholder="请输入应用名称" clearable/>
-          </el-form-item>
-          <el-form-item prop="status" label="状态">
-            <el-select v-model="queryFormData.status" placeholder="请选择状态" clearable style="width: 170px;">
-              <el-option label="启用" :value="true" />
-              <el-option label="停用" :value="false" />
-            </el-select>
-          </el-form-item>
-          <el-form-item v-if="isExpand" prop="creator" label="创建人">
-            <UserTableSelect
-                v-model="queryFormData.creator"
-                @confirm-click="handleConfirm"
-                @clear-click="handleQuery"
-            />
-          </el-form-item>
-          <el-form-item class="search-buttons">
-            <el-button v-hasPerm="['application:myapp:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-            <el-button v-hasPerm="['application:myapp:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
-            <!-- 展开/收起 -->
-            <template v-if="isExpandable">
-              <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
-                {{ isExpand ? "收起" : "展开" }}
-                <el-icon>
-                  <template v-if="isExpand">
-                    <ArrowUp />
-                  </template>
-                  <template v-else>
-                    <ArrowDown />
-                  </template>
-                </el-icon>
-              </el-link>
-            </template>
-          </el-form-item>
-        </el-form>
-      </div>
+    <!-- 顶部搜索和操作区域 -->
+    <div class="search-container">
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
+        <el-form-item prop="name" label="应用名称">
+          <el-input v-model="queryFormData.name" placeholder="请输入应用名称" clearable />
+        </el-form-item>
+        <el-form-item prop="status" label="状态">
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            clearable
+            style="width: 170px"
+          >
+            <el-option label="启用" :value="true" />
+            <el-option label="停用" :value="false" />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="isExpand" prop="creator" label="创建人">
+          <UserTableSelect
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item class="search-buttons">
+          <el-button
+            v-hasPerm="['application:myapp:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['application:myapp:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
+          <!-- 展开/收起 -->
+          <template v-if="isExpandable">
+            <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
+              {{ isExpand ? "收起" : "展开" }}
+              <el-icon>
+                <template v-if="isExpand">
+                  <ArrowUp />
+                </template>
+                <template v-else>
+                  <ArrowDown />
+                </template>
+              </el-icon>
+            </el-link>
+          </template>
+        </el-form-item>
+      </el-form>
+    </div>
 
-      <!-- 应用卡片展示区域 -->
-      <el-card shadow="hover" class="app-grid-card"  >
-        <template #header>
-          <div class="card-header">
-            <span>应用市场</span>
-            <el-button v-hasPerm="['application:myapp:create']" type="primary" icon="plus" @click="handleCreateApp">
-              创建应用
+    <!-- 应用卡片展示区域 -->
+    <el-card shadow="hover" class="app-grid-card">
+      <template #header>
+        <div class="card-header">
+          <span>应用市场</span>
+          <el-button
+            v-hasPerm="['application:myapp:create']"
+            type="primary"
+            icon="plus"
+            @click="handleCreateApp"
+          >
+            创建应用
+          </el-button>
+        </div>
+      </template>
+
+      <!-- 应用网格 -->
+      <div v-loading="loading" class="app-grid">
+        <el-card
+          v-for="app in applicationList"
+          :key="app.id"
+          class="app-card-el"
+          :body-style="{ padding: '12px' }"
+          shadow="hover"
+        >
+          <template #header>
+            <div class="app-card-header-el">
+              <div class="app-info-header">
+                <el-avatar :size="40" :src="app.icon_url" class="app-avatar-el">
+                  <el-icon size="20"><Monitor /></el-icon>
+                </el-avatar>
+                <div class="app-title-section">
+                  <h3 class="app-name-el">{{ app.name }}</h3>
+                  <el-tag
+                    :type="app.status ? 'success' : 'danger'"
+                    size="small"
+                    class="app-status-tag"
+                  >
+                    {{ app.status ? "启用" : "停用" }}
+                  </el-tag>
+                </div>
+              </div>
+              <el-dropdown
+                v-hasPerm="['application:myapp:update']"
+                trigger="click"
+                @command="(command) => handleAppAction(command, app)"
+              >
+                <el-button type="text" icon="MoreFilled" size="small" class="app-menu-btn" />
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item command="edit" icon="Edit">编辑</el-dropdown-item>
+                    <el-dropdown-item command="delete" icon="Delete" divided>删除</el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </div>
+          </template>
+
+          <div class="app-card-content">
+            <p class="app-description">{{ app.description || "暂无描述" }}</p>
+
+            <div class="app-meta-info">
+              <div class="app-meta-row">
+                <div class="meta-item left">
+                  <el-icon size="14" class="meta-icon"><User /></el-icon>
+                  <span>{{ app.creator?.name || "未知" }}</span>
+                </div>
+                <div class="meta-item right">
+                  <el-icon size="14" class="meta-icon"><Clock /></el-icon>
+                  <span>{{ formatTime(app.created_at) }}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <div class="app-card-actions">
+            <el-button
+              v-hasPerm="['application:myapp:open_external']"
+              type="primary"
+              icon="Link"
+              size="small"
+              :disabled="!app.status"
+              class="action-btn"
+              @click="openAppExternal(app.access_url)"
+            >
+              外部打开
+            </el-button>
+            <el-button
+              v-hasPerm="['application:myapp:open_internal']"
+              type="default"
+              icon="View"
+              size="small"
+              :disabled="!app.status"
+              class="action-btn"
+              @click="openAppInternal(app)"
+            >
+              内部打开
             </el-button>
           </div>
-        </template>
+        </el-card>
+      </div>
 
-        <!-- 应用网格 -->
-        <div v-loading="loading" class="app-grid" >
-          <el-card 
-            v-for="app in applicationList" 
-            :key="app.id"
-            class="app-card-el"
-            :body-style="{ padding: '12px' }"
-            shadow="hover"
-          >
-            <template #header>
-              <div class="app-card-header-el">
-                <div class="app-info-header">
-                  <el-avatar 
-                    :size="40" 
-                    :src="app.icon_url" 
-                    class="app-avatar-el"
-                  >
-                    <el-icon size="20"><Monitor /></el-icon>
-                  </el-avatar>
-                  <div class="app-title-section">
-                    <h3 class="app-name-el">{{ app.name }}</h3>
-                    <el-tag 
-                      :type="app.status ? 'success' : 'danger'" 
-                      size="small"
-                      class="app-status-tag"
-                    >
-                      {{ app.status ? '启用' : '停用' }}
-                    </el-tag>
-                  </div>
-                </div>
-                <el-dropdown 
-                  v-hasPerm="['application:myapp:update']"
-                  trigger="click" 
-                  @command="(command) => handleAppAction(command, app)"
-                >
-                  <el-button 
-                    type="text" 
-                    icon="MoreFilled" 
-                    size="small"
-                    class="app-menu-btn"
-                  />
-                  <template #dropdown>
-                    <el-dropdown-menu>
-                      <el-dropdown-item command="edit" icon="Edit">编辑</el-dropdown-item>
-                      <el-dropdown-item command="delete" icon="Delete" divided>删除</el-dropdown-item>
-                    </el-dropdown-menu>
-                  </template>
-                </el-dropdown>
-              </div>
-            </template>
+      <!-- 空状态 -->
+      <div v-if="applicationList.length === 0 && !loading">
+        <el-empty :image-size="80" description="暂无数据" />
+      </div>
 
-            <div class="app-card-content">
-              <p class="app-description">{{ app.description || '暂无描述' }}</p>
-              
-              <div class="app-meta-info">
-                <div class="app-meta-row">
-                  <div class="meta-item left">
-                    <el-icon size="14" class="meta-icon"><User /></el-icon>
-                    <span>{{ app.creator?.name || '未知' }}</span>
-                  </div>
-                  <div class="meta-item right">
-                    <el-icon size="14" class="meta-icon"><Clock /></el-icon>
-                    <span>{{ formatTime(app.created_at) }}</span>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            <div class="app-card-actions">
-              <el-button 
-                v-hasPerm="['application:myapp:open_external']"
-                type="primary" 
-                icon="Link" 
-                size="small"
-                :disabled="!app.status"
-                class="action-btn"
-                @click="openAppExternal(app.access_url)"
-              >
-                外部打开
-              </el-button>
-              <el-button 
-                v-hasPerm="['application:myapp:open_internal']"
-                type="default" 
-                icon="View" 
-                size="small"
-                :disabled="!app.status"
-                class="action-btn"
-                @click="openAppInternal(app)"
-              >
-                内部打开
-              </el-button>
-            </div>
-          </el-card>
-        </div>
-        
-        <!-- 空状态 -->
-        <div v-if="applicationList.length === 0 && !loading" >
-          <el-empty :image-size="80" description="暂无数据" />
-        </div>
-
-        <!-- 分页区域 -->
-        <template #footer>
-          <!-- 使用卡片 footer 样式右对齐，无需额外容器 -->
-          <pagination
-            v-model:total="total"
-            v-model:page="queryFormData.page_no"
-            v-model:limit="queryFormData.page_size"
-            :page-sizes="[12, 24, 48]"
-            @pagination="loadApplicationList"
-          />
-        </template>
-      </el-card>
+      <!-- 分页区域 -->
+      <template #footer>
+        <!-- 使用卡片 footer 样式右对齐，无需额外容器 -->
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          :page-sizes="[12, 24, 48]"
+          @pagination="loadApplicationList"
+        />
+      </template>
+    </el-card>
 
     <!-- 应用创建/编辑弹窗 -->
     <el-drawer
@@ -183,22 +203,22 @@
         <el-form-item label="应用名称" prop="name">
           <el-input v-model="formData.name" placeholder="请输入应用名称" />
         </el-form-item>
-        
+
         <el-form-item label="访问地址" prop="access_url">
           <el-input v-model="formData.access_url" placeholder="请输入访问地址" />
         </el-form-item>
-        
+
         <el-form-item label="图标地址" prop="icon_url">
           <el-input v-model="formData.icon_url" placeholder="请输入图标地址" />
         </el-form-item>
-        
+
         <el-form-item label="应用状态" prop="status">
           <el-radio-group v-model="formData.status">
             <el-radio :value="true">启用</el-radio>
             <el-radio :value="false">停用</el-radio>
           </el-radio-group>
         </el-form-item>
-        
+
         <el-form-item label="应用描述" prop="description">
           <el-input
             v-model="formData.description"
@@ -231,8 +251,12 @@ import { useAppStore } from "@/store/modules/app.store";
 import { useTagsViewStore } from "@/store";
 import { useRouter } from "vue-router";
 import { DeviceEnum } from "@/enums/settings/device.enum";
-import { Monitor, User, Clock } from '@element-plus/icons-vue';
-import ApplicationAPI, { type ApplicationForm, type ApplicationInfo, type ApplicationPageQuery } from "@/api/module_application/myapp";
+import { Monitor, User, Clock } from "@element-plus/icons-vue";
+import ApplicationAPI, {
+  type ApplicationForm,
+  type ApplicationInfo,
+  type ApplicationPageQuery,
+} from "@/api/module_application/myapp";
 import { formatToDateTime } from "@/utils/dateUtil";
 
 const appStore = useAppStore();
@@ -245,7 +269,7 @@ const formRef = ref();
 const loading = ref(false);
 const total = ref(0);
 const dialogVisible = ref(false);
-const dialogType = ref<'create' | 'edit'>('create');
+const dialogType = ref<"create" | "edit">("create");
 const currentApp = ref<ApplicationInfo | null>(null);
 const isExpand = ref(false);
 const isExpandable = ref(true);
@@ -264,37 +288,38 @@ const applicationList = ref<ApplicationInfo[]>([]);
 
 // 表单数据
 const formData = reactive<ApplicationForm>({
-  name: '',
-  access_url: '',
-  icon_url: '',
+  name: "",
+  access_url: "",
+  icon_url: "",
   status: true,
-  description: '',
+  description: "",
 });
 
 // 表单验证规则
 const formRules = reactive({
   name: [
     { required: true, message: "请输入应用名称", trigger: "blur" },
-    { min: 2, max: 30, message: "长度在 2 到 30 个字符", trigger: "blur" }],
+    { min: 2, max: 30, message: "长度在 2 到 30 个字符", trigger: "blur" },
+  ],
   access_url: [
     { required: true, message: "请输入访问地址", trigger: "blur" },
-    { type: 'url' as const, message: "请输入正确的URL格式", trigger: "blur" }
+    { type: "url" as const, message: "请输入正确的URL格式", trigger: "blur" },
   ],
   icon_url: [
     { required: true, message: "请输入图标地址", trigger: "blur" },
-    { type: 'url' as const, message: "请输入正确的URL格式", trigger: "blur" }
+    { type: "url" as const, message: "请输入正确的URL格式", trigger: "blur" },
   ],
   status: [{ required: true, message: "请选择应用状态", trigger: "change" }],
 });
 
 // 计算属性
 const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "500px" : "90%"));
-const dialogTitle = computed(() => dialogType.value === 'create' ? '创建应用' : '编辑应用');
+const dialogTitle = computed(() => (dialogType.value === "create" ? "创建应用" : "编辑应用"));
 
 // 格式化时间
 const formatTime = (time: string | undefined) => {
-  if (!time) return '未知';
-  return formatToDateTime(time, 'YYYY-MM-DD HH:mm:ss');
+  if (!time) return "未知";
+  return formatToDateTime(time, "YYYY-MM-DD HH:mm:ss");
 };
 
 // 加载应用列表
@@ -305,7 +330,7 @@ async function loadApplicationList() {
     applicationList.value = response.data.data.items;
     total.value = response.data.data.total;
   } catch (error) {
-    console.error('加载应用列表失败:', error);
+    console.error("加载应用列表失败:", error);
   } finally {
     loading.value = false;
   }
@@ -331,15 +356,15 @@ async function handleResetQuery() {
 
 // 创建应用
 function handleCreateApp() {
-  console.log('handleCreateApp');
-  dialogType.value = 'create';
+  console.log("handleCreateApp");
+  dialogType.value = "create";
   resetForm();
   dialogVisible.value = true;
 }
 
 // 编辑应用
 function handleEditApp(app: ApplicationInfo) {
-  dialogType.value = 'edit';
+  dialogType.value = "edit";
   currentApp.value = app;
   Object.assign(formData, app);
   dialogVisible.value = true;
@@ -348,17 +373,17 @@ function handleEditApp(app: ApplicationInfo) {
 // 删除应用
 async function handleDeleteApp(app: ApplicationInfo) {
   try {
-    await ElMessageBox.confirm('确认删除该应用？', '警告', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
+    await ElMessageBox.confirm("确认删除该应用？", "警告", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
     });
-    
+
     await ApplicationAPI.deleteApplication([app.id!]);
     await loadApplicationList();
   } catch (error) {
-    if (error !== 'cancel') {
-      console.error('删除应用失败:', error);
+    if (error !== "cancel") {
+      console.error("删除应用失败:", error);
     }
   }
 }
@@ -366,10 +391,10 @@ async function handleDeleteApp(app: ApplicationInfo) {
 // 应用操作
 async function handleAppAction(command: string, app: ApplicationInfo) {
   switch (command) {
-    case 'edit':
+    case "edit":
       handleEditApp(app);
       break;
-    case 'delete':
+    case "delete":
       await handleDeleteApp(app);
       break;
   }
@@ -378,68 +403,72 @@ async function handleAppAction(command: string, app: ApplicationInfo) {
 // 外部打开应用
 function openAppExternal(url: string | undefined) {
   if (url) {
-    window.open(url, '_blank');
+    window.open(url, "_blank");
   }
 }
 
 // 内部打开应用
 function openAppInternal(app: ApplicationInfo) {
   if (!app.status) {
-    ElMessage.warning('应用已停用，无法打开');
+    ElMessage.warning("应用已停用，无法打开");
     return;
   }
-  
+
   if (!app.access_url) {
-    ElMessage.warning('应用访问地址不存在');
+    ElMessage.warning("应用访问地址不存在");
     return;
   }
-  
+
   // 创建一个动态路由路径
   const appPath = `/internal-app/${app.id}`;
   const appName = `InternalApp${app.id}`;
-  const appTitle = app.name || '未命名应用';
-  
+  const appTitle = app.name || "未命名应用";
+
   // 先导航到路由，这样可以动态设置路由的meta信息
-  router.push({
-    path: appPath,
-    query: { url: app.access_url, appId: app.id?.toString() || '', appName: appTitle }
-  }).then(() => {
-    // 导航完成后，手动添加或更新标签视图
-    nextTick(() => {
-      // 查找是否已存在该标签
-      const existingTag = tagsViewStore.visitedViews.find(tag => tag.path === appPath);
-      
-      if (existingTag) {
-        // 如果存在，更新标题
-        tagsViewStore.updateVisitedView({
-          ...existingTag,
-          title: appTitle,
-        });
-      } else {
-        // 如果不存在，添加新标签
-        tagsViewStore.addView({
-          name: appName,
-          title: appTitle,
-          path: appPath,
-          fullPath: appPath + `?url=${encodeURIComponent(app.access_url || '')}&appId=${app.id || ''}&appName=${encodeURIComponent(appTitle)}`,
-          icon: 'Monitor',
-          affix: false,
-          keepAlive: false,
-          query: { url: app.access_url, appId: app.id?.toString() || '', appName: appTitle },
-        });
-      }
+  router
+    .push({
+      path: appPath,
+      query: { url: app.access_url, appId: app.id?.toString() || "", appName: appTitle },
+    })
+    .then(() => {
+      // 导航完成后，手动添加或更新标签视图
+      nextTick(() => {
+        // 查找是否已存在该标签
+        const existingTag = tagsViewStore.visitedViews.find((tag) => tag.path === appPath);
+
+        if (existingTag) {
+          // 如果存在，更新标题
+          tagsViewStore.updateVisitedView({
+            ...existingTag,
+            title: appTitle,
+          });
+        } else {
+          // 如果不存在，添加新标签
+          tagsViewStore.addView({
+            name: appName,
+            title: appTitle,
+            path: appPath,
+            fullPath:
+              appPath +
+              `?url=${encodeURIComponent(app.access_url || "")}&appId=${app.id || ""}&appName=${encodeURIComponent(appTitle)}`,
+            icon: "Monitor",
+            affix: false,
+            keepAlive: false,
+            query: { url: app.access_url, appId: app.id?.toString() || "", appName: appTitle },
+          });
+        }
+      });
     });
-  });
 }
 
 // 重置表单
 function resetForm() {
   Object.assign(formData, {
-    name: '',
-    access_url: '',
-    icon_url: '',
+    name: "",
+    access_url: "",
+    icon_url: "",
     status: true,
-    description: '',
+    description: "",
   });
   formRef.value?.resetFields();
 }
@@ -454,18 +483,18 @@ function handleCloseDialog() {
 async function handleSubmit() {
   try {
     await formRef.value?.validate();
-    
-    if (dialogType.value === 'create') {
+
+    if (dialogType.value === "create") {
       await ApplicationAPI.createApplication(formData);
     } else {
       await ApplicationAPI.updateApplication(currentApp.value!.id!, formData);
     }
-    
+
     dialogVisible.value = false;
     resetForm();
     await loadApplicationList();
   } catch (error) {
-    console.error('提交失败:', error);
+    console.error("提交失败:", error);
   }
 }
 
@@ -481,7 +510,7 @@ onMounted(() => {
   position: relative;
   display: flex;
   flex-direction: column;
-  
+
   :deep(.el-card__footer) {
     margin-top: auto;
     display: flex;
@@ -496,10 +525,10 @@ onMounted(() => {
 }
 
 .app-grid {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
-    flex: 1;
-  }
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
+  flex: 1;
+}
 
 .app-card-el {
   border: 1px solid var(--el-border-color-lighter);
@@ -521,7 +550,6 @@ onMounted(() => {
   min-width: 0;
 }
 
-
 .app-name-el {
   font-size: 16px;
   font-weight: 600;
@@ -533,8 +561,6 @@ onMounted(() => {
   text-overflow: ellipsis;
 }
 
-
-
 .app-card-content {
   margin: 12px 0;
 }
@@ -600,7 +626,7 @@ onMounted(() => {
   display: flex;
   gap: 8px;
   margin-top: 12px;
-  
+
   .action-btn {
     flex: 1;
     font-size: 12px;
@@ -608,17 +634,14 @@ onMounted(() => {
   }
 }
 
-
 .pagination-container {
   display: flex;
   justify-content: flex-end;
 }
 
-
 .dialog-footer {
   display: flex;
   justify-content: flex-end;
   gap: 12px;
 }
-
 </style>
diff --git a/frontend/src/views/module_application/workflow/index.vue b/frontend/src/views/module_application/workflow/index.vue
index baf490a2..1294ff52 100644
--- a/frontend/src/views/module_application/workflow/index.vue
+++ b/frontend/src/views/module_application/workflow/index.vue
@@ -1,209 +1,349 @@
 <!-- 演示示例 -->
 <template>
-    <div class="app-container">
-        <!-- 搜索区域 -->
-        <div class="search-container">
-            <el-form ref="queryFormRef" :model="queryFormData" :inline="true" label-suffix=":" @submit.prevent="handleQuery">
-                <el-form-item prop="name" label="名称">
-                    <el-input v-model="queryFormData.name" placeholder="请输入名称" clearable />
-                </el-form-item>
-                <el-form-item prop="status" label="状态">
-                    <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 167.5px" clearable>
-                        <el-option value="true" label="启用" />
-                        <el-option value="false" label="停用" />
-                    </el-select>
-                </el-form-item>
-                <!-- 时间范围，收起状态下隐藏 -->
-                <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-                    <DatePicker
-                        v-model="dateRange"
-                        @update:model-value="handleDateRangeChange"
-                    />
-                </el-form-item>
-                <!-- 查询、重置、展开/收起按钮 -->
-                <el-form-item class="search-buttons">
-                    <el-button type="primary" icon="search" native-type="submit">
-                        查询
-                    </el-button>
-                    <el-button icon="refresh" @click="handleResetQuery">
-                        重置
-                    </el-button>
-                    <!-- 展开/收起 -->
-                    <template v-if="isExpandable">
-                        <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
-                            {{ isExpand ? "收起" : "展开" }}
-                            <el-icon>
-                                <template v-if="isExpand">
-                                    <ArrowUp />
-                                </template>
-                                <template v-else>
-                                    <ArrowDown />
-                                </template>
-                            </el-icon>
-                        </el-link>
-                    </template>
-                </el-form-item>
-            </el-form>
-        </div>
-
-        <!-- 内容区域 -->
-        <el-card class="data-table">
-            <template #header>
-                <div class="card-header">
-                    <span>
-                        <el-tooltip content="流程管理列表">
-                            <QuestionFilled class="w-4 h-4 mx-1" />
-                        </el-tooltip>
-                        流程管理列表
-                    </span>
-                </div>
-            </template>
-
-            <!-- 功能区域 -->
-            <div class="data-table__toolbar">
-                <div class="data-table__toolbar--left">
-                    <el-button v-hasPerm="['workflow:operator:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
-                    <el-button v-hasPerm="['workflow:operator:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
-                    <el-dropdown v-hasPerm="['application:myapp:update']" trigger="click">
-                        <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">更多</el-button>
-                        <template #dropdown>
-                            <el-dropdown-menu>
-                                <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                                <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
-                            </el-dropdown-menu>
-                        </template>
-                    </el-dropdown>
-                </div>
-                <div class="data-table__toolbar--right">
-                    <el-tooltip content="刷新">
-                        <el-button v-hasPerm="['workflow:operator:refresh']" type="warning" icon="refresh" circle @click="handleRefresh"/>
-                    </el-tooltip>
-                    <el-popover placement="bottom" trigger="click">
-                        <template #reference>
-                            <el-button type="danger" icon="operation" circle></el-button>
-                        </template>
-                        <el-scrollbar max-height="350px">
-                            <template v-for="column in tableColumns" :key="column.prop">
-                            <el-checkbox v-if="column.prop" v-model="column.show" :label="column.label" />
-                            </template>
-                        </el-scrollbar>
-                    </el-popover>
-                </div>
-            </div>
-
-            <!-- 表格区域：工作流列表 -->
-            <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
-                <template #empty>
-                    <el-empty :image-size="80" description="暂无数据" />
+  <div class="app-container">
+    <!-- 搜索区域 -->
+    <div class="search-container">
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
+        <el-form-item prop="name" label="名称">
+          <el-input v-model="queryFormData.name" placeholder="请输入名称" clearable />
+        </el-form-item>
+        <el-form-item prop="status" label="状态">
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 167.5px"
+            clearable
+          >
+            <el-option value="true" label="启用" />
+            <el-option value="false" label="停用" />
+          </el-select>
+        </el-form-item>
+        <!-- 时间范围，收起状态下隐藏 -->
+        <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
+        </el-form-item>
+        <!-- 查询、重置、展开/收起按钮 -->
+        <el-form-item class="search-buttons">
+          <el-button type="primary" icon="search" native-type="submit">查询</el-button>
+          <el-button icon="refresh" @click="handleResetQuery">重置</el-button>
+          <!-- 展开/收起 -->
+          <template v-if="isExpandable">
+            <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
+              {{ isExpand ? "收起" : "展开" }}
+              <el-icon>
+                <template v-if="isExpand">
+                  <ArrowUp />
                 </template>
-                <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" min-width="55" align="center" />
-                <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" fixed label="序号" min-width="60">
-                    <template #default="scope">
-                        {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
-                    </template>
-                </el-table-column>
-                <el-table-column v-if="tableColumns.find(col => col.prop === 'name')?.show" label="名称" prop="name" min-width="140" />
-                <el-table-column v-if="tableColumns.find(col => col.prop === 'status')?.show" label="状态" prop="status" min-width="80">
-                    <template #default="scope">
-                        <el-tag :type="scope.row.status === true ? 'success' : 'danger'">
-                            {{ scope.row.status === true ? "启用" : "停用" }}
-                        </el-tag>
-                    </template>
-                </el-table-column>
-                <el-table-column v-if="tableColumns.find(col => col.prop === 'description')?.show" label="描述" prop="description" min-width="140" />
-                <el-table-column v-if="tableColumns.find(col => col.prop === 'created_at')?.show" label="创建时间" prop="created_at" min-width="180" sortable />
-                <el-table-column v-if="tableColumns.find(col => col.prop === 'updated_at')?.show" label="更新时间" prop="updated_at" min-width="180" sortable />
-                <el-table-column v-if="tableColumns.find(col => col.prop === 'creator')?.show" key="creator" label="创建人" min-width="100">
-                    <template #default="scope">
-                        {{ scope.row.creator?.name }}
-                    </template>
-                </el-table-column>
-
-                <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" fixed="right" label="操作" align="center" min-width="200">
-                    <template #default="scope">
-                        <el-button v-hasPerm="['workflow:operator:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-                        <el-button v-hasPerm="['workflow:operator:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-                        <el-button v-hasPerm="['workflow:operator:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
-                    </template>
-                </el-table-column>
-            </el-table>
-
-            <!-- 分页区域 -->
-            <template #footer>
-                <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
-            </template>
-        </el-card>
-
-        <!-- 弹窗区域 -->
-        <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
-            <!-- 详情 -->
-            <template v-if="dialogVisible.type === 'detail'">
-                <el-descriptions :column="4" border>
-                    <el-descriptions-item label="名称" :span="2">
-                        {{ detailFormData.name }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="状态" :span="2">
-                        <el-tag :type="detailFormData.status ? 'success' : 'danger'">
-                            {{ detailFormData.status ? '启用' : '停用' }}
-                        </el-tag>
-                    </el-descriptions-item>
-                    <el-descriptions-item label="描述" :span="2">
-                        {{ detailFormData.description }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="创建人" :span="2">
-                        {{ detailFormData.creator?.name }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="创建时间" :span="2">
-                        {{ detailFormData.created_at }}
-                    </el-descriptions-item>
-                    <el-descriptions-item label="更新时间" :span="2">
-                        {{ detailFormData.updated_at }}
-                    </el-descriptions-item>
-                </el-descriptions>
-            </template>
-            <!-- 新增、编辑表单 -->
-            <template v-else>
-                <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
-                    <el-form-item label="名称" prop="name">
-                        <el-input v-model="formData.name" placeholder="请输入名称" :maxlength="50" />
-                    </el-form-item>
-                    <el-form-item label="状态" prop="status">
-                        <el-radio-group v-model="formData.status">
-                            <el-radio :value="true">
-                                启用
-                            </el-radio>
-                            <el-radio :value="false">
-                                停用
-                            </el-radio>
-                        </el-radio-group>
-                    </el-form-item>
-                    <el-form-item label="描述" prop="description">
-                        <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
-                    </el-form-item>
-                </el-form>
-            </template>
-
-            <template #footer>
-                <div class="dialog-footer">
-                    <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
-                    <el-button @click="handleCloseDialog">取消</el-button>
-                    <el-button v-if="dialogVisible.type !== 'detail'" type="primary" @click="handleSubmit">确定</el-button>
-                    <el-button v-else type="primary" @click="handleCloseDialog">确定</el-button>
-                </div>
-            </template>
-        </el-dialog>
-
+                <template v-else>
+                  <ArrowDown />
+                </template>
+              </el-icon>
+            </el-link>
+          </template>
+        </el-form-item>
+      </el-form>
     </div>
+
+    <!-- 内容区域 -->
+    <el-card class="data-table">
+      <template #header>
+        <div class="card-header">
+          <span>
+            <el-tooltip content="流程管理列表">
+              <QuestionFilled class="w-4 h-4 mx-1" />
+            </el-tooltip>
+            流程管理列表
+          </span>
+        </div>
+      </template>
+
+      <!-- 功能区域 -->
+      <div class="data-table__toolbar">
+        <div class="data-table__toolbar--left">
+          <el-button
+            v-hasPerm="['workflow:operator:create']"
+            type="success"
+            icon="plus"
+            @click="handleOpenDialog('create')"
+          >
+            新增
+          </el-button>
+          <el-button
+            v-hasPerm="['workflow:operator:delete']"
+            type="danger"
+            icon="delete"
+            :disabled="selectIds.length === 0"
+            @click="handleDelete(selectIds)"
+          >
+            批量删除
+          </el-button>
+          <el-dropdown v-hasPerm="['application:myapp:update']" trigger="click">
+            <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">
+              更多
+            </el-button>
+            <template #dropdown>
+              <el-dropdown-menu>
+                <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                  批量启用
+                </el-dropdown-item>
+                <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                  批量停用
+                </el-dropdown-item>
+              </el-dropdown-menu>
+            </template>
+          </el-dropdown>
+        </div>
+        <div class="data-table__toolbar--right">
+          <el-tooltip content="刷新">
+            <el-button
+              v-hasPerm="['workflow:operator:refresh']"
+              type="warning"
+              icon="refresh"
+              circle
+              @click="handleRefresh"
+            />
+          </el-tooltip>
+          <el-popover placement="bottom" trigger="click">
+            <template #reference>
+              <el-button type="danger" icon="operation" circle></el-button>
+            </template>
+            <el-scrollbar max-height="350px">
+              <template v-for="column in tableColumns" :key="column.prop">
+                <el-checkbox v-if="column.prop" v-model="column.show" :label="column.label" />
+              </template>
+            </el-scrollbar>
+          </el-popover>
+        </div>
+      </div>
+
+      <!-- 表格区域：工作流列表 -->
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        :height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
+        <template #empty>
+          <el-empty :image-size="80" description="暂无数据" />
+        </template>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          min-width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          fixed
+          label="序号"
+          min-width="60"
+        >
+          <template #default="scope">
+            {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'name')?.show"
+          label="名称"
+          prop="name"
+          min-width="140"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'status')?.show"
+          label="状态"
+          prop="status"
+          min-width="80"
+        >
+          <template #default="scope">
+            <el-tag :type="scope.row.status === true ? 'success' : 'danger'">
+              {{ scope.row.status === true ? "启用" : "停用" }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'description')?.show"
+          label="描述"
+          prop="description"
+          min-width="140"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          label="创建时间"
+          prop="created_at"
+          min-width="180"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          label="更新时间"
+          prop="updated_at"
+          min-width="180"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'creator')?.show"
+          key="creator"
+          label="创建人"
+          min-width="100"
+        >
+          <template #default="scope">
+            {{ scope.row.creator?.name }}
+          </template>
+        </el-table-column>
+
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="200"
+        >
+          <template #default="scope">
+            <el-button
+              v-hasPerm="['workflow:operator:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['workflow:operator:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['workflow:operator:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 分页区域 -->
+      <template #footer>
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
+      </template>
+    </el-card>
+
+    <!-- 弹窗区域 -->
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
+      <!-- 详情 -->
+      <template v-if="dialogVisible.type === 'detail'">
+        <el-descriptions :column="4" border>
+          <el-descriptions-item label="名称" :span="2">
+            {{ detailFormData.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="状态" :span="2">
+            <el-tag :type="detailFormData.status ? 'success' : 'danger'">
+              {{ detailFormData.status ? "启用" : "停用" }}
+            </el-tag>
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="2">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="2">
+            {{ detailFormData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
+        </el-descriptions>
+      </template>
+      <!-- 新增、编辑表单 -->
+      <template v-else>
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
+          <el-form-item label="名称" prop="name">
+            <el-input v-model="formData.name" placeholder="请输入名称" :maxlength="50" />
+          </el-form-item>
+          <el-form-item label="状态" prop="status">
+            <el-radio-group v-model="formData.status">
+              <el-radio :value="true">启用</el-radio>
+              <el-radio :value="false">停用</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="描述" prop="description">
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
+          </el-form-item>
+        </el-form>
+      </template>
+
+      <template #footer>
+        <div class="dialog-footer">
+          <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
+          <el-button @click="handleCloseDialog">取消</el-button>
+          <el-button v-if="dialogVisible.type !== 'detail'" type="primary" @click="handleSubmit">
+            确定
+          </el-button>
+          <el-button v-else type="primary" @click="handleCloseDialog">确定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <script setup lang="ts">
 defineOptions({
-    name: "Workflow",
-    inheritAttrs: false,
+  name: "Workflow",
+  inheritAttrs: false,
 });
 
 import { ref, reactive, onMounted } from "vue";
-import ExampleAPI, { ExampleTable, ExampleForm, ExamplePageQuery } from "@/api/module_generator/demo";
+import ExampleAPI, {
+  ExampleTable,
+  ExampleForm,
+  ExamplePageQuery,
+} from "@/api/module_generator/demo";
 import DatePicker from "@/components/DatePicker/index.vue";
 import { formatToDateTime } from "@/utils/dateUtil";
 
@@ -220,16 +360,16 @@ const pageTableData = ref<ExampleTable[]>([]);
 
 // 表格列配置
 const tableColumns = ref([
-    { prop: 'selection', label: '选择框', show: true },
-    { prop: 'index', label: '序号', show: true },
-    { prop: 'name', label: '名称', show: true },
-    { prop: 'status', label: '状态', show: true },
-    { prop: 'description', label: '描述', show: true },
-    { prop: 'created_at', label: '创建时间', show: true },
-    { prop: 'updated_at', label: '更新时间', show: true },
-    { prop: 'creator', label: '创建人', show: true },
-    { prop: 'operation', label: '操作', show: true }
-])
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "name", label: "名称", show: true },
+  { prop: "status", label: "状态", show: true },
+  { prop: "description", label: "描述", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "creator", label: "创建人", show: true },
+  { prop: "operation", label: "操作", show: true },
+]);
 
 // 详情表单
 const detailFormData = ref<ExampleTable>({});
@@ -239,216 +379,218 @@ const dateRange = ref<[Date, Date] | []>([]);
 
 // 处理日期范围变化
 function handleDateRangeChange(range: [Date, Date]) {
-    dateRange.value = range;
-    if (range && range.length === 2) {
-        queryFormData.start_time = formatToDateTime(range[0]);
-        queryFormData.end_time = formatToDateTime(range[1]);
-    } else {
-        queryFormData.start_time = undefined;
-        queryFormData.end_time = undefined;
-    }
+  dateRange.value = range;
+  if (range && range.length === 2) {
+    queryFormData.start_time = formatToDateTime(range[0]);
+    queryFormData.end_time = formatToDateTime(range[1]);
+  } else {
+    queryFormData.start_time = undefined;
+    queryFormData.end_time = undefined;
+  }
 }
 
 // 分页查询参数
 const queryFormData = reactive<ExamplePageQuery>({
-    page_no: 1,
-    page_size: 10,
-    name: undefined,
-    status: undefined,
-    start_time: undefined,
-    end_time: undefined,
+  page_no: 1,
+  page_size: 10,
+  name: undefined,
+  status: undefined,
+  start_time: undefined,
+  end_time: undefined,
 });
 
 // 编辑表单
 const formData = reactive<ExampleForm>({
-    id: undefined,
-    name: '',
-    status: true,
-    description: undefined,
-})
+  id: undefined,
+  name: "",
+  status: true,
+  description: undefined,
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
-    title: "",
-    visible: false,
-    type: 'create' as 'create' | 'update' | 'detail',
+  title: "",
+  visible: false,
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
 const rules = reactive({
-    name: [{ required: true, message: "请输入名称", trigger: "blur" }],
-    status: [{ required: true, message: "请选择状态", trigger: "blur" }],
+  name: [{ required: true, message: "请输入名称", trigger: "blur" }],
+  status: [{ required: true, message: "请选择状态", trigger: "blur" }],
 });
 
 // 列表刷新
 async function handleRefresh() {
-    await loadingData();
-};
+  await loadingData();
+}
 
 // 加载表格数据
 async function loadingData() {
-    loading.value = true;
-    try {
-        const response = await ExampleAPI.getExampleList(queryFormData);
-        pageTableData.value = response.data.data.items;
-        total.value = response.data.data.total;
-    }
-    catch (error: any) {
-        console.error(error);
-    }
-    finally {
-        loading.value = false;
-    }
+  loading.value = true;
+  try {
+    const response = await ExampleAPI.getExampleList(queryFormData);
+    pageTableData.value = response.data.data.items;
+    total.value = response.data.data.total;
+  } catch (error: any) {
+    console.error(error);
+  } finally {
+    loading.value = false;
+  }
 }
 
 // 查询（重置页码后获取数据）
 async function handleQuery() {
-    queryFormData.page_no = 1;
-    loadingData();
+  queryFormData.page_no = 1;
+  loadingData();
 }
 
 // 重置查询
 async function handleResetQuery() {
-    queryFormRef.value.resetFields();
-    queryFormData.page_no = 1;
-    // 重置日期范围选择器
-    dateRange.value = [];
-    queryFormData.start_time = undefined;
-    queryFormData.end_time = undefined;
-    loadingData();
+  queryFormRef.value.resetFields();
+  queryFormData.page_no = 1;
+  // 重置日期范围选择器
+  dateRange.value = [];
+  queryFormData.start_time = undefined;
+  queryFormData.end_time = undefined;
+  loadingData();
 }
 
 // 定义初始表单数据常量
 const initialFormData: ExampleForm = {
-    id: undefined,
-    name: '',
-    status: true,
-    description: '',
-}
+  id: undefined,
+  name: "",
+  status: true,
+  description: "",
+};
 
 // 重置表单
 async function resetForm() {
-    if (dataFormRef.value) {
-        dataFormRef.value.resetFields();
-        dataFormRef.value.clearValidate();
-    }
-    // 完全重置 formData 为初始状态
-    Object.assign(formData, initialFormData);
+  if (dataFormRef.value) {
+    dataFormRef.value.resetFields();
+    dataFormRef.value.clearValidate();
+  }
+  // 完全重置 formData 为初始状态
+  Object.assign(formData, initialFormData);
 }
 
 // 行复选框选中项变化
 async function handleSelectionChange(selection: any) {
-    selectIds.value = selection.map((item: any) => item.id);
+  selectIds.value = selection.map((item: any) => item.id);
 }
 
 // 关闭弹窗
 async function handleCloseDialog() {
-    dialogVisible.visible = false;
-    resetForm();
+  dialogVisible.visible = false;
+  resetForm();
 }
 
 // 打开弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
-    dialogVisible.type = type;
-    if (id) {
-        const response = await ExampleAPI.getExampleDetail(id);
-        if (type === 'detail') {
-            dialogVisible.title = "详情";
-            Object.assign(detailFormData.value, response.data.data);
-        } else if (type === 'update') {
-            dialogVisible.title = "修改";
-            Object.assign(formData, response.data.data);
-        }
-    } else {
-        dialogVisible.title = "新增工作流";
-        formData.id = undefined;
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
+  dialogVisible.type = type;
+  if (id) {
+    const response = await ExampleAPI.getExampleDetail(id);
+    if (type === "detail") {
+      dialogVisible.title = "详情";
+      Object.assign(detailFormData.value, response.data.data);
+    } else if (type === "update") {
+      dialogVisible.title = "修改";
+      Object.assign(formData, response.data.data);
     }
-    dialogVisible.visible = true;
+  } else {
+    dialogVisible.title = "新增工作流";
+    formData.id = undefined;
+  }
+  dialogVisible.visible = true;
 }
 
 // 提交表单（防抖）
 async function handleSubmit() {
-    // 表单校验
-    dataFormRef.value.validate(async (valid: any) => {
-        if (valid) {
-            loading.value = true;
-            // 根据弹窗传入的参数(deatil\create\update)判断走什么逻辑
-            const id = formData.id;
-            if (id) {
-                try {
-                    await ExampleAPI.updateExample(id, { id, ...formData })
-                    dialogVisible.visible = false;
-                    resetForm();
-                    handleCloseDialog();
-                    handleResetQuery();
-                } catch (error: any) {
-                    console.error(error);
-                } finally {
-                    loading.value = false;
-                }
-            } else {
-                try {
-                    await ExampleAPI.createExample(formData)
-                    dialogVisible.visible = false;
-                    resetForm();
-                    handleCloseDialog();
-                    handleResetQuery();
-                } catch (error: any) {
-                    console.error(error);
-                } finally {
-                    loading.value = false;
-                }
-            }
+  // 表单校验
+  dataFormRef.value.validate(async (valid: any) => {
+    if (valid) {
+      loading.value = true;
+      // 根据弹窗传入的参数(deatil\create\update)判断走什么逻辑
+      const id = formData.id;
+      if (id) {
+        try {
+          await ExampleAPI.updateExample(id, { id, ...formData });
+          dialogVisible.visible = false;
+          resetForm();
+          handleCloseDialog();
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
         }
-    });
+      } else {
+        try {
+          await ExampleAPI.createExample(formData);
+          dialogVisible.visible = false;
+          resetForm();
+          handleCloseDialog();
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      }
+    }
+  });
 }
 
 // 删除、批量删除
 async function handleDelete(ids: number[]) {
-    ElMessageBox.confirm("确认删除该项数据?", "警告", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-    }).then(async () => {
-        try {
-            loading.value = true;
-            await ExampleAPI.deleteExample(ids);
-            handleResetQuery();
-        } catch (error: any) {
-            console.error(error);
-        } finally {
-            loading.value = false;
-        }
-    }).catch(() => {
-        ElMessageBox.close();
+  ElMessageBox.confirm("确认删除该项数据?", "警告", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await ExampleAPI.deleteExample(ids);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
     });
 }
 
 // 批量启用/停用
 async function handleMoreClick(status: boolean) {
-    if (selectIds.value.length) {
-        ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
-            confirmButtonText: "确定",
-            cancelButtonText: "取消",
-            type: "warning",
-        }).then(async () => {
-            try {
-                loading.value = true;
-                await ExampleAPI.batchAvailableExample({ ids: selectIds.value, status });
-                handleResetQuery();
-            } catch (error: any) {
-                console.error(error);
-            } finally {
-                loading.value = false;
-            }
-        }).catch(() => {
-            ElMessageBox.close();
-        });
-    }
+  if (selectIds.value.length) {
+    ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await ExampleAPI.batchAvailableExample({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
+  }
 }
 
 onMounted(() => {
-    loadingData();
+  loadingData();
 });
 </script>
 
diff --git a/frontend/src/views/module_common/docs/index.vue b/frontend/src/views/module_common/docs/index.vue
index d365f68c..9995ce2b 100644
--- a/frontend/src/views/module_common/docs/index.vue
+++ b/frontend/src/views/module_common/docs/index.vue
@@ -11,13 +11,11 @@ defineOptions({
   inheritAttrs: false,
 });
 
-const url = ref(import.meta.env.VITE_APP_BASE_API + "/docs")
+const url = ref(import.meta.env.VITE_APP_BASE_API + "/docs");
 
 onBeforeUnmount(() => {
-    window.onresize = null;
-})
+  window.onresize = null;
+});
 </script>
 
-
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/frontend/src/views/module_common/redoc/index.vue b/frontend/src/views/module_common/redoc/index.vue
index 70c72f74..659242cd 100644
--- a/frontend/src/views/module_common/redoc/index.vue
+++ b/frontend/src/views/module_common/redoc/index.vue
@@ -11,12 +11,11 @@ defineOptions({
   inheritAttrs: false,
 });
 
-const url = ref(import.meta.env.VITE_APP_BASE_API + "/redoc")
+const url = ref(import.meta.env.VITE_APP_BASE_API + "/redoc");
 
 onBeforeUnmount(() => {
-    window.onresize = null;
-})
+  window.onresize = null;
+});
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/frontend/src/views/module_generator/backcode/index.vue b/frontend/src/views/module_generator/backcode/index.vue
index b6e21b19..ee11c7fe 100644
--- a/frontend/src/views/module_generator/backcode/index.vue
+++ b/frontend/src/views/module_generator/backcode/index.vue
@@ -2,16 +2,47 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryRef" :model="queryFormData" :inline="true" label-suffix=":" @submit.prevent="handleQuery">
+      <el-form
+        ref="queryRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item label="表名称" prop="table_name">
-          <el-input v-model="queryFormData.table_name" placeholder="请输入表名称" clearable style="width: 200px" @keyup.enter="handleQuery"/>
+          <el-input
+            v-model="queryFormData.table_name"
+            placeholder="请输入表名称"
+            clearable
+            style="width: 200px"
+            @keyup.enter="handleQuery"
+          />
         </el-form-item>
         <el-form-item label="表描述" prop="table_comment">
-          <el-input v-model="queryFormData.table_comment" placeholder="请输入表描述" clearable style="width: 200px" @keyup.enter="handleQuery"/>
+          <el-input
+            v-model="queryFormData.table_comment"
+            placeholder="请输入表描述"
+            clearable
+            style="width: 200px"
+            @keyup.enter="handleQuery"
+          />
         </el-form-item>
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_generator:gencode:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_generator:gencode:query']" icon="refresh" @click="handleRefresh">重置</el-button>
+          <el-button
+            v-hasPerm="['module_generator:gencode:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_generator:gencode:query']"
+            icon="refresh"
+            @click="handleRefresh"
+          >
+            重置
+          </el-button>
         </el-form-item>
       </el-form>
     </div>
@@ -34,16 +65,50 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_generator:gencode:create']" type="primary" plain icon="Plus" @click="createTableVisible = true;">创建</el-button>
+              <el-button
+                v-hasPerm="['module_generator:gencode:create']"
+                type="primary"
+                plain
+                icon="Plus"
+                @click="createTableVisible = true"
+              >
+                创建
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_generator:gencode:import']" type="success" plain icon="Upload" @click="handleImportClick">导入</el-button>
+              <el-button
+                v-hasPerm="['module_generator:gencode:import']"
+                type="success"
+                plain
+                icon="Upload"
+                @click="handleImportClick"
+              >
+                导入
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_generator:gencode:delete']" type="danger" plain icon="Delete" :disabled="ids.length === 0" @click="handleDelete()">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_generator:gencode:delete']"
+                type="danger"
+                plain
+                icon="Delete"
+                :disabled="ids.length === 0"
+                @click="handleDelete()"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_generator:gencode:code']" type="warning" plain icon="Download" :disabled="!canGenerate" @click="handleGenTable('0')">批量生成</el-button>
+              <el-button
+                v-hasPerm="['module_generator:gencode:code']"
+                type="warning"
+                plain
+                icon="Download"
+                :disabled="!canGenerate"
+                @click="handleGenTable('0')"
+              >
+                批量生成
+              </el-button>
             </el-col>
           </el-row>
         </div>
@@ -51,7 +116,13 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_generator:gencode:refresh']" type="primary" icon="refresh" circle @click="handleRefresh"/>
+                <el-button
+                  v-hasPerm="['module_generator:gencode:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -84,42 +155,113 @@
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" align="center" width="55"></el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" label="序号" type="index" min-width="30" align="center" fixed>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          align="center"
+          width="55"
+        ></el-table-column>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          label="序号"
+          type="index"
+          min-width="30"
+          align="center"
+          fixed
+        >
           <template #default="scope">
-            <span>{{(queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1}}</span>
+            <span>
+              {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
+            </span>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'table_name')?.show" label="表名称" prop="table_name" :show-overflow-tooltip="true"/>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'table_comment')?.show" label="表描述" prop="table_comment" :show-overflow-tooltip="true"/>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'class_name')?.show" label="实体" prop="class_name" :show-overflow-tooltip="true"/>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'created_at')?.show" label="创建时间" prop="created_at" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'updated_at')?.show" label="更新时间" prop="updated_at" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" label="操作" align="center" min-width="120" class-name="small-padding fixed-width">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'table_name')?.show"
+          label="表名称"
+          prop="table_name"
+          :show-overflow-tooltip="true"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'table_comment')?.show"
+          label="表描述"
+          prop="table_comment"
+          :show-overflow-tooltip="true"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'class_name')?.show"
+          label="实体"
+          prop="class_name"
+          :show-overflow-tooltip="true"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          label="创建时间"
+          prop="created_at"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          label="更新时间"
+          prop="updated_at"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          label="操作"
+          align="center"
+          min-width="120"
+          class-name="small-padding fixed-width"
+        >
           <template #default="scope">
-            <el-button v-hasPerm="['module_generator:gencode:update']" link type="primary" :icon="MagicStick" @click="handlePreviewTable(scope.row)">代码生成</el-button>
-            <el-button v-hasPerm="['module_generator:gencode:delete']" link type="danger" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
-            <el-button v-hasPerm="['module_generator:gencode:sync']" link type="success" icon="Refresh" @click="handleSynchDb(scope.row)">同步</el-button>
+            <el-button
+              v-hasPerm="['module_generator:gencode:update']"
+              link
+              type="primary"
+              :icon="MagicStick"
+              @click="handlePreviewTable(scope.row)"
+            >
+              代码生成
+            </el-button>
+            <el-button
+              v-hasPerm="['module_generator:gencode:delete']"
+              link
+              type="danger"
+              icon="Delete"
+              @click="handleDelete(scope.row)"
+            >
+              删除
+            </el-button>
+            <el-button
+              v-hasPerm="['module_generator:gencode:sync']"
+              link
+              type="success"
+              icon="Refresh"
+              @click="handleSynchDb(scope.row)"
+            >
+              同步
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
-      
+
       <!-- 分页区域 -->
       <template #footer>
-        <pagination 
-          v-model:total="total" 
+        <pagination
+          v-model:total="total"
           v-model:page="queryFormData.page_no"
-          v-model:limit="queryFormData.page_size" 
-          @pagination="loadingData" 
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
         />
       </template>
     </el-card>
-    
+
     <!-- 创建表 -->
-    <el-dialog v-model="createTableVisible" title="创建表" append-to-body >
+    <el-dialog v-model="createTableVisible" title="创建表" append-to-body>
       <span>创建表语句(支持多个建表sql语句)：</span>
-      <el-button type="warning" size="small" class="ml-1 mb-1" @click="loadExampleMysql">加载MySQL示例</el-button>
-      <el-button type="primary" size="small" class="ml-1 mb-1" @click="loadExamplePostgres">加载Postgres示例</el-button>
+      <el-button type="warning" size="small" class="ml-1 mb-1" @click="loadExampleMysql">
+        加载MySQL示例
+      </el-button>
+      <el-button type="primary" size="small" class="ml-1 mb-1" @click="loadExamplePostgres">
+        加载Postgres示例
+      </el-button>
       <el-scrollbar max-height="72vh">
         <div class="absolute z-36 right-5 top-2">
           <el-link type="primary" @click="handleCopyCode">
@@ -141,14 +283,16 @@
       </el-scrollbar>
       <template #footer>
         <div class="dialog-footer">
-          <el-button type="primary" :loading="loading" @click="handleCreateTable(createContent)">确 定</el-button>
+          <el-button type="primary" :loading="loading" @click="handleCreateTable(createContent)">
+            确 定
+          </el-button>
           <el-button @click="handleCreateTableCancel()">取 消</el-button>
         </div>
       </template>
     </el-dialog>
 
     <!-- 导入表 -->
-    <el-dialog v-model="importVisible" title="导入表"  width="800px" top="5vh" append-to-body>
+    <el-dialog v-model="importVisible" title="导入表" width="800px" top="5vh" append-to-body>
       <el-form ref="queryRef" :model="importQueryFormData" :inline="true">
         <el-form-item label="表名称" prop="table_name">
           <el-input
@@ -174,19 +318,44 @@
         </el-form-item>
       </el-form>
       <el-row>
-        <el-table  ref="table" :data="dbTableList" height="300px" border @row-click="clickRow" @selection-change="handleImportTableSelectionChange">
+        <el-table
+          ref="table"
+          :data="dbTableList"
+          height="300px"
+          border
+          @row-click="clickRow"
+          @selection-change="handleImportTableSelectionChange"
+        >
           <template #empty>
             <el-empty :image-size="80" description="暂无数据" />
           </template>
           <el-table-column type="selection" width="55"></el-table-column>
           <el-table-column label="序号" type="index" min-width="30" align="center" fixed>
             <template #default="scope">
-              <span>{{(importQueryFormData.page_no - 1) * importQueryFormData.page_size + scope.$index + 1}}</span>
+              <span>
+                {{
+                  (importQueryFormData.page_no - 1) * importQueryFormData.page_size +
+                  scope.$index +
+                  1
+                }}
+              </span>
             </template>
           </el-table-column>
-          <el-table-column prop="database_name" label="数据库名称" :show-overflow-tooltip="true"></el-table-column>
-          <el-table-column prop="table_name" label="表名称" :show-overflow-tooltip="true"></el-table-column>
-          <el-table-column prop="table_comment" label="表描述" :show-overflow-tooltip="true"></el-table-column>
+          <el-table-column
+            prop="database_name"
+            label="数据库名称"
+            :show-overflow-tooltip="true"
+          ></el-table-column>
+          <el-table-column
+            prop="table_name"
+            label="表名称"
+            :show-overflow-tooltip="true"
+          ></el-table-column>
+          <el-table-column
+            prop="table_comment"
+            label="表描述"
+            :show-overflow-tooltip="true"
+          ></el-table-column>
           <el-table-column prop="table_type" label="表类型"></el-table-column>
         </el-table>
         <pagination
@@ -198,14 +367,21 @@
       </el-row>
       <template #footer>
         <div class="dialog-footer">
-          <el-button type="primary" :loading="importLoading" @click="handleImportTable">确 定</el-button>
+          <el-button type="primary" :loading="importLoading" @click="handleImportTable">
+            确 定
+          </el-button>
           <el-button @click="importVisible = false">取 消</el-button>
         </div>
       </template>
     </el-dialog>
 
     <!-- 代码生成抽屉 -->
-    <el-drawer v-model="editVisible" :title="'【代码生成】' + info.table_name" size="85%" @close="handleClose">
+    <el-drawer
+      v-model="editVisible"
+      :title="'【代码生成】' + info.table_name"
+      size="85%"
+      @close="handleClose"
+    >
       <el-steps :active="activeStep" finish-status="success" simple>
         <el-step title="基础配置" />
         <el-step title="字段配置" />
@@ -214,7 +390,13 @@
 
       <div class="mt-5">
         <!-- 第一步：基础配置 -->
-        <el-form v-show="activeStep == 0" ref="basicInfo" :model="info" :rules="rules" label-width="150px">
+        <el-form
+          v-show="activeStep == 0"
+          ref="basicInfo"
+          :model="info"
+          :rules="rules"
+          label-width="150px"
+        >
           <el-row>
             <el-col :span="12">
               <el-form-item label="表名称" prop="table_name">
@@ -223,12 +405,12 @@
             </el-col>
             <el-col :span="12">
               <el-form-item label="表描述" prop="table_comment">
-                <el-input v-model="info.table_comment" placeholder="请输入表描述"/>
+                <el-input v-model="info.table_comment" placeholder="请输入表描述" />
               </el-form-item>
             </el-col>
             <el-col :span="12">
               <el-form-item label="实体类名称" prop="class_name">
-                <el-input v-model="info.class_name" placeholder="请输入"/>
+                <el-input v-model="info.class_name" placeholder="请输入" />
               </el-form-item>
             </el-col>
             <el-col :span="12">
@@ -236,7 +418,7 @@
                 <template #label>
                   包名
                   <el-tooltip content="生成在哪个python模块下，例如 module_gencode" placement="top">
-                    <el-icon><QuestionFilled/></el-icon>
+                    <el-icon><QuestionFilled /></el-icon>
                   </el-tooltip>
                 </template>
                 <el-input v-model="info.package_name" />
@@ -247,7 +429,7 @@
                 <template #label>
                   模块名
                   <el-tooltip content="可理解为子系统名，例如 system" placement="top">
-                    <el-icon><QuestionFilled/></el-icon>
+                    <el-icon><QuestionFilled /></el-icon>
                   </el-tooltip>
                 </template>
                 <el-input v-model="info.module_name" />
@@ -258,7 +440,7 @@
                 <template #label>
                   业务名
                   <el-tooltip content="可理解为功能英文名，例如 user" placement="top">
-                    <el-icon><QuestionFilled/></el-icon>
+                    <el-icon><QuestionFilled /></el-icon>
                   </el-tooltip>
                 </template>
                 <el-input v-model="info.business_name" />
@@ -269,7 +451,7 @@
                 <template #label>
                   功能名
                   <el-tooltip content="用作类描述，例如 用户" placement="top">
-                    <el-icon><QuestionFilled/></el-icon>
+                    <el-icon><QuestionFilled /></el-icon>
                   </el-tooltip>
                 </template>
                 <el-input v-model="info.function_name" />
@@ -280,7 +462,7 @@
                 <template #label>
                   上级菜单
                   <el-tooltip content="分配到指定菜单下，例如 系统管理" placement="top">
-                    <el-icon><QuestionFilled/></el-icon>
+                    <el-icon><QuestionFilled /></el-icon>
                   </el-tooltip>
                 </template>
                 <el-tree-select
@@ -291,7 +473,7 @@
                   filterable
                   :render-after-expand="false"
                 />
-              </el-form-item> 
+              </el-form-item>
             </el-col>
             <el-col :span="24">
               <el-form-item label="备注" prop="description">
@@ -302,19 +484,34 @@
             <el-divider>生成文件路径</el-divider>
 
             <el-col :span="24">
-              <el-descriptions
-                :column="2"
-                border
-              >
-              <el-descriptions-item :label="info.function_name + '功能，后端控制层'">backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/controller.py</el-descriptions-item>
-              <el-descriptions-item :label="info.function_name + '功能，后端业务层'">backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/service.py</el-descriptions-item>
-              <el-descriptions-item :label="info.function_name + '功能，后端数据层'">backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/crud.py</el-descriptions-item>
-              <el-descriptions-item :label="info.function_name + '功能，后端实体层'">backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/model.py</el-descriptions-item>
-              <el-descriptions-item :label="info.function_name + '功能，后端访问层'">backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/param.py</el-descriptions-item>
-              <el-descriptions-item :label="info.function_name + '功能，后端序列化层'">backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/schema.py</el-descriptions-item>
-              <el-descriptions-item :label="info.function_name + '功能，数据库业务菜单'">backend/sql/menu/{{ info.module_name }}.{{ info.business_name }}.sql</el-descriptions-item>
-              <el-descriptions-item :label="info.function_name + '功能，前端接口层'">frontend/src/api/{{ info.module_name }}/{{ info.business_name }}.ts</el-descriptions-item>
-              <el-descriptions-item :label="info.function_name + '功能，前端视图层'">frontend/src/views/{{ info.module_name }}/{{ info.business_name }}/index.vue</el-descriptions-item>
+              <el-descriptions :column="2" border>
+                <el-descriptions-item :label="info.function_name + '功能，后端控制层'">
+                  backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/controller.py
+                </el-descriptions-item>
+                <el-descriptions-item :label="info.function_name + '功能，后端业务层'">
+                  backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/service.py
+                </el-descriptions-item>
+                <el-descriptions-item :label="info.function_name + '功能，后端数据层'">
+                  backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/crud.py
+                </el-descriptions-item>
+                <el-descriptions-item :label="info.function_name + '功能，后端实体层'">
+                  backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/model.py
+                </el-descriptions-item>
+                <el-descriptions-item :label="info.function_name + '功能，后端访问层'">
+                  backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/param.py
+                </el-descriptions-item>
+                <el-descriptions-item :label="info.function_name + '功能，后端序列化层'">
+                  backend/app/api/v1/{{ info.module_name }}/{{ info.business_name }}/schema.py
+                </el-descriptions-item>
+                <el-descriptions-item :label="info.function_name + '功能，数据库业务菜单'">
+                  backend/sql/menu/{{ info.module_name }}.{{ info.business_name }}.sql
+                </el-descriptions-item>
+                <el-descriptions-item :label="info.function_name + '功能，前端接口层'">
+                  frontend/src/api/{{ info.module_name }}/{{ info.business_name }}.ts
+                </el-descriptions-item>
+                <el-descriptions-item :label="info.function_name + '功能，前端视图层'">
+                  frontend/src/views/{{ info.module_name }}/{{ info.business_name }}/index.vue
+                </el-descriptions-item>
               </el-descriptions>
             </el-col>
           </el-row>
@@ -363,29 +560,44 @@
               </el-dropdown>
             </el-space>
           </div>
-          <el-table 
-            ref="dragTable" 
+          <el-table
+            ref="dragTable"
             v-loading="loading"
-            :data="info.columns" 
-            row-key="id" 
-            max-height="680" 
+            :data="info.columns"
+            row-key="id"
+            max-height="680"
             highlight--currentrow
-            class="data-table__content" 
-            border 
+            class="data-table__content"
+            border
             stripe
           >
             <template #empty>
               <el-empty :image-size="80" description="暂无数据" />
             </template>
             <el-table-column label="序号" type="index" min-width="7%" fixed />
-            <el-table-column label="列名" prop="column_name" min-width="10%" :show-overflow-tooltip="true"/>
-            <el-table-column label="类型" prop="column_type" min-width="10%" :show-overflow-tooltip="true"/>
-            <el-table-column label="长度" prop="column_length" min-width="8%" :show-overflow-tooltip="true">
+            <el-table-column
+              label="列名"
+              prop="column_name"
+              min-width="10%"
+              :show-overflow-tooltip="true"
+            />
+            <el-table-column
+              label="类型"
+              prop="column_type"
+              min-width="10%"
+              :show-overflow-tooltip="true"
+            />
+            <el-table-column
+              label="长度"
+              prop="column_length"
+              min-width="8%"
+              :show-overflow-tooltip="true"
+            >
               <template #default="scope">
-                <el-input v-model="scope.row.column_length" :disabled="scope.row.is_pk === '1'"/>
+                <el-input v-model="scope.row.column_length" :disabled="scope.row.is_pk === '1'" />
               </template>
             </el-table-column>
-            <el-table-column label="注释" min-width="10%" >
+            <el-table-column label="注释" min-width="10%">
               <template #default="scope">
                 <el-input v-model="scope.row.column_comment"></el-input>
               </template>
@@ -413,22 +625,38 @@
             </el-table-column>
             <el-table-column label="新增" min-width="10%">
               <template #default="scope">
-                <el-checkbox v-model="scope.row.is_insert" true-value="1" false-value="0"></el-checkbox>
+                <el-checkbox
+                  v-model="scope.row.is_insert"
+                  true-value="1"
+                  false-value="0"
+                ></el-checkbox>
               </template>
             </el-table-column>
             <el-table-column label="编辑" min-width="10%">
               <template #default="scope">
-                <el-checkbox v-model="scope.row.is_edit" true-value="1" false-value="0"></el-checkbox>
+                <el-checkbox
+                  v-model="scope.row.is_edit"
+                  true-value="1"
+                  false-value="0"
+                ></el-checkbox>
               </template>
             </el-table-column>
             <el-table-column label="列表" min-width="10%">
               <template #default="scope">
-                <el-checkbox v-model="scope.row.is_list" true-value="1" false-value="0"></el-checkbox>
+                <el-checkbox
+                  v-model="scope.row.is_list"
+                  true-value="1"
+                  false-value="0"
+                ></el-checkbox>
               </template>
             </el-table-column>
             <el-table-column label="查询" min-width="10%">
               <template #default="scope">
-                <el-checkbox v-model="scope.row.is_query" true-value="1" false-value="0"></el-checkbox>
+                <el-checkbox
+                  v-model="scope.row.is_query"
+                  true-value="1"
+                  false-value="0"
+                ></el-checkbox>
               </template>
             </el-table-column>
             <el-table-column label="查询方式" min-width="12%">
@@ -445,9 +673,14 @@
                 </el-select>
               </template>
             </el-table-column>
-            <el-table-column label="默认值" prop="column_default" min-width="10%" :show-overflow-tooltip="true">
+            <el-table-column
+              label="默认值"
+              prop="column_default"
+              min-width="10%"
+              :show-overflow-tooltip="true"
+            >
               <template #default="scope">
-                <el-input v-model="scope.row.column_default" :disabled="scope.row.is_pk === '1'"/>
+                <el-input v-model="scope.row.column_default" :disabled="scope.row.is_pk === '1'" />
               </template>
             </el-table-column>
             <el-table-column label="自增" min-width="10%">
@@ -457,12 +690,20 @@
             </el-table-column>
             <el-table-column label="允许空" min-width="10%">
               <template #default="scope">
-                <el-checkbox v-model="scope.row.is_nullable" true-value="0" false-value="1"></el-checkbox>
+                <el-checkbox
+                  v-model="scope.row.is_nullable"
+                  true-value="0"
+                  false-value="1"
+                ></el-checkbox>
               </template>
             </el-table-column>
             <el-table-column label="唯一" min-width="10%">
               <template #default="scope">
-                <el-checkbox v-model="scope.row.is_unique" true-value="1" false-value="0"></el-checkbox>
+                <el-checkbox
+                  v-model="scope.row.is_unique"
+                  true-value="1"
+                  false-value="0"
+                ></el-checkbox>
               </template>
             </el-table-column>
             <el-table-column label="主键" min-width="10%">
@@ -492,10 +733,13 @@
                     v-for="dict in dictOptions"
                     :key="dict.dict_type"
                     :label="dict.dict_name"
-                    :value="dict.dict_type || ''">
+                    :value="dict.dict_type || ''"
+                  >
                     <span style="float: left">{{ dict.dict_name }}</span>
-                    <span style="float: right; color: #8492a6; font-size: 13px">{{ dict.dict_type }}</span>
-                </el-option>
+                    <span style="float: right; color: #8492a6; font-size: 13px">
+                      {{ dict.dict_type }}
+                    </span>
+                  </el-option>
                 </el-select>
               </template>
             </el-table-column>
@@ -564,11 +808,41 @@
       <template #footer>
         <!-- 公共按钮：关闭 -->
         <el-button :icon="Close" @click="close">关闭</el-button>
-        <el-button v-if="activeStep != 0" type="success" :icon="Back" @click="prevStep">上一步</el-button>
-        <el-button v-if="activeStep != 2" v-hasPerm="['module_generator:gencode:update']" type="warning" :icon="Edit" :loading="loading" @click="submitForm">保存配置</el-button>
-        <el-button v-if="activeStep != 2" type="primary" @click="nextStep">下一步<el-icon class="el-icon--right"><Right /></el-icon></el-button>
-        <el-button v-if="activeStep === 2" type="warning" :icon="Download" :loading="loading" @click="handleGenTable('0', info)">下载代码</el-button>
-        <el-button v-if="activeStep === 2" type="primary" :icon="FolderOpened" :loading="loading" @click="handleGenTable('1', info)">写入本地</el-button>
+        <el-button v-if="activeStep != 0" type="success" :icon="Back" @click="prevStep">
+          上一步
+        </el-button>
+        <el-button
+          v-if="activeStep != 2"
+          v-hasPerm="['module_generator:gencode:update']"
+          type="warning"
+          :icon="Edit"
+          :loading="loading"
+          @click="submitForm"
+        >
+          保存配置
+        </el-button>
+        <el-button v-if="activeStep != 2" type="primary" @click="nextStep">
+          下一步
+          <el-icon class="el-icon--right"><Right /></el-icon>
+        </el-button>
+        <el-button
+          v-if="activeStep === 2"
+          type="warning"
+          :icon="Download"
+          :loading="loading"
+          @click="handleGenTable('0', info)"
+        >
+          下载代码
+        </el-button>
+        <el-button
+          v-if="activeStep === 2"
+          type="primary"
+          :icon="FolderOpened"
+          :loading="loading"
+          @click="handleGenTable('1', info)"
+        >
+          写入本地
+        </el-button>
       </template>
     </el-drawer>
   </div>
@@ -582,15 +856,29 @@ defineOptions({
 
 import "codemirror/mode/javascript/javascript.js";
 import "codemirror/mode/sql/sql.js";
-import { ref, reactive, computed, onActivated, onMounted } from 'vue';
-import { useClipboard } from '@vueuse/core';
-import { useRoute } from 'vue-router';
+import { ref, reactive, computed, onActivated, onMounted } from "vue";
+import { useClipboard } from "@vueuse/core";
+import { useRoute } from "vue-router";
 import Codemirror from "codemirror-editor-vue3";
 import type { EditorConfiguration } from "codemirror";
 import type { CmComponentRef } from "codemirror-editor-vue3";
-import { ElMessage, ElMessageBox, type FormInstance, type TableInstance } from 'element-plus';
-import { QuestionFilled, MagicStick, CopyDocument, Close, Right, FolderOpened, Back, Download, Edit } from '@element-plus/icons-vue';
-import GencodeAPI, { type GenTableSchema, type DBTableSchema, type GenTablePageQuery } from "@/api/module_generator/gencode";
+import { ElMessage, ElMessageBox, type FormInstance, type TableInstance } from "element-plus";
+import {
+  QuestionFilled,
+  MagicStick,
+  CopyDocument,
+  Close,
+  Right,
+  FolderOpened,
+  Back,
+  Download,
+  Edit,
+} from "@element-plus/icons-vue";
+import GencodeAPI, {
+  type GenTableSchema,
+  type DBTableSchema,
+  type GenTablePageQuery,
+} from "@/api/module_generator/gencode";
 import MenuAPI, { MenuTable } from "@/api/module_system/menu";
 import DictAPI, { DictTable } from "@/api/module_system/dict";
 import { formatTree } from "@/utils/common";
@@ -653,7 +941,7 @@ const importQueryFormData = reactive<GenTablePageQuery>({
   page_no: 1,
   page_size: 10,
   table_name: undefined,
-  table_comment: undefined
+  table_comment: undefined,
 });
 
 // 下拉选项数据
@@ -678,13 +966,13 @@ const preview = reactive({
   open: false,
   title: "代码预览",
   data: {},
-  active_name: "controller.py"
+  active_name: "controller.py",
 });
 
-const previewScope = ref<"all" | "frontend" | "backend" | "sql">('all');
-const previewTypeOptions = ['ts', 'vue', 'python', 'sql'];
+const previewScope = ref<"all" | "frontend" | "backend" | "sql">("all");
+const previewTypeOptions = ["ts", "vue", "python", "sql"];
 const previewTypes = ref<string[]>([...previewTypeOptions]);
-const code = ref<string>('');
+const code = ref<string>("");
 const treeData = ref<TreeNode[]>([]);
 
 // 分页查询参数
@@ -697,24 +985,24 @@ const queryFormData = reactive<GenTablePageQuery>({
 
 // 表格列配置
 const tableColumns = ref<TableColumn[]>([
-  { prop: 'selection', label: '选择框', show: true },
-  { prop: 'index', label: '序号', show: true },
-  { prop: 'table_name', label: '表名称', show: true },
-  { prop: 'table_comment', label: '表描述', show: true },
-  { prop: 'class_name', label: '实体', show: true },
-  { prop: 'created_at', label: '创建时间', show: true },
-  { prop: 'updated_at', label: '更新时间', show: true },
-  { prop: 'operation', label: '操作', show: true }
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "table_name", label: "表名称", show: true },
+  { prop: "table_comment", label: "表描述", show: true },
+  { prop: "class_name", label: "实体", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "operation", label: "操作", show: true },
 ]);
 
 // CodeMirror配置
 const cmOptions: EditorConfiguration = {
-  mode: 'text/javascript',
+  mode: "text/javascript",
   lineNumbers: true,
   smartIndent: true,
   indentUnit: 2,
   tabSize: 2,
-  readOnly: true
+  readOnly: true,
 };
 
 const sqlOptions: EditorConfiguration = {
@@ -728,7 +1016,6 @@ const sqlOptions: EditorConfiguration = {
   lineWrapping: true,
 };
 
-
 // 工具函数
 const { copy } = useClipboard();
 
@@ -737,27 +1024,31 @@ const { copy } = useClipboard();
 // 过滤后的文件树数据
 const filteredTreeData = computed<TreeNode[]>(() => {
   if (!treeData.value.length) return [];
-  
+
   // 基于原树按 scope/types 过滤叶子节点
   const match = (label: string, parentPath: string[]): boolean => {
     // scope 过滤：根据路径初步判断
     if (previewScope.value !== "all") {
       // 根据后端返回的格式，检查路径或文件名特征
-      const isPythonBackend = parentPath.some(part => part === 'backend' || part === 'python') || label.includes('.py');
-      const isVueFrontend = parentPath.some(part => part === 'frontend' || part === 'vue') || label.includes('.vue') || label.includes('.ts');
-      const isSqlDatabase = parentPath.some(part => part === 'sql') || label.includes('.sql');
-      
-      if (previewScope.value === 'backend' && !isPythonBackend) return false;
-      if (previewScope.value === 'frontend' && !isVueFrontend) return false;
-      if (previewScope.value === 'sql' && !isSqlDatabase) return false;
+      const isPythonBackend =
+        parentPath.some((part) => part === "backend" || part === "python") || label.includes(".py");
+      const isVueFrontend =
+        parentPath.some((part) => part === "frontend" || part === "vue") ||
+        label.includes(".vue") ||
+        label.includes(".ts");
+      const isSqlDatabase = parentPath.some((part) => part === "sql") || label.includes(".sql");
+
+      if (previewScope.value === "backend" && !isPythonBackend) return false;
+      if (previewScope.value === "frontend" && !isVueFrontend) return false;
+      if (previewScope.value === "sql" && !isSqlDatabase) return false;
     }
-    
+
     // 类型过滤：根据文件内容特征判断类型
-    if (label.endsWith('.py')) return previewTypes.value.includes('python');
-    if (label.endsWith('.sql')) return previewTypes.value.includes('sql');
-    if (label.endsWith('.vue')) return previewTypes.value.includes('vue');
-    if (label.endsWith('.ts')) return previewTypes.value.includes('ts');
-    
+    if (label.endsWith(".py")) return previewTypes.value.includes("python");
+    if (label.endsWith(".sql")) return previewTypes.value.includes("sql");
+    if (label.endsWith(".vue")) return previewTypes.value.includes("vue");
+    if (label.endsWith(".ts")) return previewTypes.value.includes("ts");
+
     return true;
   };
 
@@ -786,37 +1077,37 @@ const canGenerate = computed(() => ids.value.length > 0);
 const handleCopyCode = () => {
   if (code.value) {
     copy(code.value);
-    ElMessage.success('代码复制成功');
+    ElMessage.success("代码复制成功");
   } else {
-    ElMessage.warning('没有可复制的代码');
+    ElMessage.warning("没有可复制的代码");
   }
 };
 
 /** 获取文件树节点图标 */
 function getFileTreeNodeIcon(label: string): string {
-  if (label.endsWith('.py')) return 'python';
-  if (label.endsWith('.sql')) return 'sql';
-  if (label.endsWith('.vue')) return 'vue';
-  if (label.endsWith('.ts')) return 'typescript';
-  return 'file';
+  if (label.endsWith(".py")) return "python";
+  if (label.endsWith(".sql")) return "sql";
+  if (label.endsWith(".vue")) return "vue";
+  if (label.endsWith(".ts")) return "typescript";
+  return "file";
 }
 
 /** 文件树节点点击事件 */
 function handleFileTreeNodeClick(data: TreeNode): void {
   if (data && (!data.children || data.children.length === 0)) {
-    code.value = data.content || '';
+    code.value = data.content || "";
   }
 }
 
 /** 递归构建树形结构 */
 function buildTree(data: FileData[]): TreeNode {
   // 创建根节点
-  const root: TreeNode = { label: '前后端代码', children: [] };
+  const root: TreeNode = { label: "前后端代码", children: [] };
 
   data.forEach((item) => {
     // 将路径分成数组（确保使用正斜杠）
-    const parts = item.path.split('/').filter(part => part !== '');
-    
+    const parts = item.path.split("/").filter((part) => part !== "");
+
     let currentNode = root;
 
     // 遍历路径部分，创建对应的文件夹节点
@@ -834,7 +1125,7 @@ function buildTree(data: FileData[]): TreeNode {
     currentNode.children?.push({
       label: item.file_name,
       content: item?.content,
-    }); 
+    });
   });
 
   return root;
@@ -844,39 +1135,39 @@ function buildTree(data: FileData[]): TreeNode {
 async function handlePreview(row: GenTableSchema): Promise<void> {
   try {
     if (!row.id) {
-      ElMessage.warning('无效的表ID');
+      ElMessage.warning("无效的表ID");
       return;
     }
-    
+
     const response = await GencodeAPI.previewTable(row.id!);
     preview.data = response.data.data;
-    
+
     // 转换后端返回的数据为树形结构
     const filesData = Object.entries(response.data.data).map(([key, content]) => {
       // 解析文件路径
-      const pathParts = key.split('/');
-      let fileName = pathParts.pop() || '';
-      const path = pathParts.join('/');
-      
+      const pathParts = key.split("/");
+      let fileName = pathParts.pop() || "";
+      const path = pathParts.join("/");
+
       // 移除文件名结尾的.j2后缀
-      if (fileName.endsWith('.j2')) {
-        fileName = fileName.substring(0, fileName.lastIndexOf('.j2'));
+      if (fileName.endsWith(".j2")) {
+        fileName = fileName.substring(0, fileName.lastIndexOf(".j2"));
       }
-      
+
       // 确保content是字符串类型
-      const contentStr = typeof content === 'string' ? content : JSON.stringify(content);
-      
+      const contentStr = typeof content === "string" ? content : JSON.stringify(content);
+
       return {
         path,
         file_name: fileName,
-        content: contentStr
+        content: contentStr,
       } as FileData;
     });
-    
+
     // 构建树形数据
     const treeRoot = buildTree(filesData);
     treeData.value = [treeRoot];
-    
+
     // 查找第一个叶子节点作为默认显示内容
     const findFirstLeafNode = (nodes: TreeNode[]): TreeNode | null => {
       for (const node of nodes) {
@@ -888,14 +1179,14 @@ async function handlePreview(row: GenTableSchema): Promise<void> {
       }
       return null;
     };
-    
+
     const firstLeafNode = findFirstLeafNode(treeData.value);
     code.value = firstLeafNode?.content || "";
 
     preview.open = true;
     preview.active_name = "model.py";
   } catch (error) {
-    console.error('预览代码失败:', error);
+    console.error("预览代码失败:", error);
   }
 }
 
@@ -909,7 +1200,7 @@ async function loadingData(): Promise<void> {
       total.value = response.data.data.total;
     }
   } catch (error) {
-    console.error('获取表数据失败:', error);
+    console.error("获取表数据失败:", error);
   } finally {
     loading.value = false;
   }
@@ -918,44 +1209,44 @@ async function loadingData(): Promise<void> {
 /** 表格行内生成代码操作 */
 async function handleGenTable(targetGenType: string, row?: GenTableSchema): Promise<void> {
   let tbNames: string | string[] = [];
-  
+
   // 判断是单条还是批量操作
   if (row) {
-    tbNames = [row.table_name || ''];
+    tbNames = [row.table_name || ""];
   } else if (tableNames.value.length > 0) {
     tbNames = tableNames.value;
   } else {
-    ElMessage.error('请选择要生成的数据');
+    ElMessage.error("请选择要生成的数据");
     return;
   }
-  
+
   loading.value = true;
   try {
-    if (targetGenType === '1') {
+    if (targetGenType === "1") {
       if (!Array.isArray(tbNames) || tbNames.length !== 1 || !tbNames[0]) {
-        ElMessage.error('自定义路径只能生成单表代码');
+        ElMessage.error("自定义路径只能生成单表代码");
         loading.value = false;
         return;
       }
-      
+
       await GencodeAPI.genCodeToPath(tbNames[0]);
-      ElMessage.success('代码已生成到指定路径');
+      ElMessage.success("代码已生成到指定路径");
     } else {
       // ZIP压缩包下载
       const tableNamesArray = Array.isArray(tbNames) ? tbNames : [tbNames];
       const response = await GencodeAPI.batchGenCode(tableNamesArray);
       // 处理文件下载
-      const blob = new Blob([response.data], { type: 'application/zip' });
+      const blob = new Blob([response.data], { type: "application/zip" });
       const url = URL.createObjectURL(blob);
-      const link = document.createElement('a');
+      const link = document.createElement("a");
       link.href = url;
-      link.download = 'code.zip';
+      link.download = "code.zip";
       link.click();
       URL.revokeObjectURL(url); // 释放URL对象
-      ElMessage.success('代码生成成功，正在下载...');
+      ElMessage.success("代码生成成功，正在下载...");
     }
   } catch (error) {
-    console.error('生成代码失败:', error);
+    console.error("生成代码失败:", error);
   } finally {
     loading.value = false;
   }
@@ -963,30 +1254,26 @@ async function handleGenTable(targetGenType: string, row?: GenTableSchema): Prom
 
 /** 同步数据库操作 */
 async function handleSynchDb(row: GenTableSchema): Promise<void> {
-  const tableName = row.table_name || '';
-  
+  const tableName = row.table_name || "";
+
   if (!tableName) {
-    ElMessage.error('表名不能为空');
+    ElMessage.error("表名不能为空");
     return;
   }
-  
+
   try {
-    await ElMessageBox.confirm(
-      '确认要强制同步"' + tableName + '"表结构吗？',
-      '确认操作',
-      {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }
-    );
-    
+    await ElMessageBox.confirm('确认要强制同步"' + tableName + '"表结构吗？', "确认操作", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    });
+
     loading.value = true;
     await GencodeAPI.syncDb(tableName);
     loadingData(); // 同步成功后刷新列表
   } catch (error) {
-    if (error !== 'cancel') {
-      console.error('同步表结构失败:', error);
+    if (error !== "cancel") {
+      console.error("同步表结构失败:", error);
     }
   } finally {
     loading.value = false;
@@ -1007,24 +1294,24 @@ async function handleRefresh() {
 /** 多选框选中数据 - 主表格 */
 function handleTableSelectionChange(selection: GenTableSchema[]): void {
   ids.value = selection.map((item) => item.id!);
-  tableNames.value = selection.map((item) => item.table_name || '').filter(Boolean);
+  tableNames.value = selection.map((item) => item.table_name || "").filter(Boolean);
 }
 
 /** 多选框选中数据 - 导入表格 */
 function handleImportTableSelectionChange(selection: DBTableSchema[]): void {
-  tables.value = selection.map(item => ({
-    table_name: item.table_name || '',
-    table_comment: item.table_comment || ''
+  tables.value = selection.map((item) => ({
+    table_name: item.table_name || "",
+    table_comment: item.table_comment || "",
   }));
 }
 
 // 修改菜单选项过滤逻辑，添加递归过滤函数
 const filterMenuTypes = (nodes: MenuTable[]) => {
   return nodes
-    .filter(node => node.type === MenuTypeEnum.CATALOG || node.type === MenuTypeEnum.MENU)
+    .filter((node) => node.type === MenuTypeEnum.CATALOG || node.type === MenuTypeEnum.MENU)
     .map((node: any): any => ({
       ...node,
-      children: node.children ? filterMenuTypes(node.children) : []
+      children: node.children ? filterMenuTypes(node.children) : [],
     }));
 };
 
@@ -1033,7 +1320,7 @@ async function handlePreviewTable(row?: GenTableSchema): Promise<void> {
   const selectedTableId = row?.id || ids.value[0];
   if (selectedTableId) {
     // 设置编辑的表ID和名称
-    info.table_name = row?.table_name || '';
+    info.table_name = row?.table_name || "";
     // 加载表详情数据
     await loadTableDetail(selectedTableId);
     editVisible.value = true;
@@ -1041,39 +1328,35 @@ async function handlePreviewTable(row?: GenTableSchema): Promise<void> {
     const menu_response = await MenuAPI.getMenuList();
     menuOptions.value = formatTree(filterMenuTypes(menu_response.data.data));
 
-    const dict_response = await DictAPI.getDictTypeList({page_no: 1, page_size: 100});
+    const dict_response = await DictAPI.getDictTypeList({ page_no: 1, page_size: 100 });
     dictOptions.value = dict_response.data.data.items;
   } else {
-    ElMessage.error('请选择要修改的数据');
+    ElMessage.error("请选择要修改的数据");
   }
 }
 
 /** 删除按钮操作 */
 async function handleDelete(row?: GenTableSchema): Promise<void> {
   const tableIds = row?.id ? [row.id] : ids.value;
-  
+
   if (tableIds.length === 0) {
-    ElMessage.error('请选择要删除的数据');
+    ElMessage.error("请选择要删除的数据");
     return;
   }
-  
+
   try {
-    await ElMessageBox.confirm(
-      `是否确认删除选中的${tableIds.length}条数据？`,
-      '删除确认',
-      {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }
-    );
-    
+    await ElMessageBox.confirm(`是否确认删除选中的${tableIds.length}条数据？`, "删除确认", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    });
+
     loading.value = true;
     await GencodeAPI.deleteTable(tableIds);
     loadingData();
   } catch (error) {
-    if (error !== 'cancel') {
-      console.error('删除表数据失败:', error);
+    if (error !== "cancel") {
+      console.error("删除表数据失败:", error);
     }
   } finally {
     loading.value = false;
@@ -1126,19 +1409,19 @@ function loadExamplePostgres(): void {
 
 /** 创建表操作 */
 async function handleCreateTable(sql: string): Promise<void> {
-  if (!sql || sql.trim() === '') {
-    ElMessage.error('请输入创建表SQL语句');
+  if (!sql || sql.trim() === "") {
+    ElMessage.error("请输入创建表SQL语句");
     return;
   }
-  
+
   loading.value = true;
   try {
     await GencodeAPI.createTable(sql);
     createTableVisible.value = false;
-    createContent.value = '';
+    createContent.value = "";
     loadingData();
   } catch (error) {
-    console.error('创建表数据失败:', error);
+    console.error("创建表数据失败:", error);
   } finally {
     loading.value = false;
   }
@@ -1147,27 +1430,25 @@ async function handleCreateTable(sql: string): Promise<void> {
 /** 取消创建表操作 */
 function handleCreateTableCancel(): void {
   createTableVisible.value = false;
-  createContent.value = '';
+  createContent.value = "";
 }
 
-
-
 /** 导入表操作 */
 async function handleImportTable(): Promise<void> {
   if (tables.value.length === 0) {
-    ElMessage.error('请选择要导入的表');
+    ElMessage.error("请选择要导入的表");
     return;
   }
-  
+
   importLoading.value = true;
   try {
     // 提取表名数组
-    const tableNames = tables.value.map(table => table.table_name || '');
+    const tableNames = tables.value.map((table) => table.table_name || "");
     await GencodeAPI.importTable(tableNames);
     importVisible.value = false;
     loadingData(); // 导入成功后刷新已导入的表列表
   } catch (error) {
-    console.error('导入表失败:', error);
+    console.error("导入表失败:", error);
   } finally {
     importLoading.value = false;
   }
@@ -1188,7 +1469,7 @@ async function getDbList(): Promise<void> {
       importTotal.value = res.data.data.total;
     }
   } catch (error) {
-    console.error('获取数据库表列表失败:', error);
+    console.error("获取数据库表列表失败:", error);
   } finally {
     importLoading.value = false;
   }
@@ -1217,7 +1498,6 @@ async function handleQuery(): Promise<void> {
 // 路由和导航
 const route = useRoute();
 
-
 // ===== 生命周期和初始化 =====
 
 /** 页面激活时执行 */
@@ -1234,16 +1514,16 @@ onActivated(async () => {
 // 表单数据
 const info = reactive<GenTableSchema>({
   id: undefined,
-  table_name: '',
-  table_comment: '',
-  sub_table_name: '',
-  sub_table_fk_name: '',
-  class_name: '',
-  package_name: '',
-  module_name: '',
-  business_name: '',
-  function_name: '',
-  description: '',
+  table_name: "",
+  table_comment: "",
+  sub_table_name: "",
+  sub_table_fk_name: "",
+  class_name: "",
+  package_name: "",
+  module_name: "",
+  business_name: "",
+  function_name: "",
+  description: "",
   parent_menu_id: undefined,
   pk_column: undefined,
   sub_table: undefined,
@@ -1253,59 +1533,57 @@ const info = reactive<GenTableSchema>({
 
 // 校验规则
 const rules = {
-  table_name: [{ required: true, message: '表名称不能为空', trigger: 'blur' }],
-  class_name: [{ required: true, message: '实体名称不能为空', trigger: 'blur' }],
-  package_name: [{ required: true, message: '生成包路径不能为空', trigger: 'blur' }],
-  module_name: [{ required: true, message: '生成模块名不能为空', trigger: 'blur' }],
-  business_name: [{ required: true, message: '生成业务名不能为空', trigger: 'blur' }],
-  function_name: [{ required: true, message: '生成功能名不能为空', trigger: 'blur' }],
-  parent_menu_id: [{ required: true, message: '所属菜单不能为空', trigger: 'change' }]
+  table_name: [{ required: true, message: "表名称不能为空", trigger: "blur" }],
+  class_name: [{ required: true, message: "实体名称不能为空", trigger: "blur" }],
+  package_name: [{ required: true, message: "生成包路径不能为空", trigger: "blur" }],
+  module_name: [{ required: true, message: "生成模块名不能为空", trigger: "blur" }],
+  business_name: [{ required: true, message: "生成业务名不能为空", trigger: "blur" }],
+  function_name: [{ required: true, message: "生成功能名不能为空", trigger: "blur" }],
+  parent_menu_id: [{ required: true, message: "所属菜单不能为空", trigger: "change" }],
 };
 
 // ===== 工具函数
 /** 提交表单 - 保存配置 */
 async function submitForm() {
-  
   // 检查是否有表ID
   if (!info.id) {
-    ElMessage.error('无效的表ID');
+    ElMessage.error("无效的表ID");
     return;
   }
-  
+
   try {
     loading.value = true;
-    
+
     // 检查字段列表
     if (!info.columns || info.columns.length === 0) {
-      ElMessage.error('请配置字段信息');
+      ElMessage.error("请配置字段信息");
       return;
     }
-    
+
     // 提交表单数据，确保columns是必需的
     const tableData = {
       ...info,
-      columns: info.columns || [] // 确保columns存在
+      columns: info.columns || [], // 确保columns存在
     };
-    
+
     const response = await GencodeAPI.updateTable(tableData as GenTableSchema, info.id || 0);
-    
+
     if (response?.data?.code === 200) {
-      ElMessage.success((response?.data as any)?.message || '保存成功');
+      ElMessage.success((response?.data as any)?.message || "保存成功");
       return true;
     }
   } catch (error) {
-    console.error('保存表单失败:', error);
+    console.error("保存表单失败:", error);
   } finally {
     loading.value = false;
   }
 }
 
-
 // 下一步
 async function nextStep(): Promise<void> {
   if (activeStep.value < 3) {
     activeStep.value++;
-    
+
     // 当从字段配置进入预览步骤时，自动加载预览数据
     if (activeStep.value === 2 && info.id) {
       await handlePreview({ id: info.id, table_name: info.table_name } as GenTableSchema);
@@ -1323,12 +1601,12 @@ function prevStep(): void {
 // 批量设置字段属性
 function bulkSet(field: string | string[], value: any): void {
   if (!info.columns || !Array.isArray(info.columns)) return;
-  
+
   const fieldsToUpdate = Array.isArray(field) ? field : [field];
-  
-  info.columns.forEach(column => {
-    if (column && typeof column === 'object') {
-      fieldsToUpdate.forEach(f => {
+
+  info.columns.forEach((column) => {
+    if (column && typeof column === "object") {
+      fieldsToUpdate.forEach((f) => {
         (column as any)[f] = value;
       });
     }
@@ -1338,7 +1616,7 @@ function bulkSet(field: string | string[], value: any): void {
 function close(): void {
   editVisible.value = false;
   activeStep.value = 0; // 重置步骤
-  
+
   // 清除表单验证状态
   setTimeout(() => {
     basicInfo.value?.resetFields();
@@ -1355,13 +1633,13 @@ async function loadTableDetail(id: number | string) {
   try {
     loading.value = true;
     const response = await GencodeAPI.getGenTableDetail(Number(id));
-    
+
     if (response?.data?.data) {
       const data = response.data.data;
-      
+
       // 填充表单数据
       Object.assign(info, { ...data });
-      
+
       // 处理列数据
       if (data && data.columns && Array.isArray(data.columns)) {
         // 深拷贝确保数据独立性
@@ -1371,12 +1649,12 @@ async function loadTableDetail(id: number | string) {
           item.select = true;
         });
       }
-      
+
       // 重置当前步骤为第一步
       activeStep.value = 0;
     }
   } catch (error) {
-    console.error('获取表详情失败:', error);
+    console.error("获取表详情失败:", error);
   } finally {
     loading.value = false;
   }
@@ -1391,5 +1669,4 @@ onMounted(() => {
 });
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>
diff --git a/frontend/src/views/module_generator/demo/index.vue b/frontend/src/views/module_generator/demo/index.vue
index 7520b638..1fee0d22 100644
--- a/frontend/src/views/module_generator/demo/index.vue
+++ b/frontend/src/views/module_generator/demo/index.vue
@@ -1,260 +1,427 @@
 <!-- 演示示例 -->
 <template>
-    <div class="app-container">
-      <!-- 搜索区域 -->
-      <div v-show="visible" class="search-container">
-        <el-form
-          ref="queryFormRef"
-          :model="queryFormData"
-          label-suffix=":"
-          :inline="true"
-          @submit.prevent="handleQuery"
+  <div class="app-container">
+    <!-- 搜索区域 -->
+    <div v-show="visible" class="search-container">
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        label-suffix=":"
+        :inline="true"
+        @submit.prevent="handleQuery"
+      >
+        <el-form-item prop="name" label="名称">
+          <el-input v-model="queryFormData.name" placeholder="请输入名称" clearable />
+        </el-form-item>
+        <el-form-item prop="status" label="状态">
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 170px"
+            clearable
+          >
+            <el-option value="true" label="启用" />
+            <el-option value="false" label="停用" />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="isExpand" prop="creator" label="创建人">
+          <UserTableSelect
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
+          />
+        </el-form-item>
+        <!-- 时间范围，收起状态下隐藏 -->
+        <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
+        </el-form-item>
+        <!-- 查询、重置、展开/收起按钮 -->
+        <el-form-item>
+          <el-button
+            v-hasPerm="['module_generator:demo:query']"
+            type="primary"
+            icon="search"
+            @click="handleQuery"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_generator:demo:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
+          <!-- 展开/收起 -->
+          <template v-if="isExpandable">
+            <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
+              {{ isExpand ? "收起" : "展开" }}
+              <el-icon>
+                <template v-if="isExpand">
+                  <ArrowUp />
+                </template>
+                <template v-else>
+                  <ArrowDown />
+                </template>
+              </el-icon>
+            </el-link>
+          </template>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <!-- 内容区域 -->
+    <el-card class="data-table">
+      <template #header>
+        <div class="card-header">
+          <span>
+            演示示例列表
+            <el-tooltip content="演示示例列表">
+              <QuestionFilled class="w-4 h-4 mx-1" />
+            </el-tooltip>
+          </span>
+        </div>
+      </template>
+
+      <!-- 功能区域 -->
+      <div class="data-table__toolbar">
+        <div class="data-table__toolbar--left">
+          <el-row :gutter="10">
+            <el-col :span="1.5">
+              <el-button
+                v-hasPerm="['module_generator:demo:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
+            </el-col>
+            <el-col :span="1.5">
+              <el-button
+                v-hasPerm="['module_generator:demo:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
+            </el-col>
+            <el-col :span="1.5">
+              <el-dropdown v-hasPerm="['module_generator:demo:batch']" trigger="click">
+                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">
+                  更多
+                </el-button>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                      批量启用
+                    </el-dropdown-item>
+                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                      批量停用
+                    </el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </el-col>
+          </el-row>
+        </div>
+        <div class="data-table__toolbar--right">
+          <el-row :gutter="10">
+            <el-col :span="1.5">
+              <el-tooltip content="导入">
+                <el-button
+                  v-hasPerm="['module_generator:demo:import']"
+                  type="success"
+                  icon="upload"
+                  circle
+                  @click="handleOpenImportDialog"
+                />
+              </el-tooltip>
+            </el-col>
+            <el-col :span="1.5">
+              <el-tooltip content="导出">
+                <el-button
+                  v-hasPerm="['module_generator:demo:export']"
+                  type="warning"
+                  icon="download"
+                  circle
+                  @click="handleOpenExportsModal"
+                />
+              </el-tooltip>
+            </el-col>
+            <el-col :span="1.5">
+              <el-tooltip content="搜索显示/隐藏">
+                <el-button
+                  v-hasPerm="['*:*:*']"
+                  type="info"
+                  icon="search"
+                  circle
+                  @click="visible = !visible"
+                />
+              </el-tooltip>
+            </el-col>
+            <el-col :span="1.5">
+              <el-tooltip content="刷新">
+                <el-button
+                  v-hasPerm="['module_generator:demo:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
+              </el-tooltip>
+            </el-col>
+            <el-col :span="1.5">
+              <el-popover placement="bottom" trigger="click">
+                <template #reference>
+                  <el-button type="danger" icon="operation" circle></el-button>
+                </template>
+                <el-scrollbar max-height="350px">
+                  <template v-for="column in tableColumns" :key="column.prop">
+                    <el-checkbox v-if="column.prop" v-model="column.show" :label="column.label" />
+                  </template>
+                </el-scrollbar>
+              </el-popover>
+            </el-col>
+          </el-row>
+        </div>
+      </div>
+
+      <!-- 表格区域：系统配置列表 -->
+      <el-table
+        ref="tableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        :height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
+        <template #empty>
+          <el-empty :image-size="80" description="暂无数据" />
+        </template>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          min-width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          fixed
+          label="序号"
+          min-width="60"
         >
-          <el-form-item prop="name" label="名称">
-            <el-input v-model="queryFormData.name" placeholder="请输入名称" clearable />
-          </el-form-item>
-          <el-form-item prop="status" label="状态" >
-            <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 170px;" clearable>
-              <el-option value="true" label="启用" />
-              <el-option value="false" label="停用" />
-            </el-select>
-          </el-form-item>
-          <el-form-item v-if="isExpand" prop="creator" label="创建人">
-            <UserTableSelect
-                v-model="queryFormData.creator"
-                @confirm-click="handleConfirm"
-                @clear-click="handleQuery"
-            />
-          </el-form-item>
-          <!-- 时间范围，收起状态下隐藏 -->
-          <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-            <DatePicker
-              v-model="dateRange"
-              @update:model-value="handleDateRangeChange"
-            />
-          </el-form-item>
-          <!-- 查询、重置、展开/收起按钮 -->
-          <el-form-item >
+          <template #default="scope">
+            {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'name')?.show"
+          label="名称"
+          prop="name"
+          min-width="140"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'status')?.show"
+          label="状态"
+          prop="status"
+          min-width="120"
+        >
+          <template #default="scope">
+            <el-tag :type="scope.row.status ? 'success' : 'info'">
+              {{ scope.row.status ? "启用" : "停用" }}
+            </el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'description')?.show"
+          label="描述"
+          prop="description"
+          min-width="140"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          label="创建时间"
+          prop="created_at"
+          min-width="180"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          label="更新时间"
+          prop="updated_at"
+          min-width="180"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'creator')?.show"
+          label="创建人"
+          prop="creator"
+          min-width="120"
+        >
+          <template #default="scope">
+            <el-tag>{{ scope.row.creator?.name }}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="180"
+        >
+          <template #default="scope">
             <el-button
-              v-hasPerm="['module_generator:demo:query']"
+              v-hasPerm="['module_generator:demo:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_generator:demo:update']"
               type="primary"
-              icon="search"
-              @click="handleQuery"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
             >
-              查询
+              编辑
             </el-button>
             <el-button
-              v-hasPerm="['module_generator:demo:query']"
-              icon="refresh"
-              @click="handleResetQuery"
+              v-hasPerm="['module_generator:demo:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
             >
-              重置
+              删除
             </el-button>
-            <!-- 展开/收起 -->
-            <template v-if="isExpandable">
-              <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
-                {{ isExpand ? "收起" : "展开" }}
-                <el-icon>
-                  <template v-if="isExpand">
-                    <ArrowUp />
-                  </template>
-                  <template v-else>
-                    <ArrowDown />
-                  </template>
-                </el-icon>
-              </el-link>
-            </template>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 分页区域 -->
+      <template #footer>
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
+      </template>
+    </el-card>
+
+    <!-- 弹窗区域 -->
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
+      <!-- 详情 -->
+      <template v-if="dialogVisible.type === 'detail'">
+        <el-descriptions :column="4" border>
+          <el-descriptions-item label="名称" :span="2">
+            {{ detailFormData.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="状态" :span="2">
+            <el-tag :type="detailFormData.status ? 'success' : 'danger'">
+              {{ detailFormData.status ? "启用" : "停用" }}
+            </el-tag>
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="2">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="2">
+            {{ detailFormData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
+        </el-descriptions>
+      </template>
+      <!-- 新增、编辑表单 -->
+      <template v-else>
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
+          <el-form-item label="名称" prop="name">
+            <el-input v-model="formData.name" placeholder="请输入名称" :maxlength="50" />
+          </el-form-item>
+          <el-form-item label="状态" prop="status">
+            <el-radio-group v-model="formData.status">
+              <el-radio :value="true">启用</el-radio>
+              <el-radio :value="false">停用</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="描述" prop="description">
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
         </el-form>
-      </div>
-      
-      <!-- 内容区域 -->
-      <el-card class="data-table">
-        <template #header>
-          <div class="card-header">
-            <span>
-              演示示例列表
-              <el-tooltip content="演示示例列表">
-                <QuestionFilled class="w-4 h-4 mx-1" />
-              </el-tooltip>
-            </span>
-          </div>
-        </template>
+      </template>
 
-        <!-- 功能区域 -->
-        <div class="data-table__toolbar">
-          <div class="data-table__toolbar--left">
-            <el-row :gutter="10">
-              <el-col :span="1.5">
-                <el-button v-hasPerm="['module_generator:demo:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
-              </el-col>
-              <el-col :span="1.5">
-                <el-button v-hasPerm="['module_generator:demo:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
-              </el-col>
-              <el-col :span="1.5">
-                <el-dropdown v-hasPerm="['module_generator:demo:batch']" trigger="click">
-                  <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">更多</el-button>
-                  <template #dropdown>
-                    <el-dropdown-menu>
-                      <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                      <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
-                    </el-dropdown-menu>
-                  </template>
-                </el-dropdown>
-              </el-col>
-            </el-row>
-          </div>
-          <div class="data-table__toolbar--right">
-            <el-row :gutter="10">
-              <el-col :span="1.5">
-                <el-tooltip content="导入">
-                  <el-button v-hasPerm="['module_generator:demo:import']" type="success" icon="upload" circle @click="handleOpenImportDialog" />
-                </el-tooltip>
-              </el-col>
-              <el-col :span="1.5">
-                <el-tooltip content="导出">
-                  <el-button v-hasPerm="['module_generator:demo:export']" type="warning" icon="download" circle @click="handleOpenExportsModal" />
-                </el-tooltip>
-              </el-col>
-              <el-col :span="1.5">
-                <el-tooltip content="搜索显示/隐藏">
-                  <el-button v-hasPerm="['*:*:*']" type="info" icon="search" circle @click="visible = !visible" />
-                </el-tooltip>
-              </el-col>
-              <el-col :span="1.5">
-                <el-tooltip content="刷新">
-                  <el-button v-hasPerm="['module_generator:demo:refresh']" type="primary" icon="refresh" circle @click="handleRefresh" />
-                </el-tooltip>
-              </el-col>
-              <el-col :span="1.5">
-                <el-popover placement="bottom" trigger="click">
-                  <template #reference>
-                    <el-button type="danger" icon="operation" circle></el-button>
-                  </template>
-                  <el-scrollbar max-height="350px">
-                    <template v-for="column in tableColumns" :key="column.prop">
-                      <el-checkbox v-if="column.prop" v-model="column.show" :label="column.label" />
-                    </template>
-                  </el-scrollbar>
-                </el-popover>
-              </el-col>
-            </el-row>
-          </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
+          <el-button @click="handleCloseDialog">取消</el-button>
+          <el-button
+            v-if="dialogVisible.type !== 'detail'"
+            v-hasPerm="['module_generator:demo:submit']"
+            type="primary"
+            @click="handleSubmit"
+          >
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['smodule_generator:demo:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
         </div>
+      </template>
+    </el-dialog>
 
-        <!-- 表格区域：系统配置列表 -->
-        <el-table ref="tableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
-          <template #empty>
-            <el-empty :image-size="80" description="暂无数据" />
-          </template>
-          <el-table-column v-if="tableColumns.find((col) => col.prop === 'selection')?.show" type="selection" min-width="55" align="center"/>
-          <el-table-column v-if="tableColumns.find((col) => col.prop === 'index')?.show" fixed label="序号" min-width="60">
-            <template #default="scope">
-              {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
-            </template>
-          </el-table-column>
-          <el-table-column v-if="tableColumns.find((col) => col.prop === 'name')?.show" label="名称" prop="name" min-width="140" />
-          <el-table-column v-if="tableColumns.find((col) => col.prop === 'status')?.show" label="状态" prop="status" min-width="120">
-            <template #default="scope">
-              <el-tag :type="scope.row.status ? 'success' : 'info'">
-                {{ scope.row.status ? '启用' : '停用' }}
-              </el-tag>
-            </template>
-          </el-table-column>
-          <el-table-column v-if="tableColumns.find((col) => col.prop === 'description')?.show" label="描述" prop="description" min-width="140" />
-          <el-table-column v-if="tableColumns.find((col) => col.prop === 'created_at')?.show" label="创建时间" prop="created_at" min-width="180" />
-          <el-table-column v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show" label="更新时间" prop="updated_at" min-width="180" />
-          <el-table-column v-if="tableColumns.find((col) => col.prop === 'creator')?.show" label="创建人" prop="creator" min-width="120">
-            <template #default="scope">
-              <el-tag>{{ scope.row.creator?.name }}</el-tag>
-            </template>
-          </el-table-column>
-          <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" fixed="right" label="操作" align="center" min-width="180">
-            <template #default="scope">
-              <el-button v-hasPerm="['module_generator:demo:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-              <el-button v-hasPerm="['module_generator:demo:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-              <el-button v-hasPerm="['module_generator:demo:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
+    <!-- 导入弹窗 -->
+    <ImportModal
+      v-model="importDialogVisible"
+      :content-config="curdContentConfig"
+      @upload="handleUpload"
+    />
 
-        <!-- 分页区域 -->
-        <template #footer>
-          <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
-        </template>
-      </el-card>
-
-      <!-- 弹窗区域 -->
-      <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
-        <!-- 详情 -->
-        <template v-if="dialogVisible.type === 'detail'">
-          <el-descriptions :column="4" border>
-            <el-descriptions-item label="名称" :span="2">
-              {{ detailFormData.name }}
-            </el-descriptions-item>
-            <el-descriptions-item label="状态" :span="2">
-              <el-tag :type="detailFormData.status ? 'success' : 'danger'">
-                {{ detailFormData.status ? '启用' : '停用' }}
-              </el-tag>
-            </el-descriptions-item>
-            <el-descriptions-item label="描述" :span="2">
-              {{ detailFormData.description }}
-            </el-descriptions-item>
-            <el-descriptions-item label="创建人" :span="2">
-              {{ detailFormData.creator?.name }}
-            </el-descriptions-item>
-            <el-descriptions-item label="创建时间" :span="2">
-              {{ detailFormData.created_at }}
-            </el-descriptions-item>
-            <el-descriptions-item label="更新时间" :span="2">
-              {{ detailFormData.updated_at }}
-            </el-descriptions-item>
-          </el-descriptions>
-        </template>
-        <!-- 新增、编辑表单 -->
-        <template v-else>
-          <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
-            <el-form-item label="名称" prop="name">
-              <el-input v-model="formData.name" placeholder="请输入名称" :maxlength="50" />
-            </el-form-item>
-            <el-form-item label="状态" prop="status">
-              <el-radio-group v-model="formData.status">
-                <el-radio :value="true">启用</el-radio>
-                <el-radio :value="false">停用</el-radio>
-              </el-radio-group>
-            </el-form-item>
-            <el-form-item label="描述" prop="description">
-              <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
-            </el-form-item>
-          </el-form>
-        </template>
-
-        <template #footer>
-          <div class="dialog-footer">
-            <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
-            <el-button @click="handleCloseDialog">取消</el-button>
-            <el-button v-if="dialogVisible.type !== 'detail'" v-hasPerm="['module_generator:demo:submit']" type="primary" @click="handleSubmit">确定</el-button>
-            <el-button v-else v-hasPerm="['smodule_generator:demo:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
-          </div>
-        </template>
-      </el-dialog>
-
-      <!-- 导入弹窗 -->
-      <ImportModal 
-        v-model="importDialogVisible" 
-        :content-config="curdContentConfig"
-        @upload="handleUpload" 
-      />
-
-      <!-- 导出弹窗 -->
-      <ExportModal 
-        v-model="exportsDialogVisible"
-        :content-config="curdContentConfig"
-        :query-params="queryFormData"
-        :page-data="pageTableData"
-        :selection-data="selectionRows"
-      />
-    </div>
+    <!-- 导出弹窗 -->
+    <ExportModal
+      v-model="exportsDialogVisible"
+      :content-config="curdContentConfig"
+      :query-params="queryFormData"
+      :page-data="pageTableData"
+      :selection-data="selectionRows"
+    />
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -266,7 +433,11 @@ defineOptions({
 import { ref, reactive, onMounted } from "vue";
 import { ElMessage, ElMessageBox } from "element-plus";
 import { ResultEnum } from "@/enums/api/result.enum";
-import ExampleAPI, { ExampleTable, ExampleForm, ExamplePageQuery } from "@/api/module_generator/demo";
+import ExampleAPI, {
+  ExampleTable,
+  ExampleForm,
+  ExamplePageQuery,
+} from "@/api/module_generator/demo";
 import ImportModal from "@/components/CURD/ImportModal.vue";
 import ExportModal from "@/components/CURD/ExportModal.vue";
 import DatePicker from "@/components/DatePicker/index.vue";
@@ -274,7 +445,6 @@ import type { IContentConfig } from "@/components/CURD/types";
 import { QuestionFilled, ArrowUp, ArrowDown } from "@element-plus/icons-vue";
 import { formatToDateTime } from "@/utils/dateUtil";
 
-
 const visible = ref(true);
 const queryFormRef = ref();
 const dataFormRef = ref();
@@ -290,35 +460,35 @@ const pageTableData = ref<ExampleTable[]>([]);
 
 // 表格列配置
 const tableColumns = ref([
-  { prop: 'selection', label: '选择框', show: true },
-  { prop: 'index', label: '序号', show: true },
-  { prop: 'name', label: '名称', show: true },
-  { prop: 'status', label: '状态', show: true },
-  { prop: 'description', label: '描述', show: true },
-  { prop: 'created_at', label: '创建时间', show: true },
-  { prop: 'updated_at', label: '更新时间', show: true },
-  { prop: 'creator', label: '创建人', show: true },
-  { prop: 'operation', label: '操作', show: true }
-])
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "name", label: "名称", show: true },
+  { prop: "status", label: "状态", show: true },
+  { prop: "description", label: "描述", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "creator", label: "创建人", show: true },
+  { prop: "operation", label: "操作", show: true },
+]);
 
 // 仅用于导出字段的列（排除非数据列及嵌套对象列）
 const exportColumns = [
-  { prop: 'name', label: '名称' },
-  { prop: 'status', label: '状态' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "name", label: "名称" },
+  { prop: "status", label: "状态" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导入/导出配置
 const curdContentConfig = {
-  permPrefix: 'module_generator:demo',
+  permPrefix: "module_generator:demo",
   cols: exportColumns as any,
   importTemplate: () => ExampleAPI.downloadTemplate(),
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.status === 'string') {
-      query.status = query.status === 'true';
+    if (typeof query.status === "string") {
+      query.status = query.status === "true";
     }
     query.page_no = 1;
     query.page_size = 9999;
@@ -339,7 +509,7 @@ const detailFormData = ref<ExampleTable>({});
 // 日期范围临时变量
 const dateRange = ref<[Date, Date] | []>([]);
 
- // 处理日期范围变化
+// 处理日期范围变化
 function handleDateRangeChange(range: [Date, Date]) {
   dateRange.value = range;
   if (range && range.length === 2) {
@@ -365,16 +535,16 @@ const queryFormData = reactive<ExamplePageQuery>({
 // 编辑表单
 const formData = reactive<ExampleForm>({
   id: undefined,
-  name: '',
+  name: "",
   status: true,
   description: undefined,
-})
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -402,7 +572,7 @@ function handleOpenExportsModal() {
 // 列表刷新
 async function handleRefresh() {
   await loadingData();
-};
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -411,11 +581,9 @@ async function loadingData() {
     const response = await ExampleAPI.getExampleList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -445,10 +613,10 @@ async function handleResetQuery() {
 // 定义初始表单数据常量
 const initialFormData: ExampleForm = {
   id: undefined,
-  name: '',
+  name: "",
   status: true,
-  description: '',
-}
+  description: "",
+};
 
 // 重置表单
 async function resetForm() {
@@ -473,14 +641,14 @@ async function handleCloseDialog() {
 }
 
 // 打开弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await ExampleAPI.getExampleDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改";
       Object.assign(formData, response.data.data);
     }
@@ -496,35 +664,35 @@ async function handleSubmit() {
   // 表单校验
   dataFormRef.value.validate(async (valid: any) => {
     if (valid) {
-        loading.value = true;
-        // 根据弹窗传入的参数(deatil\create\update)判断走什么逻辑
-        const id = formData.id;
-        if (id) {
-          try {
-            await ExampleAPI.updateExample(id, { id, ...formData })
-            dialogVisible.visible = false;
-            resetForm();
-            handleCloseDialog();
-            handleResetQuery();
-          } catch (error: any) {
-              console.error(error);
-          } finally {
-            loading.value = false;
-          }
-        } else {
-          try {
-            await ExampleAPI.createExample(formData)
-            dialogVisible.visible = false;
-            resetForm();
-            handleCloseDialog();
-            handleResetQuery();
-          } catch (error: any) {
-            console.error(error);
-          } finally {
-            loading.value = false;
-          }
+      loading.value = true;
+      // 根据弹窗传入的参数(deatil\create\update)判断走什么逻辑
+      const id = formData.id;
+      if (id) {
+        try {
+          await ExampleAPI.updateExample(id, { id, ...formData });
+          dialogVisible.visible = false;
+          resetForm();
+          handleCloseDialog();
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      } else {
+        try {
+          await ExampleAPI.createExample(formData);
+          dialogVisible.visible = false;
+          resetForm();
+          handleCloseDialog();
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
         }
       }
+    }
   });
 }
 
@@ -534,41 +702,45 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await ExampleAPI.deleteExample(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
-}
-
-// 批量启用/停用
-async function handleMoreClick(status: boolean) {
-  if (selectIds.value.length) {
-    ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
-      confirmButtonText: "确定",
-      cancelButtonText: "取消",
-      type: "warning",
-    }).then(async () => {
+  })
+    .then(async () => {
       try {
         loading.value = true;
-        await ExampleAPI.batchAvailableExample({ ids: selectIds.value, status });
+        await ExampleAPI.deleteExample(ids);
         handleResetQuery();
       } catch (error: any) {
         console.error(error);
       } finally {
         loading.value = false;
       }
-    }).catch(() => {
+    })
+    .catch(() => {
       ElMessageBox.close();
     });
+}
+
+// 批量启用/停用
+async function handleMoreClick(status: boolean) {
+  if (selectIds.value.length) {
+    ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await ExampleAPI.batchAvailableExample({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
   }
 }
 
@@ -582,7 +754,7 @@ const handleUpload = async (formData: FormData) => {
       await handleQuery();
     }
   } catch (error: any) {
-      console.error(error);
+    console.error(error);
   }
 };
 
diff --git a/frontend/src/views/module_monitor/cache/index.vue b/frontend/src/views/module_monitor/cache/index.vue
index bd6df96d..5cc4f755 100644
--- a/frontend/src/views/module_monitor/cache/index.vue
+++ b/frontend/src/views/module_monitor/cache/index.vue
@@ -20,15 +20,15 @@
                   </el-tooltip>
                 </div>
               </template>
-              <el-descriptions :column=12 border :direction="'vertical'">
+              <el-descriptions :column="12" border :direction="'vertical'">
                 <el-descriptions-item label="Redis版本">
-                  {{ cache.info?.redis_version || '-' }}
+                  {{ cache.info?.redis_version || "-" }}
                 </el-descriptions-item>
                 <el-descriptions-item label="运行模式">
-                  {{ cache.info?.redis_mode === 'standalone' ? '单机' : '集群' }}
+                  {{ cache.info?.redis_mode === "standalone" ? "单机" : "集群" }}
                 </el-descriptions-item>
                 <el-descriptions-item label="端口">
-                  {{ cache.info?.tcp_port || '-' }}
+                  {{ cache.info?.tcp_port || "-" }}
                 </el-descriptions-item>
                 <el-descriptions-item label="客户端数">
                   {{ cache.info?.connected_clients || 0 }}
@@ -37,26 +37,30 @@
                   {{ cache.info?.uptime_in_days || 0 }}
                 </el-descriptions-item>
                 <el-descriptions-item label="使用内存">
-                  {{ cache.info?.used_memory_human || '-' }}
+                  {{ cache.info?.used_memory_human || "-" }}
                 </el-descriptions-item>
                 <el-descriptions-item label="使用CPU">
-                  {{ cache.info?.used_cpu_user_children ? parseFloat(cache.info.used_cpu_user_children).toFixed(2) : '-'
+                  {{
+                    cache.info?.used_cpu_user_children
+                      ? parseFloat(cache.info.used_cpu_user_children).toFixed(2)
+                      : "-"
                   }}
                 </el-descriptions-item>
                 <el-descriptions-item label="内存配置">
-                  {{ cache.info?.maxmemory_human || '-' }}
+                  {{ cache.info?.maxmemory_human || "-" }}
                 </el-descriptions-item>
                 <el-descriptions-item label="AOF是否开启">
-                  {{ cache.info?.aof_enabled === '0' ? '否' : '是' }}
+                  {{ cache.info?.aof_enabled === "0" ? "否" : "是" }}
                 </el-descriptions-item>
                 <el-descriptions-item label="RDB是否成功">
-                  {{ cache.info?.rdb_last_bgsave_status || '-' }}
+                  {{ cache.info?.rdb_last_bgsave_status || "-" }}
                 </el-descriptions-item>
                 <el-descriptions-item label="Key数量">
                   {{ cache.db_size || 0 }}
                 </el-descriptions-item>
                 <el-descriptions-item label="网络入口/出口">
-                  {{ `${cache.info?.instantaneous_input_kbps || 0}kps/${cache.info?.instantaneous_output_kbps || 0}kps`
+                  {{
+                    `${cache.info?.instantaneous_input_kbps || 0}kps/${cache.info?.instantaneous_output_kbps || 0}kps`
                   }}
                 </el-descriptions-item>
               </el-descriptions>
@@ -124,25 +128,55 @@
                     </el-tooltip>
                   </div>
                   <div>
-                    <el-button v-hasPerm="['module_monitor:cache:refresh']" type="primary" link icon="RefreshRight" @click="refreshCacheNames"/>
+                    <el-button
+                      v-hasPerm="['module_monitor:cache:refresh']"
+                      type="primary"
+                      link
+                      icon="RefreshRight"
+                      @click="refreshCacheNames"
+                    />
                   </div>
                 </div>
               </template>
-              <el-table :loading="loading" :data="cacheNames" row-key="cache_name" height="600" border>
+              <el-table
+                :loading="loading"
+                :data="cacheNames"
+                row-key="cache_name"
+                height="600"
+                border
+              >
                 <template #empty>
                   <el-empty :image-size="80" description="暂无数据" />
                 </template>
                 <el-table-column prop="cache_name" label="缓存名称" show-overflow-tooltip>
                   <template #default="{ row }">
-                    <el-button v-hasPerm="['module_monitor:cache:view']" type="primary" link @click="getCacheKeyList(row)">{{ row.cache_name }}</el-button>
+                    <el-button
+                      v-hasPerm="['module_monitor:cache:view']"
+                      type="primary"
+                      link
+                      @click="getCacheKeyList(row)"
+                    >
+                      {{ row.cache_name }}
+                    </el-button>
                   </template>
                 </el-table-column>
                 <el-table-column prop="remark" label="备注" show-overflow-tooltip />
                 <el-table-column label="操作" width="60" align="center">
                   <template #default="{ row }">
-                    <el-popconfirm class="box-item" :title="`确认删除缓存 ${row.cache_name} 吗？`" placement="top" @confirm="handleClearCacheName(row)">
+                    <el-popconfirm
+                      class="box-item"
+                      :title="`确认删除缓存 ${row.cache_name} 吗？`"
+                      placement="top"
+                      @confirm="handleClearCacheName(row)"
+                    >
                       <template #reference>
-                        <el-button v-hasPerm="['module_monitor:cache:delete']" type="danger" size="small" link icon="delete"/>
+                        <el-button
+                          v-hasPerm="['module_monitor:cache:delete']"
+                          type="danger"
+                          size="small"
+                          link
+                          icon="delete"
+                        />
                       </template>
                     </el-popconfirm>
                   </template>
@@ -168,24 +202,54 @@
                     </el-tooltip>
                   </div>
                   <div>
-                    <el-button v-hasPerm="['module_monitor:cache:refresh']" type="primary" link icon="RefreshRight" @click="refreshCacheKeys"/>
+                    <el-button
+                      v-hasPerm="['module_monitor:cache:refresh']"
+                      type="primary"
+                      link
+                      icon="RefreshRight"
+                      @click="refreshCacheKeys"
+                    />
                   </div>
                 </div>
               </template>
-              <el-table :loading="subLoading" :data="cacheKeys.map(key => ({ cacheKey: key }))" height="600" row-key="cacheKey" border>
+              <el-table
+                :loading="subLoading"
+                :data="cacheKeys.map((key) => ({ cacheKey: key }))"
+                height="600"
+                row-key="cacheKey"
+                border
+              >
                 <template #empty>
                   <el-empty :image-size="80" description="暂无数据" />
                 </template>
                 <el-table-column prop="cacheKey" label="缓存键名" show-overflow-tooltip>
                   <template #default="{ row }">
-                    <el-button v-hasPerm="['module_monitor:cache:detail']" type="primary" link @click="handleCacheValue(row.cacheKey)">{{ row.cacheKey}}</el-button>
+                    <el-button
+                      v-hasPerm="['module_monitor:cache:detail']"
+                      type="primary"
+                      link
+                      @click="handleCacheValue(row.cacheKey)"
+                    >
+                      {{ row.cacheKey }}
+                    </el-button>
                   </template>
                 </el-table-column>
                 <el-table-column label="操作" width="60" align="center">
                   <template #default="{ row }">
-                    <el-popconfirm class="box-item" :title="`确认删除键 ${row.cacheKey} 吗？`" placement="top" @confirm="handleClearCacheKey(row.cacheKey)">
+                    <el-popconfirm
+                      class="box-item"
+                      :title="`确认删除键 ${row.cacheKey} 吗？`"
+                      placement="top"
+                      @confirm="handleClearCacheKey(row.cacheKey)"
+                    >
                       <template #reference>
-                        <el-button v-hasPerm="['module_monitor:cache:delete']" type="danger" size="small" link icon="delete"/>
+                        <el-button
+                          v-hasPerm="['module_monitor:cache:delete']"
+                          type="danger"
+                          size="small"
+                          link
+                          icon="delete"
+                        />
                       </template>
                     </el-popconfirm>
                   </template>
@@ -211,7 +275,15 @@
                     </el-tooltip>
                   </div>
                   <div>
-                    <el-button v-hasPerm="['module_monitor:cache:delete_all']" type="danger" link icon="delete" @click="handleClearCacheAll">清理全部</el-button>
+                    <el-button
+                      v-hasPerm="['module_monitor:cache:delete_all']"
+                      type="danger"
+                      link
+                      icon="delete"
+                      @click="handleClearCacheAll"
+                    >
+                      清理全部
+                    </el-button>
                   </div>
                 </div>
               </template>
@@ -223,7 +295,13 @@
                   <el-input v-model="cacheForm.cache_key" readonly placeholder="缓存键名" />
                 </el-form-item>
                 <el-form-item label="缓存内容">
-                  <el-input v-model="cacheForm.cache_value" type="textarea" :rows="18" readonly placeholder="缓存内容" />
+                  <el-input
+                    v-model="cacheForm.cache_value"
+                    type="textarea"
+                    :rows="18"
+                    readonly
+                    placeholder="缓存内容"
+                  />
                 </el-form-item>
               </el-form>
             </el-card>
@@ -235,26 +313,31 @@
 </template>
 
 <script lang="ts" setup>
-import CacheAPI, { type CacheInfo, type CacheForm, type CacheMonitor, type RedisInfo } from "@/api/module_monitor/cache";
-import * as echarts from 'echarts';
+import CacheAPI, {
+  type CacheInfo,
+  type CacheForm,
+  type CacheMonitor,
+  type RedisInfo,
+} from "@/api/module_monitor/cache";
+import * as echarts from "echarts";
 
 // 响应式状态定义
 const cacheNames = ref<CacheInfo[]>([]);
 const cacheKeys = ref<string[]>([]);
 const loading = ref(true);
 const subLoading = ref(false);
-const nowCacheName = ref('');
+const nowCacheName = ref("");
 const commandstats = ref<HTMLElement | null>(null);
 const usedmemory = ref<HTMLElement | null>(null);
 const cache = ref<CacheMonitor>({
   info: {} as RedisInfo,
   command_stats: [],
-  db_size: 0
+  db_size: 0,
 });
 const cacheForm = ref<CacheForm>({
-  cache_name: '',
-  cache_key: '',
-  cache_value: ''
+  cache_name: "",
+  cache_key: "",
+  cache_value: "",
 });
 
 let commandstatsInstance: echarts.ECharts | null = null;
@@ -263,9 +346,9 @@ let usedmemoryInstance: echarts.ECharts | null = null;
 const resetCacheForm = () => {
   cacheKeys.value = [];
   cacheForm.value = {
-    cache_name: '',
-    cache_key: '',
-    cache_value: ''
+    cache_name: "",
+    cache_key: "",
+    cache_value: "",
   };
 };
 
@@ -273,11 +356,11 @@ const resetCacheForm = () => {
 const getCacheNameList = async () => {
   try {
     loading.value = true;
-    const response = await CacheAPI.getCacheNames()
+    const response = await CacheAPI.getCacheNames();
     cacheNames.value = response.data.data;
     resetCacheForm();
   } catch (error) {
-    console.error('获取缓存列表出错:', error);
+    console.error("获取缓存列表出错:", error);
   } finally {
     loading.value = false;
   }
@@ -294,7 +377,7 @@ const handleClearCacheName = async (row: CacheInfo) => {
     await CacheAPI.deleteCacheName(row.cache_name);
     refreshCacheNames();
   } catch (error) {
-    console.error('清理缓存名称出错:', error);
+    console.error("清理缓存名称出错:", error);
   }
 };
 
@@ -310,11 +393,11 @@ const getCacheKeyList = async (row?: CacheInfo) => {
     nowCacheName.value = cacheName;
     cacheForm.value = {
       cache_name: cacheName,
-      cache_key: '',
-      cache_value: ''
+      cache_key: "",
+      cache_value: "",
     };
   } catch (error) {
-    console.error('获取缓存键名列表出错:', error);
+    console.error("获取缓存键名列表出错:", error);
   } finally {
     subLoading.value = false;
   }
@@ -331,34 +414,30 @@ async function handleClearCacheKey(cacheKey: string) {
     await CacheAPI.deleteCacheKey(cacheKey);
     getCacheKeyList();
   } catch (error) {
-    console.error('清理缓存键名出错:', error);
+    console.error("清理缓存键名出错:", error);
   }
-};
+}
 
 // 缓存内容相关方法
 async function handleCacheValue(cacheKey: string) {
   try {
     loading.value = true;
-    const response = await CacheAPI.getCacheValue(nowCacheName.value, cacheKey)
+    const response = await CacheAPI.getCacheValue(nowCacheName.value, cacheKey);
     cacheForm.value = response.data.data;
   } catch (error) {
-    console.error('获取缓存内容失败:', error);
+    console.error("获取缓存内容失败:", error);
   } finally {
     loading.value = false;
   }
-};
+}
 
 // 清理全部缓存
 const handleClearCacheAll = async () => {
-  ElMessageBox.confirm(
-    '确定要清理全部缓存吗？',
-    '危险！',
-    {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning',
-    }
-  )
+  ElMessageBox.confirm("确定要清理全部缓存吗？", "危险！", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
     .then(async () => {
       return await CacheAPI.deleteCacheAll();
     })
@@ -366,8 +445,8 @@ const handleClearCacheAll = async () => {
       getCacheNameList();
     })
     .catch((error) => {
-      if (error !== 'cancel') {
-        console.error('清理全部缓存失败:', error);
+      if (error !== "cancel") {
+        console.error("清理全部缓存失败:", error);
       }
     });
 };
@@ -376,15 +455,15 @@ const handleClearCacheAll = async () => {
 const getInfo = async () => {
   try {
     loading.value = true;
-    const response = await CacheAPI.getCacheInfo()
+    const response = await CacheAPI.getCacheInfo();
     cache.value = response.data.data || {
       info: {},
       command_stats: [],
-      dbSize: 0
+      dbSize: 0,
     };
     initCharts();
   } catch (error) {
-    console.error('获取缓存监控数据失败:', error);
+    console.error("获取缓存监控数据失败:", error);
   } finally {
     loading.value = false;
   }
@@ -394,44 +473,50 @@ const getInfo = async () => {
 const initCharts = () => {
   if (!commandstats.value || !usedmemory.value) return;
 
-  commandstatsInstance = echarts.init(commandstats.value, 'macarons');
-  usedmemoryInstance = echarts.init(usedmemory.value, 'macarons');
+  commandstatsInstance = echarts.init(commandstats.value, "macarons");
+  usedmemoryInstance = echarts.init(usedmemory.value, "macarons");
 
   const commandStatsOption = {
     tooltip: {
-      trigger: 'item',
-      formatter: '{a} <br/>{b} : {c} ({d}%)'
+      trigger: "item",
+      formatter: "{a} <br/>{b} : {c} ({d}%)",
     },
-    series: [{
-      name: '命令',
-      type: 'pie',
-      roseType: 'radius',
-      radius: [15, 95],
-      center: ['50%', '38%'],
-      data: cache.value.command_stats || [],
-      animationEasing: 'cubicInOut',
-      animationDuration: 1000
-    }]
+    series: [
+      {
+        name: "命令",
+        type: "pie",
+        roseType: "radius",
+        radius: [15, 95],
+        center: ["50%", "38%"],
+        data: cache.value.command_stats || [],
+        animationEasing: "cubicInOut",
+        animationDuration: 1000,
+      },
+    ],
   };
 
-  const usedMemory = cache.value.info?.used_memory_human || '0';
+  const usedMemory = cache.value.info?.used_memory_human || "0";
   const usedMemoryOption = {
     tooltip: {
-      formatter: `{b} <br/>{a} : ${usedMemory}`
+      formatter: `{b} <br/>{a} : ${usedMemory}`,
     },
-    series: [{
-      name: '峰值',
-      type: 'gauge',
-      min: 0,
-      max: 1000,
-      detail: {
-        formatter: usedMemory
+    series: [
+      {
+        name: "峰值",
+        type: "gauge",
+        min: 0,
+        max: 1000,
+        detail: {
+          formatter: usedMemory,
+        },
+        data: [
+          {
+            value: parseFloat(usedMemory) || 0,
+            name: "内存消耗",
+          },
+        ],
       },
-      data: [{
-        value: parseFloat(usedMemory) || 0,
-        name: '内存消耗'
-      }]
-    }]
+    ],
   };
 
   commandstatsInstance.setOption(commandStatsOption);
diff --git a/frontend/src/views/module_monitor/online/index.vue b/frontend/src/views/module_monitor/online/index.vue
index 8ba8d21a..922621bb 100644
--- a/frontend/src/views/module_monitor/online/index.vue
+++ b/frontend/src/views/module_monitor/online/index.vue
@@ -3,7 +3,13 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery" >
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="ipaddr" label="IP地址">
           <el-input v-model="queryFormData.ipaddr" placeholder="请输入IP地址" clearable />
         </el-form-item>
@@ -15,8 +21,21 @@
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_monitor:online:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_monitor:online:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_monitor:online:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_monitor:online:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
         </el-form-item>
       </el-form>
     </div>
@@ -39,7 +58,14 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_monitor:online:force_logout']" type="danger" icon="delete" @click="handleClear">强退所有</el-button>
+              <el-button
+                v-hasPerm="['module_monitor:online:force_logout']"
+                type="danger"
+                icon="delete"
+                @click="handleClear"
+              >
+                强退所有
+              </el-button>
             </el-col>
           </el-row>
         </div>
@@ -47,7 +73,13 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_monitor:online:refresh']" type="primary" icon="refresh" circle @click="handleRefresh"/>
+                <el-button
+                  v-hasPerm="['module_monitor:online:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -67,29 +99,117 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        :height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
 
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" min-width="55" align="center" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" type="index" fixed label="序号" min-width="60" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'session_id')?.show" key="session_id" label="会话编号" prop="session_id" min-width="250" show-overflow-tooltip/>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'login_type')?.show" key="login_type" label="登录类型" prop="login_type" min-width="100" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'ipaddr')?.show" key="ipaddr" label="IP地址" prop="ipaddr" min-width="150" show-overflow-tooltip>
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          min-width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          type="index"
+          fixed
+          label="序号"
+          min-width="60"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'session_id')?.show"
+          key="session_id"
+          label="会话编号"
+          prop="session_id"
+          min-width="250"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'login_type')?.show"
+          key="login_type"
+          label="登录类型"
+          prop="login_type"
+          min-width="100"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'ipaddr')?.show"
+          key="ipaddr"
+          label="IP地址"
+          prop="ipaddr"
+          min-width="150"
+          show-overflow-tooltip
+        >
           <template #default="scope">
             <el-text>{{ scope.row.ipaddr }}</el-text>
             <CopyButton v-if="scope.row.ipaddr" :text="scope.row.ipaddr" style="margin-left: 2px" />
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'name')?.show" key="name" label="用户名" prop="name" min-width="80" show-overflow-tooltip />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'user_name')?.show" key="user_name" label="账号" prop="user_name" min-width="80" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'login_location')?.show" key="login_location" label="登录位置" prop="login_location" min-width="280" show-overflow-tooltip/>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'os')?.show" key="os" label="操作系统" prop="os" min-width="120" show-overflow-tooltip />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'login_time')?.show" key="login_time" label="登录时间" prop="login_time" min-width="180" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" key="operation" fixed="right" label="操作" min-width="100">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'name')?.show"
+          key="name"
+          label="用户名"
+          prop="name"
+          min-width="80"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'user_name')?.show"
+          key="user_name"
+          label="账号"
+          prop="user_name"
+          min-width="80"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'login_location')?.show"
+          key="login_location"
+          label="登录位置"
+          prop="login_location"
+          min-width="280"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'os')?.show"
+          key="os"
+          label="操作系统"
+          prop="os"
+          min-width="120"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'login_time')?.show"
+          key="login_time"
+          label="登录时间"
+          prop="login_time"
+          min-width="180"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          key="operation"
+          fixed="right"
+          label="操作"
+          min-width="100"
+        >
           <template #default="scope">
-            <el-button v-hasPerm="['module_monitor:online:force_logout']" type="danger" size="small" link icon="delete" @click="handleSubmit(scope.row.session_id)">强退
+            <el-button
+              v-hasPerm="['module_monitor:online:force_logout']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleSubmit(scope.row.session_id)"
+            >
+              强退
             </el-button>
           </template>
         </el-table-column>
@@ -97,12 +217,15 @@
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
-
   </div>
-
 </template>
 
 <script lang="ts" setup>
@@ -111,7 +234,10 @@ defineOptions({
   inheritAttrs: false,
 });
 
-import OnlineAPI, { type OnlineUserPageQuery, type OnlineUserTable } from "@/api/module_monitor/online";
+import OnlineAPI, {
+  type OnlineUserPageQuery,
+  type OnlineUserTable,
+} from "@/api/module_monitor/online";
 
 const queryFormRef = ref();
 const total = ref(0);
@@ -121,20 +247,19 @@ const loading = ref(false);
 // 分页表单
 const pageTableData = ref<OnlineUserTable[]>([]);
 
-
 // 表格列配置
 const tableColumns = ref([
-  { label: '选择框', prop: 'selection', show: true },
-  { label: '序号', prop: 'index', show: true },
-  { label: '会话编号', prop: 'session_id', show: true },
-  { label: '登录类型', prop: 'login_type', show: true },
-  { label: '登录名称', prop: 'name', show: true },
-  { label: '用户账号', prop: 'user_name', show: true },
-  { label: '主机', prop: 'ipaddr', show: true },
-  { label: '登录地点', prop: 'login_location', show: true },
-  { label: '操作系统', prop: 'os', show: true },
-  { label: '登录时间', prop: 'login_time', show: true },
-  { label: '操作', prop: 'operation', show: true }
+  { label: "选择框", prop: "selection", show: true },
+  { label: "序号", prop: "index", show: true },
+  { label: "会话编号", prop: "session_id", show: true },
+  { label: "登录类型", prop: "login_type", show: true },
+  { label: "登录名称", prop: "name", show: true },
+  { label: "用户账号", prop: "user_name", show: true },
+  { label: "主机", prop: "ipaddr", show: true },
+  { label: "登录地点", prop: "login_location", show: true },
+  { label: "操作系统", prop: "os", show: true },
+  { label: "登录时间", prop: "login_time", show: true },
+  { label: "操作", prop: "operation", show: true },
 ]);
 
 // 分页查询参数
@@ -143,13 +268,13 @@ const queryFormData = reactive<OnlineUserPageQuery>({
   page_size: 10,
   name: undefined,
   login_location: undefined,
-  ipaddr: undefined
+  ipaddr: undefined,
 });
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -158,11 +283,9 @@ async function loadingData() {
     const response = await OnlineAPI.getOnlineList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -191,19 +314,21 @@ async function handleSubmit(session_id: string) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await OnlineAPI.deleteOnline(session_id);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await OnlineAPI.deleteOnline(session_id);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 强退所有
@@ -212,19 +337,21 @@ async function handleClear() {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await OnlineAPI.clearOnline();
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await OnlineAPI.clearOnline();
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 onMounted(() => {
   loadingData();
diff --git a/frontend/src/views/module_monitor/resource/index.vue b/frontend/src/views/module_monitor/resource/index.vue
index 1f83699f..13440505 100644
--- a/frontend/src/views/module_monitor/resource/index.vue
+++ b/frontend/src/views/module_monitor/resource/index.vue
@@ -2,7 +2,13 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true" label-suffix=":" @submit.prevent="handleQuery">
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="name" label="关键词">
           <el-input
             v-model="queryFormData.name"
@@ -13,8 +19,21 @@
           />
         </el-form-item>
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_monitor:resource:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_monitor:resource:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_monitor:resource:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_monitor:resource:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
         </el-form-item>
       </el-form>
     </div>
@@ -31,7 +50,6 @@
           </span>
           <!-- 资源路径 -->
           <div class="breadcrumb-container">
-              
             <span class="breadcrumb-label"></span>
             <el-breadcrumb separator="/">
               <el-breadcrumb-item
@@ -52,20 +70,46 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_monitor:resource:upload']" type="success" icon="plus" @click="handleUpload">上传文件</el-button>
+              <el-button
+                v-hasPerm="['module_monitor:resource:upload']"
+                type="success"
+                icon="plus"
+                @click="handleUpload"
+              >
+                上传文件
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_monitor:resource:create_dir']" type="primary" icon="folder-add" @click="handleCreateDir">新建文件夹</el-button>
+              <el-button
+                v-hasPerm="['module_monitor:resource:create_dir']"
+                type="primary"
+                icon="folder-add"
+                @click="handleCreateDir"
+              >
+                新建文件夹
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_monitor:resource:delete']" type="danger" icon="delete" :disabled="selectedItems.length === 0" @click="handleBatchDelete">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_monitor:resource:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectedItems.length === 0"
+                @click="handleBatchDelete"
+              >
+                批量删除
+              </el-button>
             </el-col>
           </el-row>
         </div>
         <div class="data-table__toolbar--right">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-checkbox v-model="showHiddenFiles" v-hasPerm="['module_monitor:resource:show_hidden']"  @change="handleShowHiddenChange">
+              <el-checkbox
+                v-model="showHiddenFiles"
+                v-hasPerm="['module_monitor:resource:show_hidden']"
+                @change="handleShowHiddenChange"
+              >
                 显示隐藏文件
               </el-checkbox>
             </el-col>
@@ -89,7 +133,13 @@
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_monitor:resource:refresh']" type="primary" icon="refresh" circle @click="handleRefresh"/>
+                <el-button
+                  v-hasPerm="['module_monitor:resource:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
           </el-row>
@@ -121,7 +171,7 @@
                 <Folder v-if="row.is_dir" />
                 <Document v-else />
               </el-icon>
-              <span 
+              <span
                 v-hasPerm="['module_monitor:resource:preview']"
                 :class="{ 'file-name-clickable': true }"
                 @click="handleFileNameClick(row)"
@@ -137,7 +187,13 @@
           </template>
         </el-table-column>
         <el-table-column label="修改时间" prop="modified_time" min-width="180" sortable />
-        <el-table-column fixed="right" label="操作" align="center" min-width="200" class="search-buttons">
+        <el-table-column
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="200"
+          class="search-buttons"
+        >
           <template #default="{ row }">
             <el-button
               v-if="!row.is_dir"
@@ -150,10 +206,24 @@
             >
               下载
             </el-button>
-            <el-button v-hasPerm="['module_monitor:resource:rename']" type="primary" size="small" link icon="edit" @click="handleRename(row)">
+            <el-button
+              v-hasPerm="['module_monitor:resource:rename']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleRename(row)"
+            >
               重命名
             </el-button>
-            <el-button v-hasPerm="['module_monitor:resource:delete']" type="danger" size="small" link icon="delete" @click="handleDelete(row)">
+            <el-button
+              v-hasPerm="['module_monitor:resource:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete(row)"
+            >
               删除
             </el-button>
           </template>
@@ -179,9 +249,9 @@
           <div class="item-name">{{ item.name }}</div>
           <div v-if="!item.is_dir" class="item-size">
             {{ formatFileSize(item.size) }}
+          </div>
         </div>
       </div>
-    </div>
 
       <!-- 分页区域 -->
       <template #footer>
@@ -211,28 +281,30 @@
       >
         <el-icon class="el-icon--upload"><UploadFilled /></el-icon>
         <div class="el-upload__text">
-          将文件拖到此处，或<em>点击上传</em>
+          将文件拖到此处，或
+          <em>点击上传</em>
         </div>
         <template #tip>
-          <div class="el-upload__tip" style="color: red;">
+          <div class="el-upload__tip" style="color: red">
             不支持多文件上传，单个文件不超过100MB，多文件上传，取最后一个文件上传
           </div>
         </template>
       </el-upload>
       <template #footer>
         <el-button @click="uploadDialogVisible = false">取消</el-button>
-        <el-button v-hasPerm="['module_monitor:resource:upload']" type="primary" :loading="uploading" @click="handleUploadConfirm">
+        <el-button
+          v-hasPerm="['module_monitor:resource:upload']"
+          type="primary"
+          :loading="uploading"
+          @click="handleUploadConfirm"
+        >
           确定上传
         </el-button>
       </template>
     </el-dialog>
 
     <!-- 新建文件夹对话框 -->
-    <el-dialog
-      v-model="createDirDialogVisible"
-      title="新建文件夹"
-      width="400px"
-    >
+    <el-dialog v-model="createDirDialogVisible" title="新建文件夹" width="400px">
       <el-form :model="createDirForm" label-width="80px">
         <el-form-item label="文件夹名" required>
           <el-input
@@ -244,16 +316,18 @@
       </el-form>
       <template #footer>
         <el-button @click="createDirDialogVisible = false">取消</el-button>
-        <el-button v-hasPerm="['module_monitor:resource:create_dir']" type="primary" @click="handleCreateDirConfirm">确定</el-button>
+        <el-button
+          v-hasPerm="['module_monitor:resource:create_dir']"
+          type="primary"
+          @click="handleCreateDirConfirm"
+        >
+          确定
+        </el-button>
       </template>
     </el-dialog>
 
     <!-- 重命名对话框 -->
-    <el-dialog
-      v-model="renameDialogVisible"
-      title="重命名"
-      width="400px"
-    >
+    <el-dialog v-model="renameDialogVisible" title="重命名" width="400px">
       <el-form :model="renameForm" label-width="80px">
         <el-form-item label="新名称" required>
           <el-input
@@ -265,7 +339,13 @@
       </el-form>
       <template #footer>
         <el-button @click="renameDialogVisible = false">取消</el-button>
-        <el-button v-hasPerm="['module_monitor:resource:rename']" type="primary" @click="handleRenameConfirm">确定</el-button>
+        <el-button
+          v-hasPerm="['module_monitor:resource:rename']"
+          type="primary"
+          @click="handleRenameConfirm"
+        >
+          确定
+        </el-button>
       </template>
     </el-dialog>
   </div>
@@ -277,66 +357,70 @@ defineOptions({
   inheritAttrs: false,
 });
 
-import { ref, reactive, onMounted, computed } from 'vue'
-import { ElMessage, ElMessageBox } from 'element-plus'
+import { ref, reactive, onMounted, computed } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
 import {
   List,
   Grid,
   Folder,
   Document,
   UploadFilled,
-  QuestionFilled
-} from '@element-plus/icons-vue'
-import { ResourceAPI, type ResourceItem, type ResourcePageQuery } from '@/api/module_monitor/resource'
+  QuestionFilled,
+} from "@element-plus/icons-vue";
+import {
+  ResourceAPI,
+  type ResourceItem,
+  type ResourcePageQuery,
+} from "@/api/module_monitor/resource";
 
 // 分页表单
-const fileList = ref<ResourceItem[]>([])
+const fileList = ref<ResourceItem[]>([]);
 
 // 响应式数据
-const loading = ref(false)
-const selectedItems = ref<ResourceItem[]>([])
-const breadcrumbList = ref([{ name: '资源根目录', path: '/' }])
-const showHiddenFiles = ref(false)
-const viewMode = ref<'list' | 'grid'>('list')
-const total = ref(0)
-const isSearchMode = ref(false) // 用于标记是否处于搜索模式
-const queryFormRef = ref()
+const loading = ref(false);
+const selectedItems = ref<ResourceItem[]>([]);
+const breadcrumbList = ref([{ name: "资源根目录", path: "/" }]);
+const showHiddenFiles = ref(false);
+const viewMode = ref<"list" | "grid">("list");
+const total = ref(0);
+const isSearchMode = ref(false); // 用于标记是否处于搜索模式
+const queryFormRef = ref();
 
 // 路径相关数据
-const currentPath = ref('/') // 当前路径的响应式变量
+const currentPath = ref("/"); // 当前路径的响应式变量
 
 // 分页查询参数
 const pagination = reactive({
   page_no: 1,
-  page_size: 10
-})
+  page_size: 10,
+});
 
 // 搜索表单数据
 const queryFormData = reactive<ResourcePageQuery>({
   name: undefined,
   page_no: 1,
-  page_size: 10
-})
+  page_size: 10,
+});
 
 // 对话框状态
-const uploadDialogVisible = ref(false)
-const createDirDialogVisible = ref(false)
-const renameDialogVisible = ref(false)
-const uploading = ref(false)
+const uploadDialogVisible = ref(false);
+const createDirDialogVisible = ref(false);
+const renameDialogVisible = ref(false);
+const uploading = ref(false);
 
 // 上传相关
-const uploadRef = ref()
-const uploadFileList = ref<any[]>([])
+const uploadRef = ref();
+const uploadFileList = ref<any[]>([]);
 
 // 表单数据
 const createDirForm = reactive({
-  dir_name: ''
-})
+  dir_name: "",
+});
 
 const renameForm = reactive({
-  new_name: '',
-  old_path: ''
-})
+  new_name: "",
+  old_path: "",
+});
 
 // 计算属性
 const currentQuery = computed(() => {
@@ -344,80 +428,80 @@ const currentQuery = computed(() => {
   const query: any = {
     include_hidden: showHiddenFiles.value,
     page_no: pagination.page_no,
-    page_size: pagination.page_size
-  }
-  
+    page_size: pagination.page_size,
+  };
+
   // 如果当前路径不是根路径，则添加路径参数
-  if (currentPath.value && currentPath.value !== '/') {
+  if (currentPath.value && currentPath.value !== "/") {
     // 对于文件夹导航，直接传递文件夹名称
-    query.path = currentPath.value
+    query.path = currentPath.value;
   }
-  
+
   // 添加搜索关键词
   if (queryFormData.name) {
-    query.name = queryFormData.name
+    query.name = queryFormData.name;
   }
-  
-  return query
-})
+
+  return query;
+});
 
 // 加载文件列表
 async function loadFileList() {
-  loading.value = true
+  loading.value = true;
   try {
-    const response = await ResourceAPI.getResourceList(currentQuery.value)
-    
+    const response = await ResourceAPI.getResourceList(currentQuery.value);
+
     // 正确处理后端返回的分页数据结构
-    const pageResult = response.data?.data
-    
+    const pageResult = response.data?.data;
+
     if (pageResult && Array.isArray(pageResult.items)) {
-      fileList.value = pageResult.items
-      total.value = pageResult.total
+      fileList.value = pageResult.items;
+      total.value = pageResult.total;
       if (pageResult.page_no !== undefined) {
-        pagination.page_no = pageResult.page_no
+        pagination.page_no = pageResult.page_no;
       }
       if (pageResult.page_size !== undefined) {
-        pagination.page_size = pageResult.page_size
+        pagination.page_size = pageResult.page_size;
       }
     } else {
-      fileList.value = []
-      total.value = 0
+      fileList.value = [];
+      total.value = 0;
     }
   } catch (error) {
-    console.error('Load file list error:', error)
-    fileList.value = []
-    total.value = 0
+    console.error("Load file list error:", error);
+    fileList.value = [];
+    total.value = 0;
   } finally {
-    loading.value = false
+    loading.value = false;
   }
 }
 
 // 面包屑点击处理
 function handleBreadcrumbClick(item: any) {
   // 更新当前路径为点击的面包屑项路径
-  currentPath.value = item.path
-  updateBreadcrumb()
-  loadFileList()
+  currentPath.value = item.path;
+  updateBreadcrumb();
+  loadFileList();
 }
 
 // 更新面包屑路径
 function updateBreadcrumb() {
   // 对于根路径，直接显示根目录
-  if (currentPath.value === '/') {
-    breadcrumbList.value = [{ name: '资源根目录', path: '/' }]
-    return
+  if (currentPath.value === "/") {
+    breadcrumbList.value = [{ name: "资源根目录", path: "/" }];
+    return;
   }
-  
+
   // 对于嵌套路径，需要分解并构建面包屑
-  const parts = currentPath.value.split('/').filter(part => part !== '')
-  
+  const parts = currentPath.value.split("/").filter((part) => part !== "");
+
   breadcrumbList.value = [
-    { name: '资源根目录', path: '/' },
+    { name: "资源根目录", path: "/" },
     ...parts.map((part, index) => ({
       name: part,
-      path: parts.slice(0, index + 1).join('/')
-    }))
-  ]
+      path: parts.slice(0, index + 1).join("/"),
+    })),
+  ];
 }
 
 // 文件名点击处理
@@ -425,16 +509,16 @@ function handleFileNameClick(row: ResourceItem) {
   if (row.is_dir) {
     // 如果当前在根路径，则直接使用文件夹名称
     // 如果当前已在某个文件夹中，则拼接路径
-    if (currentPath.value === '/') {
-      currentPath.value = row.name
+    if (currentPath.value === "/") {
+      currentPath.value = row.name;
     } else {
-      currentPath.value = currentPath.value + '/' + row.name
+      currentPath.value = currentPath.value + "/" + row.name;
     }
-    updateBreadcrumb()
-    loadFileList()
+    updateBreadcrumb();
+    loadFileList();
   } else {
     // 文件预览，使用后端返回的完整URL
-    handleFilePreview(row)
+    handleFilePreview(row);
   }
 }
 
@@ -443,259 +527,255 @@ function handleItemClick(item: ResourceItem) {
   if (item.is_dir) {
     // 如果当前在根路径，则直接使用文件夹名称
     // 如果当前已在某个文件夹中，则拼接路径
-    if (currentPath.value === '/') {
-      currentPath.value = item.name
+    if (currentPath.value === "/") {
+      currentPath.value = item.name;
     } else {
-      currentPath.value = currentPath.value + '/' + item.name
+      currentPath.value = currentPath.value + "/" + item.name;
     }
-    updateBreadcrumb()
-    loadFileList()
+    updateBreadcrumb();
+    loadFileList();
   } else {
     // 文件预览，使用后端返回的完整URL
-    handleFilePreview(item)
+    handleFilePreview(item);
   }
 }
 
 // 文件预览
 function handleFilePreview(file: ResourceItem) {
   // 直接使用file_url字段进行预览
-  let previewUrl = file.file_url
-  
+  let previewUrl = file.file_url;
+
   // 如果是相对路径，构建完整URL
-  if (previewUrl && !previewUrl.startsWith('http')) {
-    previewUrl = `${window.location.origin}${previewUrl}`
+  if (previewUrl && !previewUrl.startsWith("http")) {
+    previewUrl = `${window.location.origin}${previewUrl}`;
   }
-  
+
   // 所有文件类型统一直接打开预览
-  window.open(previewUrl, '_blank')
+  window.open(previewUrl, "_blank");
 }
 
 // 选择项变化处理
 function handleSelectionChange(selection: ResourceItem[]) {
-  selectedItems.value = selection
+  selectedItems.value = selection;
 }
 
 // 打开上传对话框
 function handleUpload() {
-  uploadDialogVisible.value = true
-  uploadFileList.value = []
+  uploadDialogVisible.value = true;
+  uploadFileList.value = [];
 }
 
 // 上传文件变化处理
 function handleUploadChange(file: any, fileList: any[]) {
-  uploadFileList.value = fileList
+  uploadFileList.value = fileList;
 }
 
 // 确认上传文件
 async function handleUploadConfirm() {
   if (uploadFileList.value.length === 0) {
-    ElMessage.warning('请选择要上传的文件')
-    return
+    ElMessage.warning("请选择要上传的文件");
+    return;
   }
 
   try {
-    uploading.value = true
-    const formData = new FormData()
+    uploading.value = true;
+    const formData = new FormData();
     uploadFileList.value.forEach((file: any) => {
-      formData.append('file', file.raw)
-    })
-    
-    // 在根目录时传递空字符串作为target_path，与后端relative_path格式保持一致
-    const targetPath = currentPath.value === '/' ? '' : currentPath.value
-    formData.append('target_path', targetPath)
+      formData.append("file", file.raw);
+    });
 
-    await ResourceAPI.uploadFile(formData)
-    uploadDialogVisible.value = false
-    loadFileList()
+    // 在根目录时传递空字符串作为target_path，与后端relative_path格式保持一致
+    const targetPath = currentPath.value === "/" ? "" : currentPath.value;
+    formData.append("target_path", targetPath);
+
+    await ResourceAPI.uploadFile(formData);
+    uploadDialogVisible.value = false;
+    loadFileList();
   } catch (error) {
-    console.error('Upload error:', error)
+    console.error("Upload error:", error);
   } finally {
-    uploading.value = false
+    uploading.value = false;
   }
 }
 
 // 关闭上传对话框
 function handleUploadClose() {
-  uploadDialogVisible.value = false
-  uploadFileList.value = []
+  uploadDialogVisible.value = false;
+  uploadFileList.value = [];
 }
 
 // 打开新建目录对话框
 function handleCreateDir() {
-  createDirForm.dir_name = ''
-  createDirDialogVisible.value = true
+  createDirForm.dir_name = "";
+  createDirDialogVisible.value = true;
 }
 
 // 确认创建目录
 async function handleCreateDirConfirm() {
   if (!createDirForm.dir_name.trim()) {
-    ElMessage.warning('请输入文件夹名称')
-    return
+    ElMessage.warning("请输入文件夹名称");
+    return;
   }
 
   try {
     // 在根目录时传递空字符串作为parent_path，与后端relative_path格式保持一致
-    const parentPath = currentPath.value === '/' ? '' : currentPath.value
+    const parentPath = currentPath.value === "/" ? "" : currentPath.value;
     await ResourceAPI.createDirectory({
       parent_path: parentPath,
-      dir_name: createDirForm.dir_name.trim()
-    })
-    createDirDialogVisible.value = false
-    loadFileList()
+      dir_name: createDirForm.dir_name.trim(),
+    });
+    createDirDialogVisible.value = false;
+    loadFileList();
   } catch (error) {
-    console.error('Create directory error:', error)
+    console.error("Create directory error:", error);
   }
 }
 
 // 列表刷新
 async function handleRefresh() {
-  await loadFileList()
+  await loadFileList();
 }
 
 // 查询（重置页码后获取数据）
 async function handleQuery() {
-  queryFormData.page_no = 1
-  await loadFileList()
+  queryFormData.page_no = 1;
+  await loadFileList();
 }
 
 // 重置查询
 async function handleResetQuery() {
-  queryFormRef.value.resetFields()
-  queryFormData.page_no = 1
-  isSearchMode.value = false // 退出搜索模式
-  await loadFileList()
+  queryFormRef.value.resetFields();
+  queryFormData.page_no = 1;
+  isSearchMode.value = false; // 退出搜索模式
+  await loadFileList();
 }
 
 // 显示隐藏文件切换
 function handleShowHiddenChange() {
-  loadFileList()
+  loadFileList();
 }
 
 // 文件下载
 async function handleDownload(item: ResourceItem) {
   try {
     // 使用file_url字段
-    const response = await ResourceAPI.downloadFile(item.file_url)
-    const blob = response.data
-    const url = window.URL.createObjectURL(blob)
-    const a = document.createElement('a')
-    a.href = url
-    a.download = item.name
-    document.body.appendChild(a)
-    a.click()
-    document.body.removeChild(a)
-    window.URL.revokeObjectURL(url)
+    const response = await ResourceAPI.downloadFile(item.file_url);
+    const blob = response.data;
+    const url = window.URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = item.name;
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+    window.URL.revokeObjectURL(url);
   } catch (error) {
-    console.error('Download error:', error)
+    console.error("Download error:", error);
   }
 }
 
 // 打开重命名对话框
 function handleRename(item: ResourceItem) {
   // 使用file_url字段
-  renameForm.old_path = item.file_url
-  renameForm.new_name = item.name
-  renameDialogVisible.value = true
+  renameForm.old_path = item.file_url;
+  renameForm.new_name = item.name;
+  renameDialogVisible.value = true;
 }
 
 // 确认重命名
 async function handleRenameConfirm() {
   if (!renameForm.new_name.trim()) {
-    ElMessage.warning('请输入新名称')
-    return
+    ElMessage.warning("请输入新名称");
+    return;
   }
 
   try {
     await ResourceAPI.renameResource({
       old_path: renameForm.old_path,
-      new_name: renameForm.new_name.trim()
-    })
-    renameDialogVisible.value = false
-    loadFileList()
+      new_name: renameForm.new_name.trim(),
+    });
+    renameDialogVisible.value = false;
+    loadFileList();
   } catch (error) {
-    console.error('Rename error:', error)
+    console.error("Rename error:", error);
   }
 }
 
 // 文件删除
 async function handleDelete(item: ResourceItem) {
   try {
-    await ElMessageBox.confirm(
-      `确定要删除 ${item.name} 吗？`,
-      '确认删除',
-      {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }
-    )
+    await ElMessageBox.confirm(`确定要删除 ${item.name} 吗？`, "确认删除", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    });
 
     // 使用file_url字段
-    await ResourceAPI.deleteResource([item.file_url])
-      loadFileList()
-    } catch (error) {
-      if (error !== 'cancel') {
-        console.error('Delete error:', error)
-      }
+    await ResourceAPI.deleteResource([item.file_url]);
+    loadFileList();
+  } catch (error) {
+    if (error !== "cancel") {
+      console.error("Delete error:", error);
+    }
   }
 }
 
 // 分页处理
 function handlePagination(params: { page: number; limit: number }) {
-  pagination.page_no = params.page
-  pagination.page_size = params.limit
-  loadFileList()
+  pagination.page_no = params.page;
+  pagination.page_size = params.limit;
+  loadFileList();
 }
 
 // 批量删除
 async function handleBatchDelete() {
   if (selectedItems.value.length === 0) {
-    ElMessage.warning('请选择要删除的文件')
-    return
+    ElMessage.warning("请选择要删除的文件");
+    return;
   }
 
   try {
     await ElMessageBox.confirm(
       `确定要删除选中的 ${selectedItems.value.length} 个文件吗？`,
-      '确认删除',
+      "确认删除",
       {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
       }
-    )
+    );
 
     // 使用file_url字段
-    const paths = selectedItems.value.map(item => item.file_url)
-    
-    await ResourceAPI.deleteResource(paths)
-    loadFileList()
+    const paths = selectedItems.value.map((item) => item.file_url);
+
+    await ResourceAPI.deleteResource(paths);
+    loadFileList();
   } catch (error) {
-    if (error !== 'cancel') {
-      console.error('Batch delete error:', error)
+    if (error !== "cancel") {
+      console.error("Batch delete error:", error);
     }
   }
 }
 
 // 格式化文件大小
 function formatFileSize(size?: number | null) {
-  if (!size || size === null) return '-'  
-  const units = ['B', 'KB', 'MB', 'GB', 'TB']
-  let unitIndex = 0
-  let fileSize = size
+  if (!size || size === null) return "-";
+  const units = ["B", "KB", "MB", "GB", "TB"];
+  let unitIndex = 0;
+  let fileSize = size;
 
   while (fileSize >= 1024 && unitIndex < units.length - 1) {
-    fileSize /= 1024
-    unitIndex++
+    fileSize /= 1024;
+    unitIndex++;
   }
 
-  return `${fileSize.toFixed(1)} ${units[unitIndex]}`
+  return `${fileSize.toFixed(1)} ${units[unitIndex]}`;
 }
 
 // 生命周期
 onMounted(() => {
-  loadFileList()
-})
+  loadFileList();
+});
 </script>
 
 <style lang="scss" scoped>
@@ -713,7 +793,7 @@ onMounted(() => {
     .file-name-clickable {
       cursor: pointer;
       color: var(--el-color-primary);
-      
+
       &:hover {
         color: var(--el-color-primary-light-3);
         text-decoration: underline;
@@ -727,7 +807,7 @@ onMounted(() => {
   grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
   height: calc(100vh - 200px);
   gap: 20px;
-  
+
   .grid-item {
     display: flex;
     flex-direction: column;
@@ -750,7 +830,7 @@ onMounted(() => {
   &.is-link {
     cursor: pointer;
     color: var(--el-color-primary);
-    
+
     &:hover {
       color: var(--el-color-primary-light-3);
     }
diff --git a/frontend/src/views/module_monitor/server/index.vue b/frontend/src/views/module_monitor/server/index.vue
index 80bd8347..e8490283 100644
--- a/frontend/src/views/module_monitor/server/index.vue
+++ b/frontend/src/views/module_monitor/server/index.vue
@@ -1,11 +1,11 @@
 <template>
-  <div class="app-container" >
+  <div class="app-container">
     <el-row :gutter="16">
       <el-col :span="12" class="mb-4">
-        <el-card :loading="loading"  shadow="hover">
+        <el-card :loading="loading" shadow="hover">
           <template #header>
             <div class="flex items-center gap-2">
-              <el-icon><Cpu/></el-icon>
+              <el-icon><Cpu /></el-icon>
               <span class="flex items-center gap-2">CPU使用情况</span>
               <el-tooltip content="展示CPU核心数及使用率">
                 <el-icon><QuestionFilled /></el-icon>
@@ -19,18 +19,23 @@
                 <span>核心数</span>
                 <el-tooltip :content="(server.cpu?.cpu_num || 0).toFixed(1)">
                   <div class="text-center mb-4">
-                    <el-progress 
+                    <el-progress
                       type="circle"
                       :percentage="100"
-                      :format="() => `${server.cpu?.cpu_num || 0}`" 
+                      :format="() => `${server.cpu?.cpu_num || 0}`"
                     />
-
                   </div>
                 </el-tooltip>
                 <el-descriptions :column="1" border>
-                  <el-descriptions-item label="总核心数" >{{server.cpu?.cpu_num || 0}}</el-descriptions-item>
-                  <el-descriptions-item label="已用核心" >{{Math.floor((server.cpu?.used || 0) * server.cpu?.cpu_num / 100)}}</el-descriptions-item>
-                  <el-descriptions-item label="空闲核心" >{{Math.floor((server.cpu?.free || 0) * server.cpu?.cpu_num / 100)}}</el-descriptions-item>
+                  <el-descriptions-item label="总核心数">
+                    {{ server.cpu?.cpu_num || 0 }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="已用核心">
+                    {{ Math.floor(((server.cpu?.used || 0) * server.cpu?.cpu_num) / 100) }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="空闲核心">
+                    {{ Math.floor(((server.cpu?.free || 0) * server.cpu?.cpu_num) / 100) }}
+                  </el-descriptions-item>
                 </el-descriptions>
               </el-card>
             </el-col>
@@ -40,17 +45,29 @@
                 <span>使用率</span>
                 <el-tooltip :content="(server.cpu?.used || 0).toFixed(1) + '%'">
                   <div class="text-center mb-4">
-                    <el-progress 
-                      type="circle" 
-                      :percentage="server.cpu?.used || 0" 
-                      :status="server.cpu?.used > 80 ? 'exception' : server.cpu?.used > 60 ? 'warning' : 'success'"
+                    <el-progress
+                      type="circle"
+                      :percentage="server.cpu?.used || 0"
+                      :status="
+                        server.cpu?.used > 80
+                          ? 'exception'
+                          : server.cpu?.used > 60
+                            ? 'warning'
+                            : 'success'
+                      "
                     />
                   </div>
                 </el-tooltip>
                 <el-descriptions :column="1" border>
-                  <el-descriptions-item label="用户使用率" >{{(server.cpu?.used || 0).toFixed(1) + '%'}}</el-descriptions-item>
-                  <el-descriptions-item label="系统使用率" >{{(server.cpu?.sys || 0).toFixed(1) + '%'}}</el-descriptions-item>
-                  <el-descriptions-item label="当前空闲率" >{{(server.cpu?.free || 0).toFixed(1) + '%'}}</el-descriptions-item>
+                  <el-descriptions-item label="用户使用率">
+                    {{ (server.cpu?.used || 0).toFixed(1) + "%" }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="系统使用率">
+                    {{ (server.cpu?.sys || 0).toFixed(1) + "%" }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="当前空闲率">
+                    {{ (server.cpu?.free || 0).toFixed(1) + "%" }}
+                  </el-descriptions-item>
                 </el-descriptions>
               </el-card>
             </el-col>
@@ -59,7 +76,7 @@
       </el-col>
 
       <el-col :span="12" class="mb-4">
-        <el-card :loading="loading"  shadow="hover">
+        <el-card :loading="loading" shadow="hover">
           <template #header>
             <div class="flex items-center gap-2">
               <el-icon><Memo /></el-icon>
@@ -76,17 +93,29 @@
                 <span>系统内存</span>
                 <el-tooltip :content="(server.mem?.usage || 0).toFixed(1) + '%'">
                   <div class="text-center mb-4">
-                    <el-progress 
-                      type="circle" 
-                      :percentage="server.mem?.usage || 0" 
-                      :status="server.mem?.usage > 80 ? 'exception' : server.mem?.usage > 60 ? 'warning' : 'success'"
+                    <el-progress
+                      type="circle"
+                      :percentage="server.mem?.usage || 0"
+                      :status="
+                        server.mem?.usage > 80
+                          ? 'exception'
+                          : server.mem?.usage > 60
+                            ? 'warning'
+                            : 'success'
+                      "
                     />
                   </div>
                 </el-tooltip>
                 <el-descriptions :column="1" border>
-                  <el-descriptions-item label="总内存" >{{server.mem?.total}}</el-descriptions-item>
-                  <el-descriptions-item label="已用内存" >{{server.mem?.used}}</el-descriptions-item>
-                  <el-descriptions-item label="空闲内存" >{{server.mem?.free}}</el-descriptions-item>
+                  <el-descriptions-item label="总内存">
+                    {{ server.mem?.total }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="已用内存">
+                    {{ server.mem?.used }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="空闲内存">
+                    {{ server.mem?.free }}
+                  </el-descriptions-item>
                 </el-descriptions>
               </el-card>
             </el-col>
@@ -96,17 +125,29 @@
                 <span>Python内存</span>
                 <el-tooltip :content="(server.py?.memory_usage || 0).toFixed(1) + '%'">
                   <div class="text-center mb-4">
-                    <el-progress 
-                      type="circle" 
-                      :percentage="server.py?.memory_usage || 0" 
-                      :status="server.py?.memory_usage > 80 ? 'exception' : server.py?.memory_usage > 60 ? 'warning' : 'success'"
+                    <el-progress
+                      type="circle"
+                      :percentage="server.py?.memory_usage || 0"
+                      :status="
+                        server.py?.memory_usage > 80
+                          ? 'exception'
+                          : server.py?.memory_usage > 60
+                            ? 'warning'
+                            : 'success'
+                      "
                     />
                   </div>
                 </el-tooltip>
                 <el-descriptions :column="1" border>
-                  <el-descriptions-item label="总内存" >{{server.py?.memory_total}}</el-descriptions-item>
-                  <el-descriptions-item label="已用内存" >{{server.py?.memory_used}}</el-descriptions-item>
-                  <el-descriptions-item label="空闲内存" >{{server.py?.memory_free}}</el-descriptions-item>
+                  <el-descriptions-item label="总内存">
+                    {{ server.py?.memory_total }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="已用内存">
+                    {{ server.py?.memory_used }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="空闲内存">
+                    {{ server.py?.memory_free }}
+                  </el-descriptions-item>
                 </el-descriptions>
               </el-card>
             </el-col>
@@ -115,7 +156,7 @@
       </el-col>
 
       <el-col :span="24" class="mb-4">
-        <el-card :loading="loading" >
+        <el-card :loading="loading">
           <template #header>
             <div class="flex items-center gap-2">
               <el-icon><Monitor /></el-icon>
@@ -126,16 +167,24 @@
             </div>
           </template>
           <el-descriptions :column="2" border>
-            <el-descriptions-item label="服务器名称">{{ server.sys?.computer_name || '-' }}</el-descriptions-item>
-            <el-descriptions-item label="操作系统">{{ server.sys?.os_name || '-' }}</el-descriptions-item>
-            <el-descriptions-item label="服务器IP">{{ server.sys?.computer_ip || '-' }}</el-descriptions-item>
-            <el-descriptions-item label="系统架构">{{ server.sys?.os_arch || '-' }}</el-descriptions-item>
+            <el-descriptions-item label="服务器名称">
+              {{ server.sys?.computer_name || "-" }}
+            </el-descriptions-item>
+            <el-descriptions-item label="操作系统">
+              {{ server.sys?.os_name || "-" }}
+            </el-descriptions-item>
+            <el-descriptions-item label="服务器IP">
+              {{ server.sys?.computer_ip || "-" }}
+            </el-descriptions-item>
+            <el-descriptions-item label="系统架构">
+              {{ server.sys?.os_arch || "-" }}
+            </el-descriptions-item>
           </el-descriptions>
         </el-card>
       </el-col>
 
       <el-col :span="24" class="mb-4">
-        <el-card :loading="loading"  class="shadow-sm">
+        <el-card :loading="loading" class="shadow-sm">
           <template #header>
             <div class="flex items-center gap-2">
               <el-icon><Dish /></el-icon>
@@ -146,12 +195,24 @@
             </div>
           </template>
           <el-descriptions :column="3" border>
-            <el-descriptions-item label="Python名称">{{ server.py?.name || '-' }}</el-descriptions-item>
-            <el-descriptions-item label="Python版本">{{ server.py?.version || '-' }}</el-descriptions-item>
-            <el-descriptions-item label="启动时间">{{ server.py?.start_time || '-' }}</el-descriptions-item>
-            <el-descriptions-item label="运行时长">{{ server.py?.run_time || '-' }}</el-descriptions-item>
-            <el-descriptions-item label="安装路径">{{ server.py?.home || '-' }}</el-descriptions-item>
-            <el-descriptions-item label="项目路径">{{ server.sys?.user_dir || '-' }}</el-descriptions-item>
+            <el-descriptions-item label="Python名称">
+              {{ server.py?.name || "-" }}
+            </el-descriptions-item>
+            <el-descriptions-item label="Python版本">
+              {{ server.py?.version || "-" }}
+            </el-descriptions-item>
+            <el-descriptions-item label="启动时间">
+              {{ server.py?.start_time || "-" }}
+            </el-descriptions-item>
+            <el-descriptions-item label="运行时长">
+              {{ server.py?.run_time || "-" }}
+            </el-descriptions-item>
+            <el-descriptions-item label="安装路径">
+              {{ server.py?.home || "-" }}
+            </el-descriptions-item>
+            <el-descriptions-item label="项目路径">
+              {{ server.sys?.user_dir || "-" }}
+            </el-descriptions-item>
           </el-descriptions>
         </el-card>
       </el-col>
@@ -169,35 +230,19 @@
               </el-tooltip>
             </div>
           </template>
-          <el-table :data="server.disks" border >
+          <el-table :data="server.disks" border>
             <template #empty>
               <el-empty :image-size="80" description="暂无数据" />
             </template>
-            <el-table-column 
-              label="盘符路径" 
-              prop="dir_name" 
-              :show-overflow-tooltip="true"
-            />
-            <el-table-column 
-              label="文件系统" 
-              prop="sys_type_name" 
-              align="center"
-              width="100"
-            />
-            <el-table-column 
-              label="盘符名称" 
-              prop="type_name" 
-            />
-            <el-table-column 
-              prop="usage" 
-              label="使用率" 
-              align="center" 
-            >
+            <el-table-column label="盘符路径" prop="dir_name" :show-overflow-tooltip="true" />
+            <el-table-column label="文件系统" prop="sys_type_name" align="center" width="100" />
+            <el-table-column label="盘符名称" prop="type_name" />
+            <el-table-column prop="usage" label="使用率" align="center">
               <template #default="{ row }">
                 <!-- 使用 element-plus 的 Progress 组件 -->
                 <div>
-                  <el-progress 
-                    :percentage="Number(row.usage)" 
+                  <el-progress
+                    :percentage="Number(row.usage)"
                     :status="row.usage > 80 ? 'exception' : row.usage > 60 ? 'warning' : 'success'"
                     :text-inside="true"
                     :stroke-width="16"
@@ -205,24 +250,9 @@
                 </div>
               </template>
             </el-table-column>
-            <el-table-column 
-              label="总大小" 
-              prop="total" 
-              align="center"
-              width="100"
-            />
-            <el-table-column 
-              label="可用大小" 
-              prop="free" 
-              align="center"
-              width="100"
-            />
-            <el-table-column 
-              label="已用大小" 
-              prop="used" 
-              align="center"
-              width="100"
-            />
+            <el-table-column label="总大小" prop="total" align="center" width="100" />
+            <el-table-column label="可用大小" prop="free" align="center" width="100" />
+            <el-table-column label="已用大小" prop="used" align="center" width="100" />
           </el-table>
         </el-card>
       </el-col>
@@ -231,8 +261,7 @@
 </template>
 
 <script lang="ts" setup>
-import ServerAPI, {type ServerInfo } from '@/api/module_monitor/server'
-
+import ServerAPI, { type ServerInfo } from "@/api/module_monitor/server";
 
 const loading = ref(false);
 const server = ref<ServerInfo>({
@@ -240,33 +269,33 @@ const server = ref<ServerInfo>({
     cpu_num: 0,
     used: 0,
     sys: 0,
-    free: 0
+    free: 0,
   },
   mem: {
-    total: '',
-    used: '',
-    free: '',
-    usage: 0
+    total: "",
+    used: "",
+    free: "",
+    usage: 0,
   },
   sys: {
-    computer_name: '',
-    os_name: '',
-    computer_ip: '',
-    os_arch: '',
-    user_dir: ''
+    computer_name: "",
+    os_name: "",
+    computer_ip: "",
+    os_arch: "",
+    user_dir: "",
   },
   py: {
-    name: '',
-    version: '',
-    start_time: '',
-    run_time: '',
-    home: '',
-    memory_total: '',
-    memory_used: '',
-    memory_free: '',
-    memory_usage: 0
+    name: "",
+    version: "",
+    start_time: "",
+    run_time: "",
+    home: "",
+    memory_total: "",
+    memory_used: "",
+    memory_free: "",
+    memory_usage: 0,
   },
-  disks: []
+  disks: [],
 });
 
 async function getList() {
@@ -275,7 +304,7 @@ async function getList() {
     const response = await ServerAPI.getServer();
     server.value = response.data.data;
   } catch (error) {
-    console.error('获取服务器信息失败:', error);
+    console.error("获取服务器信息失败:", error);
   } finally {
     loading.value = false;
   }
diff --git a/frontend/src/views/module_system/auth/components/Login.vue b/frontend/src/views/module_system/auth/components/Login.vue
index 73575a66..b892e58b 100644
--- a/frontend/src/views/module_system/auth/components/Login.vue
+++ b/frontend/src/views/module_system/auth/components/Login.vue
@@ -39,12 +39,17 @@
       <!-- 验证码 -->
       <el-form-item v-if="captchaState.enable" prop="captcha">
         <div flex>
-          <el-input v-model.trim="loginForm.captcha" :placeholder="t('login.captchaCode')" clearable @keyup.enter="handleLoginSubmit" >
+          <el-input
+            v-model.trim="loginForm.captcha"
+            :placeholder="t('login.captchaCode')"
+            clearable
+            @keyup.enter="handleLoginSubmit"
+          >
             <template #prefix>
               <div class="i-svg:captcha" />
             </template>
           </el-input>
-          <div cursor-pointer flex-center ml-10px  >
+          <div cursor-pointer flex-center ml-10px>
             <el-icon v-if="codeLoading" class="is-loading">
               <Loading />
             </el-icon>
@@ -104,7 +109,7 @@ import type { FormInstance } from "element-plus";
 import { LocationQuery, RouteLocationRaw, useRoute, useRouter } from "vue-router";
 import { useI18n } from "vue-i18n";
 import { onActivated, onMounted, watch } from "vue";
-import AuthAPI, {type LoginFormData, type CaptchaInfo } from "@/api/module_system/auth";
+import AuthAPI, { type LoginFormData, type CaptchaInfo } from "@/api/module_system/auth";
 import { useAppStore, useUserStore, useSettingsStore } from "@/store";
 import CommonWrapper from "@/components/CommonWrapper/index.vue";
 
@@ -126,7 +131,7 @@ onMounted(() => getCaptcha());
 onActivated(() => {
   getCaptcha();
   // 重置登录表单
-  loginForm.captcha = '';
+  loginForm.captcha = "";
 });
 
 // 监听路由变化，确保每次进入登录页面都有最新验证码
@@ -134,7 +139,7 @@ watch(
   () => route.fullPath,
   () => {
     getCaptcha();
-    loginForm.captcha = '';
+    loginForm.captcha = "";
   }
 );
 
@@ -143,7 +148,6 @@ const loading = ref(false);
 // 是否大写锁定
 const isCapsLock = ref(false);
 
-
 const loginForm = reactive<LoginFormData>({
   username: "",
   password: "",
@@ -157,10 +161,10 @@ const loginForm = reactive<LoginFormData>({
 watch(
   () => [props.presetUsername, props.presetPassword],
   ([presetUsername, presetPassword]) => {
-    if (typeof presetUsername === 'string') {
+    if (typeof presetUsername === "string") {
       loginForm.username = presetUsername;
     }
-    if (typeof presetPassword === 'string') {
+    if (typeof presetPassword === "string") {
       loginForm.password = presetPassword;
     }
   },
@@ -170,7 +174,7 @@ watch(
 const captchaState = reactive<CaptchaInfo>({
   enable: true,
   key: "",
-  img_base: ""
+  img_base: "",
 });
 
 const loginRules = computed(() => {
@@ -209,7 +213,7 @@ const codeLoading = ref(false);
 async function getCaptcha() {
   try {
     codeLoading.value = true;
-    const response = await AuthAPI.getCaptcha()
+    const response = await AuthAPI.getCaptcha();
     loginForm.captcha_key = response.data.data.key;
     captchaState.img_base = response.data.data.img_base;
   } finally {
@@ -241,17 +245,15 @@ async function handleLoginSubmit() {
     // 4. 记住我功能已实现，根据用户选择决定token的存储方式:
     // - 选中"记住我": token存储在localStorage中，浏览器关闭后仍然有效
     // - 未选中"记住我": token存储在sessionStorage中，浏览器关闭后失效
-    
+
     // 登录成功后自动开启项目引导
     if (settingsStore.showGuide) {
       appStore.showGuide(true);
     }
-
   } catch (error: any) {
     if (error) {
       getCaptcha(); // 刷新验证码
     }
-
   } finally {
     loading.value = false;
   }
@@ -295,8 +297,6 @@ const emit = defineEmits(["update:modelValue"]);
 function toOtherForm(type: "register" | "resetPwd") {
   emit("update:modelValue", type);
 }
-
-
 </script>
 
 <style lang="scss" scoped>
diff --git a/frontend/src/views/module_system/auth/components/Register.vue b/frontend/src/views/module_system/auth/components/Register.vue
index e2b7bc89..c801eff2 100644
--- a/frontend/src/views/module_system/auth/components/Register.vue
+++ b/frontend/src/views/module_system/auth/components/Register.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <h3 text-center m-0 mb-20px>{{ t("login.reg") }}</h3>
-    <el-form ref="formRef" :model="model" :rules="rules" size="large"  label-suffix=":" >      
+    <el-form ref="formRef" :model="model" :rules="rules" size="large" label-suffix=":">
       <!-- 账号 -->
       <el-form-item prop="username">
         <el-input v-model.trim="model.username" :placeholder="t('login.username')" clearable>
@@ -49,11 +49,17 @@
         </el-form-item>
       </el-tooltip>
 
-      
       <el-form-item>
         <div class="flex-y-center w-full gap-10px">
           <el-checkbox v-model="isRead">{{ t("login.agree") }}</el-checkbox>
-          <el-link type="primary" underline="never" :href="configStore.configData.sys_web_clause.config_value" target="_blank">{{ t("login.userAgreement") }}</el-link>
+          <el-link
+            type="primary"
+            underline="never"
+            :href="configStore.configData.sys_web_clause.config_value"
+            target="_blank"
+          >
+            {{ t("login.userAgreement") }}
+          </el-link>
         </div>
       </el-form-item>
 
@@ -81,9 +87,11 @@ const { t } = useI18n();
 
 // 使用 defineModel 简化具名 v-model 绑定
 const modelValue = defineModel<string>();
-const presetUsername = defineModel<string>('presetUsername');
-const presetPassword = defineModel<string>('presetPassword');
-const toLogin = () => { modelValue.value = 'login'; };
+const presetUsername = defineModel<string>("presetUsername");
+const presetPassword = defineModel<string>("presetPassword");
+const toLogin = () => {
+  modelValue.value = "login";
+};
 
 const configStore = useConfigStore();
 
@@ -92,7 +100,6 @@ const loading = ref(false); // 按钮 loading 状态
 const isCapsLock = ref(false); // 是否大写锁定
 const isRead = ref(false);
 
-
 const model = ref<RegisterForm>({
   username: "",
   password: "",
@@ -150,7 +157,6 @@ function checkCapsLock(event: KeyboardEvent) {
   }
 }
 
-
 const submit = async () => {
   try {
     // 0. 检查是否已勾选协议
@@ -164,12 +170,11 @@ const submit = async () => {
 
     loading.value = true;
 
-    await UserAPI.registerUser(model.value)
+    await UserAPI.registerUser(model.value);
     // 注册成功后，双向绑定回写父容器的用户名和密码，并切回登录
     presetUsername.value = model.value.username;
     presetPassword.value = model.value.password;
     toLogin();
-
   } catch (error) {
     console.error(error);
   } finally {
@@ -177,6 +182,5 @@ const submit = async () => {
   }
 };
 
-onMounted(() => {
-});
+onMounted(() => {});
 </script>
diff --git a/frontend/src/views/module_system/auth/components/ResetPwd.vue b/frontend/src/views/module_system/auth/components/ResetPwd.vue
index 7324a27e..a7ee49fc 100644
--- a/frontend/src/views/module_system/auth/components/ResetPwd.vue
+++ b/frontend/src/views/module_system/auth/components/ResetPwd.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <h3 text-center m-0 mb-20px>{{ t("login.resetPassword") }}</h3>
-    <el-form ref="formRef" :model="model" :rules="rules" size="large"  label-suffix=":">
+    <el-form ref="formRef" :model="model" :rules="rules" size="large" label-suffix=":">
       <!-- 用户名 -->
       <el-form-item prop="username">
         <el-input v-model.trim="model.username" :placeholder="t('login.username')" clearable>
@@ -75,9 +75,11 @@ const { t } = useI18n();
 
 // 使用 defineModel 简化具名 v-model 绑定
 const modelValue = defineModel<string>();
-const presetUsername = defineModel<string>('presetUsername');
-const presetPassword = defineModel<string>('presetPassword');
-const toLogin = () => { modelValue.value = 'login'; };
+const presetUsername = defineModel<string>("presetUsername");
+const presetPassword = defineModel<string>("presetPassword");
+const toLogin = () => {
+  modelValue.value = "login";
+};
 
 const model = ref<ForgetPasswordForm>({
   username: "",
@@ -145,12 +147,11 @@ const submit = async () => {
 
     loading.value = true;
 
-    await UserAPI.forgetPassword(model.value)
+    await UserAPI.forgetPassword(model.value);
     // 重置成功后，双向绑定回写父容器的用户名和新密码，并切回登录
     presetUsername.value = model.value.username;
     presetPassword.value = model.value.new_password;
     toLogin();
-
   } catch (error) {
     console.error(error);
   } finally {
diff --git a/frontend/src/views/module_system/auth/index.vue b/frontend/src/views/module_system/auth/index.vue
index 99cb5f1b..a0c573b2 100644
--- a/frontend/src/views/module_system/auth/index.vue
+++ b/frontend/src/views/module_system/auth/index.vue
@@ -1,5 +1,12 @@
 <template>
-  <div class="login-container" :style="{ 'background-image': configStore.configData?.sys_login_background?.config_value ? `url(${configStore.configData.sys_login_background.config_value})` : '/background.svg' }">
+  <div
+    class="login-container"
+    :style="{
+      'background-image': configStore.configData?.sys_login_background?.config_value
+        ? `url(${configStore.configData.sys_login_background.config_value})`
+        : '/background.svg',
+    }"
+  >
     <!-- 右侧切换主题、语言按钮  -->
     <div class="action-bar">
       <el-tooltip :content="t('login.themeToggle')" placement="bottom">
@@ -26,11 +33,17 @@
           <!-- 标题 -->
           <!-- 添加小图标用于显示提示信息 -->
           <div class="flex items-center justify-center mb-4">
-            <el-tooltip :content="configStore.configData.sys_web_description.config_value" placement="bottom">
+            <el-tooltip
+              :content="configStore.configData.sys_web_description.config_value"
+              placement="bottom"
+            >
               <el-icon class="cursor-help"><QuestionFilled /></el-icon>
             </el-tooltip>
             <div class="ml-2 text-xl font-bold">
-              <el-badge :value="`v ${configStore.configData.sys_web_version.config_value}`" type="success">
+              <el-badge
+                :value="`v ${configStore.configData.sys_web_version.config_value}`"
+                type="success"
+              >
                 {{ configStore.configData.sys_web_title.config_value }}
               </el-badge>
             </div>
@@ -50,7 +63,9 @@
       </div>
       <!-- 登录页底部版权 -->
       <el-text size="small" class="py-2.5! fixed bottom-0 text-center">
-        <a :href="configStore.configData.sys_git_code.config_value" target="_blank">{{ configStore.configData.sys_web_copyright.config_value }} |</a>
+        <a :href="configStore.configData.sys_git_code.config_value" target="_blank">
+          {{ configStore.configData.sys_web_copyright.config_value }} |
+        </a>
         <a :href="configStore.configData.sys_help_doc.config_value" target="_blank">帮助 |</a>
         <a :href="configStore.configData.sys_web_privacy.config_value" target="_blank">隐私 |</a>
         <a :href="configStore.configData.sys_web_clause.config_value" target="_blank">条款</a>
@@ -81,7 +96,10 @@ const formComponents = {
 };
 
 // 预填登录信息（通过具名 v-model 双向绑定传递）
-const loginPreset = reactive<{ username: string; password: string }>({ username: "admin", password: "123456" });
+const loginPreset = reactive<{ username: string; password: string }>({
+  username: "admin",
+  password: "123456",
+});
 
 onMounted(() => {
   configStore.getConfig();
@@ -145,6 +163,4 @@ onMounted(() => {
   opacity: 0;
   transform: translateX(30px);
 }
-
-
 </style>
diff --git a/frontend/src/views/module_system/dept/index.vue b/frontend/src/views/module_system/dept/index.vue
index 0b6d4cff..c2d7f367 100644
--- a/frontend/src/views/module_system/dept/index.vue
+++ b/frontend/src/views/module_system/dept/index.vue
@@ -3,27 +3,48 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery" >
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="name" label="部门名称">
           <el-input v-model="queryFormData.name" placeholder="请输入部门名称" clearable />
         </el-form-item>
         <el-form-item prop="status" label="状态">
-          <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option value="true" label="启用" />
             <el-option value="false" label="停用" />
           </el-select>
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_system:dept:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_system:dept:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_system:dept:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_system:dept:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
           <!-- 展开/收起 -->
           <template v-if="isExpandable">
             <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
@@ -60,18 +81,39 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:dept:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
+              <el-button
+                v-hasPerm="['module_system:dept:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:dept:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_system:dept:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-dropdown v-hasPerm="['module_system:dept:patch']" trigger="click">
-                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">更多</el-button>
+                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">
+                  更多
+                </el-button>
                 <template #dropdown>
                   <el-dropdown-menu>
-                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
+                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                      批量启用
+                    </el-dropdown-item>
+                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                      批量停用
+                    </el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -82,7 +124,7 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button type="primary" icon="refresh" circle @click="handleRefresh"/>
+                <el-button type="primary" icon="refresh" circle @click="handleRefresh" />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -102,60 +144,195 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" row-key="id" :data="pageTableData" :tree-props="{children: 'children', hasChildren: 'hasChildren'}" class="data-table__content" :height="540" border stripe @selection-change="handleSelectionChange" @row-click="handleRowClick">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        row-key="id"
+        :data="pageTableData"
+        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+        class="data-table__content"
+        :height="540"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+        @row-click="handleRowClick"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" min-width="55" align="center" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" type="index" fixed label="序号" min-width="60" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'name')?.show" key="name" label="部门名称" prop="name" min-width="120" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'code')?.show" key="code" label="部门编码" prop="code" min-width="120" />')
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'status')?.show" key="status" label="状态" prop="status" min-width="60">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          min-width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          type="index"
+          fixed
+          label="序号"
+          min-width="60"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'name')?.show"
+          key="name"
+          label="部门名称"
+          prop="name"
+          min-width="120"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'code')?.show"
+          key="code"
+          label="部门编码"
+          prop="code"
+          min-width="120"
+        />
+        ')
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'status')?.show"
+          key="status"
+          label="状态"
+          prop="status"
+          min-width="60"
+        >
           <template #default="scope">
             <el-tag :type="scope.row.status === true ? 'success' : 'danger'">
               {{ scope.row.status ? "启用" : "停用" }}
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'order')?.show" key="order" label="排序" prop="order" min-width="60" show-overflow-tooltip />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'description')?.show" key="description" label="描述" prop="description" min-width="100" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'created_at')?.show" key="created_at" label="创建时间" prop="created_at" min-width="120" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'updated_at')?.show" key="updated_at" label="更新时间" prop="updated_at" min-width="120" sortable />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'order')?.show"
+          key="order"
+          label="排序"
+          prop="order"
+          min-width="60"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'description')?.show"
+          key="description"
+          label="描述"
+          prop="description"
+          min-width="100"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          key="created_at"
+          label="创建时间"
+          prop="created_at"
+          min-width="120"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          key="updated_at"
+          label="更新时间"
+          prop="updated_at"
+          min-width="120"
+          sortable
+        />
 
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" fixed="right" label="操作" align="center"  min-width="200">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="200"
+        >
           <template #default="scope">
-            <el-button v-hasPerm="['module_system:dept:create']" type="success" size="small" link icon="plus" @click="handleOpenDialog('create', undefined, scope.row.id)">新增</el-button>
-            <el-button v-hasPerm="['module_system:dept:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button v-hasPerm="['module_system:dept:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-            <el-button v-hasPerm="['module_system:dept:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              v-hasPerm="['module_system:dept:create']"
+              type="success"
+              size="small"
+              link
+              icon="plus"
+              @click="handleOpenDialog('create', undefined, scope.row.id)"
+            >
+              新增
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:dept:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:dept:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:dept:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
-
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
-          <el-descriptions-item label="部门名称" :span="2">{{ detailFormData.name }}</el-descriptions-item>
-          <el-descriptions-item label="部门编码" :span="2">{{ detailFormData.code }}</el-descriptions-item>
-          <el-descriptions-item label="上级部门" :span="2">{{ detailFormData.parent_name }}</el-descriptions-item>
+          <el-descriptions-item label="部门名称" :span="2">
+            {{ detailFormData.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="部门编码" :span="2">
+            {{ detailFormData.code }}
+          </el-descriptions-item>
+          <el-descriptions-item label="上级部门" :span="2">
+            {{ detailFormData.parent_name }}
+          </el-descriptions-item>
           <el-descriptions-item label="状态" :span="2">
             <el-tag :type="detailFormData.status ? 'success' : 'danger'">
-              {{ detailFormData.status ? '启用' : '停用' }}
+              {{ detailFormData.status ? "启用" : "停用" }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="排序" :span="2">{{ detailFormData.order }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{ detailFormData.created_at }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="2">{{ detailFormData.updated_at }}</el-descriptions-item>
-          <el-descriptions-item label="描述" :span="4">{{ detailFormData.description }}</el-descriptions-item>
+          <el-descriptions-item label="排序" :span="2">
+            {{ detailFormData.order }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="4">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
           <el-form-item label="部门名称" prop="name">
             <el-input v-model="formData.name" placeholder="请输入部门名称" :maxlength="50" />
           </el-form-item>
@@ -163,10 +340,22 @@
             <el-input v-model="formData.code" placeholder="请输入部门编码" :maxlength="50" />
           </el-form-item>
           <el-form-item label="上级部门" prop="parent_id">
-            <el-tree-select v-model="formData.parent_id" placeholder="请选择上级部门" :data="deptOptions" filterable check-strictly :render-after-expand="false" />
+            <el-tree-select
+              v-model="formData.parent_id"
+              placeholder="请选择上级部门"
+              :data="deptOptions"
+              filterable
+              check-strictly
+              :render-after-expand="false"
+            />
           </el-form-item>
           <el-form-item label="排序" prop="order">
-            <el-input-number v-model="formData.order" controls-position="right" :min="1" :max="999" />
+            <el-input-number
+              v-model="formData.order"
+              controls-position="right"
+              :min="1"
+              :max="999"
+            />
           </el-form-item>
           <el-form-item label="状态" prop="status">
             <el-radio-group v-model="formData.status">
@@ -175,7 +364,14 @@
             </el-radio-group>
           </el-form-item>
           <el-form-item label="描述" prop="description">
-            <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
         </el-form>
       </template>
@@ -183,13 +379,26 @@
       <template #footer>
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
-          <el-button v-if="dialogVisible.type !== 'detail'" v-hasPerm="['module_system:dept:submit']" type="primary" @click="handleSubmit">确定</el-button>
-          <el-button v-else v-hasPerm="['module_system:dept:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
+          <el-button
+            v-if="dialogVisible.type !== 'detail'"
+            v-hasPerm="['module_system:dept:submit']"
+            type="primary"
+            @click="handleSubmit"
+          >
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['module_system:dept:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
           <el-button @click="handleCloseDialog">取消</el-button>
         </div>
       </template>
     </el-dialog>
-
   </div>
 </template>
 
@@ -220,17 +429,17 @@ const deptOptions = ref<OptionType[]>([]);
 
 // 表格列配置
 const tableColumns = ref([
-  { prop: 'selection', label: '选择框', show: true },
-  { prop: 'index', label: '序号', show: true },
-  { prop: 'name', label: '部门名称', show: true },
-  { prop: 'code', label: '部门编码', show: true },
-  { prop: 'order', label: '排序', show: true },
-  { prop: 'status', label: '状态', show: true },
-  { prop: 'description', label: '描述', show: true },
-  { prop: 'created_at', label: '创建时间', show: true },
-  { prop: 'updated_at', label: '更新时间', show: true },
-  { prop: 'operation', label: '操作', show: true }
-])
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "name", label: "部门名称", show: true },
+  { prop: "code", label: "部门编码", show: true },
+  { prop: "order", label: "排序", show: true },
+  { prop: "status", label: "状态", show: true },
+  { prop: "description", label: "描述", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "operation", label: "操作", show: true },
+]);
 
 // 详情表单
 const detailFormData = ref<DeptTable>({});
@@ -252,13 +461,13 @@ const formData = reactive<DeptForm>({
   parent_id: undefined,
   status: true,
   description: undefined,
-})
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -269,7 +478,7 @@ const rules = reactive({
 });
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   loading.value = true;
   try {
     const response = await DeptAPI.getDeptList(queryFormData);
@@ -279,7 +488,7 @@ async function handleRefresh () {
   } finally {
     loading.value = false;
   }
-};
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -289,11 +498,9 @@ async function loadingData() {
     pageTableData.value = response.data.data;
     // 加载部门选项
     deptOptions.value = formatTree(response.data.data);
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -321,7 +528,7 @@ const initialFormData: DeptForm = {
   parent_id: undefined,
   status: true,
   description: undefined,
-}
+};
 
 // 日期范围临时变量
 const dateRange = ref<[Date, Date] | []>([]);
@@ -368,14 +575,18 @@ async function handleCloseDialog() {
 }
 
 // 打开系统配置弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number, parentId?: number) {
+async function handleOpenDialog(
+  type: "create" | "update" | "detail",
+  id?: number,
+  parentId?: number
+) {
   dialogVisible.type = type;
   if (id) {
     const response = await DeptAPI.getDeptDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "部门详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改部门";
       Object.assign(formData, response.data.data);
     }
@@ -400,9 +611,9 @@ async function handleSubmit() {
       const id = formData.id;
       try {
         if (id) {
-          await DeptAPI.updateDept(id, { id, ...formData })
+          await DeptAPI.updateDept(id, { id, ...formData });
         } else {
-          await DeptAPI.createDept(formData)
+          await DeptAPI.createDept(formData);
         }
         dialogVisible.visible = false;
         resetForm();
@@ -425,41 +636,45 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await DeptAPI.deleteDept(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
-}
-
-// 批量启用/停用
-async function handleMoreClick(status: boolean) {
-  if (selectIds.value.length) {
-    ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
-      confirmButtonText: "确定",
-      cancelButtonText: "取消",
-      type: "warning",
-    }).then(async () => {
+  })
+    .then(async () => {
       try {
         loading.value = true;
-        await DeptAPI.batchAvailableDept({ ids: selectIds.value, status });
+        await DeptAPI.deleteDept(ids);
         handleResetQuery();
       } catch (error: any) {
         console.error(error);
       } finally {
         loading.value = false;
       }
-    }).catch(() => {
+    })
+    .catch(() => {
       ElMessageBox.close();
     });
+}
+
+// 批量启用/停用
+async function handleMoreClick(status: boolean) {
+  if (selectIds.value.length) {
+    ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await DeptAPI.batchAvailableDept({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
   }
 }
 
diff --git a/frontend/src/views/module_system/dict/components/DataDrawer.vue b/frontend/src/views/module_system/dict/components/DataDrawer.vue
index 746342fe..e4083a52 100644
--- a/frontend/src/views/module_system/dict/components/DataDrawer.vue
+++ b/frontend/src/views/module_system/dict/components/DataDrawer.vue
@@ -1,31 +1,42 @@
 <!-- 字典数据 -->
 <template>
-  <el-drawer v-model="drawerVisible" :title="'【' + props.dictLabel + '】字典数据'" :size="drawerSize">
+  <el-drawer
+    v-model="drawerVisible"
+    :title="'【' + props.dictLabel + '】字典数据'"
+    :size="drawerSize"
+  >
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":"  @submit.prevent="handleQuery">
-
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="dict_label" label="字典数据标签">
           <el-input v-model="queryFormData.dict_label" placeholder="请输入字典标签" clearable />
         </el-form-item>
         <el-form-item prop="status" label="状态">
-          <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option value="true" label="启用" />
             <el-option value="false" label="停用" />
           </el-select>
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <el-form-item v-if="isExpand" prop="creator" label="创建人">
           <UserTableSelect
-              v-model="queryFormData.creator"
-              @confirm-click="handleConfirm"
-              @clear-click="handleQuery"
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
           />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
@@ -68,18 +79,39 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:dict_data:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
+              <el-button
+                v-hasPerm="['module_system:dict_data:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:dict_data:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_system:dict_data:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-dropdown v-hasPerm="['module_system:dict_data:patch']" trigger="click">
-                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">更多</el-button>
+                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">
+                  更多
+                </el-button>
                 <template #dropdown>
                   <el-dropdown-menu>
-                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
+                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                      批量启用
+                    </el-dropdown-item>
+                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                      批量停用
+                    </el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -90,7 +122,13 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="导出">
-                <el-button v-hasPerm="['module_system:dict_data:export']" type="warning" icon="download" circle @click="handleOpenExportsModal"/>
+                <el-button
+                  v-hasPerm="['module_system:dict_data:export']"
+                  type="warning"
+                  icon="download"
+                  circle
+                  @click="handleOpenExportsModal"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -103,7 +141,17 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" height="460" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        height="460"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
@@ -128,7 +176,12 @@
         </el-table-column>
         <el-table-column label="值" prop="dict_value" min-width="100" show-overflow-tooltip />
         <el-table-column label="样式属性" prop="css_class" min-width="100" show-overflow-tooltip />
-        <el-table-column label="列表类样式" prop="list_class" min-width="100" show-overflow-tooltip />
+        <el-table-column
+          label="列表类样式"
+          prop="list_class"
+          min-width="100"
+          show-overflow-tooltip
+        />
         <el-table-column label="排序" prop="dict_sort" min-width="60" />
         <el-table-column label="是否默认" prop="is_default" min-width="100">
           <template #default="scope">
@@ -136,7 +189,7 @@
             <el-tag v-else type="danger">否</el-tag>
           </template>
         </el-table-column>
-        <el-table-column label="描述" prop="description" min-width="100" show-overflow-tooltip/>
+        <el-table-column label="描述" prop="description" min-width="100" show-overflow-tooltip />
         <el-table-column label="创建时间" prop="created_at" min-width="200" sortable />
         <el-table-column label="更新时间" prop="updated_at" min-width="200" sortable />
         <el-table-column label="创建人" prop="creator" min-width="100">
@@ -146,29 +199,74 @@
         </el-table-column>
         <el-table-column fixed="right" label="操作" align="center" min-width="200">
           <template #default="scope">
-            <el-button type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button v-hasPerm="['module_system:dict_data:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-            <el-button v-hasPerm="['module_system:dict_data:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:dict_data:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:dict_data:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
-          <el-descriptions-item label="数据标签" :span="2">{{ detailFormData.dict_label }}</el-descriptions-item>
-          <el-descriptions-item label="数据类型" :span="2">{{ detailFormData.dict_type }}</el-descriptions-item>
-          <el-descriptions-item label="数据值" :span="2">{{ detailFormData.dict_value }}</el-descriptions-item>
-          <el-descriptions-item label="样式属性" :span="2">{{ detailFormData.css_class }}</el-descriptions-item>
-          <el-descriptions-item label="列表样式属性" :span="2">{{ detailFormData.list_class }}</el-descriptions-item>
+          <el-descriptions-item label="数据标签" :span="2">
+            {{ detailFormData.dict_label }}
+          </el-descriptions-item>
+          <el-descriptions-item label="数据类型" :span="2">
+            {{ detailFormData.dict_type }}
+          </el-descriptions-item>
+          <el-descriptions-item label="数据值" :span="2">
+            {{ detailFormData.dict_value }}
+          </el-descriptions-item>
+          <el-descriptions-item label="样式属性" :span="2">
+            {{ detailFormData.css_class }}
+          </el-descriptions-item>
+          <el-descriptions-item label="列表样式属性" :span="2">
+            {{ detailFormData.list_class }}
+          </el-descriptions-item>
           <el-descriptions-item label="是否默认" :span="2">
             <el-tag v-if="detailFormData.is_default" type="success">是</el-tag>
             <el-tag v-else type="danger">否</el-tag>
@@ -177,18 +275,40 @@
             <el-tag v-if="detailFormData.status" type="success">启用</el-tag>
             <el-tag v-else type="danger">停用</el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="排序" :span="2">{{ detailFormData.dict_sort }}</el-descriptions-item>
-          <el-descriptions-item label="描述" :span="2">{{ detailFormData.description }}</el-descriptions-item>
-          <el-descriptions-item label="创建人" :span="2">{{ detailFormData.creator?.name }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{ detailFormData.created_at }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="2">{{ detailFormData.updated_at }}</el-descriptions-item>
+          <el-descriptions-item label="排序" :span="2">
+            {{ detailFormData.dict_sort }}
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="2">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="2">
+            {{ detailFormData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
           <el-form-item label="数据类型" prop="dict_type">
-            <el-input v-model="formData.dict_type" placeholder="请输入数据类型" :maxlength="50" :disabled="true" />
+            <el-input
+              v-model="formData.dict_type"
+              placeholder="请输入数据类型"
+              :maxlength="50"
+              :disabled="true"
+            />
           </el-form-item>
           <el-form-item label="数据标签" prop="dict_label">
             <el-input v-model="formData.dict_label" placeholder="请输入数据标签" :maxlength="50" />
@@ -197,20 +317,27 @@
             <el-input v-model="formData.dict_value" placeholder="请输入数据值" :maxlength="50" />
           </el-form-item>
           <el-form-item label="样式属性" prop="css_class">
-            <el-select v-model="formData.css_class" placeholder="请选择常用颜色或输入自定义" clearable filterable allow-create default-first-option>
-            <!-- Element Plus 常用主题色（十六进制） -->
-            <el-option value="#409EFF" label="蓝色-Primary (#409EFF)" />
-            <el-option value="#67C23A" label="绿色-Success (#67C23A)" />
-            <el-option value="#E6A23C" label="橙色-Warning (#E6A23C)" />
-            <el-option value="#F56C6C" label="红色-Danger (#F56C6C)" />
-            <el-option value="#909399" label="灰色-Info (#909399)" />
-            <!-- 文本常用颜色 -->
-            <el-option value="#303133" label="深灰-文本主要 (#303133)" />
-            <el-option value="#606266" label="灰色-文本常规 (#606266)" />
-            <el-option value="#C0C4CC" label="浅灰-占位文本 (#C0C4CC)" />
-            <!-- 基础色 -->
-            <el-option value="#000000" label="黑色 (#000000)" />
-            <el-option value="#FFFFFF" label="白色 (#FFFFFF)" />
+            <el-select
+              v-model="formData.css_class"
+              placeholder="请选择常用颜色或输入自定义"
+              clearable
+              filterable
+              allow-create
+              default-first-option
+            >
+              <!-- Element Plus 常用主题色（十六进制） -->
+              <el-option value="#409EFF" label="蓝色-Primary (#409EFF)" />
+              <el-option value="#67C23A" label="绿色-Success (#67C23A)" />
+              <el-option value="#E6A23C" label="橙色-Warning (#E6A23C)" />
+              <el-option value="#F56C6C" label="红色-Danger (#F56C6C)" />
+              <el-option value="#909399" label="灰色-Info (#909399)" />
+              <!-- 文本常用颜色 -->
+              <el-option value="#303133" label="深灰-文本主要 (#303133)" />
+              <el-option value="#606266" label="灰色-文本常规 (#606266)" />
+              <el-option value="#C0C4CC" label="浅灰-占位文本 (#C0C4CC)" />
+              <!-- 基础色 -->
+              <el-option value="#000000" label="黑色 (#000000)" />
+              <el-option value="#FFFFFF" label="白色 (#FFFFFF)" />
             </el-select>
           </el-form-item>
           <el-form-item label="列表类样式" prop="list_class">
@@ -233,11 +360,23 @@
             <el-input-number v-model="formData.dict_sort" controls-position="right" :min="1" />
           </el-form-item>
           <el-form-item label="状态" prop="status">
-            <el-switch v-model="formData.status" inline-prompt :active-value="true" :inactive-value="false" />
+            <el-switch
+              v-model="formData.status"
+              inline-prompt
+              :active-value="true"
+              :inactive-value="false"
+            />
           </el-form-item>
 
           <el-form-item label="描述" prop="description">
-            <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
         </el-form>
       </template>
@@ -246,12 +385,13 @@
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
           <el-button @click="handleCloseDialog">取消</el-button>
-          <el-button v-if="dialogVisible.type !== 'detail'" type="primary" @click="handleSubmit">确定</el-button>
+          <el-button v-if="dialogVisible.type !== 'detail'" type="primary" @click="handleSubmit">
+            确定
+          </el-button>
           <el-button v-else type="primary" @click="handleCloseDialog">确定</el-button>
         </div>
       </template>
     </el-dialog>
-
   </el-drawer>
   <ExportModal
     v-model="exportsDialogVisible"
@@ -267,15 +407,15 @@
 const props = defineProps({
   dictType: {
     type: String,
-    required: true
+    required: true,
   },
   dictLabel: {
     type: String,
-    required: true
-  }
-})
+    required: true,
+  },
+});
 
-const drawerVisible = defineModel<boolean>()
+const drawerVisible = defineModel<boolean>();
 import DictAPI, { DictDataTable, DictDataForm, DictDataPageQuery } from "@/api/module_system/dict";
 import { useAppStore } from "@/store/modules/app.store";
 import { DeviceEnum } from "@/enums/settings/device.enum";
@@ -323,21 +463,21 @@ const queryFormData = reactive<DictDataPageQuery>({
 const formData = reactive<DictDataForm>({
   id: undefined,
   dict_sort: 1,
-  dict_label: '',
-  dict_value: '',
-  dict_type: '',
-  css_class: '',
+  dict_label: "",
+  dict_value: "",
+  dict_type: "",
+  css_class: "",
   list_class: undefined,
   is_default: false,
   status: true,
-  description: ''
-})
+  description: "",
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -368,9 +508,9 @@ function handleDateRangeChange(range: [Date, Date]) {
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -380,11 +520,9 @@ async function loadingData() {
     const response = await DictAPI.getDictDataList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -415,15 +553,15 @@ async function handleResetQuery() {
 const initialFormData: DictDataForm = {
   id: undefined,
   dict_sort: 1,
-  dict_label: '',
-  dict_value: '',
-  dict_type: '',
-  css_class: '',
+  dict_label: "",
+  dict_value: "",
+  dict_type: "",
+  css_class: "",
   list_class: undefined,
   is_default: false,
   status: true,
-  description: ''
-}
+  description: "",
+};
 
 // 重置表单
 async function resetForm() {
@@ -448,14 +586,14 @@ async function handleCloseDialog() {
 }
 
 // 打开系统配置弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await DictAPI.getDictDataDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "字典数据详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改字典数据";
       Object.assign(formData, response.data.data);
     }
@@ -480,7 +618,7 @@ async function handleSubmit() {
       const id = formData.id;
       if (id) {
         try {
-          await DictAPI.updateDictData(id, { id, ...formData })
+          await DictAPI.updateDictData(id, { id, ...formData });
           dialogVisible.visible = false;
           resetForm();
           handleResetQuery();
@@ -491,7 +629,7 @@ async function handleSubmit() {
         }
       } else {
         try {
-          await DictAPI.createDictData(formData)
+          await DictAPI.createDictData(formData);
           dialogVisible.visible = false;
           resetForm();
           handleResetQuery();
@@ -511,19 +649,21 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await DictAPI.deleteDictData(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await DictAPI.deleteDictData(ids);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 打开导出弹窗
@@ -534,48 +674,50 @@ function handleOpenExportsModal() {
 // 批量启用/停用
 async function handleMoreClick(status: boolean) {
   if (selectIds.value.length) {
-    ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
+    ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
       confirmButtonText: "确定",
       cancelButtonText: "取消",
       type: "warning",
-    }).then(async () => {
-      try {
-        loading.value = true;
-        await DictAPI.batchAvailableDictData({ ids: selectIds.value, status });
-        handleResetQuery();
-      } catch (error: any) {
-        console.error(error);
-      } finally {
-        loading.value = false;
-      }
-    }).catch(() => {
-      ElMessageBox.close();
-    });
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await DictAPI.batchAvailableDictData({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
   }
 }
 
 // 导出字段
 const exportColumns = [
-  { prop: 'dict_label', label: '数据标签' },
-  { prop: 'dict_type', label: '数据类型' },
-  { prop: 'dict_value', label: '数据值' },
-  { prop: 'css_class', label: '样式属性' },
-  { prop: 'list_class', label: '列表类样式' },
-  { prop: 'dict_sort', label: '排序' },
-  { prop: 'is_default', label: '是否默认' },
-  { prop: 'status', label: '状态' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "dict_label", label: "数据标签" },
+  { prop: "dict_type", label: "数据类型" },
+  { prop: "dict_value", label: "数据值" },
+  { prop: "css_class", label: "样式属性" },
+  { prop: "list_class", label: "列表类样式" },
+  { prop: "dict_sort", label: "排序" },
+  { prop: "is_default", label: "是否默认" },
+  { prop: "status", label: "状态" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导出配置（用于导出弹窗）
 const curdContentConfig = {
-  permPrefix: 'module_system:dict_data',
+  permPrefix: "module_system:dict_data",
   cols: exportColumns as any,
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.status === 'string') query.status = query.status === 'true';
+    if (typeof query.status === "string") query.status = query.status === "true";
     // dict_type 已在查询表单中设置为 props.dictType
     query.page_no = 1;
     query.page_size = 1000;
diff --git a/frontend/src/views/module_system/dict/index.vue b/frontend/src/views/module_system/dict/index.vue
index 8f056820..65c2de45 100644
--- a/frontend/src/views/module_system/dict/index.vue
+++ b/frontend/src/views/module_system/dict/index.vue
@@ -3,7 +3,13 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery" >
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="dict_name" label="字典名称">
           <el-input v-model="queryFormData.dict_name" placeholder="请输入字典名称" clearable />
         </el-form-item>
@@ -11,29 +17,44 @@
           <el-input v-model="queryFormData.dict_type" placeholder="请输入字典类型" clearable />
         </el-form-item>
         <el-form-item prop="status" label="状态">
-          <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option value="true" label="启用" />
             <el-option value="false" label="停用" />
           </el-select>
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <el-form-item v-if="isExpand" prop="creator" label="创建人">
           <UserTableSelect
-              v-model="queryFormData.creator"
-              @confirm-click="handleConfirm"
-              @clear-click="handleQuery"
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
           />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_system:dict_type:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_system:dict_type:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_system:dict_type:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_system:dict_type:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
           <!-- 展开/收起 -->
           <template v-if="isExpandable">
             <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
@@ -70,10 +91,25 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:dict_type:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
+              <el-button
+                v-hasPerm="['module_system:dict_type:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:dict_type:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_system:dict_type:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-dropdown v-hasPerm="['module_system:dict_type:patch']" trigger="click">
@@ -82,8 +118,12 @@
                 </el-button>
                 <template #dropdown>
                   <el-dropdown-menu>
-                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
+                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                      批量启用
+                    </el-dropdown-item>
+                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                      批量停用
+                    </el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -94,12 +134,24 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="导出">
-                <el-button v-hasPerm="['module_system:dict_type:export']" type="warning" icon="download" circle @click="handleOpenExportsModal"/>
+                <el-button
+                  v-hasPerm="['module_system:dict_type:export']"
+                  type="warning"
+                  icon="download"
+                  circle
+                  @click="handleOpenExportsModal"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_system:dict_type:refresh']" type="primary" icon="refresh" circle @click="handleRefresh"/>
+                <el-button
+                  v-hasPerm="['module_system:dict_type:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -119,59 +171,178 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        :height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" min-width="55" align="center" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" type="index" fixed label="序号" min-width="60">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          min-width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          type="index"
+          fixed
+          label="序号"
+          min-width="60"
+        >
           <template #default="scope">
             {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'dict_name')?.show" key="dict_name" label="字典名称" prop="dict_name" min-width="140" show-overflow-tooltip/>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'dict_type')?.show" key="dict_type" label="字典类型" prop="dict_type" min-width="180">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'dict_name')?.show"
+          key="dict_name"
+          label="字典名称"
+          prop="dict_name"
+          min-width="140"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'dict_type')?.show"
+          key="dict_type"
+          label="字典类型"
+          prop="dict_type"
+          min-width="180"
+        >
           <template #default="scope">
             <el-tag type="primary">{{ scope.row.dict_type }}</el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'status')?.show" key="status" label="状态" prop="status" min-width="80">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'status')?.show"
+          key="status"
+          label="状态"
+          prop="status"
+          min-width="80"
+        >
           <template #default="scope">
             <el-tag :type="scope.row.status === true ? 'success' : 'danger'">
               {{ scope.row.status ? "启用" : "停用" }}
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'description')?.show" key="description" label="描述" prop="description" min-width="140" show-overflow-tooltip/>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'created_at')?.show" key="created_at" label="创建时间" prop="created_at" min-width="200" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'updated_at')?.show" key="updated_at" label="更新时间" prop="updated_at" min-width="200" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'creator')?.show" label="创建人" prop="creator" min-width="120">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'description')?.show"
+          key="description"
+          label="描述"
+          prop="description"
+          min-width="140"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          key="created_at"
+          label="创建时间"
+          prop="created_at"
+          min-width="200"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          key="updated_at"
+          label="更新时间"
+          prop="updated_at"
+          min-width="200"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'creator')?.show"
+          label="创建人"
+          prop="creator"
+          min-width="120"
+        >
           <template #default="scope">
             {{ scope.row.creator?.name }}
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" fixed="right" label="操作" align="center" min-width="260">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="260"
+        >
           <template #default="scope">
-            <el-button v-hasPerm="['module_system:dict_data:query']" type="warning" size="small" link icon="document" @click="handleDictDataDrawer(scope.row.dict_type, scope.row.dict_name)">字典</el-button>
-            <el-button v-hasPerm="['module_system:dict_type:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button v-hasPerm="['module_system:dict_type:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-            <el-button v-hasPerm="['module_system:dict_type:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              v-hasPerm="['module_system:dict_data:query']"
+              type="warning"
+              size="small"
+              link
+              icon="document"
+              @click="handleDictDataDrawer(scope.row.dict_type, scope.row.dict_name)"
+            >
+              字典
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:dict_type:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:dict_type:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:dict_type:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
-          <el-descriptions-item label="字典名称" :span="2">{{ detailFormData.dict_name }}</el-descriptions-item>
+          <el-descriptions-item label="字典名称" :span="2">
+            {{ detailFormData.dict_name }}
+          </el-descriptions-item>
           <el-descriptions-item label="字典类型" :span="2">
             <el-tag type="primary">{{ detailFormData.dict_type }}</el-tag>
           </el-descriptions-item>
@@ -179,15 +350,30 @@
             <el-tag v-if="detailFormData.status" type="success">启用</el-tag>
             <el-tag v-else type="danger">停用</el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="描述" :span="2">{{ detailFormData.description }}</el-descriptions-item>
-          <el-descriptions-item label="创建人" :span="2">{{ detailFormData.creator?.name }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{ detailFormData.created_at }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="2">{{ detailFormData.updated_at }}</el-descriptions-item>
+          <el-descriptions-item label="描述" :span="2">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="2">
+            {{ detailFormData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
           <el-form-item label="字典名称" prop="dict_name">
             <el-input v-model="formData.dict_name" placeholder="请输入字典名称" :maxlength="50" />
           </el-form-item>
@@ -201,7 +387,14 @@
             </el-radio-group>
           </el-form-item>
           <el-form-item label="描述" prop="description">
-            <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
         </el-form>
       </template>
@@ -210,13 +403,32 @@
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
           <el-button @click="handleCloseDialog">取消</el-button>
-          <el-button v-if="dialogVisible.type !== 'detail'" v-hasPerm="['module_system:dict_type:submit']" type="primary" @click="handleSubmit">确定</el-button>
-          <el-button v-else v-hasPerm="['module_system:dict_type:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
+          <el-button
+            v-if="dialogVisible.type !== 'detail'"
+            v-hasPerm="['module_system:dict_type:submit']"
+            type="primary"
+            @click="handleSubmit"
+          >
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['module_system:dict_type:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
         </div>
       </template>
     </el-dialog>
 
-    <DataDrawer v-if="drawerVisible" v-model="drawerVisible" :dict-type="currentDictType" :dict-label="currentDictLabel" />
+    <DataDrawer
+      v-if="drawerVisible"
+      v-model="drawerVisible"
+      :dict-type="currentDictType"
+      :dict-label="currentDictLabel"
+    />
     <ExportModal
       v-model="exportsDialogVisible"
       :content-config="curdContentConfig"
@@ -224,7 +436,6 @@
       :page-data="pageTableData"
       :selection-data="selectionRows"
     />
-
   </div>
 </template>
 
@@ -235,7 +446,7 @@ defineOptions({
 });
 
 import DictAPI, { DictTable, DictForm, DictPageQuery } from "@/api/module_system/dict";
-import DataDrawer from "@/views/module_system/dict/components/DataDrawer.vue"
+import DataDrawer from "@/views/module_system/dict/components/DataDrawer.vue";
 import UserTableSelect from "@/views/module_system/user/components/UserTableSelect.vue";
 import ExportModal from "@/components/CURD/ExportModal.vue";
 import type { IContentConfig } from "@/components/CURD/types";
@@ -257,20 +468,19 @@ const pageTableData = ref<DictTable[]>([]);
 const exportsDialogVisible = ref(false);
 const selectionRows = ref<DictTable[]>([]);
 
-
 // 表格列配置
 const tableColumns = ref([
-  { prop: 'selection', label: '选择框', show: true },
-  { prop: 'index', label: '序号', show: true },
-  { prop: 'dict_name', label: '字典名称', show: true },
-  { prop: 'dict_type', label: '字典类型', show: true },
-  { prop: 'status', label: '状态', show: true },
-  { prop: 'description', label: '描述', show: true },
-  { prop: 'creator', label: '创建人', show: true },
-  { prop: 'created_at', label: '创建时间', show: true },
-  { prop: 'updated_at', label: '更新时间', show: true },
-  { prop: 'operation', label: '操作', show: true }
-])
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "dict_name", label: "字典名称", show: true },
+  { prop: "dict_type", label: "字典类型", show: true },
+  { prop: "status", label: "状态", show: true },
+  { prop: "description", label: "描述", show: true },
+  { prop: "creator", label: "创建人", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "operation", label: "操作", show: true },
+]);
 
 // 详情表单
 const detailFormData = ref<DictTable>({});
@@ -291,17 +501,17 @@ const queryFormData = reactive<DictPageQuery>({
 // 编辑表单
 const formData = reactive<DictForm>({
   id: undefined,
-  dict_name: '',
-  dict_type: '',
+  dict_name: "",
+  dict_type: "",
   status: true,
   description: undefined,
-})
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -327,19 +537,18 @@ function handleDateRangeChange(range: [Date, Date]) {
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
-
+}
 
 // 抽屉显隐
 const drawerVisible = ref(false);
 
 // 添加字典类型变量
-const currentDictType = ref('');
+const currentDictType = ref("");
 
 // 添加字典名称变量
-const currentDictLabel = ref('');
+const currentDictLabel = ref("");
 
 // 加载表格数据
 async function loadingData() {
@@ -348,11 +557,9 @@ async function loadingData() {
     const response = await DictAPI.getDictTypeList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -382,11 +589,11 @@ async function handleResetQuery() {
 // 定义初始表单数据常量
 const initialFormData: DictForm = {
   id: undefined,
-  dict_name: '',
-  dict_type: '',
+  dict_name: "",
+  dict_type: "",
   status: true,
   description: undefined,
-}
+};
 
 // 重置表单
 async function resetForm() {
@@ -411,14 +618,14 @@ async function handleCloseDialog() {
 }
 
 // 打开系统配置弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await DictAPI.getDictTypeDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "字典详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改字典";
       Object.assign(formData, response.data.data);
     }
@@ -439,7 +646,7 @@ async function handleSubmit() {
       const id = formData.id;
       if (id) {
         try {
-          await DictAPI.updateDictType(id, { id, ...formData })
+          await DictAPI.updateDictType(id, { id, ...formData });
           dialogVisible.visible = false;
           resetForm();
           handleResetQuery();
@@ -450,7 +657,7 @@ async function handleSubmit() {
         }
       } else {
         try {
-          await DictAPI.createDictType(formData)
+          await DictAPI.createDictType(formData);
           dialogVisible.visible = false;
           resetForm();
           handleResetQuery();
@@ -470,19 +677,21 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await DictAPI.deleteDictType(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await DictAPI.deleteDictType(ids);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 打开导出弹窗
@@ -493,23 +702,25 @@ function handleOpenExportsModal() {
 // 批量启用/停用
 async function handleMoreClick(status: boolean) {
   if (selectIds.value.length) {
-    ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
+    ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
       confirmButtonText: "确定",
       cancelButtonText: "取消",
       type: "warning",
-    }).then(async () => {
-      try {
-        loading.value = true;
-        await DictAPI.batchAvailableDict({ ids: selectIds.value, status });
-        handleResetQuery();
-      } catch (error: any) {
-        console.error(error);
-      } finally {
-        loading.value = false;
-      }
-    }).catch(() => {
-      ElMessageBox.close();
-    });
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await DictAPI.batchAvailableDict({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
   }
 }
 
@@ -521,21 +732,21 @@ function handleDictDataDrawer(dictType: string, dictLabel: string) {
 
 // 导出字段
 const exportColumns = [
-  { prop: 'dict_name', label: '字典名称' },
-  { prop: 'dict_type', label: '字典类型' },
-  { prop: 'status', label: '状态' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "dict_name", label: "字典名称" },
+  { prop: "dict_type", label: "字典类型" },
+  { prop: "status", label: "状态" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导出配置（用于导出弹窗）
 const curdContentConfig = {
-  permPrefix: 'module_system:dict_type',
+  permPrefix: "module_system:dict_type",
   cols: exportColumns as any,
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.status === 'string') query.status = query.status === 'true';
+    if (typeof query.status === "string") query.status = query.status === "true";
     query.page_no = 1;
     query.page_size = 1000;
     const all: any[] = [];
diff --git a/frontend/src/views/module_system/log/index.vue b/frontend/src/views/module_system/log/index.vue
index e2a8431d..d435f7fb 100644
--- a/frontend/src/views/module_system/log/index.vue
+++ b/frontend/src/views/module_system/log/index.vue
@@ -3,34 +3,55 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery" >
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="request_path" label="请求路径">
           <el-input v-model="queryFormData.request_path" placeholder="请输入请求路径" clearable />
         </el-form-item>
         <el-form-item prop="type" label="日志类型">
-          <el-select v-model="queryFormData.type" placeholder="请选择日志类型" style="width: 167.5px" clearable>
-            <el-option label="登录日志" value=1 />
-            <el-option label="操作日志" value=2 />
+          <el-select
+            v-model="queryFormData.type"
+            placeholder="请选择日志类型"
+            style="width: 167.5px"
+            clearable
+          >
+            <el-option label="登录日志" value="1" />
+            <el-option label="操作日志" value="2" />
           </el-select>
         </el-form-item>
         <el-form-item v-if="isExpand" prop="creator" label="创建人">
           <UserTableSelect
-              v-model="queryFormData.creator"
-              @confirm-click="handleConfirm"
-              @clear-click="handleQuery"
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
           />
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_system:log:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_system:log:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_system:log:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_system:log:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
           <!-- 展开/收起 -->
           <template v-if="isExpandable">
             <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
@@ -67,7 +88,15 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:log:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_system:log:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
           </el-row>
         </div>
@@ -75,12 +104,24 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="导出">
-                <el-button v-hasPerm="['module_system:log:export']" type="warning" icon="download" circle @click="handleOpenExportsModal"/>
+                <el-button
+                  v-hasPerm="['module_system:log:export']"
+                  type="warning"
+                  icon="download"
+                  circle
+                  @click="handleOpenExportsModal"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_system:log:refresh']" type="default" icon="refresh" circle @click="handleRefresh"/>
+                <el-button
+                  v-hasPerm="['module_system:log:refresh']"
+                  type="default"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
           </el-row>
@@ -88,12 +129,22 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" ::height="450" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        ::height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
-        <el-table-column prop='selection' type="selection" min-width="55" align="center" />
-        <el-table-column type="index" fixed label="序号" min-width="60" >
+        <el-table-column prop="selection" type="selection" min-width="55" align="center" />
+        <el-table-column type="index" fixed label="序号" min-width="60">
           <template #default="scope">
             {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
           </template>
@@ -101,11 +152,16 @@
         <el-table-column label="日志类型" prop="type" min-width="100">
           <template #default="scope">
             <el-tag :type="scope.row.type === 1 ? 'success' : 'primary'">
-              {{ scope.row.type === 1 ? '登录日志' : '操作日志' }}
+              {{ scope.row.type === 1 ? "登录日志" : "操作日志" }}
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column label="请求路径" prop="request_path" min-width="200" show-overflow-tooltip />
+        <el-table-column
+          label="请求路径"
+          prop="request_path"
+          min-width="200"
+          show-overflow-tooltip
+        />
         <el-table-column label="请求方法" prop="request_method" min-width="100">
           <template #default="scope">
             <el-tag :type="getMethodType(scope.row.request_method)">
@@ -123,11 +179,20 @@
         <el-table-column label="请求IP" prop="request_ip" min-width="180" show-overflow-tooltip>
           <template #default="scope">
             <el-text>{{ scope.row.request_ip }}</el-text>
-            <CopyButton v-if="scope.row.request_ip" :text="scope.row.request_ip" style="margin-left: 2px" />
+            <CopyButton
+              v-if="scope.row.request_ip"
+              :text="scope.row.request_ip"
+              style="margin-left: 2px"
+            />
           </template>
         </el-table-column>
         <el-table-column label="处理时间" prop="process_time" min-width="120" />
-        <el-table-column label="浏览器" prop="request_browser" min-width="220" show-overflow-tooltip/>
+        <el-table-column
+          label="浏览器"
+          prop="request_browser"
+          min-width="220"
+          show-overflow-tooltip
+        />
         <el-table-column label="系统" prop="request_os" min-width="100" />
         <el-table-column label="描述" prop="description" min-width="120" show-overflow-tooltip />
         <el-table-column label="创建时间" prop="created_at" min-width="200" sortable />
@@ -138,29 +203,58 @@
         </el-table-column>
         <el-table-column label="操作" fixed="right" align="center" min-width="150">
           <template #default="scope">
-            <el-button v-hasPerm="['module_system:log:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button v-hasPerm="['module_system:log:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              v-hasPerm="['module_system:log:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:log:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="8" border label-width="200px">
           <el-descriptions-item label="日志类型" :span="2">
             <el-tag :type="formData.type === 1 ? 'success' : 'primary'">
-              {{ formData.type === 1 ? '登录日志' : '操作日志' }}
+              {{ formData.type === 1 ? "登录日志" : "操作日志" }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="请求路径" :span="2">{{ formData.request_path }}</el-descriptions-item>
+          <el-descriptions-item label="请求路径" :span="2">
+            {{ formData.request_path }}
+          </el-descriptions-item>
           <el-descriptions-item label="请求方法" :span="2">
             <el-tag :type="getMethodType(formData.request_method)">
               {{ formData.request_method }}
@@ -171,21 +265,39 @@
               {{ formData.response_code }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="请求IP" :span="2">{{ formData.request_ip }}</el-descriptions-item>
-          <el-descriptions-item label="处理时间" :span="2">{{ formData.process_time }}</el-descriptions-item>
-          <el-descriptions-item label="浏览器" :span="2">{{ formData.request_browser }}</el-descriptions-item>
-          <el-descriptions-item label="操作系统" :span="2">{{ formData.request_os }}</el-descriptions-item>
+          <el-descriptions-item label="请求IP" :span="2">
+            {{ formData.request_ip }}
+          </el-descriptions-item>
+          <el-descriptions-item label="处理时间" :span="2">
+            {{ formData.process_time }}
+          </el-descriptions-item>
+          <el-descriptions-item label="浏览器" :span="2">
+            {{ formData.request_browser }}
+          </el-descriptions-item>
+          <el-descriptions-item label="操作系统" :span="2">
+            {{ formData.request_os }}
+          </el-descriptions-item>
           <el-descriptions-item label="请求参数" :span="8">
             <JsonPretty :value="formData.request_payload" height="80px" />
           </el-descriptions-item>
           <el-descriptions-item label="响应数据" :span="8">
             <JsonPretty :value="formData.response_json" height="140px" />
           </el-descriptions-item>
-          <el-descriptions-item label="登录地点" :span="4">{{ formData.login_location }}</el-descriptions-item>
-          <el-descriptions-item label="创建人" :span="4">{{ formData.creator?.name }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="4">{{ formData.created_at }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="4">{{ formData.updated_at }}</el-descriptions-item>
-          <el-descriptions-item label="描述" :span="8">{{ formData.description }}</el-descriptions-item>
+          <el-descriptions-item label="登录地点" :span="4">
+            {{ formData.login_location }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="4">
+            {{ formData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="4">
+            {{ formData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="4">
+            {{ formData.updated_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="8">
+            {{ formData.description }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
 
@@ -193,7 +305,13 @@
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
           <el-button @click="handleCloseDialog">取消</el-button>
-          <el-button v-hasPerm="['module_system:log:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
+          <el-button
+            v-hasPerm="['module_system:log:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
         </div>
       </template>
     </el-dialog>
@@ -206,7 +324,6 @@
       :page-data="pageTableData"
       :selection-data="selectionRows"
     />
-
   </div>
 </template>
 
@@ -258,7 +375,7 @@ const queryFormData = reactive<LogPageQuery>({
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 日期范围临时变量
@@ -277,41 +394,41 @@ function handleDateRangeChange(range: [Date, Date]) {
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
+}
 
 const getStatusCodeType = (code?: number) => {
   if (code === undefined) {
-    return 'info';
+    return "info";
   }
   if (code >= 200 && code < 300) {
-    return 'success';
+    return "success";
   } else if (code >= 300 && code < 400) {
-    return 'warning';
+    return "warning";
   } else if (code >= 400 && code < 500) {
-    return 'danger';
+    return "danger";
   } else {
-    return 'danger';
+    return "danger";
   }
-}
+};
 
 const getMethodType = (method?: string) => {
   if (method === undefined) {
-    return 'info';
+    return "info";
   }
-  if (method === 'GET') {
-    return 'info';
-  } else if (method === 'POST') {
-    return 'success';
-  } else if (method === 'PUT' || method === 'PATCH') {
-    return 'warning';
-  } else if (method === 'DELETE') {
-    return 'danger';
+  if (method === "GET") {
+    return "info";
+  } else if (method === "POST") {
+    return "success";
+  } else if (method === "PUT" || method === "PATCH") {
+    return "warning";
+  } else if (method === "DELETE") {
+    return "danger";
   } else {
-    return 'info';
+    return "info";
   }
-}
+};
 
 // 加载表格数据
 async function loadingData() {
@@ -320,11 +437,9 @@ async function loadingData() {
     const response = await LogAPI.getLogList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -373,11 +488,11 @@ async function handleCloseDialog() {
 }
 
 // 打开日志详情弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await LogAPI.getLogDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "日志详情";
       Object.assign(formData.value, response.data.data);
     }
@@ -391,22 +506,23 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await LogAPI.deleteLog(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await LogAPI.deleteLog(ids);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
-
 // 打开导出弹窗
 function handleOpenExportsModal() {
   exportsDialogVisible.value = true;
@@ -414,23 +530,23 @@ function handleOpenExportsModal() {
 
 // 导出字段
 const exportColumns = [
-  { prop: 'type', label: '日志类型' },
-  { prop: 'request_path', label: '请求路径' },
-  { prop: 'request_method', label: '请求方法' },
-  { prop: 'response_code', label: '状态码' },
-  { prop: 'request_ip', label: '请求IP' },
-  { prop: 'login_location', label: '登录地点' },
-  { prop: 'process_time', label: '处理时间' },
-  { prop: 'request_browser', label: '浏览器' },
-  { prop: 'request_os', label: '系统' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "type", label: "日志类型" },
+  { prop: "request_path", label: "请求路径" },
+  { prop: "request_method", label: "请求方法" },
+  { prop: "response_code", label: "状态码" },
+  { prop: "request_ip", label: "请求IP" },
+  { prop: "login_location", label: "登录地点" },
+  { prop: "process_time", label: "处理时间" },
+  { prop: "request_browser", label: "浏览器" },
+  { prop: "request_os", label: "系统" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导入/导出配置（用于导出弹窗）
 const curdContentConfig = {
-  permPrefix: 'module_system:log',
+  permPrefix: "module_system:log",
   cols: exportColumns as any,
   exportsAction: async (params: any) => {
     const query: any = { ...params };
diff --git a/frontend/src/views/module_system/menu/index.vue b/frontend/src/views/module_system/menu/index.vue
index 55842243..569b3f2a 100644
--- a/frontend/src/views/module_system/menu/index.vue
+++ b/frontend/src/views/module_system/menu/index.vue
@@ -3,27 +3,48 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery" >
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="name" label="菜单名称">
           <el-input v-model="queryFormData.name" placeholder="请输入菜单名称" clearable />
         </el-form-item>
         <el-form-item prop="status" label="状态">
-          <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option value="true" label="启用" />
             <el-option value="false" label="停用" />
           </el-select>
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_system:menu:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_system:menu:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_system:menu:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_system:menu:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
           <!-- 展开/收起 -->
           <template v-if="isExpandable">
             <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
@@ -60,18 +81,39 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:menu:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
+              <el-button
+                v-hasPerm="['module_system:menu:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:menu:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_system:menu:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-dropdown v-hasPerm="['module_system:menu:patch']" trigger="click">
-                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">更多</el-button>
+                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">
+                  更多
+                </el-button>
                 <template #dropdown>
                   <el-dropdown-menu>
-                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
+                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                      批量启用
+                    </el-dropdown-item>
+                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                      批量停用
+                    </el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -82,7 +124,13 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_system:menu:refresh']" type="primary" icon="refresh" circle @click="handleRefresh"/>
+                <el-button
+                  v-hasPerm="['module_system:menu:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
           </el-row>
@@ -90,7 +138,19 @@
       </div>
 
       <!-- 表格区域 -->
-      <el-table ref="dataTableRef" v-loading="loading" row-key="id" :data="pageTableData" :tree-props="{children: 'children',hasChildren: 'hasChildren'}" class="data-table__content" :height="540" border stripe @selection-change="handleSelectionChange" @row-click="handleRowClick">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        row-key="id"
+        :data="pageTableData"
+        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+        class="data-table__content"
+        :height="540"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+        @row-click="handleRowClick"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
@@ -129,36 +189,36 @@
         <el-table-column label="是否缓存" prop="keep_alive" min-width="100">
           <template #default="scope">
             <el-tag :type="scope.row.keep_alive ? 'success' : 'danger'">
-              {{ scope.row.keep_alive ? '是' : '否' }}
+              {{ scope.row.keep_alive ? "是" : "否" }}
             </el-tag>
           </template>
         </el-table-column>
         <el-table-column label="是否隐藏" prop="hidden" min-width="100">
           <template #default="scope">
             <el-tag :type="scope.row.hidden ? 'success' : 'danger'">
-              {{ scope.row.hidden ? '是' : '否' }}
+              {{ scope.row.hidden ? "是" : "否" }}
             </el-tag>
           </template>
         </el-table-column>
         <el-table-column label="显示根路由" prop="always_show" min-width="120">
           <template #default="scope">
             <el-tag :type="scope.row.always_show ? 'success' : 'danger'">
-              {{ scope.row.always_show ? '是' : '否' }}
+              {{ scope.row.always_show ? "是" : "否" }}
             </el-tag>
           </template>
         </el-table-column>
         <el-table-column label="固定路由" prop="affix" min-width="100">
           <template #default="scope">
             <el-tag :type="scope.row.affix ? 'success' : 'danger'">
-              {{ scope.row.affix ? '是' : '否' }}
+              {{ scope.row.affix ? "是" : "否" }}
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column label="菜单标题" prop="title" min-width="200"/>
-        <el-table-column label="权限标识" prop="permission" min-width="220"  />
+        <el-table-column label="菜单标题" prop="title" min-width="200" />
+        <el-table-column label="权限标识" prop="permission" min-width="220" />
         <el-table-column label="路由名称" prop="route_name" min-width="200" />
         <el-table-column label="路由路径" prop="route_path" min-width="200" />
-        <el-table-column label="组件路径" prop="component_path" min-width="200"  />
+        <el-table-column label="组件路径" prop="component_path" min-width="200" />
         <el-table-column label="路由参数" prop="params" min-width="100" />
         <el-table-column label="描述" prop="description" min-width="200" />
         <el-table-column label="创建时间" prop="created_at" min-width="200" sortable />
@@ -166,23 +226,68 @@
 
         <el-table-column fixed="right" label="操作" align="center" min-width="260">
           <template #default="scope">
-            <el-button v-if="scope.row.type == MenuTypeEnum.CATALOG || scope.row.type == MenuTypeEnum.MENU" v-hasPerm="['module_system:menu:create']" type="success" link size="small" icon="plus" @click.stop="handleOpenDialog('create', undefined, scope.row.id)">新增</el-button>
-            <el-button v-hasPerm="['module_system:menu:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button v-hasPerm="['module_system:menu:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-            <el-button v-hasPerm="['module_system:menu:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              v-if="scope.row.type == MenuTypeEnum.CATALOG || scope.row.type == MenuTypeEnum.MENU"
+              v-hasPerm="['module_system:menu:create']"
+              type="success"
+              link
+              size="small"
+              icon="plus"
+              @click.stop="handleOpenDialog('create', undefined, scope.row.id)"
+            >
+              新增
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:menu:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:menu:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:menu:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
-
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-drawer v-model="dialogVisible.visible" :title="dialogVisible.title" :size="drawerSize" @close="handleCloseDialog">
+    <el-drawer
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      :size="drawerSize"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
-          <el-descriptions-item label="编号" :span="2">{{ detailFormData.id }}</el-descriptions-item>
-          <el-descriptions-item label="菜单名称" :span="2">{{ detailFormData.name }}</el-descriptions-item>
+          <el-descriptions-item label="编号" :span="2">
+            {{ detailFormData.id }}
+          </el-descriptions-item>
+          <el-descriptions-item label="菜单名称" :span="2">
+            {{ detailFormData.name }}
+          </el-descriptions-item>
           <el-descriptions-item label="菜单类型" :span="2">
             <el-tag v-if="detailFormData.type === MenuTypeEnum.CATALOG" type="warning">目录</el-tag>
             <el-tag v-if="detailFormData.type === MenuTypeEnum.MENU" type="success">菜单</el-tag>
@@ -191,63 +296,110 @@
           </el-descriptions-item>
           <el-descriptions-item label="图标" :span="2">
             <template #default>
-              <template v-if=" detailFormData.icon &&  detailFormData.icon.startsWith('el-icon')">
+              <template v-if="detailFormData.icon && detailFormData.icon.startsWith('el-icon')">
                 <el-icon style="vertical-align: -0.15em">
                   <component :is="detailFormData.icon.replace('el-icon-', '')" />
                 </el-icon>
               </template>
-              <template v-else-if=" detailFormData.icon">
+              <template v-else-if="detailFormData.icon">
                 <div :class="`i-svg:${detailFormData.icon}`" />
               </template>
             </template>
           </el-descriptions-item>
-          <el-descriptions-item label="排序" :span="2">{{ detailFormData.order }}</el-descriptions-item>
-          <el-descriptions-item label="权限标识" :span="2">{{ detailFormData.permission }}</el-descriptions-item>
-          <el-descriptions-item label="路由名称" :span="2">{{ detailFormData.route_name }}</el-descriptions-item>
-          <el-descriptions-item label="路由路径" :span="2">{{ detailFormData.route_path }}</el-descriptions-item>
-          <el-descriptions-item label="组件路径" :span="2">{{ detailFormData.component_path }}</el-descriptions-item>
-          <el-descriptions-item label="重定向" :span="2">{{ detailFormData.redirect }}</el-descriptions-item>
-          <el-descriptions-item label="父级编号" :span="2">{{ detailFormData.parent_id }}</el-descriptions-item>
-          <el-descriptions-item label="父级菜单" :span="2">{{ detailFormData.parent_name }}</el-descriptions-item>
+          <el-descriptions-item label="排序" :span="2">
+            {{ detailFormData.order }}
+          </el-descriptions-item>
+          <el-descriptions-item label="权限标识" :span="2">
+            {{ detailFormData.permission }}
+          </el-descriptions-item>
+          <el-descriptions-item label="路由名称" :span="2">
+            {{ detailFormData.route_name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="路由路径" :span="2">
+            {{ detailFormData.route_path }}
+          </el-descriptions-item>
+          <el-descriptions-item label="组件路径" :span="2">
+            {{ detailFormData.component_path }}
+          </el-descriptions-item>
+          <el-descriptions-item label="重定向" :span="2">
+            {{ detailFormData.redirect }}
+          </el-descriptions-item>
+          <el-descriptions-item label="父级编号" :span="2">
+            {{ detailFormData.parent_id }}
+          </el-descriptions-item>
+          <el-descriptions-item label="父级菜单" :span="2">
+            {{ detailFormData.parent_name }}
+          </el-descriptions-item>
           <el-descriptions-item label="是否缓存" :span="2">
             <el-tag :type="detailFormData.keep_alive ? 'success' : 'danger'">
-              {{ detailFormData.keep_alive ? '是' : '否' }}
+              {{ detailFormData.keep_alive ? "是" : "否" }}
             </el-tag>
           </el-descriptions-item>
           <el-descriptions-item label="是否显示" :span="2">
             <el-tag :type="detailFormData.hidden ? 'success' : 'danger'">
-              {{ detailFormData.hidden ? '是' : '否' }}
+              {{ detailFormData.hidden ? "是" : "否" }}
             </el-tag>
           </el-descriptions-item>
           <el-descriptions-item label="是否显示根路由" :span="2">
             <el-tag :type="detailFormData.always_show ? 'success' : 'danger'">
-              {{ detailFormData.always_show ? '是' : '否' }}
+              {{ detailFormData.always_show ? "是" : "否" }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="菜单标题" :span="2">{{ detailFormData.title }}</el-descriptions-item>
-          <el-descriptions-item label="路由参数" :span="2">{{ detailFormData.params }}</el-descriptions-item>
+          <el-descriptions-item label="菜单标题" :span="2">
+            {{ detailFormData.title }}
+          </el-descriptions-item>
+          <el-descriptions-item label="路由参数" :span="2">
+            {{ detailFormData.params }}
+          </el-descriptions-item>
           <el-descriptions-item label="是否固定路由" :span="2">
             <el-tag :type="detailFormData.affix ? 'success' : 'danger'">
-              {{ detailFormData.affix ? '是' : '否' }}
+              {{ detailFormData.affix ? "是" : "否" }}
             </el-tag>
           </el-descriptions-item>
           <el-descriptions-item label="状态" :span="2">
             <el-tag :type="detailFormData.status ? 'success' : 'danger'">
-              {{ detailFormData.status ? '启用' : '停用' }}
+              {{ detailFormData.status ? "启用" : "停用" }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="排序" :span="2">{{ detailFormData.order }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{ detailFormData.created_at }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="2">{{ detailFormData.updated_at }}</el-descriptions-item>
-          <el-descriptions-item label="描述" :span="4">{{ detailFormData.description }}</el-descriptions-item>
+          <el-descriptions-item label="排序" :span="2">
+            {{ detailFormData.order }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="4">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
 
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
-          <el-form-item v-if="formData.type !== MenuTypeEnum.CATALOG" label="父级菜单" prop="parent_id" if >
-            <el-tree-select v-model="formData.parent_id" placeholder="选择上级菜单" :data="menuOptions" filterable check-strictly :render-after-expand="false" />
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
+          <el-form-item
+            v-if="formData.type !== MenuTypeEnum.CATALOG"
+            label="父级菜单"
+            prop="parent_id"
+            if
+          >
+            <el-tree-select
+              v-model="formData.parent_id"
+              placeholder="选择上级菜单"
+              :data="menuOptions"
+              filterable
+              check-strictly
+              :render-after-expand="false"
+            />
           </el-form-item>
 
           <el-form-item label="菜单名称" prop="name">
@@ -271,7 +423,7 @@
             <el-input v-model="formData.route_path" placeholder="请输入外链完整路径" />
           </el-form-item>
 
-          <el-form-item  prop="route_name">
+          <el-form-item prop="route_name">
             <template #label>
               <div class="flex-y-center">
                 路由名称
@@ -288,14 +440,17 @@
             <el-input v-model="formData.route_name" placeholder="请输入路由名称" />
           </el-form-item>
 
-          <el-form-item v-if="formData.type == MenuTypeEnum.CATALOG || formData.type == MenuTypeEnum.MENU" prop="route_path">
+          <el-form-item
+            v-if="formData.type == MenuTypeEnum.CATALOG || formData.type == MenuTypeEnum.MENU"
+            prop="route_path"
+          >
             <template #label>
               <div class="flex-y-center">
                 路由路径
                 <el-tooltip placement="bottom" effect="light">
                   <template #content>
-                    定义应用中不同页面对应的 URL 路径，目录需以 / 开头，菜单项不用。例如：系统管理目录
-                    /system，系统管理下的用户管理菜单 user。
+                    定义应用中不同页面对应的 URL 路径，目录需以 /
+                    开头，菜单项不用。例如：系统管理目录 /system，系统管理下的用户管理菜单 user。
                   </template>
                   <el-icon class="ml-1 cursor-pointer">
                     <QuestionFilled />
@@ -303,7 +458,7 @@
                 </el-tooltip>
               </div>
             </template>
-            <el-input  v-model="formData.route_path" placeholder="请输入路由路径,如：/system" />
+            <el-input v-model="formData.route_path" placeholder="请输入路由路径,如：/system" />
           </el-form-item>
 
           <el-form-item v-if="formData.type == MenuTypeEnum.MENU" prop="component">
@@ -321,7 +476,11 @@
               </div>
             </template>
 
-            <el-input v-model="formData.component_path" placeholder="请输入组件路径，如system/user/index" style="width: 95%">
+            <el-input
+              v-model="formData.component_path"
+              placeholder="请输入组件路径，如system/user/index"
+              style="width: 95%"
+            >
               <template v-if="formData.type == MenuTypeEnum.MENU" #prepend>src/views/</template>
               <template v-if="formData.type == MenuTypeEnum.MENU" #append>.vue</template>
             </el-input>
@@ -342,7 +501,11 @@
               </div>
             </template>
 
-            <div v-if="!formData.params || (Array.isArray(formData.params) && formData.params.length === 0)">
+            <div
+              v-if="
+                !formData.params || (Array.isArray(formData.params) && formData.params.length === 0)
+              "
+            >
               <el-button type="success" plain @click="formData.params = [{ key: '', value: '' }]">
                 添加路由参数
               </el-button>
@@ -356,10 +519,19 @@
 
                 <el-input v-model="item.value" placeholder="参数值" style="width: 100px" />
 
-                <el-icon v-if="formData.params.indexOf(item) === formData.params.length - 1" class="ml-2 cursor-pointer color-[var(--el-color-success)]" style="vertical-align: -0.15em" @click="formData.params.push({ key: '', value: '' })">
+                <el-icon
+                  v-if="formData.params.indexOf(item) === formData.params.length - 1"
+                  class="ml-2 cursor-pointer color-[var(--el-color-success)]"
+                  style="vertical-align: -0.15em"
+                  @click="formData.params.push({ key: '', value: '' })"
+                >
                   <CirclePlusFilled />
                 </el-icon>
-                <el-icon class="ml-2 cursor-pointer color-[var(--el-color-danger)]" style="vertical-align: -0.15em" @click="formData.params.splice(formData.params.indexOf(item), 1)">
+                <el-icon
+                  class="ml-2 cursor-pointer color-[var(--el-color-danger)]"
+                  style="vertical-align: -0.15em"
+                  @click="formData.params.splice(formData.params.indexOf(item), 1)"
+                >
                   <DeleteFilled />
                 </el-icon>
               </div>
@@ -390,7 +562,9 @@
             </el-radio-group>
           </el-form-item>
 
-          <el-form-item v-if="formData.type === MenuTypeEnum.CATALOG || formData.type === MenuTypeEnum.MENU">
+          <el-form-item
+            v-if="formData.type === MenuTypeEnum.CATALOG || formData.type === MenuTypeEnum.MENU"
+          >
             <template #label>
               <div class="flex-y-center">
                 始终显示
@@ -423,11 +597,15 @@
           </el-form-item>
 
           <el-form-item label="排序" prop="order">
-            <el-input-number v-model="formData.order"  controls-position="right" :min="1" />
+            <el-input-number v-model="formData.order" controls-position="right" :min="1" />
           </el-form-item>
 
           <!-- 权限标识 -->
-          <el-form-item v-if="formData.type == MenuTypeEnum.BUTTON || formData.type === MenuTypeEnum.MENU" label="权限标识" prop="perm">
+          <el-form-item
+            v-if="formData.type == MenuTypeEnum.BUTTON || formData.type === MenuTypeEnum.MENU"
+            label="权限标识"
+            prop="perm"
+          >
             <el-input v-model="formData.permission" placeholder="请输入权限标识，如sys:user:add" />
           </el-form-item>
 
@@ -436,7 +614,11 @@
             <icon-select v-model="formData.icon" />
           </el-form-item>
 
-          <el-form-item v-if="formData.type == MenuTypeEnum.CATALOG || formData.type === MenuTypeEnum.MENU" label="重定向" prop="redirect">
+          <el-form-item
+            v-if="formData.type == MenuTypeEnum.CATALOG || formData.type === MenuTypeEnum.MENU"
+            label="重定向"
+            prop="redirect"
+          >
             <el-input v-model="formData.redirect" placeholder="请输入重定向路由" />
           </el-form-item>
 
@@ -455,7 +637,14 @@
           </el-form-item>
 
           <el-form-item label="描述" prop="description">
-            <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
         </el-form>
       </template>
@@ -463,8 +652,22 @@
       <template #footer>
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
-          <el-button v-if="dialogVisible.type !== 'detail'" v-hasPerm="['module_system:menu:submit']" type="primary" @click="handleSubmit">确定</el-button>
-          <el-button v-else v-hasPerm="['module_system:menu:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
+          <el-button
+            v-if="dialogVisible.type !== 'detail'"
+            v-hasPerm="['module_system:menu:submit']"
+            type="primary"
+            @click="handleSubmit"
+          >
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['module_system:menu:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
           <el-button @click="handleCloseDialog">取消</el-button>
         </div>
       </template>
@@ -519,27 +722,27 @@ const formData = reactive<MenuForm>({
   type: MenuTypeEnum.CATALOG,
   icon: undefined,
   order: 999,
-  permission: '',
-  route_name: '',
-  route_path: '',
+  permission: "",
+  route_name: "",
+  route_path: "",
   component_path: undefined,
   redirect: undefined,
   parent_id: undefined,
   keep_alive: false,
   hidden: false,
   always_show: false,
-  title: '',
+  title: "",
   params: undefined,
   affix: false,
   status: true,
   description: undefined,
-})
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "600px" : "90%"));
@@ -562,14 +765,14 @@ const rules = reactive({
     { required: true, message: "请输入路由路径", trigger: "blur" },
     {
       validator: (rule: any, value: string, callback: any) => {
-        if (value && !value.startsWith('/')) {
-          callback(new Error('目录和菜单路由必须以/开头'));
+        if (value && !value.startsWith("/")) {
+          callback(new Error("目录和菜单路由必须以/开头"));
         } else {
           callback();
         }
       },
-      trigger: 'blur'
-    }
+      trigger: "blur",
+    },
   ],
   component_path: [{ required: true, message: "请输入组件路径", trigger: "blur" }],
   title: [
@@ -601,25 +804,25 @@ function handleDateRangeChange(range: [Date, Date]) {
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   loading.value = true;
   try {
     const response = await MenuAPI.getMenuList(queryFormData);
-    pageTableData.value = response.data.data
+    pageTableData.value = response.data.data;
   } catch (error: any) {
     console.error(error);
   } finally {
     loading.value = false;
   }
-};
+}
 
 // 修改菜单选项过滤逻辑，添加递归过滤函数
 const filterMenuTypes = (nodes: MenuTable[]) => {
   return nodes
-    .filter(node => node.type === MenuTypeEnum.CATALOG || node.type === MenuTypeEnum.MENU)
+    .filter((node) => node.type === MenuTypeEnum.CATALOG || node.type === MenuTypeEnum.MENU)
     .map((node: any): any => ({
       ...node,
-      children: node.children ? filterMenuTypes(node.children) : []
+      children: node.children ? filterMenuTypes(node.children) : [],
     }));
 };
 
@@ -628,14 +831,12 @@ async function loadingData() {
   loading.value = true;
   try {
     const response = await MenuAPI.getMenuList(queryFormData);
-    pageTableData.value = response.data.data
+    pageTableData.value = response.data.data;
     // 加载菜单选项，只显示目录、菜单
     menuOptions.value = formatTree(filterMenuTypes(response.data.data));
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -662,21 +863,21 @@ const initialFormData: MenuForm = {
   type: MenuTypeEnum.MENU,
   icon: undefined,
   order: 1,
-  permission: '',
-  route_name: '',
-  route_path: '',
-  component_path: '',
-  redirect: '',
+  permission: "",
+  route_name: "",
+  route_path: "",
+  component_path: "",
+  redirect: "",
   parent_id: undefined,
   keep_alive: false,
   hidden: false,
   always_show: false,
-  title: '',
+  title: "",
   params: [] as { key: string; value: string }[],
   affix: false,
   status: true,
   description: undefined,
-}
+};
 
 // 重置表单
 async function resetForm() {
@@ -705,14 +906,18 @@ async function handleCloseDialog() {
 }
 
 //打开弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number, parentId?: number) {
+async function handleOpenDialog(
+  type: "create" | "update" | "detail",
+  id?: number,
+  parentId?: number
+) {
   dialogVisible.type = type;
   if (id) {
     const response = await MenuAPI.getMenuDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "菜单详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改菜单";
       Object.assign(formData, response.data.data);
     }
@@ -748,9 +953,9 @@ async function handleSubmit() {
       const id = formData.id;
       try {
         if (id) {
-          await MenuAPI.updateMenu(id, formData)
+          await MenuAPI.updateMenu(id, formData);
         } else {
-          await MenuAPI.createMenu(formData)
+          await MenuAPI.createMenu(formData);
         }
         await userStore.getUserInfo();
         dialogVisible.visible = false;
@@ -771,41 +976,45 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await MenuAPI.deleteMenu(ids);
-      await userStore.getUserInfo();
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await MenuAPI.deleteMenu(ids);
+        await userStore.getUserInfo();
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 批量启用/停用
 async function handleMoreClick(status: boolean) {
-  ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
+  ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await MenuAPI.batchAvailableMenu({ ids: selectIds.value, status });
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await MenuAPI.batchAvailableMenu({ ids: selectIds.value, status });
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 onMounted(() => {
diff --git a/frontend/src/views/module_system/notice/index.vue b/frontend/src/views/module_system/notice/index.vue
index c406ec69..42ac0688 100644
--- a/frontend/src/views/module_system/notice/index.vue
+++ b/frontend/src/views/module_system/notice/index.vue
@@ -3,12 +3,23 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery">
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="notice_title" label="标题">
           <el-input v-model="queryFormData.notice_title" placeholder="请输入标题" clearable />
         </el-form-item>
         <el-form-item prop="notice_type" label="类型">
-          <el-select v-model="queryFormData.notice_type" placeholder="请选择类型" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.notice_type"
+            placeholder="请选择类型"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option
               v-for="item in dictStore.getDictArray('sys_notice_type')"
               :key="item.dict_value"
@@ -18,33 +29,44 @@
           </el-select>
         </el-form-item>
         <el-form-item prop="status" label="状态">
-          <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option value="true" label="启用" />
             <el-option value="false" label="停用" />
           </el-select>
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <el-form-item v-if="isExpand" prop="creator" label="创建人">
           <UserTableSelect
-              v-model="queryFormData.creator"
-              @confirm-click="handleConfirm"
-              @clear-click="handleQuery"
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
           />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_system:notice:query']" type="primary" icon="search" native-type="submit">
-              查询
-            </el-button>
-          <el-button v-hasPerm="['module_system:notice:query']" icon="refresh" @click="handleResetQuery">
-              重置
-            </el-button>
+          <el-button
+            v-hasPerm="['module_system:notice:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_system:notice:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
           <!-- 展开/收起 -->
           <template v-if="isExpandable">
             <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
@@ -81,18 +103,39 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:notice:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
+              <el-button
+                v-hasPerm="['module_system:notice:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:notice:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_system:notice:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-dropdown v-hasPerm="['module_system:notice:patch']" trigger="click">
-                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">更多</el-button>
+                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">
+                  更多
+                </el-button>
                 <template #dropdown>
                   <el-dropdown-menu>
-                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
+                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                      批量启用
+                    </el-dropdown-item>
+                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                      批量停用
+                    </el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -103,12 +146,24 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="导出">
-                <el-button v-hasPerm="['module_system:notice:export']" type="warning" icon="download" circle @click="handleOpenExportsModal" />
+                <el-button
+                  v-hasPerm="['module_system:notice:export']"
+                  type="warning"
+                  icon="download"
+                  circle
+                  @click="handleOpenExportsModal"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_system:notice:refresh']" type="primary" icon="refresh" circle @click="handleRefresh" />
+                <el-button
+                  v-hasPerm="['module_system:notice:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -128,58 +183,170 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        :height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" min-width="55" align="center" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" fixed label="序号" min-width="60" >
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          min-width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          fixed
+          label="序号"
+          min-width="60"
+        >
           <template #default="scope">
             {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'notice_title')?.show" label="通知标题" prop="notice_title" min-width="140" show-overflow-tooltip/>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'status')?.show" label="状态" prop="status" min-width="80">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'notice_title')?.show"
+          label="通知标题"
+          prop="notice_title"
+          min-width="140"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'status')?.show"
+          label="状态"
+          prop="status"
+          min-width="80"
+        >
           <template #default="scope">
             <el-tag :type="scope.row.status === true ? 'success' : 'danger'">
               {{ scope.row.status === true ? "启用" : "停用" }}
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'notice_type')?.show" label="类型" prop="notice_type" min-width="80">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'notice_type')?.show"
+          label="类型"
+          prop="notice_type"
+          min-width="80"
+        >
           <template #default="scope">
             <el-tag :type="scope.row.notice_type === '1' ? 'primary' : 'warning'">
-              {{ (scope.row.notice_type ? dictStore.getDictLabel('sys_notice_type', scope.row.notice_type) as any : undefined)?.dict_label || scope.row.notice_type }}
+              {{
+                (scope.row.notice_type
+                  ? (dictStore.getDictLabel("sys_notice_type", scope.row.notice_type) as any)
+                  : undefined
+                )?.dict_label || scope.row.notice_type
+              }}
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'notice_content')?.show" label="内容" prop="notice_content" min-width="200" show-overflow-tooltip />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'description')?.show" label="描述" prop="description" min-width="140" show-overflow-tooltip/>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'created_at')?.show" label="创建时间" prop="created_at" min-width="180" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'updated_at')?.show" label="更新时间" prop="updated_at" min-width="180" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'creator')?.show" key="creator" label="创建人" min-width="100">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'notice_content')?.show"
+          label="内容"
+          prop="notice_content"
+          min-width="200"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'description')?.show"
+          label="描述"
+          prop="description"
+          min-width="140"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          label="创建时间"
+          prop="created_at"
+          min-width="180"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          label="更新时间"
+          prop="updated_at"
+          min-width="180"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'creator')?.show"
+          key="creator"
+          label="创建人"
+          min-width="100"
+        >
           <template #default="scope">
             {{ scope.row.creator?.name }}
           </template>
         </el-table-column>
 
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" fixed="right" label="操作" align="center" min-width="200">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="200"
+        >
           <template #default="scope">
-            <el-button v-hasPerm="['module_system:notice:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button v-hasPerm="['module_system:notice:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-            <el-button v-hasPerm="['module_system:notice:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              v-hasPerm="['module_system:notice:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:notice:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:notice:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
@@ -188,12 +355,17 @@
           </el-descriptions-item>
           <el-descriptions-item label="类型" :span="2">
             <el-tag :type="detailFormData.notice_type === '1' ? 'primary' : 'warning'">
-              {{ (detailFormData.notice_type ? dictStore.getDictLabel('sys_notice_type', detailFormData.notice_type) as any : undefined)?.dict_label || detailFormData.notice_type }}
+              {{
+                (detailFormData.notice_type
+                  ? (dictStore.getDictLabel("sys_notice_type", detailFormData.notice_type) as any)
+                  : undefined
+                )?.dict_label || detailFormData.notice_type
+              }}
             </el-tag>
           </el-descriptions-item>
           <el-descriptions-item label="状态" :span="2">
             <el-tag :type="detailFormData.status ? 'success' : 'danger'">
-              {{ detailFormData.status ? '启用' : '停用' }}
+              {{ detailFormData.status ? "启用" : "停用" }}
             </el-tag>
           </el-descriptions-item>
           <el-descriptions-item label="内容" :span="2">
@@ -215,12 +387,27 @@
       </template>
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right" :inline="true">
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+          :inline="true"
+        >
           <el-form-item label="标题" prop="notice_title">
             <el-input v-model="formData.notice_title" placeholder="请输入标题" :maxlength="50" />
           </el-form-item>
-          <el-form-item label="描述" prop="description" >
-            <el-input v-model="formData.description" :rows="1" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+          <el-form-item label="描述" prop="description">
+            <el-input
+              v-model="formData.description"
+              :rows="1"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
           <el-form-item label="类型" prop="notice_type" class="w-50">
             <el-select v-model="formData.notice_type" placeholder="请选择类型" clearable>
@@ -230,17 +417,12 @@
                 :value="item.dict_value"
                 :label="item.dict_label"
               />
-
             </el-select>
           </el-form-item>
-          <el-form-item label="状态" prop="status" >
+          <el-form-item label="状态" prop="status">
             <el-radio-group v-model="formData.status">
-              <el-radio :value="true">
-                启用
-              </el-radio>
-              <el-radio :value="false">
-                停用
-              </el-radio>
+              <el-radio :value="true">启用</el-radio>
+              <el-radio :value="false">停用</el-radio>
             </el-radio-group>
           </el-form-item>
           <el-form-item label="内容" prop="notice_content">
@@ -254,14 +436,31 @@
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
           <el-button @click="handleCloseDialog">取消</el-button>
-          <el-button v-if="dialogVisible.type !== 'detail'" v-hasPerm="['module_system:notice:submit']" type="primary" @click="handleSubmit">确定</el-button>
-          <el-button v-else v-hasPerm="['module_system:notice:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
+          <el-button
+            v-if="dialogVisible.type !== 'detail'"
+            v-hasPerm="['module_system:notice:submit']"
+            type="primary"
+            @click="handleSubmit"
+          >
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['module_system:notice:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
         </div>
       </template>
     </el-dialog>
 
-    <ExportModal v-model="exportsDialogVisible" :content-config="curdContentConfig" :selection-data="selectionRows" />
-
+    <ExportModal
+      v-model="exportsDialogVisible"
+      :content-config="curdContentConfig"
+      :selection-data="selectionRows"
+    />
   </div>
 </template>
 
@@ -297,18 +496,18 @@ const selectionRows = ref<NoticeTable[]>([]);
 
 // 表格列配置
 const tableColumns = ref([
-  { prop: 'selection', label: '选择框', show: true },
-  { prop: 'index', label: '序号', show: true },
-  { prop: 'notice_title', label: '标题', show: true },
-  { prop: 'notice_type', label: '类型', show: true },
-  { prop: 'notice_content', label: '内容', show: true },
-  { prop: 'status', label: '状态', show: true },
-  { prop: 'description', label: '描述', show: true },
-  { prop: 'created_at', label: '创建时间', show: true },
-  { prop: 'updated_at', label: '更新时间', show: true },
-  { prop: 'creator', label: '创建人', show: true },
-  { prop: 'operation', label: '操作', show: true }
-])
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "notice_title", label: "标题", show: true },
+  { prop: "notice_type", label: "类型", show: true },
+  { prop: "notice_content", label: "内容", show: true },
+  { prop: "status", label: "状态", show: true },
+  { prop: "description", label: "描述", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "creator", label: "创建人", show: true },
+  { prop: "operation", label: "操作", show: true },
+]);
 
 // 详情表单
 const detailFormData = ref<NoticeTable>({});
@@ -329,18 +528,18 @@ const queryFormData = reactive<NoticePageQuery>({
 // 编辑表单
 const formData = reactive<NoticeForm>({
   id: undefined,
-  notice_title: '',
-  notice_type: '',
-  notice_content: '',
+  notice_title: "",
+  notice_type: "",
+  notice_content: "",
   status: true,
   description: undefined,
-})
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -367,9 +566,9 @@ function handleDateRangeChange(range: [Date, Date]) {
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -378,11 +577,9 @@ async function loadingData() {
     const response = await NoticeAPI.getNoticeList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -412,12 +609,12 @@ async function handleResetQuery() {
 // 定义初始表单数据常量
 const initialFormData: NoticeForm = {
   id: undefined,
-  notice_title: '',
-  notice_type: '',
-  notice_content: '',
+  notice_title: "",
+  notice_type: "",
+  notice_content: "",
   status: true,
   description: undefined,
-}
+};
 
 // 重置表单
 async function resetForm() {
@@ -442,14 +639,14 @@ async function handleCloseDialog() {
 }
 
 // 打开弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await NoticeAPI.getNoticeDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "公告通知详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改公告通知";
       Object.assign(formData, response.data.data);
     }
@@ -470,7 +667,7 @@ async function handleSubmit() {
       const id = formData.id;
       if (id) {
         try {
-          await NoticeAPI.updateNotice(id, { id, ...formData })
+          await NoticeAPI.updateNotice(id, { id, ...formData });
           dialogVisible.visible = false;
           resetForm();
           handleCloseDialog();
@@ -482,7 +679,7 @@ async function handleSubmit() {
         }
       } else {
         try {
-          await NoticeAPI.createNotice(formData)
+          await NoticeAPI.createNotice(formData);
           dialogVisible.visible = false;
           resetForm();
           handleCloseDialog();
@@ -503,19 +700,21 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await NoticeAPI.deleteNotice(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await NoticeAPI.deleteNotice(ids);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 导出弹窗
@@ -526,45 +725,46 @@ async function handleOpenExportsModal() {
 // 批量启用/停用
 async function handleMoreClick(status: boolean) {
   if (selectIds.value.length) {
-    ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
+    ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
       confirmButtonText: "确定",
       cancelButtonText: "取消",
       type: "warning",
-    }).then(async () => {
-      try {
-        loading.value = true;
-        await NoticeAPI.batchAvailableNotice({ ids: selectIds.value, status });
-        handleResetQuery();
-      } catch (error: any) {
-        console.error(error);
-      } finally {
-        loading.value = false;
-      }
-    }).catch(() => {
-      ElMessageBox.close();
-    });
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await NoticeAPI.batchAvailableNotice({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
   }
 }
 
-
 // 导出字段
 const exportColumns = [
-  { prop: 'notice_title', label: '标题' },
-  { prop: 'status', label: '状态' },
-  { prop: 'notice_type', label: '类型' },
-  { prop: 'notice_content', label: '内容' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "notice_title", label: "标题" },
+  { prop: "status", label: "状态" },
+  { prop: "notice_type", label: "类型" },
+  { prop: "notice_content", label: "内容" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导入/导出配置（用于导出弹窗）
 const curdContentConfig = {
-  permPrefix: 'module_system:notice',
+  permPrefix: "module_system:notice",
   cols: exportColumns as any,
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.status === 'string') query.status = query.status === 'true';
+    if (typeof query.status === "string") query.status = query.status === "true";
     // notice_type 为字符串，无需转换；如果后端需要数字，可在此转换
     query.page_no = 1;
     query.page_size = 1000;
@@ -583,7 +783,7 @@ const curdContentConfig = {
 
 onMounted(async () => {
   // 加载字典数据
-  await dictStore.getDict(['sys_notice_type']);
+  await dictStore.getDict(["sys_notice_type"]);
   // 加载表格数据
   loadingData();
 });
diff --git a/frontend/src/views/module_system/param/components/ConfigInfoDrawer.vue b/frontend/src/views/module_system/param/components/ConfigInfoDrawer.vue
index 9c2f5cb9..055c2c0d 100644
--- a/frontend/src/views/module_system/param/components/ConfigInfoDrawer.vue
+++ b/frontend/src/views/module_system/param/components/ConfigInfoDrawer.vue
@@ -1,6 +1,12 @@
 <template>
-  <el-drawer v-model="drawerVisible" title="配置中心" :size="drawerSize" destroy-on-close @closed="onDrawerClosed">
-    <el-tabs v-model="activeTabRef" type="border-card" >
+  <el-drawer
+    v-model="drawerVisible"
+    title="配置中心"
+    :size="drawerSize"
+    destroy-on-close
+    @closed="onDrawerClosed"
+  >
+    <el-tabs v-model="activeTabRef" type="border-card">
       <!-- 网站配置 -->
       <el-tab-pane label="网站配置" name="website">
         <el-form :model="configState" label-suffix=":" label-width="auto" label-position="right">
@@ -37,9 +43,8 @@
                 />
               </div>
             </el-form-item>
-          </div>      
+          </div>
         </el-form>
-
       </el-tab-pane>
       <el-tab-pane label="安全隐私" name="securityPrivacy">
         <el-form :model="configState" label-suffix=":" label-width="auto" label-position="right">
@@ -86,17 +91,23 @@
           <div v-for="(item, key) in apiWhitelistConfigs" :key="key">
             <el-form-item :label="item.config_name">
               <div class="space-y-2">
-                <div v-for="listItem in apiWhitelistItems" :key="listItem.id" class="flex items-center gap-2">
+                <div
+                  v-for="listItem in apiWhitelistItems"
+                  :key="listItem.id"
+                  class="flex items-center gap-2"
+                >
                   <el-input
                     v-model="listItem.value"
                     :placeholder="'/api/v1/users/get'"
                     clearable
                     @input="markModified(key)"
-                    @blur="{
-                      if (!isValidApiPath(listItem.value) && listItem.value.trim()) {
-                        ElMessage.warning('请输入有效的接口路径格式（以/开头）');
+                    @blur="
+                      {
+                        if (!isValidApiPath(listItem.value) && listItem.value.trim()) {
+                          ElMessage.warning('请输入有效的接口路径格式（以/开头）');
+                        }
                       }
-                    }"
+                    "
                   />
                   <el-button
                     type="danger"
@@ -130,18 +141,24 @@
           <div v-for="(item, key) in ipBlacklistConfigs" :key="key">
             <el-form-item :label="item.config_name">
               <div class="space-y-2">
-                <div v-for="listItem in ipBlacklistItems" :key="listItem.id" class="flex items-center gap-2">
+                <div
+                  v-for="listItem in ipBlacklistItems"
+                  :key="listItem.id"
+                  class="flex items-center gap-2"
+                >
                   <el-input
                     v-model="listItem.value"
                     :placeholder="'192.168.1.1'"
                     clearable
                     style="flex: 1"
                     @input="markModified(key)"
-                    @blur="{
-                      if (!isValidIp(listItem.value) && listItem.value.trim()) {
-                        ElMessage.warning('请输入有效的IP地址格式');
+                    @blur="
+                      {
+                        if (!isValidIp(listItem.value) && listItem.value.trim()) {
+                          ElMessage.warning('请输入有效的IP地址格式');
+                        }
                       }
-                    }"
+                    "
                   />
                   <el-button
                     type="danger"
@@ -176,17 +193,18 @@
             <el-form-item :label="item.config_name">
               <!-- 演示模式开关 -->
               <template v-if="key === 'demo_enable'">
-                  <el-switch
-                    inline-prompt
-                    active-text="启用"
-                    inactive-text="禁用"
-                    :model-value="item.config_value === 'true'"
-                    @update:model-value="(value) => {
+                <el-switch
+                  inline-prompt
+                  active-text="启用"
+                  inactive-text="禁用"
+                  :model-value="item.config_value === 'true'"
+                  @update:model-value="
+                    (value) => {
                       item.config_value = value ? 'true' : 'false';
                       markModified(key);
-                    }"
-                    
-                  />
+                    }
+                  "
+                />
                 <div class="text-xs text-gray-500 mt-1">
                   配置说明：启用后系统将进入演示模式，部分功能可能受限。
                 </div>
@@ -194,18 +212,24 @@
               <!-- IP白名单 -->
               <template v-else-if="key === 'ip_white_list'">
                 <div class="space-y-2">
-                  <div v-for="listItem in demoIpWhitelistItems" :key="listItem.id" class="flex items-center gap-2">
+                  <div
+                    v-for="listItem in demoIpWhitelistItems"
+                    :key="listItem.id"
+                    class="flex items-center gap-2"
+                  >
                     <el-input
                       v-model="listItem.value"
                       :placeholder="'192.168.1.1'"
                       clearable
                       style="flex: 1"
                       @input="markModified(key)"
-                      @blur="{
-                        if (!isValidIp(listItem.value) && listItem.value.trim()) {
-                          ElMessage.warning('请输入有效的IP地址格式');
+                      @blur="
+                        {
+                          if (!isValidIp(listItem.value) && listItem.value.trim()) {
+                            ElMessage.warning('请输入有效的IP地址格式');
+                          }
                         }
-                      }"
+                      "
                     />
                     <el-button
                       type="danger"
@@ -228,7 +252,6 @@
                     配置说明：演示模式下，只有白名单中的IP地址可以访问系统，支持单个IP配置。
                   </div>
                 </div>
-                
               </template>
               <!-- 其他配置项 -->
               <template v-else>
@@ -245,20 +268,27 @@
         </el-form>
       </el-tab-pane>
     </el-tabs>
-    <template #footer> 
+    <template #footer>
       <el-button @click="handleCloseDialog">取消</el-button>
-      <el-button v-hasPerm="['module_system:config:update']" type="primary" :disabled="!hasChanges" @click="submitChanges">保存</el-button>
+      <el-button
+        v-hasPerm="['module_system:config:update']"
+        type="primary"
+        :disabled="!hasChanges"
+        @click="submitChanges"
+      >
+        保存
+      </el-button>
     </template>
   </el-drawer>
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive, onMounted, computed } from 'vue';
-import ParamsAPI, { type ConfigTable } from '@/api/module_system/params';
+import { ref, reactive, onMounted, computed } from "vue";
+import ParamsAPI, { type ConfigTable } from "@/api/module_system/params";
 import { useConfigStore } from "@/store";
-import { useI18n } from 'vue-i18n';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import SingleImageUpload from '@/components/Upload/SingleImageUpload.vue';
+import { useI18n } from "vue-i18n";
+import { ElMessage, ElMessageBox } from "element-plus";
+import SingleImageUpload from "@/components/Upload/SingleImageUpload.vue";
 import { useAppStore } from "@/store/modules/app.store";
 import { DeviceEnum } from "@/enums/settings/device.enum";
 
@@ -275,7 +305,8 @@ const generateId = () => {
 
 // IP地址验证函数
 const isValidIp = (ip: string): boolean => {
-  const ipRegex = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
+  const ipRegex =
+    /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
   return ipRegex.test(ip);
 };
 
@@ -283,31 +314,31 @@ const isValidIp = (ip: string): boolean => {
 const isValidApiPath = (path: string): boolean => {
   const pathRegex = /^\/[\w\-/]+$/;
   return pathRegex.test(path);
-}
+};
 
 const appStore = useAppStore();
 const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "60%" : "60%"));
 
 const t = useI18n().t;
 const configStore = useConfigStore();
-const activeTabRef = ref('website')
+const activeTabRef = ref("website");
 
 // 与父组件的 v-model 同步
 const props = defineProps<{ modelValue: boolean }>();
-const emit = defineEmits(['update:modelValue']);
+const emit = defineEmits(["update:modelValue"]);
 const drawerVisible = computed({
   get: () => props.modelValue,
-  set: (val: boolean) => emit('update:modelValue', val)
+  set: (val: boolean) => emit("update:modelValue", val),
 });
 
 // 配置状态管理
 const configState = reactive<ConfigTable>({
   id: undefined,
-  config_name: '',
-  config_key: '',
-  config_value: '',
+  config_name: "",
+  config_key: "",
+  config_value: "",
   config_type: undefined,
-  description: ''
+  description: "",
 });
 
 // 记录修改过的字段
@@ -329,68 +360,72 @@ const submitChanges = async () => {
   try {
     // 准备提交数据
     // 1. 处理接口白名单
-    if ('white_api_list_path' in modifiedFields && apiWhitelistConfigs.value.white_api_list_path?.id) {
+    if (
+      "white_api_list_path" in modifiedFields &&
+      apiWhitelistConfigs.value.white_api_list_path?.id
+    ) {
       const apiWhitelistArray = apiWhitelistItems.value
-        .map(item => item.value.trim())
+        .map((item) => item.value.trim())
         .filter(Boolean);
       // 转换为JSON字符串格式保存
       const apiWhitelistJson = JSON.stringify(apiWhitelistArray);
       await ParamsAPI.updateConfig(apiWhitelistConfigs.value.white_api_list_path.id, {
         ...apiWhitelistConfigs.value.white_api_list_path,
-        config_value: apiWhitelistJson
+        config_value: apiWhitelistJson,
       });
     }
 
     // 2. 处理IP黑名单
-    if ('ip_black_list' in modifiedFields && ipBlacklistConfigs.value.ip_black_list?.id) {
+    if ("ip_black_list" in modifiedFields && ipBlacklistConfigs.value.ip_black_list?.id) {
       const ipBlacklistArray = ipBlacklistItems.value
-        .map(item => item.value.trim())
+        .map((item) => item.value.trim())
         .filter(Boolean);
       // 转换为JSON字符串格式保存
       const ipBlacklistJson = JSON.stringify(ipBlacklistArray);
       await ParamsAPI.updateConfig(ipBlacklistConfigs.value.ip_black_list.id, {
         ...ipBlacklistConfigs.value.ip_black_list,
-        config_value: ipBlacklistJson
+        config_value: ipBlacklistJson,
       });
     }
 
     // 3. 处理演示环境IP白名单
-    if ('ip_white_list' in modifiedFields && demoConfigs.value.ip_white_list?.id) {
+    if ("ip_white_list" in modifiedFields && demoConfigs.value.ip_white_list?.id) {
       const demoIpWhitelistArray = demoIpWhitelistItems.value
-        .map(item => item.value.trim())
+        .map((item) => item.value.trim())
         .filter(Boolean);
       // 转换为JSON字符串格式保存
       const demoIpWhitelistJson = JSON.stringify(demoIpWhitelistArray);
       await ParamsAPI.updateConfig(demoConfigs.value.ip_white_list.id, {
         ...demoConfigs.value.ip_white_list,
-        config_value: demoIpWhitelistJson
+        config_value: demoIpWhitelistJson,
       });
     }
 
     // 4. 处理其他配置项
-    const otherKeys = keysToSubmit.filter(key => 
-      !['white_api_list_path', 'ip_black_list', 'ip_white_list'].includes(key)
+    const otherKeys = keysToSubmit.filter(
+      (key) => !["white_api_list_path", "ip_black_list", "ip_white_list"].includes(key)
     );
-    const otherUpdatePromises = otherKeys.map(key => {
-      const item = systemConfigs.value[key as keyof typeof systemConfigs.value] || 
-                 logoConfigs.value[key as keyof typeof logoConfigs.value] ||
-                 securityPrivacyConfigs.value[key as keyof typeof securityPrivacyConfigs.value] ||
-                 userAgreementConfigs.value[key as keyof typeof userAgreementConfigs.value] ||
-                 demoConfigs.value[key as keyof typeof demoConfigs.value];
+    const otherUpdatePromises = otherKeys.map((key) => {
+      const item =
+        systemConfigs.value[key as keyof typeof systemConfigs.value] ||
+        logoConfigs.value[key as keyof typeof logoConfigs.value] ||
+        securityPrivacyConfigs.value[key as keyof typeof securityPrivacyConfigs.value] ||
+        userAgreementConfigs.value[key as keyof typeof userAgreementConfigs.value] ||
+        demoConfigs.value[key as keyof typeof demoConfigs.value];
       return item && item.id ? ParamsAPI.updateConfig(item.id, { ...item }) : Promise.resolve();
     });
     await Promise.all(otherUpdatePromises);
 
     // 清除已提交的修改标记
-    keysToSubmit.forEach(key => {
+    keysToSubmit.forEach((key) => {
       delete modifiedFields[key];
     });
-    
+
     // 重新加载配置数据
     await configStore.getConfig();
     initializeLists();
   } catch (error) {
-    console.error('保存失败:', error);
+    console.error("保存失败:", error);
   }
 };
 
@@ -398,22 +433,27 @@ const submitChanges = async () => {
 const resetForm = () => {
   // 重置动态列表
   initializeLists();
-  
+
   // 重置其他配置项
   const keysToReset = Object.keys(modifiedFields);
   for (const key of keysToReset) {
     if (systemConfigs.value[key as keyof typeof systemConfigs.value]) {
-      systemConfigs.value[key as keyof typeof systemConfigs.value].config_value = configStore.configData[key as keyof typeof configStore.configData]?.config_value || '';
+      systemConfigs.value[key as keyof typeof systemConfigs.value].config_value =
+        configStore.configData[key as keyof typeof configStore.configData]?.config_value || "";
     } else if (logoConfigs.value[key as keyof typeof logoConfigs.value]) {
-      logoConfigs.value[key as keyof typeof logoConfigs.value].config_value = configStore.configData[key as keyof typeof configStore.configData]?.config_value || '';
+      logoConfigs.value[key as keyof typeof logoConfigs.value].config_value =
+        configStore.configData[key as keyof typeof configStore.configData]?.config_value || "";
     } else if (securityPrivacyConfigs.value[key as keyof typeof securityPrivacyConfigs.value]) {
-      securityPrivacyConfigs.value[key as keyof typeof securityPrivacyConfigs.value].config_value = configStore.configData[key as keyof typeof configStore.configData]?.config_value || '';
+      securityPrivacyConfigs.value[key as keyof typeof securityPrivacyConfigs.value].config_value =
+        configStore.configData[key as keyof typeof configStore.configData]?.config_value || "";
     } else if (userAgreementConfigs.value[key as keyof typeof userAgreementConfigs.value]) {
-      userAgreementConfigs.value[key as keyof typeof userAgreementConfigs.value].config_value = configStore.configData[key as keyof typeof configStore.configData]?.config_value || '';
+      userAgreementConfigs.value[key as keyof typeof userAgreementConfigs.value].config_value =
+        configStore.configData[key as keyof typeof configStore.configData]?.config_value || "";
     } else if (demoConfigs.value[key as keyof typeof demoConfigs.value]) {
       // 除了IP白名单外的演示配置项
-      if (key !== 'ip_white_list') {
-        demoConfigs.value[key as keyof typeof demoConfigs.value].config_value = configStore.configData[key as keyof typeof configStore.configData]?.config_value || '';
+      if (key !== "ip_white_list") {
+        demoConfigs.value[key as keyof typeof demoConfigs.value].config_value =
+          configStore.configData[key as keyof typeof configStore.configData]?.config_value || "";
       }
     }
     delete modifiedFields[key];
@@ -462,130 +502,136 @@ const demoIpWhitelistItems = ref<ListItem[]>([]);
 // 从配置数据初始化列表
 const initializeLists = () => {
   // 初始化接口白名单
-  const apiWhitelistStr = configStore.configData.white_api_list_path?.config_value || '';
+  const apiWhitelistStr = configStore.configData.white_api_list_path?.config_value || "";
   try {
     // 尝试解析为JSON数组
     const apiWhitelistArray = JSON.parse(apiWhitelistStr);
     if (Array.isArray(apiWhitelistArray)) {
       apiWhitelistItems.value = apiWhitelistArray
-        .filter(item => typeof item === 'string' && item.trim())
-        .map(item => ({ id: generateId(), value: item.trim() }));
+        .filter((item) => typeof item === "string" && item.trim())
+        .map((item) => ({ id: generateId(), value: item.trim() }));
     } else {
       // 如果不是数组，回退到按换行符分割
       apiWhitelistItems.value = apiWhitelistStr
-        ? apiWhitelistStr.split('\n')
-            .filter(item => item.trim())
-            .map(item => ({ id: generateId(), value: item.trim() }))
-        : [{ id: generateId(), value: '' }];
+        ? apiWhitelistStr
+            .split("\n")
+            .filter((item) => item.trim())
+            .map((item) => ({ id: generateId(), value: item.trim() }))
+        : [{ id: generateId(), value: "" }];
     }
   } catch {
     // 解析失败，回退到按换行符分割
     apiWhitelistItems.value = apiWhitelistStr
-      ? apiWhitelistStr.split('\n')
-          .filter(item => item.trim())
-          .map(item => ({ id: generateId(), value: item.trim() }))
-      : [{ id: generateId(), value: '' }];
+      ? apiWhitelistStr
+          .split("\n")
+          .filter((item) => item.trim())
+          .map((item) => ({ id: generateId(), value: item.trim() }))
+      : [{ id: generateId(), value: "" }];
   }
 
   // 初始化IP黑名单
-  const ipBlacklistStr = configStore.configData.ip_black_list?.config_value || '';
+  const ipBlacklistStr = configStore.configData.ip_black_list?.config_value || "";
   try {
     // 尝试解析为JSON数组
     const ipBlacklistArray = JSON.parse(ipBlacklistStr);
     if (Array.isArray(ipBlacklistArray)) {
       ipBlacklistItems.value = ipBlacklistArray
-        .filter(item => typeof item === 'string' && item.trim())
-        .map(item => ({ id: generateId(), value: item.trim() }));
+        .filter((item) => typeof item === "string" && item.trim())
+        .map((item) => ({ id: generateId(), value: item.trim() }));
     } else {
       // 如果不是数组，回退到按换行符分割
       ipBlacklistItems.value = ipBlacklistStr
-        ? ipBlacklistStr.split('\n')
-            .filter(item => item.trim())
-            .map(item => ({ id: generateId(), value: item.trim() }))
-        : [{ id: generateId(), value: '' }];
+        ? ipBlacklistStr
+            .split("\n")
+            .filter((item) => item.trim())
+            .map((item) => ({ id: generateId(), value: item.trim() }))
+        : [{ id: generateId(), value: "" }];
     }
   } catch {
     // 解析失败，回退到按换行符分割
     ipBlacklistItems.value = ipBlacklistStr
-      ? ipBlacklistStr.split('\n')
-          .filter(item => item.trim())
-          .map(item => ({ id: generateId(), value: item.trim() }))
-      : [{ id: generateId(), value: '' }];
+      ? ipBlacklistStr
+          .split("\n")
+          .filter((item) => item.trim())
+          .map((item) => ({ id: generateId(), value: item.trim() }))
+      : [{ id: generateId(), value: "" }];
   }
 
   // 初始化演示环境IP白名单
-  const demoIpWhitelistStr = configStore.configData.ip_white_list?.config_value || '';
+  const demoIpWhitelistStr = configStore.configData.ip_white_list?.config_value || "";
   try {
     // 尝试解析为JSON数组
     const demoIpWhitelistArray = JSON.parse(demoIpWhitelistStr);
     if (Array.isArray(demoIpWhitelistArray)) {
       demoIpWhitelistItems.value = demoIpWhitelistArray
-        .filter(item => typeof item === 'string' && item.trim())
-        .map(item => ({ id: generateId(), value: item.trim() }));
+        .filter((item) => typeof item === "string" && item.trim())
+        .map((item) => ({ id: generateId(), value: item.trim() }));
     } else {
       // 如果不是数组，回退到按换行符分割
       demoIpWhitelistItems.value = demoIpWhitelistStr
-        ? demoIpWhitelistStr.split('\n')
-            .filter(item => item.trim())
-            .map(item => ({ id: generateId(), value: item.trim() }))
-        : [{ id: generateId(), value: '' }];
+        ? demoIpWhitelistStr
+            .split("\n")
+            .filter((item) => item.trim())
+            .map((item) => ({ id: generateId(), value: item.trim() }))
+        : [{ id: generateId(), value: "" }];
     }
   } catch {
     // 解析失败，回退到按换行符分割
     demoIpWhitelistItems.value = demoIpWhitelistStr
-      ? demoIpWhitelistStr.split('\n')
-          .filter(item => item.trim())
-          .map(item => ({ id: generateId(), value: item.trim() }))
-      : [{ id: generateId(), value: '' }];
+      ? demoIpWhitelistStr
+          .split("\n")
+          .filter((item) => item.trim())
+          .map((item) => ({ id: generateId(), value: item.trim() }))
+      : [{ id: generateId(), value: "" }];
   }
 };
 
 // 添加接口白名单项
 const addApiWhitelistItem = () => {
-  apiWhitelistItems.value.push({ id: generateId(), value: '' });
-  markModified('white_api_list_path');
+  apiWhitelistItems.value.push({ id: generateId(), value: "" });
+  markModified("white_api_list_path");
 };
 
 // 移除接口白名单项
 const removeApiWhitelistItem = (id: string) => {
   if (apiWhitelistItems.value.length <= 1) {
-    ElMessage.warning('至少需要保留一个接口白名单配置');
+    ElMessage.warning("至少需要保留一个接口白名单配置");
     return;
   }
-  apiWhitelistItems.value = apiWhitelistItems.value.filter(item => item.id !== id);
-  markModified('white_api_list_path');
+  apiWhitelistItems.value = apiWhitelistItems.value.filter((item) => item.id !== id);
+  markModified("white_api_list_path");
 };
 
 // 添加IP黑名单项
 const addIpBlacklistItem = () => {
-  ipBlacklistItems.value.push({ id: generateId(), value: '' });
-  markModified('ip_black_list');
+  ipBlacklistItems.value.push({ id: generateId(), value: "" });
+  markModified("ip_black_list");
 };
 
 // 移除IP黑名单项
 const removeIpBlacklistItem = (id: string) => {
   if (ipBlacklistItems.value.length <= 1) {
-    ElMessage.warning('至少需要保留一个IP黑名单配置');
+    ElMessage.warning("至少需要保留一个IP黑名单配置");
     return;
   }
-  ipBlacklistItems.value = ipBlacklistItems.value.filter(item => item.id !== id);
-  markModified('ip_black_list');
+  ipBlacklistItems.value = ipBlacklistItems.value.filter((item) => item.id !== id);
+  markModified("ip_black_list");
 };
 
 // 添加演示环境IP白名单项
 const addDemoIpWhitelistItem = () => {
-  demoIpWhitelistItems.value.push({ id: generateId(), value: '' });
-  markModified('ip_white_list');
+  demoIpWhitelistItems.value.push({ id: generateId(), value: "" });
+  markModified("ip_white_list");
 };
 
 // 移除演示环境IP白名单项
 const removeDemoIpWhitelistItem = (id: string) => {
   if (demoIpWhitelistItems.value.length <= 1) {
-    ElMessage.warning('至少需要保留一个IP白名单配置');
+    ElMessage.warning("至少需要保留一个IP白名单配置");
     return;
   }
-  demoIpWhitelistItems.value = demoIpWhitelistItems.value.filter(item => item.id !== id);
-  markModified('ip_white_list');
+  demoIpWhitelistItems.value = demoIpWhitelistItems.value.filter((item) => item.id !== id);
+  markModified("ip_white_list");
 };
 
 // 接口白名单配置项
@@ -641,15 +687,14 @@ const handleUploadSuccess = (fileInfo: UploadFilePath, type: string) => {
 
 // 图片上传失败的回调处理
 const handleUploadError = (error: any) => {
-  console.error('上传失败:', error.message || '未知错误');
-  ElMessage.error(`上传失败：${error.message || '请稍后重试'}`);
+  console.error("上传失败:", error.message || "未知错误");
+  ElMessage.error(`上传失败：${error.message || "请稍后重试"}`);
 };
 
 // 生命周期钩子
 onMounted(() => {
   configStore.getConfig();
 });
-
 </script>
 
 <style lang="scss" scoped>
diff --git a/frontend/src/views/module_system/param/index.vue b/frontend/src/views/module_system/param/index.vue
index 49e1d5e3..fb472a51 100644
--- a/frontend/src/views/module_system/param/index.vue
+++ b/frontend/src/views/module_system/param/index.vue
@@ -3,7 +3,13 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery" >
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="config_name" label="配置名称">
           <el-input v-model="queryFormData.config_name" placeholder="请输入配置名称" clearable />
         </el-form-item>
@@ -11,28 +17,43 @@
           <el-input v-model="queryFormData.config_key" placeholder="请输入配置键名" clearable />
         </el-form-item>
         <el-form-item prop="config_type" label="系统内置">
-          <el-select v-model="queryFormData.config_type" placeholder="请选择系统内置" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.config_type"
+            placeholder="请选择系统内置"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option value="true" label="是" />
             <el-option value="false" label="否" />
           </el-select>
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <el-form-item v-if="isExpand" prop="creator" label="创建人">
           <UserTableSelect
-              v-model="queryFormData.creator"
-              @confirm-click="handleConfirm"
-              @clear-click="handleQuery"
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
           />
         </el-form-item>
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_system:config:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_system:config:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_system:config:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_system:config:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
           <!-- 展开/收起 -->
           <template v-if="isExpandable">
             <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
@@ -69,10 +90,25 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:config:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
+              <el-button
+                v-hasPerm="['module_system:config:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:config:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_system:config:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
           </el-row>
         </div>
@@ -80,12 +116,24 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="导出">
-                <el-button v-hasPerm="['module_system:config:export']" type="warning" icon="download" circle @click="handleOpenExportsModal"/>
+                <el-button
+                  v-hasPerm="['module_system:config:export']"
+                  type="warning"
+                  icon="download"
+                  circle
+                  @click="handleOpenExportsModal"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_system:config:refresh']" type="primary" icon="refresh" circle @click="handleRefresh"/>
+                <el-button
+                  v-hasPerm="['module_system:config:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -93,7 +141,11 @@
                 <el-button type="default" icon="operation" circle />
                 <template #dropdown>
                   <el-dropdown-menu>
-                    <el-dropdown-item v-for="column in tableColumns" :key="column.prop" :command="column">
+                    <el-dropdown-item
+                      v-for="column in tableColumns"
+                      :key="column.prop"
+                      :command="column"
+                    >
                       <el-checkbox v-model="column.show">{{ column.label }}</el-checkbox>
                     </el-dropdown-item>
                   </el-dropdown-menu>
@@ -105,69 +157,203 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        :height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" min-width="55" align="center" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" type="index" fixed label="序号" min-width="60">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          min-width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          type="index"
+          fixed
+          label="序号"
+          min-width="60"
+        >
           <template #default="scope">
             {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'config_name')?.show" key="config_name" label="配置名称" prop="config_name" min-width="100" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'config_key')?.show" key="config_key" label="配置键" prop="config_key" min-width="200" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'config_value')?.show" key="config_value" label="配置值" prop="config_value" min-width="200" show-overflow-tooltip />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'config_type')?.show" key="config_type" label="系统内置" prop="config_type" min-width="100">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'config_name')?.show"
+          key="config_name"
+          label="配置名称"
+          prop="config_name"
+          min-width="100"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'config_key')?.show"
+          key="config_key"
+          label="配置键"
+          prop="config_key"
+          min-width="200"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'config_value')?.show"
+          key="config_value"
+          label="配置值"
+          prop="config_value"
+          min-width="200"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'config_type')?.show"
+          key="config_type"
+          label="系统内置"
+          prop="config_type"
+          min-width="100"
+        >
           <template #default="scope">
             <el-tag v-if="scope.row.config_type" type="success">是</el-tag>
             <el-tag v-else type="danger">否</el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'description')?.show" key="description" label="描述" prop="description" min-width="120" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'created_at')?.show" key="created_at" label="创建时间" prop="created_at" min-width="200" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'updated_at')?.show" key="updated_at" label="更新时间" prop="updated_at" min-width="200" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'creator')?.show" key="creator" label="创建人" min-width="120">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'description')?.show"
+          key="description"
+          label="描述"
+          prop="description"
+          min-width="120"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          key="created_at"
+          label="创建时间"
+          prop="created_at"
+          min-width="200"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          key="updated_at"
+          label="更新时间"
+          prop="updated_at"
+          min-width="200"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'creator')?.show"
+          key="creator"
+          label="创建人"
+          min-width="120"
+        >
           <template #default="scope">
             {{ scope.row.creator?.name }}
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" fixed="right" label="操作" align="center" min-width="200">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="200"
+        >
           <template #default="scope">
-            <el-button v-hasPerm="['module_system:config:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button v-hasPerm="['module_system:config:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-            <el-button v-hasPerm="['module_system:config:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              v-hasPerm="['module_system:config:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:config:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:config:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
-          <el-descriptions-item label="配置名称" :span="2">{{ detailFormData.config_name }}</el-descriptions-item>
+          <el-descriptions-item label="配置名称" :span="2">
+            {{ detailFormData.config_name }}
+          </el-descriptions-item>
           <el-descriptions-item label="系统内置" :span="2">
             <el-tag v-if="detailFormData.config_type" type="success">是</el-tag>
             <el-tag v-else type="danger">否</el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="配置键" :span="2">{{ detailFormData.config_key }}</el-descriptions-item>
-          <el-descriptions-item label="配置值" :span="2">{{ detailFormData.config_value }}</el-descriptions-item>
-          <el-descriptions-item label="描述" :span="2">{{ detailFormData.description }}</el-descriptions-item>
-          <el-descriptions-item label="创建人" :span="2">{{ detailFormData.creator?.name }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{ detailFormData.created_at }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="2">{{ detailFormData.updated_at }}</el-descriptions-item>
+          <el-descriptions-item label="配置键" :span="2">
+            {{ detailFormData.config_key }}
+          </el-descriptions-item>
+          <el-descriptions-item label="配置值" :span="2">
+            {{ detailFormData.config_value }}
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="2">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="2">
+            {{ detailFormData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
           <el-form-item label="配置名称" prop="config_name">
             <el-input v-model="formData.config_name" placeholder="请输入配置名称" :maxlength="50" />
           </el-form-item>
@@ -184,7 +370,14 @@
             </el-radio-group>
           </el-form-item>
           <el-form-item label="描述" prop="description">
-            <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
         </el-form>
       </template>
@@ -193,14 +386,31 @@
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
           <el-button @click="handleCloseDialog">取消</el-button>
-          <el-button v-if="dialogVisible.type !== 'detail'" v-hasPerm="['module_system:config:create']" type="primary" @click="handleSubmit">确定</el-button>
-          <el-button v-else v-hasPerm="['module_system:config:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
+          <el-button
+            v-if="dialogVisible.type !== 'detail'"
+            v-hasPerm="['module_system:config:create']"
+            type="primary"
+            @click="handleSubmit"
+          >
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['module_system:config:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
         </div>
       </template>
     </el-dialog>
 
-    <ExportModal v-model="exportsDialogVisible" :content-config="curdContentConfig" :selection-data="selectionRows" />
-
+    <ExportModal
+      v-model="exportsDialogVisible"
+      :content-config="curdContentConfig"
+      :selection-data="selectionRows"
+    />
   </div>
 </template>
 
@@ -232,21 +442,20 @@ const pageTableData = ref<ConfigTable[]>([]);
 const exportsDialogVisible = ref(false);
 const selectionRows = ref<ConfigTable[]>([]);
 
-
 // 表格列配置
 const tableColumns = ref([
-  { prop: 'selection', label: '选择框', show: true },
-  { prop: 'index', label: '序号', show: true },
-  { prop: 'config_name', label: '配置名称', show: true },
-  { prop: 'config_key', label: '配置键', show: true },
-  { prop: 'config_value', label: '配置值', show: true },
-  { prop: 'config_type', label: '系统内置', show: true },
-  { prop: 'description', label: '描述', show: true },
-  { prop: 'created_at', label: '创建时间', show: true },
-  { prop: 'updated_at', label: '更新时间', show: true },
-  { prop: 'creator', label: '创建人', show: true },
-  { prop: 'operation', label: '操作', show: true }
-])
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "config_name", label: "配置名称", show: true },
+  { prop: "config_key", label: "配置键", show: true },
+  { prop: "config_value", label: "配置值", show: true },
+  { prop: "config_type", label: "系统内置", show: true },
+  { prop: "description", label: "描述", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "creator", label: "创建人", show: true },
+  { prop: "operation", label: "操作", show: true },
+]);
 
 // 详情表单
 const detailFormData = ref<ConfigTable>({});
@@ -267,18 +476,18 @@ const queryFormData = reactive<ConfigPageQuery>({
 // 编辑表单
 const formData = reactive<ConfigForm>({
   id: undefined,
-  config_name: '',
-  config_key: '',
-  config_value: '',
+  config_name: "",
+  config_key: "",
+  config_value: "",
   config_type: false,
-  description: ''
+  description: "",
 });
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -305,9 +514,9 @@ function handleDateRangeChange(range: [Date, Date]) {
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -316,11 +525,9 @@ async function loadingData() {
     const response = await ParamsAPI.getConfigList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -350,12 +557,12 @@ async function handleResetQuery() {
 // 定义初始表单数据常量
 const initialFormData: ConfigForm = {
   id: undefined,
-  config_name: '',
-  config_key: '',
-  config_value: '',
+  config_name: "",
+  config_key: "",
+  config_value: "",
   config_type: false,
-  description: ''
-}
+  description: "",
+};
 
 // 重置表单
 async function resetForm() {
@@ -380,14 +587,14 @@ async function handleCloseDialog() {
 }
 
 // 打开系统配置弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await ParamsAPI.getConfigDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "系统配置详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改系统配置";
       Object.assign(formData, response.data.data);
     }
@@ -408,7 +615,7 @@ async function handleSubmit() {
       const id = formData.id;
       if (id) {
         try {
-          await ParamsAPI.updateConfig(id, formData)
+          await ParamsAPI.updateConfig(id, formData);
           dialogVisible.visible = false;
           resetForm();
           handleResetQuery();
@@ -419,7 +626,7 @@ async function handleSubmit() {
         }
       } else {
         try {
-          await ParamsAPI.createConfig(formData)
+          await ParamsAPI.createConfig(formData);
           dialogVisible.visible = false;
           resetForm();
           handleResetQuery();
@@ -439,19 +646,21 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await ParamsAPI.deleteConfig(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await ParamsAPI.deleteConfig(ids);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 导出弹窗
@@ -461,23 +670,23 @@ async function handleOpenExportsModal() {
 
 // 导出字段
 const exportColumns = [
-  { prop: 'config_name', label: '配置名称' },
-  { prop: 'config_key', label: '配置键' },
-  { prop: 'config_value', label: '配置值' },
-  { prop: 'config_type', label: '系统内置' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "config_name", label: "配置名称" },
+  { prop: "config_key", label: "配置键" },
+  { prop: "config_value", label: "配置值" },
+  { prop: "config_type", label: "系统内置" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导入/导出配置（用于导出弹窗）
 const curdContentConfig = {
-  permPrefix: 'module_system:config',
+  permPrefix: "module_system:config",
   cols: exportColumns as any,
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.config_type === 'string') {
-      query.config_type = query.config_type === 'true';
+    if (typeof query.config_type === "string") {
+      query.config_type = query.config_type === "true";
     }
     query.page_no = 1;
     query.page_size = 1000;
diff --git a/frontend/src/views/module_system/position/index.vue b/frontend/src/views/module_system/position/index.vue
index f3d827b7..49ef5662 100644
--- a/frontend/src/views/module_system/position/index.vue
+++ b/frontend/src/views/module_system/position/index.vue
@@ -3,34 +3,55 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery" >
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="name" label="岗位名称">
           <el-input v-model="queryFormData.name" placeholder="请输入岗位名称" clearable />
         </el-form-item>
         <el-form-item prop="status" label="状态">
-          <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option value="true" label="启用" />
             <el-option value="false" label="停用" />
           </el-select>
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <el-form-item v-if="isExpand" prop="creator" label="创建人">
           <UserTableSelect
-              v-model="queryFormData.creator"
-              @confirm-click="handleConfirm"
-              @clear-click="handleQuery"
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
           />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_system:position:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_system:position:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_system:position:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_system:position:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
           <!-- 展开/收起 -->
           <template v-if="isExpandable">
             <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
@@ -67,18 +88,39 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:position:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
+              <el-button
+                v-hasPerm="['module_system:position:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:position:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_system:position:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-dropdown v-hasPerm="['module_system:position:patch']" trigger="click">
-                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">更多</el-button>
+                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">
+                  更多
+                </el-button>
                 <template #dropdown>
                   <el-dropdown-menu v-hasPerm="['module_system:position:filter']">
-                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
+                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                      批量启用
+                    </el-dropdown-item>
+                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                      批量停用
+                    </el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -89,12 +131,24 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="导出">
-                <el-button v-hasPerm="['module_system:position:export']" type="warning" icon="download" circle @click="handleOpenExportsModal" />
+                <el-button
+                  v-hasPerm="['module_system:position:export']"
+                  type="warning"
+                  icon="download"
+                  circle
+                  @click="handleOpenExportsModal"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_system:position:refresh']" type="primary" icon="refresh" circle @click="handleRefresh" />
+                <el-button
+                  v-hasPerm="['module_system:position:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -114,55 +168,164 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        :height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" min-width="55" align="center" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" type="index" fixed label="序号" min-width="60">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          min-width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          type="index"
+          fixed
+          label="序号"
+          min-width="60"
+        >
           <template #default="scope">
             {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'name')?.show" key="name" label="岗位名称" prop="name" min-width="100" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'status')?.show" key="status" label="状态" prop="status" min-width="80">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'name')?.show"
+          key="name"
+          label="岗位名称"
+          prop="name"
+          min-width="100"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'status')?.show"
+          key="status"
+          label="状态"
+          prop="status"
+          min-width="80"
+        >
           <template #default="scope">
             <el-tag :type="scope.row.status === true ? 'success' : 'danger'">
               {{ scope.row.status === true ? "启用" : "停用" }}
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'order')?.show" key="order" label="岗位排序" prop="order" min-width="80" show-overflow-tooltip />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'description')?.show" key="description" label="描述" prop="description" min-width="120" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'created_at')?.show" key="created_at" label="创建时间" prop="created_at" min-width="200" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'updated_at')?.show" key="updated_at" label="更新时间" prop="updated_at" min-width="200" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'creator')?.show" key="creator" label="创建人" min-width="100">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'order')?.show"
+          key="order"
+          label="岗位排序"
+          prop="order"
+          min-width="80"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'description')?.show"
+          key="description"
+          label="描述"
+          prop="description"
+          min-width="120"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          key="created_at"
+          label="创建时间"
+          prop="created_at"
+          min-width="200"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          key="updated_at"
+          label="更新时间"
+          prop="updated_at"
+          min-width="200"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'creator')?.show"
+          key="creator"
+          label="创建人"
+          min-width="100"
+        >
           <template #default="scope">
             {{ scope.row.creator?.name }}
           </template>
         </el-table-column>
 
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" fixed="right" label="操作" align="center" min-width="200">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="200"
+        >
           <template #default="scope">
-            <el-button v-hasPerm="['module_system:position:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button v-hasPerm="['module_system:position:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-            <el-button v-hasPerm="['module_system:position:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              v-hasPerm="['module_system:position:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:position:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:position:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
-          <el-descriptions-item label="岗位名称" :span="2">{{ detailFormData.name }}</el-descriptions-item>
+          <el-descriptions-item label="岗位名称" :span="2">
+            {{ detailFormData.name }}
+          </el-descriptions-item>
           <el-descriptions-item label="排序" :span="2">
             {{ detailFormData.order }}
           </el-descriptions-item>
@@ -170,15 +333,30 @@
             <el-tag v-if="detailFormData.status" type="success">启用</el-tag>
             <el-tag v-else type="danger">停用</el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="创建人" :span="2">{{ detailFormData.creator?.name }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{ detailFormData.created_at }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="2">{{ detailFormData.updated_at }}</el-descriptions-item>
-          <el-descriptions-item label="描述" :span="4">{{ detailFormData.description }}</el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="2">
+            {{ detailFormData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="4">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
           <el-form-item label="岗位名称" prop="name">
             <el-input v-model="formData.name" placeholder="请输入岗位名称" :maxlength="50" />
           </el-form-item>
@@ -192,7 +370,14 @@
             </el-radio-group>
           </el-form-item>
           <el-form-item label="描述" prop="description">
-            <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
         </el-form>
       </template>
@@ -201,14 +386,31 @@
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
           <el-button @click="handleCloseDialog">取消</el-button>
-          <el-button v-if="dialogVisible.type !== 'detail'" v-hasPerm="['module_system:position:submit']" type="primary" @click="handleSubmit">确定</el-button>
-          <el-button v-else v-hasPerm="['module_system:position:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
+          <el-button
+            v-if="dialogVisible.type !== 'detail'"
+            v-hasPerm="['module_system:position:submit']"
+            type="primary"
+            @click="handleSubmit"
+          >
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['module_system:position:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
         </div>
       </template>
     </el-dialog>
 
-    <ExportModal v-model="exportsDialogVisible" :content-config="curdContentConfig" :selection-data="selectionRows" />
-
+    <ExportModal
+      v-model="exportsDialogVisible"
+      :content-config="curdContentConfig"
+      :selection-data="selectionRows"
+    />
   </div>
 </template>
 
@@ -218,7 +420,11 @@ defineOptions({
   inheritAttrs: false,
 });
 
-import PositionAPI, { PositionTable, PositionForm, PositionPageQuery } from "@/api/module_system/position";
+import PositionAPI, {
+  PositionTable,
+  PositionForm,
+  PositionPageQuery,
+} from "@/api/module_system/position";
 import { useUserStore } from "@/store";
 import UserTableSelect from "@/views/module_system/user/components/UserTableSelect.vue";
 import ExportModal from "@/components/CURD/ExportModal.vue";
@@ -241,20 +447,19 @@ const pageTableData = ref<PositionTable[]>([]);
 const exportsDialogVisible = ref(false);
 const selectionRows = ref<PositionTable[]>([]);
 
-
 // 表格列配置
 const tableColumns = ref([
-  { prop: 'selection', label: '选择框', show: true },
-  { prop: 'index', label: '序号', show: true },
-  { prop: 'name', label: '岗位名称', show: true },
-  { prop: 'order', label: '岗位排序', show: true },
-  { prop: 'status', label: '状态', show: true },
-  { prop: 'description', label: '描述', show: true },
-  { prop: 'created_at', label: '创建时间', show: true },
-  { prop: 'updated_at', label: '更新时间', show: true },
-  { prop: 'creator', label: '创建人', show: true },
-  { prop: 'operation', label: '操作', show: true }
-])
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "name", label: "岗位名称", show: true },
+  { prop: "order", label: "岗位排序", show: true },
+  { prop: "status", label: "状态", show: true },
+  { prop: "description", label: "描述", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "creator", label: "创建人", show: true },
+  { prop: "operation", label: "操作", show: true },
+]);
 
 // 详情表单
 const detailFormData = ref<PositionTable>({});
@@ -263,7 +468,7 @@ const detailFormData = ref<PositionTable>({});
 const queryFormData = reactive<PositionPageQuery>({
   page_no: 1,
   page_size: 10,
-  name: '',
+  name: "",
   status: undefined,
   start_time: undefined,
   end_time: undefined,
@@ -278,13 +483,13 @@ const formData = reactive<PositionForm>({
   order: 1,
   status: true,
   description: undefined,
-})
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -310,10 +515,9 @@ function handleDateRangeChange(range: [Date, Date]) {
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
-
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -322,11 +526,9 @@ async function loadingData() {
     const response = await PositionAPI.getPositionList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -360,7 +562,7 @@ const initialFormData: PositionForm = {
   order: 1,
   status: true,
   description: undefined,
-}
+};
 
 // 重置表单
 async function resetForm() {
@@ -385,14 +587,14 @@ async function handleCloseDialog() {
 }
 
 // 打开系统配置弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await PositionAPI.getPositionDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "岗位详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改岗位";
       Object.assign(formData, response.data.data);
     }
@@ -413,9 +615,9 @@ async function handleSubmit() {
       const id = formData.id;
       try {
         if (id) {
-          await PositionAPI.updatePosition(id, { id, ...formData })
+          await PositionAPI.updatePosition(id, { id, ...formData });
         } else {
-          await PositionAPI.createPosition(formData)
+          await PositionAPI.createPosition(formData);
         }
         dialogVisible.visible = false;
         resetForm();
@@ -438,19 +640,21 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await PositionAPI.deletePosition(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await PositionAPI.deletePosition(ids);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 导出
@@ -460,44 +664,46 @@ async function handleOpenExportsModal() {
 // 批量启用/停用
 async function handleMoreClick(status: boolean) {
   if (selectIds.value.length) {
-    ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
+    ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
       confirmButtonText: "确定",
       cancelButtonText: "取消",
       type: "warning",
-    }).then(async () => {
-      try {
-        loading.value = true;
-        await PositionAPI.batchAvailablePosition({ ids: selectIds.value, status });
-        handleResetQuery();
-      } catch (error: any) {
-        console.error(error);
-      } finally {
-        loading.value = false;
-      }
-    }).catch(() => {
-      ElMessageBox.close();
-    });
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await PositionAPI.batchAvailablePosition({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
   }
 }
 
 // 导出字段
 const exportColumns = [
-  { prop: 'name', label: '岗位名称' },
-  { prop: 'order', label: '岗位排序' },
-  { prop: 'status', label: '状态' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "name", label: "岗位名称" },
+  { prop: "order", label: "岗位排序" },
+  { prop: "status", label: "状态" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导入/导出配置（用于导出）
 const curdContentConfig = {
-  permPrefix: 'module_system:position',
+  permPrefix: "module_system:position",
   cols: exportColumns as any,
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.status === 'string') {
-      query.status = query.status === 'true';
+    if (typeof query.status === "string") {
+      query.status = query.status === "true";
     }
     query.page_no = 1;
     query.page_size = 1000;
@@ -521,36 +727,13 @@ onMounted(() => {
 
 <style lang="scss" scoped></style>
 
-// 导出字段
-const exportColumns = [
-  { prop: 'name', label: '岗位名称' },
-  { prop: 'order', label: '岗位排序' },
-  { prop: 'status', label: '状态' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
-];
-
-// 导入/导出配置（仅用于导出）
-const curdContentConfig = {
-  permPrefix: 'module_system:position',
-  cols: exportColumns as any,
-  exportsAction: async (params: any) => {
-    const query: any = { ...params };
-    if (typeof query.status === 'string') {
-      query.status = query.status === 'true';
-    }
-    query.page_no = 1;
-    query.page_size = 1000;
-    const all: any[] = [];
-    while (true) {
-      const res = await PositionAPI.getPositionList(query);
-      const items = res.data?.data?.items || [];
-      const total = res.data?.data?.total || 0;
-      all.push(...items);
-      if (all.length >= total || items.length === 0) break;
-      query.page_no += 1;
-    }
-    return all;
-  },
-} as unknown as IContentConfig;
+// 导出字段 const exportColumns = [ { prop: 'name', label: '岗位名称' }, { prop: 'order', label:
+'岗位排序' }, { prop: 'status', label: '状态' }, { prop: 'description', label: '描述' }, { prop:
+'created_at', label: '创建时间' }, { prop: 'updated_at', label: '更新时间' }, ]; //
+导入/导出配置（仅用于导出） const curdContentConfig = { permPrefix: 'module_system:position', cols:
+exportColumns as any, exportsAction: async (params: any) => { const query: any = { ...params }; if
+(typeof query.status === 'string') { query.status = query.status === 'true'; } query.page_no = 1;
+query.page_size = 1000; const all: any[] = []; while (true) { const res = await
+PositionAPI.getPositionList(query); const items = res.data?.data?.items || []; const total =
+res.data?.data?.total || 0; all.push(...items); if (all.length >= total || items.length === 0)
+break; query.page_no += 1; } return all; }, } as unknown as IContentConfig;
diff --git a/frontend/src/views/module_system/role/components/PermissonDrawer.vue b/frontend/src/views/module_system/role/components/PermissonDrawer.vue
index e7674286..49c52a83 100644
--- a/frontend/src/views/module_system/role/components/PermissonDrawer.vue
+++ b/frontend/src/views/module_system/role/components/PermissonDrawer.vue
@@ -1,16 +1,20 @@
 <!-- 角色授权 -->
 <template>
   <!-- 分配权限弹窗 -->
-  <el-drawer v-model="drawerVisible" :title="'【' + props.roleName + '】权限分配'" :size="drawerSize">
+  <el-drawer
+    v-model="drawerVisible"
+    :title="'【' + props.roleName + '】权限分配'"
+    :size="drawerSize"
+  >
     <el-container>
       <!-- 数据权限 -->
-      <el-aside >
+      <el-aside>
         <div class="border-r-1 border-r-[#f0f0f0] b-r-solid h-[100%] p-[20px] box-border">
           <div class="flex items-center">
-            <div style="display: flex; gap: 10px; ">
-              <div style="width: 10px; background-color: #409eff;"></div>
+            <div style="display: flex; gap: 10px">
+              <div style="width: 10px; background-color: #409eff"></div>
               <div>
-                <span style="font-size: 16px;">数据授权</span>
+                <span style="font-size: 16px">数据授权</span>
                 <el-tooltip placement="right">
                   <template #content>
                     <span>授权用户可操作的数据范围</span>
@@ -32,38 +36,41 @@
                   <el-option :key="4" label="全部数据权限" :value="4" />
                   <el-option :key="5" label="自定义数据权限" :value="5" />
                 </el-select>
-                </el-form-item>
-              </el-form>
-              
-              <div v-if="permissionState.data_scope === 5 && deptTreeData.length" class="mt-5 max-h-[60vh] b-1 b-solid b-[#e5e7eb] p-10px overflow-auto box-border">
-                <el-input v-model="deptFilterText" placeholder="部门名称" />
-                <el-tree 
-                  ref="deptTreeRef"
-                  node-key="value"
-                  show-checkbox
-                  :data="deptTreeData"
-                  :filter-node-method="handleFilter"
-                  default-expand-all
-                  :highlight-current="true"
-                  :check-strictly="!parentChildLinked"
-                  style="height: calc(100% - 60px); overflow-y: auto; margin-top: 10px;"
-                  @check="deptTreeCheck"
-                  >
-                  <template #empty>
-                    <el-empty :image-size="80" description="暂无数据" />
-                  </template>
-                </el-tree>
-              </div>
+              </el-form-item>
+            </el-form>
+
+            <div
+              v-if="permissionState.data_scope === 5 && deptTreeData.length"
+              class="mt-5 max-h-[60vh] b-1 b-solid b-[#e5e7eb] p-10px overflow-auto box-border"
+            >
+              <el-input v-model="deptFilterText" placeholder="部门名称" />
+              <el-tree
+                ref="deptTreeRef"
+                node-key="value"
+                show-checkbox
+                :data="deptTreeData"
+                :filter-node-method="handleFilter"
+                default-expand-all
+                :highlight-current="true"
+                :check-strictly="!parentChildLinked"
+                style="height: calc(100% - 60px); overflow-y: auto; margin-top: 10px"
+                @check="deptTreeCheck"
+              >
+                <template #empty>
+                  <el-empty :image-size="80" description="暂无数据" />
+                </template>
+              </el-tree>
+            </div>
           </div>
         </div>
       </el-aside>
 
       <!-- 菜单权限 -->
       <el-main>
-        <div style="display: flex; gap: 10px; ">
-          <div style="width: 10px; background-color: #409eff;"></div>
+        <div style="display: flex; gap: 10px">
+          <div style="width: 10px; background-color: #409eff"></div>
           <div>
-            <span style="font-size: 16px;">菜单授权</span>
+            <span style="font-size: 16px">菜单授权</span>
             <el-tooltip placement="right">
               <template #content>
                 <span>授权用户可操作的菜单权限</span>
@@ -83,7 +90,11 @@
               </template>
               {{ isExpanded ? "收缩" : "展开" }}
             </el-button>
-            <el-checkbox v-model="parentChildLinked" class="ml-5" @change="handleParentChildLinkedChange">
+            <el-checkbox
+              v-model="parentChildLinked"
+              class="ml-5"
+              @change="handleParentChildLinkedChange"
+            >
               父子联动
             </el-checkbox>
 
@@ -99,16 +110,16 @@
         </div>
 
         <div class="mt-5 max-h-[65vh] b-1 b-solid b-[#e5e7eb] p-10px overflow-auto box-border">
-          <el-tree 
-            ref="permTreeRef" 
-            node-key="value" 
-            show-checkbox 
+          <el-tree
+            ref="permTreeRef"
+            node-key="value"
+            show-checkbox
             :data="menuTreeData"
-            :filter-node-method="handleFilter" 
+            :filter-node-method="handleFilter"
             default-expand-all
             :highlight-current="true"
             :check-strictly="!parentChildLinked"
-            style="height: calc(100% - 60px); overflow: auto; margin-top: 10px;"
+            style="height: calc(100% - 60px); overflow: auto; margin-top: 10px"
             @check="menuTreeCheck"
           >
             <template #empty>
@@ -133,46 +144,50 @@
 const props = defineProps({
   roleName: {
     type: String,
-    required: true
+    required: true,
   },
   roleId: {
     type: Number,
-    required: true
+    required: true,
   },
   modelValue: {
     type: Boolean,
-    required: true
-  }
-})
+    required: true,
+  },
+});
 
 import { listToTree, formatTree } from "@/utils/common";
-import RoleAPI, { permissionDataType, permissionDeptType, permissionMenuType } from "@/api/module_system/role";
+import RoleAPI, {
+  permissionDataType,
+  permissionDeptType,
+  permissionMenuType,
+} from "@/api/module_system/role";
 import DeptAPI from "@/api/module_system/dept";
 import MenuAPI from "@/api/module_system/menu";
-import type { TreeInstance } from 'element-plus'
+import type { TreeInstance } from "element-plus";
 import { useAppStore } from "@/store/modules/app.store";
 import { DeviceEnum } from "@/enums/settings/device.enum";
 import { useUserStore } from "@/store";
 
 const appStore = useAppStore();
 const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "800px" : "90%"));
-const emit = defineEmits(['update:modelValue', 'saved'])
+const emit = defineEmits(["update:modelValue", "saved"]);
 
 const permTreeRef = ref<TreeInstance>();
-const deptTreeRef = ref<TreeInstance>()
-const deptFilterText = ref("")
+const deptTreeRef = ref<TreeInstance>();
+const deptFilterText = ref("");
 const permFilterText = ref("");
 const dataFormRef = ref();
 const drawerVisible = computed({
   get() {
-    return props.modelValue
+    return props.modelValue;
   },
   set(value) {
-    emit('update:modelValue', value)
-  }
-})
+    emit("update:modelValue", value);
+  },
+});
 const isExpanded = ref(true);
-const parentChildLinked = ref(false)
+const parentChildLinked = ref(false);
 const loading = ref<boolean>(false);
 const deptTreeData = ref<permissionDeptType[]>([]);
 const menuTreeData = ref<permissionMenuType[]>([]);
@@ -180,7 +195,7 @@ const permissionState = ref<permissionDataType>({
   role_ids: [],
   menu_ids: [],
   data_scope: 1,
-  dept_ids: []
+  dept_ids: [],
 });
 
 // 初始化方法,用于打开抽屉并加载数据
@@ -202,13 +217,16 @@ const init = async () => {
     // 更新权限状态
     permissionState.value = {
       role_ids: [props.roleId],
-      menu_ids: roleResponse.data.data.menus?.map(menu => menu.id) || [],
+      menu_ids: roleResponse.data.data.menus?.map((menu) => menu.id) || [],
       data_scope: roleResponse.data.data.data_scope || 1,
-      dept_ids: roleResponse.data.data.depts?.map(dept => dept.id) || []
+      dept_ids: roleResponse.data.data.depts?.map((dept) => dept.id) || [],
     };
 
     // 根据保存的权限数据判断是否应该开启父子联动
-    parentChildLinked.value = checkParentChildLinked(permissionState.value.menu_ids, menuTreeData.value);
+    parentChildLinked.value = checkParentChildLinked(
+      permissionState.value.menu_ids,
+      menuTreeData.value
+    );
 
     // 回显菜单树选中项
     if (permTreeRef.value) {
@@ -220,14 +238,13 @@ const init = async () => {
       // await 一定不能丢，否则到导致初始化时候deptTreeRef.value 为 undefined
       await deptTreeRef.value.setCheckedKeys(permissionState.value.dept_ids);
     }
-
   } catch (error: any) {
-    ElMessage.error('获取权限数据失败: ' + error.message);
+    ElMessage.error("获取权限数据失败: " + error.message);
   } finally {
     loading.value = false;
     // handleCancel()
   }
-}
+};
 
 // 取消按钮处理函数
 function handleCancel() {
@@ -235,30 +252,30 @@ function handleCancel() {
 }
 
 // 保存权限分配
-async function handleDrawerSave () {
+async function handleDrawerSave() {
   try {
     if (props.roleId === 1) {
-      ElMessage.warning('系统默认角色，不可操作');
+      ElMessage.warning("系统默认角色，不可操作");
       return;
     }
     loading.value = true;
 
     // 构造提交数据
-    const submitData : permissionDataType = {
+    const submitData: permissionDataType = {
       role_ids: [props.roleId],
-      menu_ids: (permTreeRef.value?.getCheckedKeys() || []).map(key => Number(key)),
+      menu_ids: (permTreeRef.value?.getCheckedKeys() || []).map((key) => Number(key)),
       data_scope: permissionState.value.data_scope,
-      dept_ids: (deptTreeRef.value?.getCheckedKeys() || []).map(key => Number(key))
+      dept_ids: (deptTreeRef.value?.getCheckedKeys() || []).map((key) => Number(key)),
     };
 
-    await RoleAPI.setPermission(submitData)
-    
+    await RoleAPI.setPermission(submitData);
+
     // 更新全局用户状态，刷新权限信息
     const userStore = useUserStore();
     await userStore.getUserInfo();
-    
+
     drawerVisible.value = false;
-    emit('saved');
+    emit("saved");
   } catch (error: any) {
     console.error(error);
   } finally {
@@ -269,12 +286,12 @@ async function handleDrawerSave () {
 // 部门树选择回调
 const deptTreeCheck = (checkedIds: number[]) => {
   permissionState.value.dept_ids = checkedIds;
-}
+};
 
 // 菜单选择变更回调
 const menuTreeCheck = (checkedIds: number[]) => {
   permissionState.value.menu_ids = checkedIds;
-}
+};
 
 // 展开/收缩 菜单权限树
 function togglePermTree() {
@@ -293,7 +310,7 @@ function togglePermTree() {
 // 部门筛选
 watch(deptFilterText, (val) => {
   deptTreeRef.value!.filter(val);
-})
+});
 
 // 菜单筛选
 watch(permFilterText, (val) => {
@@ -301,10 +318,7 @@ watch(permFilterText, (val) => {
 });
 
 // 树节点过滤
-function handleFilter(
-  value: string,
-  data: {[key: string]: any;}
-) {
+function handleFilter(value: string, data: { [key: string]: any }) {
   if (!value) return true;
   return data.label.includes(value);
 }
@@ -312,11 +326,11 @@ function handleFilter(
 // 检查权限数据是否遵循父子联动模式
 function checkParentChildLinked(menuIds: number[], menuTreeData: permissionMenuType[]): boolean {
   if (!menuIds.length || !menuTreeData.length) return false;
-  
+
   // 创建一个映射来快速查找菜单项
   const menuMap = new Map<number, permissionMenuType>();
   const buildMenuMap = (menus: permissionMenuType[]) => {
-    menus.forEach(menu => {
+    menus.forEach((menu) => {
       menuMap.set(menu.id, menu);
       if (menu.children) {
         buildMenuMap(menu.children);
@@ -324,23 +338,23 @@ function checkParentChildLinked(menuIds: number[], menuTreeData: permissionMenuT
     });
   };
   buildMenuMap(menuTreeData);
-  
+
   let hasParentChildConflict = false;
-  
+
   // 检查每个选中的菜单项
   for (const menuId of menuIds) {
     const menu = menuMap.get(menuId);
     if (!menu) continue;
-    
+
     // 如果选中了父菜单，检查是否有子菜单未被选中
     if (menu.children && menu.children.length > 0) {
-      const hasUnselectedChildren = menu.children.some(child => !menuIds.includes(child.id));
+      const hasUnselectedChildren = menu.children.some((child) => !menuIds.includes(child.id));
       if (hasUnselectedChildren) {
         hasParentChildConflict = true;
         break; // 发现冲突，直接返回false
       }
     }
-    
+
     // 如果选中了子菜单，检查父菜单是否也被选中
     const parentMenu = findParentMenu(menuId, menuTreeData);
     if (parentMenu && !menuIds.includes(parentMenu.id)) {
@@ -348,13 +362,16 @@ function checkParentChildLinked(menuIds: number[], menuTreeData: permissionMenuT
       break; // 发现冲突，直接返回false
     }
   }
-  
+
   // 如果没有发现父子冲突，说明是父子联动模式
   return !hasParentChildConflict;
 }
 
 // 查找父菜单
-function findParentMenu(menuId: number, menuTreeData: permissionMenuType[]): permissionMenuType | null {
+function findParentMenu(
+  menuId: number,
+  menuTreeData: permissionMenuType[]
+): permissionMenuType | null {
   for (const menu of menuTreeData) {
     if (menu.children) {
       for (const child of menu.children) {
@@ -377,7 +394,7 @@ function handleParentChildLinkedChange(val: any) {
 
 onMounted(async () => {
   await init();
-})
+});
 </script>
 
 <style lang="scss" scoped></style>
diff --git a/frontend/src/views/module_system/role/index.vue b/frontend/src/views/module_system/role/index.vue
index 55cb8d0e..f384570c 100644
--- a/frontend/src/views/module_system/role/index.vue
+++ b/frontend/src/views/module_system/role/index.vue
@@ -3,34 +3,55 @@
   <div class="app-container">
     <!-- 搜索区域 -->
     <div class="search-container">
-      <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery" >
+      <el-form
+        ref="queryFormRef"
+        :model="queryFormData"
+        :inline="true"
+        label-suffix=":"
+        @submit.prevent="handleQuery"
+      >
         <el-form-item prop="name" label="角色名称">
           <el-input v-model="queryFormData.name" placeholder="请输入角色名称" clearable />
         </el-form-item>
         <el-form-item prop="status" label="状态">
-          <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 167.5px" clearable>
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 167.5px"
+            clearable
+          >
             <el-option value="true" label="启用" />
             <el-option value="false" label="停用" />
           </el-select>
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <el-form-item v-if="isExpand" prop="creator" label="创建人">
           <UserTableSelect
-              v-model="queryFormData.creator"
-              @confirm-click="handleConfirm"
-              @clear-click="handleQuery"
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
           />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
         <el-form-item class="search-buttons">
-          <el-button v-hasPerm="['module_system:role:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-          <el-button v-hasPerm="['module_system:role:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+          <el-button
+            v-hasPerm="['module_system:role:query']"
+            type="primary"
+            icon="search"
+            native-type="submit"
+          >
+            查询
+          </el-button>
+          <el-button
+            v-hasPerm="['module_system:role:query']"
+            icon="refresh"
+            @click="handleResetQuery"
+          >
+            重置
+          </el-button>
           <!-- 展开/收起 -->
           <template v-if="isExpandable">
             <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
@@ -67,10 +88,25 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:role:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
+              <el-button
+                v-hasPerm="['module_system:role:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_system:role:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_system:role:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-dropdown v-hasPerm="['module_system:role:patch']" trigger="click">
@@ -79,8 +115,12 @@
                 </el-button>
                 <template #dropdown>
                   <el-dropdown-menu v-hasPerm="['module_system:role:filter']">
-                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
+                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                      批量启用
+                    </el-dropdown-item>
+                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                      批量停用
+                    </el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -91,12 +131,24 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="导出">
-                <el-button v-hasPerm="['module_system:role:export']" type="warning" icon="download" circle @click="handleOpenExportsModal" />
+                <el-button
+                  v-hasPerm="['module_system:role:export']"
+                  type="warning"
+                  icon="download"
+                  circle
+                  @click="handleOpenExportsModal"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_system:role:refresh']" type="primary" icon="refresh" circle @click="handleRefresh" />
+                <el-button
+                  v-hasPerm="['module_system:role:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -115,128 +167,268 @@
         </div>
       </div>
 
-      <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="dataTableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        :height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" width="55" align="center" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" type="index" fixed label="序号" width="60" >
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          type="index"
+          fixed
+          label="序号"
+          width="60"
+        >
           <template #default="scope">
             {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'name')?.show" key="name" label="角色名称" prop="name" min-width="100" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'code')?.show" key="code" label="角色编码" prop="code" min-width="100" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'data_scope')?.show" key="data_scope" label="数据权限" prop="data_scope" min-width="200">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'name')?.show"
+          key="name"
+          label="角色名称"
+          prop="name"
+          min-width="100"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'code')?.show"
+          key="code"
+          label="角色编码"
+          prop="code"
+          min-width="100"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'data_scope')?.show"
+          key="data_scope"
+          label="数据权限"
+          prop="data_scope"
+          min-width="200"
+        >
           <template #default="scope">
             <el-tag v-if="scope.row.data_scope === 1" type="primary">仅本人数据权限</el-tag>
             <el-tag v-else-if="scope.row.data_scope === 2" type="info">本部门数据权限</el-tag>
-            <el-tag v-else-if="scope.row.data_scope === 3" type="warning">本部门及以下数据权限</el-tag>
+            <el-tag v-else-if="scope.row.data_scope === 3" type="warning">
+              本部门及以下数据权限
+            </el-tag>
             <el-tag v-else-if="scope.row.data_scope === 4" type="success">全部数据权限</el-tag>
-            <el-tag v-else type="danger" >自定义数据权限</el-tag>
+            <el-tag v-else type="danger">自定义数据权限</el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'order')?.show" key="order" label="排序" prop="order" min-width="80" show-overflow-tooltip />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'status')?.show" key="status" label="状态" prop="status" min-width="80">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'order')?.show"
+          key="order"
+          label="排序"
+          prop="order"
+          min-width="80"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'status')?.show"
+          key="status"
+          label="状态"
+          prop="status"
+          min-width="80"
+        >
           <template #default="scope">
             <el-tag :type="scope.row.status === true ? 'success' : 'danger'">
               {{ scope.row.status === true ? "启用" : "停用" }}
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'description')?.show" key="description" label="描述" prop="description" min-width="100" />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'created_at')?.show" key="created_at" label="创建时间" prop="created_at" min-width="200" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'updated_at')?.show" key="updated_at" label="更新时间" prop="updated_at" min-width="200" sortable />
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'creator')?.show" key="creator" label="创建人" min-width="120">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'description')?.show"
+          key="description"
+          label="描述"
+          prop="description"
+          min-width="100"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          key="created_at"
+          label="创建时间"
+          prop="created_at"
+          min-width="200"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          key="updated_at"
+          label="更新时间"
+          prop="updated_at"
+          min-width="200"
+          sortable
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'creator')?.show"
+          key="creator"
+          label="创建人"
+          min-width="120"
+        >
           <template #default="scope">
             {{ scope.row.creator?.name }}
           </template>
         </el-table-column>
 
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" fixed="right" label="操作" align="center" min-width="280">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="280"
+        >
           <template #default="scope">
-            <el-button 
-              v-hasPerm="['module_system:role:permission']" 
-              type="warning" 
-              size="small" 
-              link 
-              icon="position" 
+            <el-button
+              v-hasPerm="['module_system:role:permission']"
+              type="warning"
+              size="small"
+              link
+              icon="position"
               :disabled="scope.row.id === 1"
-              @click="scope.row.id === 1 ? ElMessage.warning('系统默认角色，不可操作') : handleOpenAssignPermDialog(scope.row.id, scope.row.name)"
-            >分配权限</el-button>
-            <el-button 
+              @click="
+                scope.row.id === 1
+                  ? ElMessage.warning('系统默认角色，不可操作')
+                  : handleOpenAssignPermDialog(scope.row.id, scope.row.name)
+              "
+            >
+              分配权限
+            </el-button>
+            <el-button
               v-hasPerm="['module_system:role:detail']"
-              type="info" 
-              size="small" 
-              link 
-              icon="document" 
+              type="info"
+              size="small"
+              link
+              icon="document"
               @click="handleOpenDialog('detail', scope.row.id)"
-            >详情</el-button>
-            <el-button 
-              v-hasPerm="['module_system:role:update']" 
-              type="primary" 
-              size="small" 
-              link 
-              icon="edit" 
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:role:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
               :disabled="scope.row.id === 1"
-              @click="scope.row.id === 1 ? ElMessage.warning('系统默认角色，不可操作') : handleOpenDialog('update', scope.row.id)"
-            >编辑</el-button>
-            <el-button 
-              v-hasPerm="['module_system:role:delete']" 
-              type="danger" 
-              size="small" 
-              link 
-              icon="delete" 
+              @click="
+                scope.row.id === 1
+                  ? ElMessage.warning('系统默认角色，不可操作')
+                  : handleOpenDialog('update', scope.row.id)
+              "
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['module_system:role:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
               :disabled="scope.row.id === 1"
-              @click="scope.row.id === 1 ? ElMessage.warning('系统默认角色，不可操作') : handleDelete([scope.row.id])"
-            >删除</el-button>
+              @click="
+                scope.row.id === 1
+                  ? ElMessage.warning('系统默认角色，不可操作')
+                  : handleDelete([scope.row.id])
+              "
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
 
     <!-- 角色表单弹窗 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
-          <el-descriptions-item label="角色名称" :span="2">{{ detailFormData.name }}</el-descriptions-item>
+          <el-descriptions-item label="角色名称" :span="2">
+            {{ detailFormData.name }}
+          </el-descriptions-item>
           <el-descriptions-item label="排序" :span="2">
             {{ detailFormData.order }}
           </el-descriptions-item>
-          <el-descriptions-item label="角色编码" :span="2">{{ detailFormData.code }}</el-descriptions-item>
+          <el-descriptions-item label="角色编码" :span="2">
+            {{ detailFormData.code }}
+          </el-descriptions-item>
           <el-descriptions-item label="数据权限" :span="2">
             <el-tag v-if="detailFormData.data_scope === 1" type="primary">仅本人数据权限</el-tag>
             <el-tag v-else-if="detailFormData.data_scope === 2" type="info">本部门数据权限</el-tag>
-            <el-tag v-else-if="detailFormData.data_scope === 3" type="warning">本部门及以下数据权限</el-tag>
+            <el-tag v-else-if="detailFormData.data_scope === 3" type="warning">
+              本部门及以下数据权限
+            </el-tag>
             <el-tag v-else-if="detailFormData.data_scope === 4" type="success">全部数据权限</el-tag>
-            <el-tag v-else type="danger" >自定义数据权限</el-tag>
+            <el-tag v-else type="danger">自定义数据权限</el-tag>
           </el-descriptions-item>
           <el-descriptions-item label="状态" :span="2">
             <el-tag :type="detailFormData.status ? 'success' : 'danger'">
-              {{ detailFormData.status ? '启用' : '停用' }}
+              {{ detailFormData.status ? "启用" : "停用" }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="创建人" :span="2">{{ detailFormData.creator?.name }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{ detailFormData.created_at }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="2">{{ detailFormData.updated_at }}</el-descriptions-item>
-          <el-descriptions-item label="描述" :span="4">{{ detailFormData.description }}</el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="2">
+            {{ detailFormData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="4">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
           <el-form-item label="角色名称" prop="name">
             <el-input v-model="formData.name" placeholder="请输入角色名称" />
           </el-form-item>
 
           <el-form-item label="排序" prop="order">
-            <el-input-number v-model="formData.order" controls-position="right" :min="0" style="width: 100px" />
+            <el-input-number
+              v-model="formData.order"
+              controls-position="right"
+              :min="0"
+              style="width: 100px"
+            />
           </el-form-item>
 
           <el-form-item label="角色编码" prop="code">
@@ -251,24 +443,38 @@
           </el-form-item>
 
           <el-form-item label="描述" prop="description">
-            <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
         </el-form>
-
       </template>
 
       <template #footer>
         <div class="dialog-footer">
           <el-button @click="handleCloseDialog">取 消</el-button>
-          <el-button v-hasPerm="['module_system:role:submit']" type="primary" @click="handleSubmit">确 定</el-button>
+          <el-button v-hasPerm="['module_system:role:submit']" type="primary" @click="handleSubmit">
+            确 定
+          </el-button>
         </div>
       </template>
     </el-dialog>
 
-    <PermissonDrawer v-if="drawerVisible" v-model="drawerVisible" :role-name="checkedRole.name" :role-id="checkedRole.id" @saved="handleRefresh" />
+    <PermissonDrawer
+      v-if="drawerVisible"
+      v-model="drawerVisible"
+      :role-name="checkedRole.name"
+      :role-id="checkedRole.id"
+      @saved="handleRefresh"
+    />
 
     <!-- 导出弹窗 -->
-    <ExportModal 
+    <ExportModal
       v-model="exportsDialogVisible"
       :content-config="curdContentConfig"
       :query-params="queryFormData"
@@ -309,19 +515,19 @@ const drawerVisible = ref(false);
 
 // 表格列配置
 const tableColumns = ref([
-  { prop: 'selection', label: '选择框', show: true },
-  { prop: 'index', label: '序号', show: true },
-  { prop: 'name', label: '角色名称', show: true },
-  { prop: 'data_scope', label: '数据权限', show: true },
-  { prop: 'order', label: '排序', show: true },
-  { prop: 'code', label: '角色编码', show: true },
-  { prop: 'status', label: '状态', show: true },
-  { prop: 'description', label: '描述', show: true },
-  { prop: 'created_at', label: '创建时间', show: true },
-  { prop: 'updated_at', label: '更新时间', show: true },
-  { prop: 'creator', label: '创建人', show: true },
-  { prop: 'operation', label: '操作', show: true }
-])
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "name", label: "角色名称", show: true },
+  { prop: "data_scope", label: "数据权限", show: true },
+  { prop: "order", label: "排序", show: true },
+  { prop: "code", label: "角色编码", show: true },
+  { prop: "status", label: "状态", show: true },
+  { prop: "description", label: "描述", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "creator", label: "创建人", show: true },
+  { prop: "operation", label: "操作", show: true },
+]);
 
 // 详情表单
 const detailFormData = ref<RoleTable>({} as RoleTable);
@@ -332,7 +538,7 @@ const checkedRole = ref<RoleTable>({} as RoleTable);
 const queryFormData = reactive<TablePageQuery>({
   page_no: 1,
   page_size: 10,
-  name: '',
+  name: "",
   status: undefined,
   start_time: undefined,
   end_time: undefined,
@@ -354,7 +560,7 @@ const formData = reactive<RoleForm>({
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -364,7 +570,6 @@ const rules = reactive({
   status: [{ required: true, message: "请选择状态", trigger: "blur" }],
 });
 
-
 // 加载表格数据
 async function loadingData() {
   loading.value = true;
@@ -372,19 +577,17 @@ async function loadingData() {
     const response = await RoleAPI.getRoleList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
+}
 
 // 查询（重置页码后获取数据）
 async function handleQuery() {
@@ -422,7 +625,7 @@ const initialFormData: RoleForm = {
   code: undefined,
   status: true,
   description: undefined,
-}
+};
 
 // 日期范围临时变量
 const dateRange = ref<[Date, Date] | []>([]);
@@ -456,14 +659,14 @@ async function handleCloseDialog() {
 }
 
 // 打开系统配置弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await RoleAPI.getRoleDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "角色详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改角色";
       Object.assign(formData, response.data.data);
     }
@@ -484,9 +687,9 @@ async function handleSubmit() {
       const id = formData.id;
       try {
         if (id) {
-          await RoleAPI.updateRole(id, { id, ...formData })
+          await RoleAPI.updateRole(id, { id, ...formData });
         } else {
-          await RoleAPI.createRole(formData)
+          await RoleAPI.createRole(formData);
         }
         dialogVisible.visible = false;
         resetForm();
@@ -509,19 +712,21 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await RoleAPI.deleteRole(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await RoleAPI.deleteRole(ids);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 导出已改为通过导出弹窗 ExportModal 统一处理
@@ -532,23 +737,25 @@ function handleOpenExportsModal() {
 // 批量启用/停用
 async function handleMoreClick(status: boolean) {
   if (selectIds.value.length) {
-    ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
+    ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
       confirmButtonText: "确定",
       cancelButtonText: "取消",
       type: "warning",
-    }).then(async () => {
-      try {
-        loading.value = true;
-        await RoleAPI.batchAvailableRole({ ids: selectIds.value, status });
-        handleResetQuery();
-      } catch (error: any) {
-        console.error(error);
-      } finally {
-        loading.value = false;
-      }
-    }).catch(() => {
-      ElMessageBox.close();
-    });
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await RoleAPI.batchAvailableRole({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
   }
 }
 
@@ -566,24 +773,24 @@ const exportsDialogVisible = ref(false);
 const selectionRows = ref<RoleTable[]>([]);
 // 导出字段
 const exportColumns = [
-  { prop: 'name', label: '角色名称' },
-  { prop: 'code', label: '角色编码' },
-  { prop: 'data_scope', label: '数据权限' },
-  { prop: 'order', label: '排序' },
-  { prop: 'status', label: '状态' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "name", label: "角色名称" },
+  { prop: "code", label: "角色编码" },
+  { prop: "data_scope", label: "数据权限" },
+  { prop: "order", label: "排序" },
+  { prop: "status", label: "状态" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导入/导出配置
 const curdContentConfig = {
-  permPrefix: 'module_system:role',
+  permPrefix: "module_system:role",
   cols: exportColumns as any,
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.status === 'string') {
-      query.status = query.status === 'true';
+    if (typeof query.status === "string") {
+      query.status = query.status === "true";
     }
     query.page_no = 1;
     query.page_size = 1000;
diff --git a/frontend/src/views/module_system/tenant/index.vue b/frontend/src/views/module_system/tenant/index.vue
index c68300fd..636c9ab8 100644
--- a/frontend/src/views/module_system/tenant/index.vue
+++ b/frontend/src/views/module_system/tenant/index.vue
@@ -13,28 +13,30 @@
         <el-form-item prop="name" label="名称">
           <el-input v-model="queryFormData.name" placeholder="请输入名称" clearable />
         </el-form-item>
-        <el-form-item prop="status" label="状态" >
-          <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 170px;" clearable>
+        <el-form-item prop="status" label="状态">
+          <el-select
+            v-model="queryFormData.status"
+            placeholder="请选择状态"
+            style="width: 170px"
+            clearable
+          >
             <el-option value="true" label="启用" />
             <el-option value="false" label="停用" />
           </el-select>
         </el-form-item>
         <el-form-item v-if="isExpand" prop="creator" label="创建人">
           <UserTableSelect
-              v-model="queryFormData.creator"
-              @confirm-click="handleConfirm"
-              @clear-click="handleQuery"
+            v-model="queryFormData.creator"
+            @confirm-click="handleConfirm"
+            @clear-click="handleQuery"
           />
         </el-form-item>
         <!-- 时间范围，收起状态下隐藏 -->
         <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-          <DatePicker
-            v-model="dateRange"
-            @update:model-value="handleDateRangeChange"
-          />
+          <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
         </el-form-item>
         <!-- 查询、重置、展开/收起按钮 -->
-        <el-form-item >
+        <el-form-item>
           <el-button
             v-hasPerm="['module_generator:tenant:query']"
             type="primary"
@@ -67,7 +69,7 @@
         </el-form-item>
       </el-form>
     </div>
-    
+
     <!-- 内容区域 -->
     <el-card class="data-table">
       <template #header>
@@ -86,18 +88,39 @@
         <div class="data-table__toolbar--left">
           <el-row :gutter="10">
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_generator:tenant:create']" type="success" icon="plus" @click="handleOpenDialog('create')">新增</el-button>
+              <el-button
+                v-hasPerm="['module_generator:tenant:create']"
+                type="success"
+                icon="plus"
+                @click="handleOpenDialog('create')"
+              >
+                新增
+              </el-button>
             </el-col>
             <el-col :span="1.5">
-              <el-button v-hasPerm="['module_generator:tenant:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+              <el-button
+                v-hasPerm="['module_generator:tenant:delete']"
+                type="danger"
+                icon="delete"
+                :disabled="selectIds.length === 0"
+                @click="handleDelete(selectIds)"
+              >
+                批量删除
+              </el-button>
             </el-col>
             <el-col :span="1.5">
               <el-dropdown v-hasPerm="['module_generator:tenant:batch']" trigger="click">
-                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">更多</el-button>
+                <el-button type="default" :disabled="selectIds.length === 0" icon="ArrowDown">
+                  更多
+                </el-button>
                 <template #dropdown>
                   <el-dropdown-menu>
-                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
+                    <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                      批量启用
+                    </el-dropdown-item>
+                    <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                      批量停用
+                    </el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -108,22 +131,46 @@
           <el-row :gutter="10">
             <el-col :span="1.5">
               <el-tooltip content="导入">
-                <el-button v-hasPerm="['module_generator:tenant:import']" type="success" icon="upload" circle @click="handleOpenImportDialog" />
+                <el-button
+                  v-hasPerm="['module_generator:tenant:import']"
+                  type="success"
+                  icon="upload"
+                  circle
+                  @click="handleOpenImportDialog"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="导出">
-                <el-button v-hasPerm="['module_generator:tenant:export']" type="warning" icon="download" circle @click="handleOpenExportsModal" />
+                <el-button
+                  v-hasPerm="['module_generator:tenant:export']"
+                  type="warning"
+                  icon="download"
+                  circle
+                  @click="handleOpenExportsModal"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="搜索显示/隐藏">
-                <el-button v-hasPerm="['*:*:*']" type="info" icon="search" circle @click="visible = !visible" />
+                <el-button
+                  v-hasPerm="['*:*:*']"
+                  type="info"
+                  icon="search"
+                  circle
+                  @click="visible = !visible"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
               <el-tooltip content="刷新">
-                <el-button v-hasPerm="['module_generator:tenant:refresh']" type="primary" icon="refresh" circle @click="handleRefresh" />
+                <el-button
+                  v-hasPerm="['module_generator:tenant:refresh']"
+                  type="primary"
+                  icon="refresh"
+                  circle
+                  @click="handleRefresh"
+                />
               </el-tooltip>
             </el-col>
             <el-col :span="1.5">
@@ -143,50 +190,142 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="tableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
+      <el-table
+        ref="tableRef"
+        v-loading="loading"
+        :data="pageTableData"
+        highlight-current-row
+        class="data-table__content"
+        :height="450"
+        border
+        stripe
+        @selection-change="handleSelectionChange"
+      >
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
-        <el-table-column v-if="tableColumns.find((col) => col.prop === 'selection')?.show" type="selection" min-width="55" align="center"/>
-        <el-table-column v-if="tableColumns.find((col) => col.prop === 'index')?.show" fixed label="序号" min-width="60">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'selection')?.show"
+          type="selection"
+          min-width="55"
+          align="center"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'index')?.show"
+          fixed
+          label="序号"
+          min-width="60"
+        >
           <template #default="scope">
             {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find((col) => col.prop === 'name')?.show" label="名称" prop="name" min-width="140" />
-        <el-table-column v-if="tableColumns.find((col) => col.prop === 'code')?.show" label="编码" prop="code" min-width="140" />
-        <el-table-column v-if="tableColumns.find((col) => col.prop === 'status')?.show" label="状态" prop="status" min-width="120">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'name')?.show"
+          label="名称"
+          prop="name"
+          min-width="140"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'code')?.show"
+          label="编码"
+          prop="code"
+          min-width="140"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'status')?.show"
+          label="状态"
+          prop="status"
+          min-width="120"
+        >
           <template #default="scope">
             <el-tag :type="scope.row.status ? 'success' : 'info'">
-              {{ scope.row.status ? '启用' : '停用' }}
+              {{ scope.row.status ? "启用" : "停用" }}
             </el-tag>
           </template>
         </el-table-column>
-        <el-table-column v-if="tableColumns.find((col) => col.prop === 'description')?.show" label="描述" prop="description" min-width="140" />
-        <el-table-column v-if="tableColumns.find((col) => col.prop === 'created_at')?.show" label="创建时间" prop="created_at" min-width="180" />
-        <el-table-column v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show" label="更新时间" prop="updated_at" min-width="180" />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'description')?.show"
+          label="描述"
+          prop="description"
+          min-width="140"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'created_at')?.show"
+          label="创建时间"
+          prop="created_at"
+          min-width="180"
+        />
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'updated_at')?.show"
+          label="更新时间"
+          prop="updated_at"
+          min-width="180"
+        />
         <!-- <el-table-column v-if="tableColumns.find((col) => col.prop === 'creator')?.show" label="创建人" prop="creator" min-width="120">
           <template #default="scope">
             <el-tag>{{ scope.row.creator?.name }}</el-tag>
           </template>
         </el-table-column> -->
-        <el-table-column v-if="tableColumns.find(col => col.prop === 'operation')?.show" fixed="right" label="操作" align="center" min-width="180">
+        <el-table-column
+          v-if="tableColumns.find((col) => col.prop === 'operation')?.show"
+          fixed="right"
+          label="操作"
+          align="center"
+          min-width="180"
+        >
           <template #default="scope">
-            <el-button v-hasPerm="['module_generator:tenant:detail']" type="info" size="small" link icon="document" @click="handleOpenDialog('detail', scope.row.id)">详情</el-button>
-            <el-button v-hasPerm="['module_generator:tenant:update']" type="primary" size="small" link icon="edit" @click="handleOpenDialog('update', scope.row.id)">编辑</el-button>
-            <el-button v-hasPerm="['module_generator:tenant:delete']" type="danger" size="small" link icon="delete" @click="handleDelete([scope.row.id])">删除</el-button>
+            <el-button
+              v-hasPerm="['module_generator:tenant:detail']"
+              type="info"
+              size="small"
+              link
+              icon="document"
+              @click="handleOpenDialog('detail', scope.row.id)"
+            >
+              详情
+            </el-button>
+            <el-button
+              v-hasPerm="['module_generator:tenant:update']"
+              type="primary"
+              size="small"
+              link
+              icon="edit"
+              @click="handleOpenDialog('update', scope.row.id)"
+            >
+              编辑
+            </el-button>
+            <el-button
+              v-hasPerm="['module_generator:tenant:delete']"
+              type="danger"
+              size="small"
+              link
+              icon="delete"
+              @click="handleDelete([scope.row.id])"
+            >
+              删除
+            </el-button>
           </template>
         </el-table-column>
       </el-table>
 
       <!-- 分页区域 -->
       <template #footer>
-        <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+        <pagination
+          v-model:total="total"
+          v-model:page="queryFormData.page_no"
+          v-model:limit="queryFormData.page_size"
+          @pagination="loadingData"
+        />
       </template>
     </el-card>
 
     <!-- 弹窗区域 -->
-    <el-dialog v-model="dialogVisible.visible" :title="dialogVisible.title" @close="handleCloseDialog">
+    <el-dialog
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
@@ -198,7 +337,7 @@
           </el-descriptions-item>
           <el-descriptions-item label="状态" :span="2">
             <el-tag :type="detailFormData.status ? 'success' : 'danger'">
-              {{ detailFormData.status ? '启用' : '停用' }}
+              {{ detailFormData.status ? "启用" : "停用" }}
             </el-tag>
           </el-descriptions-item>
           <el-descriptions-item label="描述" :span="2">
@@ -217,7 +356,14 @@
       </template>
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
           <el-form-item label="名称" prop="name">
             <el-input v-model="formData.name" placeholder="请输入名称" :maxlength="64" />
           </el-form-item>
@@ -231,7 +377,14 @@
             </el-radio-group>
           </el-form-item>
           <el-form-item label="描述" prop="description">
-            <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
         </el-form>
       </template>
@@ -240,21 +393,35 @@
         <div class="dialog-footer">
           <!-- 详情弹窗不需要确定按钮的提交逻辑 -->
           <el-button @click="handleCloseDialog">取消</el-button>
-          <el-button v-if="dialogVisible.type !== 'detail'" v-hasPerm="['module_generator:tenant:submit']" type="primary" @click="handleSubmit">确定</el-button>
-          <el-button v-else v-hasPerm="['smodule_generator:tenant:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
+          <el-button
+            v-if="dialogVisible.type !== 'detail'"
+            v-hasPerm="['module_generator:tenant:submit']"
+            type="primary"
+            @click="handleSubmit"
+          >
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['smodule_generator:tenant:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
         </div>
       </template>
     </el-dialog>
 
     <!-- 导入弹窗 -->
-    <ImportModal 
-      v-model="importDialogVisible" 
+    <ImportModal
+      v-model="importDialogVisible"
       :content-config="curdContentConfig"
-      @upload="handleUpload" 
+      @upload="handleUpload"
     />
 
     <!-- 导出弹窗 -->
-    <ExportModal 
+    <ExportModal
       v-model="exportsDialogVisible"
       :content-config="curdContentConfig"
       :query-params="queryFormData"
@@ -281,7 +448,6 @@ import { QuestionFilled, ArrowUp, ArrowDown } from "@element-plus/icons-vue";
 import { formatToDateTime } from "@/utils/dateUtil";
 import TenantAPI, { ObjTable, ObjForm, ObjPageQuery } from "@/api/module_system/tenant";
 
-
 const visible = ref(true);
 const queryFormRef = ref();
 const dataFormRef = ref();
@@ -297,37 +463,37 @@ const pageTableData = ref<ObjTable[]>([]);
 
 // 表格列配置
 const tableColumns = ref([
-  { prop: 'selection', label: '选择框', show: true },
-  { prop: 'index', label: '序号', show: true },
-  { prop: 'name', label: '名称', show: true },
-  { prop: 'code', label: '编码', show: true },
-  { prop: 'status', label: '状态', show: true },
-  { prop: 'description', label: '描述', show: true },
-  { prop: 'created_at', label: '创建时间', show: true },
-  { prop: 'updated_at', label: '更新时间', show: true },
-  { prop: 'creator', label: '创建人', show: true },
-  { prop: 'operation', label: '操作', show: true }
-])
+  { prop: "selection", label: "选择框", show: true },
+  { prop: "index", label: "序号", show: true },
+  { prop: "name", label: "名称", show: true },
+  { prop: "code", label: "编码", show: true },
+  { prop: "status", label: "状态", show: true },
+  { prop: "description", label: "描述", show: true },
+  { prop: "created_at", label: "创建时间", show: true },
+  { prop: "updated_at", label: "更新时间", show: true },
+  { prop: "creator", label: "创建人", show: true },
+  { prop: "operation", label: "操作", show: true },
+]);
 
 // 仅用于导出字段的列（排除非数据列及嵌套对象列）
 const exportColumns = [
-  { prop: 'name', label: '名称' },
-  { prop: 'code', label: '编码' },
-  { prop: 'status', label: '状态' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "name", label: "名称" },
+  { prop: "code", label: "编码" },
+  { prop: "status", label: "状态" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导入/导出配置
 const curdContentConfig = {
-  permPrefix: 'module_generator:tenant',
+  permPrefix: "module_generator:tenant",
   cols: exportColumns as any,
   importTemplate: () => TenantAPI.download(),
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.status === 'string') {
-      query.status = query.status === 'true';
+    if (typeof query.status === "string") {
+      query.status = query.status === "true";
     }
     query.page_no = 1;
     query.page_size = 9999;
@@ -348,7 +514,7 @@ const detailFormData = ref<ObjTable>({});
 // 日期范围临时变量
 const dateRange = ref<[Date, Date] | []>([]);
 
- // 处理日期范围变化
+// 处理日期范围变化
 function handleDateRangeChange(range: [Date, Date]) {
   dateRange.value = range;
   if (range && range.length === 2) {
@@ -374,17 +540,17 @@ const queryFormData = reactive<ObjPageQuery>({
 // 编辑表单
 const formData = reactive<ObjForm>({
   id: undefined,
-  name: '',
-  code: '',
+  name: "",
+  code: "",
   status: true,
   description: undefined,
-})
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -413,7 +579,7 @@ function handleOpenExportsModal() {
 // 列表刷新
 async function handleRefresh() {
   await loadingData();
-};
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -422,11 +588,9 @@ async function loadingData() {
     const response = await TenantAPI.list(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -456,11 +620,11 @@ async function handleResetQuery() {
 // 定义初始表单数据常量
 const initialFormData: ObjForm = {
   id: undefined,
-  name: '',
-  code: '',
+  name: "",
+  code: "",
   status: true,
-  description: '',
-}
+  description: "",
+};
 
 // 重置表单
 async function resetForm() {
@@ -485,14 +649,14 @@ async function handleCloseDialog() {
 }
 
 // 打开弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await TenantAPI.detail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改";
       Object.assign(formData, response.data.data);
     }
@@ -508,35 +672,35 @@ async function handleSubmit() {
   // 表单校验
   dataFormRef.value.validate(async (valid: any) => {
     if (valid) {
-        loading.value = true;
-        // 根据弹窗传入的参数(deatil\create\update)判断走什么逻辑
-        const id = formData.id;
-        if (id) {
-          try {
-            await TenantAPI.update(id, { id, ...formData })
-            dialogVisible.visible = false;
-            resetForm();
-            handleCloseDialog();
-            handleResetQuery();
-          } catch (error: any) {
-              console.error(error);
-          } finally {
-            loading.value = false;
-          }
-        } else {
-          try {
-            await TenantAPI.create(formData)
-            dialogVisible.visible = false;
-            resetForm();
-            handleCloseDialog();
-            handleResetQuery();
-          } catch (error: any) {
-            console.error(error);
-          } finally {
-            loading.value = false;
-          }
+      loading.value = true;
+      // 根据弹窗传入的参数(deatil\create\update)判断走什么逻辑
+      const id = formData.id;
+      if (id) {
+        try {
+          await TenantAPI.update(id, { id, ...formData });
+          dialogVisible.visible = false;
+          resetForm();
+          handleCloseDialog();
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      } else {
+        try {
+          await TenantAPI.create(formData);
+          dialogVisible.visible = false;
+          resetForm();
+          handleCloseDialog();
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
         }
       }
+    }
   });
 }
 
@@ -546,41 +710,45 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await TenantAPI.delete(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
-}
-
-// 批量启用/停用
-async function handleMoreClick(status: boolean) {
-  if (selectIds.value.length) {
-    ElMessageBox.confirm(`确认${status ? '启用' : '停用'}该项数据?`, "警告", {
-      confirmButtonText: "确定",
-      cancelButtonText: "取消",
-      type: "warning",
-    }).then(async () => {
+  })
+    .then(async () => {
       try {
         loading.value = true;
-        await TenantAPI.batch({ ids: selectIds.value, status });
+        await TenantAPI.delete(ids);
         handleResetQuery();
       } catch (error: any) {
         console.error(error);
       } finally {
         loading.value = false;
       }
-    }).catch(() => {
+    })
+    .catch(() => {
       ElMessageBox.close();
     });
+}
+
+// 批量启用/停用
+async function handleMoreClick(status: boolean) {
+  if (selectIds.value.length) {
+    ElMessageBox.confirm(`确认${status ? "启用" : "停用"}该项数据?`, "警告", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await TenantAPI.batch({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
   }
 }
 
@@ -594,7 +762,7 @@ const handleUpload = async (formData: FormData) => {
       await handleQuery();
     }
   } catch (error: any) {
-      console.error(error);
+    console.error(error);
   }
 };
 
diff --git a/frontend/src/views/module_system/user/components/DeptTree.vue b/frontend/src/views/module_system/user/components/DeptTree.vue
index 512f16c6..eef73ad4 100644
--- a/frontend/src/views/module_system/user/components/DeptTree.vue
+++ b/frontend/src/views/module_system/user/components/DeptTree.vue
@@ -9,15 +9,16 @@
       </template>
     </el-input>
 
-    <el-tree 
+    <el-tree
       ref="deptTreeRef"
-      class="mt-2" 
+      class="mt-2"
       :data="deptOptions"
-      :props="{ children: 'children', label: 'label', disabled: 'disabled' }" 
+      :props="{ children: 'children', label: 'label', disabled: 'disabled' }"
       :expand-on-click-node="false"
-      :filter-node-method="handleFilter" 
-      default-expand-all 
-      @node-click="handleNodeClick" >
+      :filter-node-method="handleFilter"
+      default-expand-all
+      @node-click="handleNodeClick"
+    >
       <template #empty>
         <el-empty :image-size="80" description="暂无数据" />
       </template>
@@ -28,7 +29,7 @@
 <script setup lang="ts">
 import DeptAPI, { DeptPageQuery } from "@/api/module_system/dept";
 import { formatTree } from "@/utils/common";
-import type { FilterNodeMethodFunction, TreeInstance } from 'element-plus'
+import type { FilterNodeMethodFunction, TreeInstance } from "element-plus";
 
 const props = defineProps({
   modelValue: {
@@ -46,11 +47,11 @@ const emits = defineEmits(["node-click", "update:modelValue"]);
 const deptId = useVModel(props, "modelValue", emits);
 
 watch(deptName, (val) => {
-  deptTreeRef.value!.filter(val)
-})
+  deptTreeRef.value!.filter(val);
+});
 
 interface Tree {
-  [key: string]: any
+  [key: string]: any;
 }
 
 /**
@@ -58,8 +59,8 @@ interface Tree {
  */
 const handleFilter: FilterNodeMethodFunction = (value: string, data: Tree) => {
   if (!value) return true;
-  return data.label.includes(value)
-}
+  return data.label.includes(value);
+};
 
 /** 部门树节点 Click */
 function handleNodeClick(data: { [key: string]: any }) {
@@ -78,10 +79,12 @@ const loading = ref(true);
 
 onBeforeMount(() => {
   loading.value = true;
-  DeptAPI.getDeptList(queryFormData).then((response) => {
-    deptOptions.value = formatTree(response.data.data);
-  }).finally(() => {
-    loading.value = false;
-  });
+  DeptAPI.getDeptList(queryFormData)
+    .then((response) => {
+      deptOptions.value = formatTree(response.data.data);
+    })
+    .finally(() => {
+      loading.value = false;
+    });
 });
 </script>
diff --git a/frontend/src/views/module_system/user/components/UserTableSelect.vue b/frontend/src/views/module_system/user/components/UserTableSelect.vue
index 60dbaab5..9bfd940f 100644
--- a/frontend/src/views/module_system/user/components/UserTableSelect.vue
+++ b/frontend/src/views/module_system/user/components/UserTableSelect.vue
@@ -1,6 +1,11 @@
 <!-- 列表选择器 -->
 <template>
-  <table-select :text="text" :select-config="selectConfig" @confirm-click="handleConfirm" @clear-click="handleClearSelection">
+  <table-select
+    :text="text"
+    :select-config="selectConfig"
+    @confirm-click="handleConfirm"
+    @clear-click="handleClearSelection"
+  >
     <template #status="scope">
       <el-tag :type="scope.row[scope.prop] === true ? 'success' : 'danger'">
         {{ scope.row[scope.prop] === true ? "启用" : "停用" }}
diff --git a/frontend/src/views/module_system/user/index.vue b/frontend/src/views/module_system/user/index.vue
index 3f96afd5..f8aee6cb 100644
--- a/frontend/src/views/module_system/user/index.vue
+++ b/frontend/src/views/module_system/user/index.vue
@@ -4,14 +4,20 @@
     <el-row :gutter="12">
       <!-- 部门树 -->
       <el-col :lg="4" :xs="24">
-        <DeptTree v-model="queryFormData.dept_id" class="h-full" @node-click="handleQuery"  />
+        <DeptTree v-model="queryFormData.dept_id" class="h-full" @node-click="handleQuery" />
       </el-col>
 
       <!-- 用户列表 -->
       <el-col :lg="20" :xs="24">
         <!-- 搜索区域 -->
         <div class="search-container">
-          <el-form ref="queryFormRef" :model="queryFormData" :inline="true"  label-suffix=":" @submit.prevent="handleQuery" >
+          <el-form
+            ref="queryFormRef"
+            :model="queryFormData"
+            :inline="true"
+            label-suffix=":"
+            @submit.prevent="handleQuery"
+          >
             <el-form-item prop="username" label="账号">
               <el-input v-model="queryFormData.username" placeholder="请输入账号" clearable />
             </el-form-item>
@@ -19,32 +25,52 @@
               <el-input v-model="queryFormData.name" placeholder="请输入用户名" clearable />
             </el-form-item>
             <el-form-item prop="status" label="状态">
-              <el-select v-model="queryFormData.status" placeholder="请选择状态" style="width: 167.5px" clearable>
+              <el-select
+                v-model="queryFormData.status"
+                placeholder="请选择状态"
+                style="width: 167.5px"
+                clearable
+              >
                 <el-option value="true" label="启用" />
                 <el-option value="false" label="停用" />
               </el-select>
             </el-form-item>
             <!-- 时间范围，收起状态下隐藏 -->
             <el-form-item v-if="isExpand" prop="start_time" label="创建时间">
-              <DatePicker
-                  v-model="dateRange"
-                  @update:model-value="handleDateRangeChange"
-              />
+              <DatePicker v-model="dateRange" @update:model-value="handleDateRangeChange" />
             </el-form-item>
             <el-form-item v-if="isExpand" prop="creator" label="创建人">
               <UserTableSelect
-                  v-model="queryFormData.creator"
-                  @confirm-click="handleConfirm"
-                  @clear-click="handleQuery"
+                v-model="queryFormData.creator"
+                @confirm-click="handleConfirm"
+                @clear-click="handleQuery"
               />
             </el-form-item>
             <!-- 查询、重置、展开/收起按钮 -->
             <el-form-item class="search-buttons">
-              <el-button v-hasPerm="['module_system:user:query']" type="primary" icon="search" native-type="submit">查询</el-button>
-              <el-button v-hasPerm="['module_system:user:query']" icon="refresh" @click="handleResetQuery">重置</el-button>
+              <el-button
+                v-hasPerm="['module_system:user:query']"
+                type="primary"
+                icon="search"
+                native-type="submit"
+              >
+                查询
+              </el-button>
+              <el-button
+                v-hasPerm="['module_system:user:query']"
+                icon="refresh"
+                @click="handleResetQuery"
+              >
+                重置
+              </el-button>
               <!-- 展开/收起 -->
               <template v-if="isExpandable">
-                <el-link class="ml-3" type="primary" underline="never" @click="isExpand = !isExpand">
+                <el-link
+                  class="ml-3"
+                  type="primary"
+                  underline="never"
+                  @click="isExpand = !isExpand"
+                >
                   {{ isExpand ? "收起" : "展开" }}
                   <el-icon>
                     <template v-if="isExpand">
@@ -77,10 +103,25 @@
             <div class="data-table__toolbar--left">
               <el-row :gutter="10">
                 <el-col :span="1.5">
-                  <el-button v-hasPerm="['module_system:user:create']" type="success" icon="plus"  @click="handleOpenDialog('create')">新增</el-button>
+                  <el-button
+                    v-hasPerm="['module_system:user:create']"
+                    type="success"
+                    icon="plus"
+                    @click="handleOpenDialog('create')"
+                  >
+                    新增
+                  </el-button>
                 </el-col>
                 <el-col :span="1.5">
-                  <el-button v-hasPerm="['module_system:user:delete']" type="danger" icon="delete" :disabled="selectIds.length === 0" @click="handleDelete(selectIds)">批量删除</el-button>
+                  <el-button
+                    v-hasPerm="['module_system:user:delete']"
+                    type="danger"
+                    icon="delete"
+                    :disabled="selectIds.length === 0"
+                    @click="handleDelete(selectIds)"
+                  >
+                    批量删除
+                  </el-button>
                 </el-col>
                 <el-col :span="1.5">
                   <el-dropdown v-hasPerm="['module_system:user:patch']" trigger="click">
@@ -89,8 +130,12 @@
                     </el-button>
                     <template #dropdown>
                       <el-dropdown-menu v-hasPerm="['module_system:user:filter']">
-                        <el-dropdown-item icon="Check" @click="handleMoreClick(true)">批量启用</el-dropdown-item>
-                        <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">批量停用</el-dropdown-item>
+                        <el-dropdown-item icon="Check" @click="handleMoreClick(true)">
+                          批量启用
+                        </el-dropdown-item>
+                        <el-dropdown-item icon="CircleClose" @click="handleMoreClick(false)">
+                          批量停用
+                        </el-dropdown-item>
                       </el-dropdown-menu>
                     </template>
                   </el-dropdown>
@@ -102,17 +147,35 @@
               <el-row :gutter="10">
                 <el-col :span="1.5">
                   <el-tooltip content="导入">
-                    <el-button v-hasPerm="['module_system:user:import']" type="info" icon="upload" circle @click="handleOpenImportDialog" />
+                    <el-button
+                      v-hasPerm="['module_system:user:import']"
+                      type="info"
+                      icon="upload"
+                      circle
+                      @click="handleOpenImportDialog"
+                    />
                   </el-tooltip>
                 </el-col>
                 <el-col :span="1.5">
                   <el-tooltip content="导出">
-                    <el-button v-hasPerm="['module_system:user:export']" type="warning" icon="download" circle @click="handleOpenExportsModal" />
+                    <el-button
+                      v-hasPerm="['module_system:user:export']"
+                      type="warning"
+                      icon="download"
+                      circle
+                      @click="handleOpenExportsModal"
+                    />
                   </el-tooltip>
                 </el-col>
                 <el-col :span="1.5">
                   <el-tooltip content="刷新">
-                    <el-button v-hasPerm="['module_system:user:refresh']" type="default" icon="refresh" circle @click="handleRefresh"/>
+                    <el-button
+                      v-hasPerm="['module_system:user:refresh']"
+                      type="default"
+                      icon="refresh"
+                      circle
+                      @click="handleRefresh"
+                    />
                   </el-tooltip>
                 </el-col>
               </el-row>
@@ -120,12 +183,22 @@
           </div>
 
           <!-- 表格区域 -->
-          <el-table ref="dataTableRef" v-loading="loading" :data="pageTableData" highlight-current-row class="data-table__content" :height="450" border stripe @selection-change="handleSelectionChange">
+          <el-table
+            ref="dataTableRef"
+            v-loading="loading"
+            :data="pageTableData"
+            highlight-current-row
+            class="data-table__content"
+            :height="450"
+            border
+            stripe
+            @selection-change="handleSelectionChange"
+          >
             <template #empty>
               <el-empty :image-size="80" description="暂无数据" />
             </template>
             <el-table-column type="selection" min-width="55" align="center" />
-            <el-table-column type="index" fixed label="序号" align="center" min-width="60" >
+            <el-table-column type="index" fixed label="序号" align="center" min-width="60">
               <template #default="scope">
                 {{ (queryFormData.page_no - 1) * queryFormData.page_size + scope.$index + 1 }}
               </template>
@@ -152,14 +225,14 @@
             <el-table-column label="是否超管" prop="is_superuser" min-width="100">
               <template #default="scope">
                 <el-tag :type="scope.row.is_superuser ? 'success' : 'info'">
-                  {{ scope.row.is_superuser ? '是' : '否' }}
+                  {{ scope.row.is_superuser ? "是" : "否" }}
                 </el-tag>
               </template>
             </el-table-column>
             <el-table-column label="性别" prop="gender" min-width="100">
               <template #default="scope">
-                <el-tag v-if="scope.row.gender ==='0'" type="success">男</el-tag>
-                <el-tag v-else-if="scope.row.gender ==='1'" type="warning">女</el-tag>
+                <el-tag v-if="scope.row.gender === '0'" type="success">男</el-tag>
+                <el-tag v-else-if="scope.row.gender === '1'" type="warning">女</el-tag>
                 <el-tag v-else type="info">未知</el-tag>
               </template>
             </el-table-column>
@@ -175,59 +248,92 @@
             </el-table-column>
             <el-table-column fixed="right" label="操作" align="center" min-width="280">
               <template #default="scope">
-                <el-button 
-                  v-hasPerm="['module_system:user:update']" 
-                  type="warning" 
-                  icon="RefreshLeft" 
-                  size="small" 
+                <el-button
+                  v-hasPerm="['module_system:user:update']"
+                  type="warning"
+                  icon="RefreshLeft"
+                  size="small"
                   link
-                  :disabled="scope.row.is_superuser === true" 
-                  @click="scope.row.is_superuser === true ? ElMessage.warning('系统超管角色，不可操作') : hancleResetPassword(scope.row)"
-                >重置密码</el-button>
-                <el-button 
+                  :disabled="scope.row.is_superuser === true"
+                  @click="
+                    scope.row.is_superuser === true
+                      ? ElMessage.warning('系统超管角色，不可操作')
+                      : hancleResetPassword(scope.row)
+                  "
+                >
+                  重置密码
+                </el-button>
+                <el-button
                   v-hasPerm="['module_system:user:detail']"
-                  type="info" 
-                  size="small" 
-                  link 
-                  icon="document" 
+                  type="info"
+                  size="small"
+                  link
+                  icon="document"
                   @click="handleOpenDialog('detail', scope.row.id)"
-                >详情</el-button>
-                <el-button 
-                  v-hasPerm="['module_system:user:update']" 
-                  type="primary" 
-                  size="small" 
-                  link 
-                  icon="edit" 
-                  :disabled="scope.row.is_superuser === true" 
-                  @click="scope.row.is_superuser === true ? ElMessage.warning('系统超管角色，不可操作') : handleOpenDialog('update', scope.row.id)"
-                >编辑</el-button>
-                <el-button 
-                  v-hasPerm="['module_system:user:delete']" 
-                  type="danger" 
-                  size="small" 
-                  link 
-                  icon="delete" 
-                  :disabled="scope.row.is_superuser === true" 
-                  @click="scope.row.is_superuser === true ? ElMessage.warning('系统超管角色，不可操作') : handleDelete([scope.row.id])"
-                >删除</el-button>
+                >
+                  详情
+                </el-button>
+                <el-button
+                  v-hasPerm="['module_system:user:update']"
+                  type="primary"
+                  size="small"
+                  link
+                  icon="edit"
+                  :disabled="scope.row.is_superuser === true"
+                  @click="
+                    scope.row.is_superuser === true
+                      ? ElMessage.warning('系统超管角色，不可操作')
+                      : handleOpenDialog('update', scope.row.id)
+                  "
+                >
+                  编辑
+                </el-button>
+                <el-button
+                  v-hasPerm="['module_system:user:delete']"
+                  type="danger"
+                  size="small"
+                  link
+                  icon="delete"
+                  :disabled="scope.row.is_superuser === true"
+                  @click="
+                    scope.row.is_superuser === true
+                      ? ElMessage.warning('系统超管角色，不可操作')
+                      : handleDelete([scope.row.id])
+                  "
+                >
+                  删除
+                </el-button>
               </template>
             </el-table-column>
           </el-table>
 
           <!-- 分页区域 -->
           <template #footer>
-            <pagination v-model:total="total" v-model:page="queryFormData.page_no" v-model:limit="queryFormData.page_size" @pagination="loadingData" />
+            <pagination
+              v-model:total="total"
+              v-model:page="queryFormData.page_no"
+              v-model:limit="queryFormData.page_size"
+              @pagination="loadingData"
+            />
           </template>
         </el-card>
       </el-col>
     </el-row>
 
     <!-- 弹窗区域 -->
-    <el-drawer v-model="dialogVisible.visible" :title="dialogVisible.title" append-to-body :size="drawerSize" @close="handleCloseDialog">
+    <el-drawer
+      v-model="dialogVisible.visible"
+      :title="dialogVisible.title"
+      append-to-body
+      :size="drawerSize"
+      @close="handleCloseDialog"
+    >
       <!-- 详情 -->
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="2" border>
-          <el-descriptions-item label="编号" :span="2">{{ detailFormData.id }}</el-descriptions-item>
+          <el-descriptions-item label="编号" :span="2">
+            {{ detailFormData.id }}
+          </el-descriptions-item>
           <el-descriptions-item label="头像" :span="2">
             <template v-if="detailFormData.avatar">
               <el-avatar :src="detailFormData.avatar" size="small"></el-avatar>
@@ -236,40 +342,81 @@
               <el-avatar icon="UserFilled" size="small"></el-avatar>
             </template>
           </el-descriptions-item>
-          <el-descriptions-item label="账号" :span="2">{{ detailFormData.username }}</el-descriptions-item>
-          <el-descriptions-item label="用户名" :span="2">{{ detailFormData.name }}</el-descriptions-item>
+          <el-descriptions-item label="账号" :span="2">
+            {{ detailFormData.username }}
+          </el-descriptions-item>
+          <el-descriptions-item label="用户名" :span="2">
+            {{ detailFormData.name }}
+          </el-descriptions-item>
           <el-descriptions-item label="性别" :span="2">
-            <el-tag v-if="detailFormData.gender ==='0'" type="success">男</el-tag>
-            <el-tag v-else-if="detailFormData.gender ==='1'" type="warning">女</el-tag>
+            <el-tag v-if="detailFormData.gender === '0'" type="success">男</el-tag>
+            <el-tag v-else-if="detailFormData.gender === '1'" type="warning">女</el-tag>
             <el-tag v-else type="info">未知</el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="部门" :span="2">{{ detailFormData.dept ? detailFormData.dept.name : '' }}</el-descriptions-item>
-          <el-descriptions-item label="角色" :span="2">{{ detailFormData.roles ? detailFormData.roles.map(item => item.name).join('、') : '' }}</el-descriptions-item>
-          <el-descriptions-item label="岗位" :span="2">{{ detailFormData.positions ? detailFormData.positions.map(item => item.name).join('、') : '' }}</el-descriptions-item>  
-          <el-descriptions-item label="邮箱" :span="2">{{ detailFormData.email }}</el-descriptions-item>
-          <el-descriptions-item label="手机号" :span="2">{{ detailFormData.mobile }}</el-descriptions-item>
+          <el-descriptions-item label="部门" :span="2">
+            {{ detailFormData.dept ? detailFormData.dept.name : "" }}
+          </el-descriptions-item>
+          <el-descriptions-item label="角色" :span="2">
+            {{
+              detailFormData.roles ? detailFormData.roles.map((item) => item.name).join("、") : ""
+            }}
+          </el-descriptions-item>
+          <el-descriptions-item label="岗位" :span="2">
+            {{
+              detailFormData.positions
+                ? detailFormData.positions.map((item) => item.name).join("、")
+                : ""
+            }}
+          </el-descriptions-item>
+          <el-descriptions-item label="邮箱" :span="2">
+            {{ detailFormData.email }}
+          </el-descriptions-item>
+          <el-descriptions-item label="手机号" :span="2">
+            {{ detailFormData.mobile }}
+          </el-descriptions-item>
           <el-descriptions-item label="是否超管" :span="2">
             <el-tag :type="detailFormData.is_superuser ? 'success' : 'info'">
-              {{ detailFormData.is_superuser ? '是' : '否' }}
+              {{ detailFormData.is_superuser ? "是" : "否" }}
             </el-tag>
           </el-descriptions-item>
           <el-descriptions-item label="状态" :span="2">
             <el-tag :type="detailFormData.status ? 'success' : 'danger'">
-              {{ detailFormData.status ? '启用' : '停用' }}
+              {{ detailFormData.status ? "启用" : "停用" }}
             </el-tag>
           </el-descriptions-item>
-          <el-descriptions-item label="上次登录时间" :span="2">{{ detailFormData.last_login }}</el-descriptions-item>
-          <el-descriptions-item label="创建人" :span="2">{{ detailFormData.creator?.name }}</el-descriptions-item>
-          <el-descriptions-item label="创建时间" :span="2">{{ detailFormData.created_at }}</el-descriptions-item>
-          <el-descriptions-item label="更新时间" :span="2">{{ detailFormData.updated_at }}</el-descriptions-item>
-          <el-descriptions-item label="描述" :span="4">{{ detailFormData.description }}</el-descriptions-item>
+          <el-descriptions-item label="上次登录时间" :span="2">
+            {{ detailFormData.last_login }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建人" :span="2">
+            {{ detailFormData.creator?.name }}
+          </el-descriptions-item>
+          <el-descriptions-item label="创建时间" :span="2">
+            {{ detailFormData.created_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="更新时间" :span="2">
+            {{ detailFormData.updated_at }}
+          </el-descriptions-item>
+          <el-descriptions-item label="描述" :span="4">
+            {{ detailFormData.description }}
+          </el-descriptions-item>
         </el-descriptions>
       </template>
       <!-- 新增、编辑表单 -->
       <template v-else>
-        <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
+        <el-form
+          ref="dataFormRef"
+          :model="formData"
+          :rules="rules"
+          label-suffix=":"
+          label-width="auto"
+          label-position="right"
+        >
           <el-form-item label="账号" prop="username">
-            <el-input v-model="formData.username" :disabled="!!formData.id" placeholder="请输入账号" />
+            <el-input
+              v-model="formData.username"
+              :disabled="!!formData.id"
+              placeholder="请输入账号"
+            />
           </el-form-item>
 
           <el-form-item label="用户名" prop="name">
@@ -293,23 +440,50 @@
           </el-form-item>
 
           <el-form-item label="部门" prop="dept_id">
-            <el-tree-select v-model="formData.dept_id" placeholder="请选择上级部门" :data="deptOptions" :props="{ children: 'children', label: 'label', disabled: 'disabled' }" filterable check-strictly :render-after-expand="false" />
+            <el-tree-select
+              v-model="formData.dept_id"
+              placeholder="请选择上级部门"
+              :data="deptOptions"
+              :props="{ children: 'children', label: 'label', disabled: 'disabled' }"
+              filterable
+              check-strictly
+              :render-after-expand="false"
+            />
           </el-form-item>
 
           <el-form-item label="角色" prop="role_ids">
             <el-select v-model="formData.role_ids" multiple placeholder="请选择角色">
-              <el-option v-for="item in roleOptions" :key="item.value" :label="item.label" :value="item.value" :disabled="item.disabled" />
+              <el-option
+                v-for="item in roleOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+                :disabled="item.disabled"
+              />
             </el-select>
           </el-form-item>
 
           <el-form-item label="岗位" prop="position_ids">
             <el-select v-model="formData.position_ids" multiple placeholder="请选择岗位">
-              <el-option v-for="item in positionOptions" :key="item.value" :label="item.label" :value="item.value" :disabled="item.disabled" />
+              <el-option
+                v-for="item in positionOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+                :disabled="item.disabled"
+              />
             </el-select>
           </el-form-item>
 
           <el-form-item label="密码" prop="password">
-            <el-input v-model="formData.password" :readonly="!!formData.id" placeholder="请输入密码" type="password" show-password clearable />
+            <el-input
+              v-model="formData.password"
+              :readonly="!!formData.id"
+              placeholder="请输入密码"
+              type="password"
+              show-password
+              clearable
+            />
           </el-form-item>
 
           <el-form-item label="是否超管" prop="is_superuser">
@@ -324,38 +498,56 @@
           </el-form-item>
 
           <el-form-item label="描述" prop="description">
-            <el-input v-model="formData.description" :rows="4" :maxlength="100" show-word-limit type="textarea" placeholder="请输入描述" />
+            <el-input
+              v-model="formData.description"
+              :rows="4"
+              :maxlength="100"
+              show-word-limit
+              type="textarea"
+              placeholder="请输入描述"
+            />
           </el-form-item>
-
-
         </el-form>
       </template>
 
       <template #footer>
         <div class="dialog-footer">
-          <el-button v-if="dialogVisible.type === 'create' || dialogVisible.type === 'update'" v-hasPerm="['module_system:user:create']" type="primary" @click="handleSubmit">确定</el-button>
-          <el-button v-else v-hasPerm="['module_system:user:detail']" type="primary" @click="handleCloseDialog">确定</el-button>
+          <el-button
+            v-if="dialogVisible.type === 'create' || dialogVisible.type === 'update'"
+            v-hasPerm="['module_system:user:create']"
+            type="primary"
+            @click="handleSubmit"
+          >
+            确定
+          </el-button>
+          <el-button
+            v-else
+            v-hasPerm="['module_system:user:detail']"
+            type="primary"
+            @click="handleCloseDialog"
+          >
+            确定
+          </el-button>
           <el-button @click="handleCloseDialog">取消</el-button>
         </div>
       </template>
     </el-drawer>
 
     <!-- 导入弹窗 -->
-    <ImportModal 
-      v-model="importDialogVisible" 
+    <ImportModal
+      v-model="importDialogVisible"
       :content-config="curdContentConfig"
-      @upload="handleUpload" 
+      @upload="handleUpload"
     />
 
     <!-- 导出弹窗 -->
-    <ExportModal 
+    <ExportModal
       v-model="exportsDialogVisible"
       :content-config="curdContentConfig"
       :query-params="queryFormData"
       :page-data="pageTableData"
       :selection-data="selectionRows"
     />
-    
   </div>
 </template>
 
@@ -369,7 +561,11 @@ import { useAppStore } from "@/store/modules/app.store";
 import { DeviceEnum } from "@/enums/settings/device.enum";
 import { ResultEnum } from "@/enums/api/result.enum";
 
-import UserAPI, { type UserForm, type UserInfo, type UserPageQuery } from "@/api/module_system/user";
+import UserAPI, {
+  type UserForm,
+  type UserInfo,
+  type UserPageQuery,
+} from "@/api/module_system/user";
 import { formatTree } from "@/utils/common";
 import PositionAPI from "@/api/module_system/position";
 import DeptAPI from "@/api/module_system/dept";
@@ -443,13 +639,13 @@ const formData = reactive<UserForm>({
   is_superuser: false, //默认不是超管
   status: true,
   description: undefined,
-})
+});
 
 // 弹窗状态
 const dialogVisible = reactive({
   title: "",
   visible: false,
-  type: 'create' as 'create' | 'update' | 'detail',
+  type: "create" as "create" | "update" | "detail",
 });
 
 // 表单验证规则
@@ -481,27 +677,27 @@ const dateRange = ref<[Date, Date] | []>([]);
 
 // 仅用于导出字段的列（排除非数据列及嵌套对象列）
 const exportColumns = [
-  { prop: 'username', label: '账号' },
-  { prop: 'name', label: '名称' },
-  { prop: 'status', label: '状态' },
-  { prop: 'gender', label: '性别' },
-  { prop: 'email', label: '邮箱' },
-  { prop: 'mobile', label: '手机号' },
-  { prop: 'is_superuser', label: '是否超管' },
-  { prop: 'description', label: '描述' },
-  { prop: 'created_at', label: '创建时间' },
-  { prop: 'updated_at', label: '更新时间' },
+  { prop: "username", label: "账号" },
+  { prop: "name", label: "名称" },
+  { prop: "status", label: "状态" },
+  { prop: "gender", label: "性别" },
+  { prop: "email", label: "邮箱" },
+  { prop: "mobile", label: "手机号" },
+  { prop: "is_superuser", label: "是否超管" },
+  { prop: "description", label: "描述" },
+  { prop: "created_at", label: "创建时间" },
+  { prop: "updated_at", label: "更新时间" },
 ];
 
 // 导入/导出配置
 const curdContentConfig = {
-  permPrefix: 'module_system:user',
+  permPrefix: "module_system:user",
   cols: exportColumns as any,
   importTemplate: () => UserAPI.downloadTemplate(),
   exportsAction: async (params: any) => {
     const query: any = { ...params };
-    if (typeof query.status === 'string') {
-      query.status = query.status === 'true';
+    if (typeof query.status === "string") {
+      query.status = query.status === "true";
     }
     query.page_no = 1;
     query.page_size = 9999;
@@ -518,7 +714,6 @@ const curdContentConfig = {
   },
 } as unknown as IContentConfig;
 
-
 // 选择创建人后触发查询
 function handleConfirm() {
   handleQuery();
@@ -537,9 +732,9 @@ function handleDateRangeChange(range: [Date, Date]) {
 }
 
 // 列表刷新
-async function handleRefresh () {
+async function handleRefresh() {
   await loadingData();
-};
+}
 
 // 加载表格数据
 async function loadingData() {
@@ -548,11 +743,9 @@ async function loadingData() {
     const response = await UserAPI.getUserList(queryFormData);
     pageTableData.value = response.data.data.items;
     total.value = response.data.data.total;
-  }
-  catch (error: any) {
+  } catch (error: any) {
     console.error(error);
-  }
-  finally {
+  } finally {
     loading.value = false;
   }
 }
@@ -598,7 +791,7 @@ const initialFormData: UserForm = {
   is_superuser: false, //默认不是超管
   status: true,
   description: undefined,
-}
+};
 
 // 重置表单
 async function resetForm() {
@@ -627,7 +820,7 @@ function hancleResetPassword(row: UserInfo) {
         ElMessage.warning("密码至少需要6位字符，请重新输入");
         return false;
       }
-      await UserAPI.resetUserPassword({id: row.id!, password: value})
+      await UserAPI.resetUserPassword({ id: row.id!, password: value });
     },
     () => {
       ElMessageBox.close();
@@ -642,19 +835,19 @@ async function handleCloseDialog() {
 }
 
 // 打开弹窗
-async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: number) {
+async function handleOpenDialog(type: "create" | "update" | "detail", id?: number) {
   dialogVisible.type = type;
   if (id) {
     const response = await UserAPI.getUserDetail(id);
-    if (type === 'detail') {
+    if (type === "detail") {
       dialogVisible.title = "用户详情";
       Object.assign(detailFormData.value, response.data.data);
-    } else if (type === 'update') {
+    } else if (type === "update") {
       dialogVisible.title = "修改用户";
       Object.assign(formData, response.data.data);
       // 确保角色和岗位ID正确设置
-      formData.role_ids = (response.data.data.roles || []).map(item => item.id as number);
-      formData.position_ids = (response.data.data.positions || []).map(item => item.id as number);
+      formData.role_ids = (response.data.data.roles || []).map((item) => item.id as number);
+      formData.position_ids = (response.data.data.positions || []).map((item) => item.id as number);
     }
   } else {
     dialogVisible.title = "新增用户";
@@ -674,24 +867,24 @@ async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: numbe
   // 获取角色列表
   const roleResponse = await RoleAPI.getRoleList();
   roleOptions.value = roleResponse.data.data.items
-    .filter(item => item.id !== undefined && item.name !== undefined)
-    .map(item => ({
+    .filter((item) => item.id !== undefined && item.name !== undefined)
+    .map((item) => ({
       value: item.id as number,
       label: item.name as string,
-      disabled: item.status === false || String(item.status) === 'false'
+      disabled: item.status === false || String(item.status) === "false",
     }))
-    .filter(opt => !opt.disabled);
+    .filter((opt) => !opt.disabled);
 
   // 获取岗位列表
   const positionResponse = await PositionAPI.getPositionList();
   positionOptions.value = positionResponse.data.data.items
-    .filter(item => item.id !== undefined && item.name !== undefined)
-    .map(item => ({
+    .filter((item) => item.id !== undefined && item.name !== undefined)
+    .map((item) => ({
       value: item.id as number,
       label: item.name as string,
-      disabled: item.status === false || String(item.status) === 'false'
+      disabled: item.status === false || String(item.status) === "false",
     }))
-    .filter(opt => !opt.disabled);
+    .filter((opt) => !opt.disabled);
 }
 
 // 提交表单（防抖）
@@ -704,9 +897,9 @@ async function handleSubmit() {
       const id = formData.id;
       try {
         if (id) {
-          await UserAPI.updateUser(id, { id, ...formData })
+          await UserAPI.updateUser(id, { id, ...formData });
         } else {
-          await UserAPI.createUser(formData)
+          await UserAPI.createUser(formData);
         }
         dialogVisible.visible = false;
         resetForm();
@@ -733,19 +926,21 @@ async function handleDelete(ids: number[]) {
     confirmButtonText: "确定",
     cancelButtonText: "取消",
     type: "warning",
-  }).then(async () => {
-    try {
-      loading.value = true;
-      await UserAPI.deleteUser(ids);
-      handleResetQuery();
-    } catch (error: any) {
-      console.error(error);
-    } finally {
-      loading.value = false;
-    }
-  }).catch(() => {
-    ElMessageBox.close();
-  });
+  })
+    .then(async () => {
+      try {
+        loading.value = true;
+        await UserAPI.deleteUser(ids);
+        handleResetQuery();
+      } catch (error: any) {
+        console.error(error);
+      } finally {
+        loading.value = false;
+      }
+    })
+    .catch(() => {
+      ElMessageBox.close();
+    });
 }
 
 // 批量启用/停用
@@ -755,19 +950,21 @@ async function handleMoreClick(status: boolean) {
       confirmButtonText: "确定",
       cancelButtonText: "取消",
       type: "warning",
-    }).then(async () => {
-      try {
-        loading.value = true;
-        await UserAPI.batchAvailableUser({ ids: selectIds.value, status });
-        handleResetQuery();
-      } catch (error: any) {
-        console.error(error);
-      } finally {
-        loading.value = false;
-      }
-    }).catch(() => {
-      ElMessageBox.close();
-    });
+    })
+      .then(async () => {
+        try {
+          loading.value = true;
+          await UserAPI.batchAvailableUser({ ids: selectIds.value, status });
+          handleResetQuery();
+        } catch (error: any) {
+          console.error(error);
+        } finally {
+          loading.value = false;
+        }
+      })
+      .catch(() => {
+        ElMessageBox.close();
+      });
   }
 }
 
@@ -781,7 +978,7 @@ function handleOpenExportsModal() {
   exportsDialogVisible.value = true;
 }
 
-const emit = defineEmits(['import-success']);
+const emit = defineEmits(["import-success"]);
 
 // 上传文件
 const handleUpload = async (formData: FormData) => {
@@ -791,15 +988,14 @@ const handleUpload = async (formData: FormData) => {
       ElMessage.success(`${response.data.msg}，${response.data.data}`);
       importDialogVisible.value = false;
       await handleQuery();
-      emit('import-success');
+      emit("import-success");
     }
   } catch (error: any) {
     console.error(error);
-    ElMessage.error('上传失败：' + error);
+    ElMessage.error("上传失败：" + error);
   }
 };
 
-
 onMounted(() => {
   handleQuery();
 });
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index 67375d28..8db9c701 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -28,6 +28,6 @@
     "types": ["node", "vite/client", "element-plus/global"]
   },
 
-  "include": ["mock/**/*.ts", "src/**/*.ts", "src/**/*.vue", "vite.config.ts", "eslint.config.ts"],
+  "include": ["mock/**/*.ts", "src/**/*.ts", "src/**/*.vue", "vite.config.ts", "eslint.config.ts", "uno.config.ts"],
   "exclude": ["node_modules", "dist"]
 }
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index b484b5d7..3dda0fb3 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -193,7 +193,7 @@ export default defineConfig(({ mode }: ConfigEnv) => {
         "element-plus/es/components/button-group/style/index",
         "element-plus/es/components/result/style/index",
         "element-plus/es/components/checkbox-button/style/index",
-        "element-plus/es/components/space/style/index"
+        "element-plus/es/components/space/style/index",
       ],
     },
     // 构建配置
@@ -219,29 +219,29 @@ export default defineConfig(({ mode }: ConfigEnv) => {
           //   "vue-i18n": ["vue-i18n"],
           // },
           manualChunks(id) {
-            if (id.includes('node_modules')) {
+            if (id.includes("node_modules")) {
               // 针对大型库进行单独拆分
-              if (id.includes('echarts')) {
-                return 'echarts';
+              if (id.includes("echarts")) {
+                return "echarts";
               }
-              if (id.includes('element-plus')) {
-                return 'element-plus';
+              if (id.includes("element-plus")) {
+                return "element-plus";
               }
-              if (id.includes('@wangeditor-next')) {
-                return 'wangeditor';
+              if (id.includes("@wangeditor-next")) {
+                return "wangeditor";
               }
-              if (id.includes('codemirror')) {
-                return 'codemirror';
+              if (id.includes("codemirror")) {
+                return "codemirror";
               }
-              if (id.includes('exceljs')) {
-                return 'exceljs';
+              if (id.includes("exceljs")) {
+                return "exceljs";
               }
-              
+
 
               // 其他模块保持当前拆分方式
-              const module = id.toString().split('node_modules/')[1].split('/')[0]
-              if (['birpc', 'hookable'].includes(module)) return
-              return module
+              const module = id.toString().split("node_modules/")[1].split("/")[0];
+              if (["birpc", "hookable"].includes(module)) return;
+              return module;
             }
           },
           // 用于从入口点创建的块的打包输出格式[name]表示文件名,[hash]表示该文件内容hash值