From f30af5243423bafd4b79ad9ec448db327cda89f0 Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sat, 24 Jan 2026 13:45:50 +0800
Subject: [PATCH 01/10] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E6=89=B9?=
 =?UTF-8?q?=E9=87=8F=E9=80=89=E6=8B=A9=E5=92=8C=E5=88=A0=E9=99=A4=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=EF=BC=8C=E6=9B=B4=E6=96=B0=E9=83=A8=E9=97=A8=E8=A7=86?=
 =?UTF-8?q?=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/departmentapi.js          |   2 +-
 src/entities/common.entity.js     |   1 +
 src/entities/department.entity.js |  23 ++-
 src/i18n.js                       |   9 +
 src/views/base/DepartmentView.vue | 262 ++++++++++++++++++++++++++----
 5 files changed, 254 insertions(+), 43 deletions(-)

diff --git a/src/api/departmentapi.js b/src/api/departmentapi.js
index b2b6cc2..060545a 100644
--- a/src/api/departmentapi.js
+++ b/src/api/departmentapi.js
@@ -33,7 +33,7 @@ export const updateDepartment = async (data) => {
 // 删除部门
 export const deleteDepartment = async (data) => {
   try {
-    const response = await api.post(`/Base/DelDept`, data);
+    const response = await api.post(`/Base/DelDept`, { data });
     return response.data;
   } catch (error) {
     throw error;
diff --git a/src/entities/common.entity.js b/src/entities/common.entity.js
index 5f55dd4..bf46bef 100644
--- a/src/entities/common.entity.js
+++ b/src/entities/common.entity.js
@@ -7,6 +7,7 @@ export const BaseFields = {
   PAGE: "Page",
   PAGE_SIZE: "PageSize",
   VERSION: "RowVersion",
+  SELECTED: "selected",
 };
 
 export const BaseInitialValues = {
diff --git a/src/entities/department.entity.js b/src/entities/department.entity.js
index 704861a..b73d32b 100644
--- a/src/entities/department.entity.js
+++ b/src/entities/department.entity.js
@@ -34,13 +34,24 @@ export const initialFormValues = {
   },
 };
 
-export const getColumns = (t) => [
+export const getColumns = (t, handleView) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.departmentNo"),
     dataIndex: DepartmentFields.NUMBER,
     key: DepartmentFields.NUMBER,
     sorter: (a, b) =>
-      a[DepartmentFields.NUMBER].localeCompare(b[DepartmentFields.NUMBER]),
+      a[DepartmentFields.NUMBER]?.localeCompare(b[DepartmentFields.NUMBER]),
     defaultSortOrder: "ascend",
   },
   {
@@ -67,11 +78,7 @@ export const getColumns = (t) => [
     title: t("message.departmentDate"),
     dataIndex: DepartmentFields.CREATIONDATE,
     key: DepartmentFields.CREATIONDATE,
-  },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
+  }
 ];
 
 export const getFormRules = (t) => ({
@@ -82,4 +89,4 @@ export const getFormRules = (t) => ({
       trigger: "blur",
     },
   ],
-});
+});
\ No newline at end of file
diff --git a/src/i18n.js b/src/i18n.js
index 615a6b0..fa16c85 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -65,6 +65,9 @@ const messages = {
       backToHome: "Back to Home Page",
       isDeleted: "Is Deleted?",
       areYouSureToDeleteRecord: "Are you sure to delete this record?",
+      areYouSureToDeleteSelectedRecords:
+        "Are you sure to delete selected records?",
+      action: "Action",
       areYouSureToRestoreRecord: "Are you sure to restore this record?",
       checkUsernameAndPassword: "Please check username and password",
       fetchDataFailed: "Fetch Data Failed",
@@ -150,6 +153,8 @@ const messages = {
       department: "Department Management",
       insertDepartment: "Create Department",
       updateDepartment: "Edit Department",
+      viewDepartment: "View Department",
+      deleteDepartment: "Delete Department",
       pleaseInputDepartmentName: "Please input department name",
       pleaseInputDepartmentNo: "Please input department no",
       pleaseInputDepartmentLeader: "Please select department leader",
@@ -681,6 +686,8 @@ const messages = {
       isDeleted: "已删除?",
       undefined: "未定义",
       areYouSureToDeleteRecord: "确定要删除这条记录吗？",
+      areYouSureToDeleteSelectedRecords: "确定要删除选中的记录吗？",
+      action: "操作",
       areYouSureToRestoreRecord: "确定要恢复这条记录吗？",
       checkUsernameAndPassword: "请检查用户名和密码",
       fetchDataFailed: "获取数据失败",
@@ -769,6 +776,8 @@ const messages = {
       department: "部门管理",
       insertDepartment: "添加部门",
       updateDepartment: "编辑部门",
+      viewDepartment: "查看部门",
+      deleteDepartment: "删除部门",
       pleaseInputDepartmentName: "请输入部门名称",
       pleaseInputDepartmentNo: "请输入部门编号",
       pleaseInputDepartmentLeader: "请输入部门主管",
diff --git a/src/views/base/DepartmentView.vue b/src/views/base/DepartmentView.vue
index 0882e06..8b4506e 100644
--- a/src/views/base/DepartmentView.vue
+++ b/src/views/base/DepartmentView.vue
@@ -1,18 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="DepartmentPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertDepartment") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="DepartmentPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertDepartment") }}
+      </a-button>
+      <a-button
+        v-perm="DepartmentPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleBatchEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateDepartment") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="DepartmentPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteDepartment") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -36,12 +62,30 @@
       :data-source="departments"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
+          <a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
+          >
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+        </template>
+        <template v-else-if="column.key === 'operation'">
           <template v-if="record[DepartmentFields.IS_DELETED] == 1">
             <a-popconfirm
               :title="t('message.areYouSureToRestoreRecord')"
@@ -56,22 +100,6 @@
               </a-button>
             </a-popconfirm>
           </template>
-          <template v-else>
-            <a-button
-              v-perm="DepartmentPermissions.UPDATE"
-              style="margin-right: 15px"
-              @click="editDepartment(record)"
-              ><EditOutlined /> {{ $t("message.edit") }}</a-button
-            >
-            <a-popconfirm
-              :title="t('message.areYouSureToDeleteRecord')"
-              @confirm="handleDelete(record)"
-            >
-              <a-button v-perm="DepartmentPermissions.DELETE" danger
-                ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
-              >
-            </a-popconfirm>
-          </template>
         </template>
         <template v-else-if="column.key === DepartmentFields.CREATIONDATE">
           {{ formatDate(record[DepartmentFields.CREATIONDATE]) }}
@@ -131,11 +159,39 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewDepartment')"
+      width="600px"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="1">
+        <a-descriptions-item :label="t('message.departmentNo')">
+          {{ selectedRecord?.[DepartmentFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.departmentName')">
+          {{ selectedRecord?.[DepartmentFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.departmentDesc')">
+          {{ selectedRecord?.[DepartmentFields.DESCRIPTION] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.departmentLeader')">
+          {{ selectedRecord?.[DepartmentFields.LEADERNAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.departmentParent')">
+          {{ selectedRecord?.[DepartmentFields.PARENTNAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.departmentDate')">
+          {{ formatDate(selectedRecord?.[DepartmentFields.CREATIONDATE]) }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted, computed, reactive } from "vue";
+import { ref, onMounted, computed, reactive, watch } from "vue";
 import { useRoute } from "vue-router";
 import { getPageTitle } from "@/utils/pageTitle";
 import {
@@ -171,6 +227,7 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const departments = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
@@ -178,11 +235,132 @@ const sortedInfo = ref({ order: null, columnKey: null });
 const departmentOptions = ref([]);
 const leaderOptions = ref([]);
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 const departmentFilterConfig = computed(() =>
   getDepartmentFilterConfig(t, departmentOptions.value, leaderOptions.value),
 );
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[DepartmentFields.IS_DELETED] == 1,
+  }),
+}));
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[DepartmentFields.ID])) {
+      selectedRowKeys.value.push(record[DepartmentFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[DepartmentFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 处理全选
+const handleSelectAll = () => {
+  const allIds = departments.value
+    .filter((record) => record[DepartmentFields.IS_DELETED] != 1)
+    .map((record) => record[DepartmentFields.ID]);
+  if (selectedRowKeys.value.length === allIds.length) {
+    // 取消全选
+    selectedRowKeys.value = [];
+    selectedRows.value = [];
+    departments.value.forEach((record) => {
+      record.selected = false;
+    });
+  } else {
+    // 全选
+    selectedRowKeys.value = allIds;
+    selectedRows.value = departments.value.filter(
+      (record) => record[DepartmentFields.IS_DELETED] != 1,
+    );
+    departments.value.forEach((record) => {
+      if (record[DepartmentFields.IS_DELETED] != 1) {
+        record.selected = true;
+      }
+    });
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  departments.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 批量编辑
+const handleBatchEdit = () => {
+  if (selectedRows.value.length === 1) {
+    editDepartment(selectedRows.value[0]);
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteDepartment(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchDepartmentData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const buildServerParamsFromFilters = () => {
   let params = {};
   const fields = departmentFilterConfig.value?.fields || [];
@@ -230,6 +408,7 @@ const handleFilterSearch = (vals) => {
   );
   Object.assign(currentFilterParams, built);
   pagination.current = 1;
+  clearSelection(); // 重置选择
   fetchDepartmentData();
 };
 
@@ -242,6 +421,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection(); // 重置选择
   fetchDepartmentData();
 };
 
@@ -256,8 +436,6 @@ const departmentLeaderLabel = computed(() => t("message.departmentLeader"));
 const departmentParentLabel = computed(() => t("message.departmentParent"));
 const departmentDateLabel = computed(() => t("message.departmentDate"));
 
-const columns = computed(() => getColumns(t));
-
 const pagination = reactive({
   current: 1,
   pageSize: 15,
@@ -290,6 +468,7 @@ const fetchDepartmentData = async () => {
         [DepartmentFields.IS_DELETED]:
           item[DepartmentFields.IS_DELETED] ?? item.IsDelete ?? 0,
         [DepartmentFields.VERSION]: item[DepartmentFields.VERSION],
+        [DepartmentFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     } else {
@@ -355,6 +534,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchDepartmentData();
 };
 
@@ -404,6 +584,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchDepartmentData();
   } catch (error) {
     showErrorNotification(t("message.pleaseTryAgainLater"));
@@ -418,13 +599,18 @@ const handleModalCancel = () => {
 
 const handleDelete = async (record) => {
   try {
-    record[DepartmentFields.IS_DELETED] = 1;
-    var response = await deleteDepartment(record);
+    const deleteRequest = {
+      [DepartmentFields.ID]: 0,
+      [DepartmentFields.IS_DELETED]: 1,
+      DelIds: [record[DepartmentFields.ID]], 
+    };
+    var response = await deleteDepartment(deleteRequest);
     if (response && response.Success) {
       showSuccessNotification(t("message.deleteSuccess"));
     } else {
       showErrorNotification(response.Message);
     }
+    clearSelection();
     fetchDepartmentData();
   } catch (error) {
     showErrorNotification(t("message.pleaseTryAgainLater"));
@@ -449,6 +635,7 @@ const restoreDepartment = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchDepartmentData();
 };
 
@@ -456,3 +643,10 @@ const handleSorterChange = (pagination, filters, sorter) => {
   sortedInfo.value = sorter;
 };
 </script>
+
+<style scoped>
+/* 确保表头对齐 */
+:deep(.ant-table-thead > tr > th) {
+  text-align: center;
+}
+</style>
-- 
Gitee


From 85506466b211d92ba797f574c12d2363f42e634a Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sat, 24 Jan 2026 14:58:19 +0800
Subject: [PATCH 02/10] fix selected.

---
 src/entities/nation.entity.js     |  15 +-
 src/entities/position.entity.js   |  15 +-
 src/i18n.js                       |   8 +
 src/views/base/DepartmentView.vue |  55 +------
 src/views/base/NationView.vue     | 248 ++++++++++++++++++++++++++----
 src/views/base/PositionView.vue   | 196 +++++++++++++++++++----
 6 files changed, 415 insertions(+), 122 deletions(-)

diff --git a/src/entities/nation.entity.js b/src/entities/nation.entity.js
index ebec18d..072cee8 100644
--- a/src/entities/nation.entity.js
+++ b/src/entities/nation.entity.js
@@ -17,6 +17,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.nationNo"),
     dataIndex: NationFields.NUMBER,
@@ -30,10 +41,6 @@ export const getColumns = (t) => [
     dataIndex: NationFields.NAME,
     key: NationFields.NAME,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/position.entity.js b/src/entities/position.entity.js
index f8da492..1d98564 100644
--- a/src/entities/position.entity.js
+++ b/src/entities/position.entity.js
@@ -17,6 +17,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.positionNo"),
     dataIndex: PositionFields.NUMBER,
@@ -30,10 +41,6 @@ export const getColumns = (t) => [
     dataIndex: PositionFields.NAME,
     key: PositionFields.NAME,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/i18n.js b/src/i18n.js
index fa16c85..2d25f81 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -169,6 +169,8 @@ const messages = {
       nation: "Nation Management",
       insertNation: "Create Nation",
       updateNation: "Edit Nation",
+      deleteNation: "Delete Nation",
+      viewNation: "View Nation",
       pleaseInputNationName: "Please input nation name",
       pleaseInputNationNo: "Please input nation no",
       nationNo: "Nation No",
@@ -177,6 +179,8 @@ const messages = {
       position: "Position Management",
       insertPosition: "Create Position",
       updatePosition: "Edit Position",
+      deletePosition: "Delete Position",
+      viewPosition: "View Position",
       pleaseInputPositionName: "Please input position name",
       pleaseInputPositionNo: "Please input position no",
       positionNo: "Position No",
@@ -792,6 +796,8 @@ const messages = {
       nation: "民族管理",
       insertNation: "添加民族",
       updateNation: "编辑民族",
+      deleteNation: "删除民族",
+      viewNation: "查看民族",
       areYouSureToDeleteNation: "确定要删除这个民族吗？",
       pleaseInputNationName: "请输入民族名称",
       pleaseInputNationNo: "请输入民族编号",
@@ -801,6 +807,8 @@ const messages = {
       position: "职位管理",
       insertPosition: "添加职位",
       updatePosition: "编辑职位",
+      deletePosition: "删除职位",
+      viewPosition: "查看职位",
       pleaseInputPositionName: "请输入职位名称",
       pleaseInputPositionNo: "请输入职位编号",
       positionNo: "职位编号",
diff --git a/src/views/base/DepartmentView.vue b/src/views/base/DepartmentView.vue
index 8b4506e..e79be0b 100644
--- a/src/views/base/DepartmentView.vue
+++ b/src/views/base/DepartmentView.vue
@@ -17,7 +17,7 @@
         v-perm="DepartmentPermissions.UPDATE"
         :disabled="selectedRowKeys.length !== 1"
         style="margin-right: 15px"
-        @click="handleBatchEdit"
+        @click="handleEdit"
       >
         <EditOutlined /> {{ $t("message.updateDepartment") }}
       </a-button>
@@ -58,6 +58,7 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[DepartmentFields.ID]"
       :columns="columns"
       :data-source="departments"
       :loading="loading"
@@ -166,7 +167,7 @@
       width="600px"
       :footer="null"
     >
-      <a-descriptions bordered :column="1">
+      <a-descriptions bordered :column="2">
         <a-descriptions-item :label="t('message.departmentNo')">
           {{ selectedRecord?.[DepartmentFields.NUMBER] }}
         </a-descriptions-item>
@@ -273,32 +274,6 @@ const handleSelectChange = (record, e) => {
   }
 };
 
-// 处理全选
-const handleSelectAll = () => {
-  const allIds = departments.value
-    .filter((record) => record[DepartmentFields.IS_DELETED] != 1)
-    .map((record) => record[DepartmentFields.ID]);
-  if (selectedRowKeys.value.length === allIds.length) {
-    // 取消全选
-    selectedRowKeys.value = [];
-    selectedRows.value = [];
-    departments.value.forEach((record) => {
-      record.selected = false;
-    });
-  } else {
-    // 全选
-    selectedRowKeys.value = allIds;
-    selectedRows.value = departments.value.filter(
-      (record) => record[DepartmentFields.IS_DELETED] != 1,
-    );
-    departments.value.forEach((record) => {
-      if (record[DepartmentFields.IS_DELETED] != 1) {
-        record.selected = true;
-      }
-    });
-  }
-};
-
 // 清空选择
 const clearSelection = () => {
   selectedRowKeys.value = [];
@@ -314,8 +289,8 @@ const handleView = (record) => {
   viewModalVisible.value = true;
 };
 
-// 批量编辑
-const handleBatchEdit = () => {
+// 编辑选中的单条记录
+const handleEdit = () => {
   if (selectedRows.value.length === 1) {
     editDepartment(selectedRows.value[0]);
   }
@@ -597,26 +572,6 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
-  try {
-    const deleteRequest = {
-      [DepartmentFields.ID]: 0,
-      [DepartmentFields.IS_DELETED]: 1,
-      DelIds: [record[DepartmentFields.ID]], 
-    };
-    var response = await deleteDepartment(deleteRequest);
-    if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
-    } else {
-      showErrorNotification(response.Message);
-    }
-    clearSelection();
-    fetchDepartmentData();
-  } catch (error) {
-    showErrorNotification(t("message.pleaseTryAgainLater"));
-  }
-};
-
 const restoreDepartment = async (record) => {
   try {
     record[DepartmentFields.IS_DELETED] = 0;
diff --git a/src/views/base/NationView.vue b/src/views/base/NationView.vue
index 6122d4d..3e0e20f 100644
--- a/src/views/base/NationView.vue
+++ b/src/views/base/NationView.vue
@@ -1,18 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="NationPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertNation") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="NationPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertNation") }}
+      </a-button>
+      <a-button
+        v-perm="NationPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateNation") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="NationPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteNation") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
 
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
@@ -33,30 +59,49 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[NationFields.ID]"
       :columns="columns"
       :data-source="nations"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="NationPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editNation(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <a-button v-perm="NationPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+        </template>
+        <template v-if="column.key === 'operation'">
+          <template v-if="record[NationFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreNation(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="NationPermissions.UPDATE"
+                type="default"
+                style="color: green"
+              >
+                <UndoOutlined /> {{ $t("message.restore") || "Restore" }}
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -78,6 +123,22 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewNation')"
+      width="600px"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="t('message.nationNo')">
+          {{ selectedRecord?.[NationFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.nationName')">
+          {{ selectedRecord?.[NationFields.NAME] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -110,12 +171,134 @@ const pageTitleKey = computed(() => getPageTitle(route.path));
 const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const nations = ref([]);
+const viewModalVisible = ref(false);
 const modalVisible = ref(false);
 const modalTitle = ref("");
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 const nationFilterConfig = computed(() => getNationFilterConfig(t));
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[NationFields.IS_DELETED] == 1,
+  }),
+}));
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[NationFields.ID])) {
+      selectedRowKeys.value.push(record[NationFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[NationFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 处理全选
+const handleSelectAll = () => {
+  const allIds = nations.value
+    .filter((record) => record[NationFields.IS_DELETED] != 1)
+    .map((record) => record[NationFields.ID]);
+  if (selectedRowKeys.value.length === allIds.length) {
+    // 取消全选
+    selectedRowKeys.value = [];
+    selectedRows.value = [];
+    nations.value.forEach((record) => {
+      record.selected = false;
+    });
+  } else {
+    // 全选
+    selectedRowKeys.value = allIds;
+    selectedRows.value = nations.value.filter(
+      (record) => record[NationFields.IS_DELETED] != 1,
+    );
+    nations.value.forEach((record) => {
+      if (record[NationFields.IS_DELETED] != 1) {
+        record.selected = true;
+      }
+    });
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  nations.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRows.value.length === 1) {
+    editNation(selectedRows.value[0]);
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteNation(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchNationData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -156,8 +339,6 @@ const rules = getFormRules(t);
 const nationNoLabel = computed(() => t("message.nationNo"));
 const nationNameLabel = computed(() => t("message.nationName"));
 
-const columns = computed(() => getColumns(t));
-
 const pagination = reactive({
   current: 1,
   pageSize: 15,
@@ -181,6 +362,7 @@ const fetchNationData = async () => {
         [NationFields.ID]: item[NationFields.ID],
         [NationFields.NUMBER]: item[NationFields.NUMBER],
         [NationFields.NAME]: item[NationFields.NAME],
+        [NationFields.SELECTED]: false,
       }));
       pagination.total = result.TotlalCount;
     } else {
@@ -209,6 +391,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchNationData();
 };
 
@@ -241,6 +424,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchNationData();
   } catch (error) {
     showErrorNotification(t("message.pleaseTryAgainLater"));
@@ -253,18 +437,18 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreNation = async (record) => {
   try {
-    record[NationFields.IS_DELETED] = 1;
-    var response = await deleteNation(record);
+    record[NationFields.IS_DELETED] = 0;
+    const response = await updateNation(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(response.Message);
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchNationData();
   } catch (error) {
-    showErrorNotification(t("message.pleaseTryAgainLater"));
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
   }
 };
 
diff --git a/src/views/base/PositionView.vue b/src/views/base/PositionView.vue
index 0bdf0f1..6771257 100644
--- a/src/views/base/PositionView.vue
+++ b/src/views/base/PositionView.vue
@@ -1,19 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="PositionPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertPosition") }}</a-button
-    >
-
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="PositionPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertPosition") }}
+      </a-button>
+      <a-button
+        v-perm="PositionPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updatePosition") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="PositionPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deletePosition") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -33,30 +58,43 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[PositionFields.ID]"
       :columns="columns"
       :data-source="positions"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'action'">
           <a-button
-            v-perm="PositionPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editPosition(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="PositionPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+        </template>
+        <template v-if="column.key === 'operation'">
+          <template v-if="record[PositionFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restorePosition(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="PositionPermissions.UPDATE"
+                type="default"
+                style="color: green"
+              >
+                <UndoOutlined /> {{ $t("message.restore") || "Restore" }}
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -78,6 +116,22 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewPosition')"
+      width="600px"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="t('message.positionNo')">
+          {{ selectedRecord?.[PositionFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.positionName')">
+          {{ selectedRecord?.[PositionFields.NAME] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -111,11 +165,86 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const positions = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 const positionFilterConfig = computed(() => getPositionFilterConfig(t));
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[PositionFields.IS_DELETED] == 1,
+  }),
+}));
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRows.value.length === 1) {
+    editPosition(selectedRows.value[0]);
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deletePosition(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchPositionData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2),
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -131,6 +260,7 @@ const handleFilterSearch = (values) => {
     }
     currentFilterParams[key] = val;
   });
+  clearSelection(); // 重置选择
   fetchPositionData();
 };
 
@@ -143,6 +273,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection(); // 重置选择
   fetchPositionData();
 };
 const confirmLoading = ref(false);
@@ -156,8 +287,6 @@ const rules = getFormRules(t);
 const positionNoLabel = computed(() => t("message.positionNo"));
 const positionNameLabel = computed(() => t("message.positionName"));
 
-const columns = computed(() => getColumns(t));
-
 const pagination = reactive({
   current: 1,
   pageSize: 15,
@@ -208,6 +337,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchPositionData();
 };
 
@@ -240,6 +370,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchPositionData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -252,14 +383,14 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restorePosition = async (record) => {
   try {
-    record[PositionFields.IS_DELETED] = 1;
-    var response = await deletePosition(record);
+    record[PositionFields.IS_DELETED] = 0;
+    const response = await updatePosition(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(t("message.pleaseTryAgainLater"));
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchPositionData();
   } catch (error) {
@@ -270,6 +401,7 @@ const handleDelete = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchPositionData();
 };
 
-- 
Gitee


From 367a3f8691e2d728795d3ff5ea2825fec950d35f Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sat, 24 Jan 2026 17:10:43 +0800
Subject: [PATCH 03/10] support bulk selected for base module.

---
 src/entities/administrator.entity.js     |  15 +-
 src/entities/administratortype.entity.js |  15 +-
 src/entities/customer.entity.js          |  15 +-
 src/entities/customertype.entity.js      |  15 +-
 src/entities/employee.entity.js          |  15 +-
 src/entities/energymanagement.entity.js  |  15 +-
 src/entities/goods.entity.js             |  15 +-
 src/entities/internalfinance.entity.js   |  15 +-
 src/entities/log.entity.js               |  15 +-
 src/entities/menu.entity.js              |  15 +-
 src/entities/noticetype.entity.js        |  15 +-
 src/entities/passport.entity.js          |  15 +-
 src/entities/promotioncontent.entity.js  |  15 +-
 src/entities/qualification.entity.js     |  15 +-
 src/entities/reser.entity.js             |  15 +-
 src/entities/role.entity.js              |  15 +-
 src/entities/room.entity.js              |  15 +-
 src/entities/roomconfig.entity.js        |  15 +-
 src/entities/spendinfo.entity.js         |  16 +-
 src/entities/supervision.entity.js       |  15 +-
 src/entities/viprule.entity.js           |  15 +-
 src/i18n.js                              | 119 +++++++++++-
 src/views/base/DepartmentView.vue        |   3 +-
 src/views/base/NationView.vue            |  41 +---
 src/views/base/NoticeTypeView.vue        | 228 ++++++++++++++++++----
 src/views/base/PassportView.vue          | 227 ++++++++++++++++++----
 src/views/base/PositionView.vue          |  13 +-
 src/views/base/PromotionContentView.vue  | 231 +++++++++++++++++++----
 src/views/base/QualificationView.vue     | 228 ++++++++++++++++++----
 29 files changed, 1153 insertions(+), 253 deletions(-)

diff --git a/src/entities/administrator.entity.js b/src/entities/administrator.entity.js
index 9afa557..eceaf8e 100644
--- a/src/entities/administrator.entity.js
+++ b/src/entities/administrator.entity.js
@@ -34,6 +34,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.adminNumber"),
     dataIndex: AdministratorFields.NUMBER,
@@ -82,10 +93,6 @@ export const getColumns = (t) => [
     dataIndex: AdministratorFields.ISSUPERADMINDESCRIPTION,
     key: AdministratorFields.ISSUPERADMINDESCRIPTION,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t, isEditMode = false) => ({
diff --git a/src/entities/administratortype.entity.js b/src/entities/administratortype.entity.js
index 9627e53..634e342 100644
--- a/src/entities/administratortype.entity.js
+++ b/src/entities/administratortype.entity.js
@@ -17,6 +17,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.adminTypeNumber"),
     dataIndex: AdministratorTypeFields.NUMBER,
@@ -36,10 +47,6 @@ export const getColumns = (t) => [
         b[AdministratorTypeFields.NAME],
       ),
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/customer.entity.js b/src/entities/customer.entity.js
index bed9405..e1bd6f1 100644
--- a/src/entities/customer.entity.js
+++ b/src/entities/customer.entity.js
@@ -48,6 +48,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.customerNo"),
     dataIndex: CustomerFields.NUMBER,
@@ -114,10 +125,6 @@ export const getColumns = (t) => [
     dataIndex: CustomerFields.ADDRESS,
     key: CustomerFields.ADDRESS,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/customertype.entity.js b/src/entities/customertype.entity.js
index 3d62416..724844f 100644
--- a/src/entities/customertype.entity.js
+++ b/src/entities/customertype.entity.js
@@ -19,6 +19,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.customerTypeNo"),
     dataIndex: CustomerTypeFields.NUMBER,
@@ -40,10 +51,6 @@ export const getColumns = (t) => [
     dataIndex: CustomerTypeFields.DISCOUNT,
     key: CustomerTypeFields.DISCOUNT,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/employee.entity.js b/src/entities/employee.entity.js
index 36b3479..363e603 100644
--- a/src/entities/employee.entity.js
+++ b/src/entities/employee.entity.js
@@ -70,6 +70,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.staffId"),
     dataIndex: EmployeeFields.NUMBER,
@@ -176,10 +187,6 @@ export const getColumns = (t) => [
     dataIndex: EmployeeFields.ISENABLE,
     key: EmployeeFields.ISENABLE,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/energymanagement.entity.js b/src/entities/energymanagement.entity.js
index 6bcb543..4fa867e 100644
--- a/src/entities/energymanagement.entity.js
+++ b/src/entities/energymanagement.entity.js
@@ -30,6 +30,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.wtiNo"),
     dataIndex: [EnergyManagementFields.NUMBER],
@@ -74,10 +85,6 @@ export const getColumns = (t) => [
     dataIndex: [EnergyManagementFields.RECORDER],
     key: [EnergyManagementFields.RECORDER],
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/goods.entity.js b/src/entities/goods.entity.js
index 6288568..20a2d61 100644
--- a/src/entities/goods.entity.js
+++ b/src/entities/goods.entity.js
@@ -23,6 +23,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.goodsNumber"),
     dataIndex: GoodsFields.NUMBER,
@@ -52,10 +63,6 @@ export const getColumns = (t) => [
     dataIndex: GoodsFields.STOCK,
     key: GoodsFields.STOCK,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/internalfinance.entity.js b/src/entities/internalfinance.entity.js
index d4c492f..9c66ee7 100644
--- a/src/entities/internalfinance.entity.js
+++ b/src/entities/internalfinance.entity.js
@@ -33,6 +33,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.internalfinanceNo"),
     dataIndex: InternalFinanceFields.NUMBER,
@@ -91,10 +102,6 @@ export const getColumns = (t) => [
     dataIndex: InternalFinanceFields.ACQUIREDBYEMPLOYEENAME,
     key: InternalFinanceFields.ACQUIREDBYEMPLOYEENAME,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/log.entity.js b/src/entities/log.entity.js
index 5566bcb..a9e832b 100644
--- a/src/entities/log.entity.js
+++ b/src/entities/log.entity.js
@@ -39,6 +39,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.operationTime"),
     dataIndex: LogFields.TIME,
@@ -76,10 +87,6 @@ export const getColumns = (t) => [
     dataIndex: LogFields.IPADDRESS,
     key: LogFields.IPADDRESS,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/menu.entity.js b/src/entities/menu.entity.js
index 3affa4c..3a93831 100644
--- a/src/entities/menu.entity.js
+++ b/src/entities/menu.entity.js
@@ -23,6 +23,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.menuId"),
     dataIndex: MenuFields.ID,
@@ -53,10 +64,6 @@ export const getColumns = (t) => [
     dataIndex: MenuFields.ICON,
     key: MenuFields.ICON,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/noticetype.entity.js b/src/entities/noticetype.entity.js
index 47c147a..8ca721c 100644
--- a/src/entities/noticetype.entity.js
+++ b/src/entities/noticetype.entity.js
@@ -17,6 +17,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.noticeTypeNumber"),
     dataIndex: NoticeTypeFields.NUMBER,
@@ -28,10 +39,6 @@ export const getColumns = (t) => [
     dataIndex: NoticeTypeFields.NAME,
     key: NoticeTypeFields.NAME,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/passport.entity.js b/src/entities/passport.entity.js
index 0633517..29e9562 100644
--- a/src/entities/passport.entity.js
+++ b/src/entities/passport.entity.js
@@ -17,6 +17,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.passportNo"),
     dataIndex: PassportFields.NUMBER,
@@ -33,10 +44,6 @@ export const getColumns = (t) => [
     dataIndex: PassportFields.NAME,
     key: PassportFields.NAME,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/promotioncontent.entity.js b/src/entities/promotioncontent.entity.js
index c1a8c5a..175638a 100644
--- a/src/entities/promotioncontent.entity.js
+++ b/src/entities/promotioncontent.entity.js
@@ -17,6 +17,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.id"),
     dataIndex: PromotionContentFields.ID,
@@ -32,10 +43,6 @@ export const getColumns = (t) => [
     dataIndex: PromotionContentFields.MESSAGE,
     key: PromotionContentFields.MESSAGE,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/qualification.entity.js b/src/entities/qualification.entity.js
index a41f81b..4bcb907 100644
--- a/src/entities/qualification.entity.js
+++ b/src/entities/qualification.entity.js
@@ -17,6 +17,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.qualificationNo"),
     dataIndex: EducationFields.NUMBER,
@@ -30,10 +41,6 @@ export const getColumns = (t) => [
     dataIndex: EducationFields.NAME,
     key: EducationFields.NAME,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/reser.entity.js b/src/entities/reser.entity.js
index 1c4ff2d..2f78aa5 100644
--- a/src/entities/reser.entity.js
+++ b/src/entities/reser.entity.js
@@ -28,6 +28,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.reserNo"),
     dataIndex: ReserFields.NUMBER,
@@ -72,10 +83,6 @@ export const getColumns = (t) => [
     dataIndex: ReserFields.ENDDATE,
     key: ReserFields.ENDDATE,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/role.entity.js b/src/entities/role.entity.js
index b2af952..caaa039 100644
--- a/src/entities/role.entity.js
+++ b/src/entities/role.entity.js
@@ -19,6 +19,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.roleNumber"),
     dataIndex: RoleFields.NUMBER,
@@ -36,10 +47,6 @@ export const getColumns = (t) => [
     dataIndex: RoleFields.DESCRIPTION,
     key: RoleFields.DESCRIPTION,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/room.entity.js b/src/entities/room.entity.js
index c698bd0..34054c3 100644
--- a/src/entities/room.entity.js
+++ b/src/entities/room.entity.js
@@ -51,6 +51,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.roomNo"),
     dataIndex: RoomFields.NO,
@@ -95,10 +106,6 @@ export const getColumns = (t) => [
     dataIndex: RoomFields.POSITION,
     key: RoomFields.POSITION,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/roomconfig.entity.js b/src/entities/roomconfig.entity.js
index a0e30fe..67e31a8 100644
--- a/src/entities/roomconfig.entity.js
+++ b/src/entities/roomconfig.entity.js
@@ -21,6 +21,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.roomTypeCode"),
     dataIndex: RoomConfigFields.NO,
@@ -44,10 +55,6 @@ export const getColumns = (t) => [
     dataIndex: RoomConfigFields.DEPOSIT,
     key: RoomConfigFields.DEPOSIT,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/spendinfo.entity.js b/src/entities/spendinfo.entity.js
index 25ce353..86a2629 100644
--- a/src/entities/spendinfo.entity.js
+++ b/src/entities/spendinfo.entity.js
@@ -53,6 +53,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.spendNumber"),
     dataIndex: SpendInfoFields.NUMBER,
@@ -120,11 +131,6 @@ export const getColumns = (t) => [
     key: SpendInfoFields.STATE,
     width: 100,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-    width: 120,
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/supervision.entity.js b/src/entities/supervision.entity.js
index 7c8b3e8..97e3bc6 100644
--- a/src/entities/supervision.entity.js
+++ b/src/entities/supervision.entity.js
@@ -28,6 +28,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.checkNo"),
     dataIndex: SupervisionFields.CHECK_NO,
@@ -74,10 +85,6 @@ export const getColumns = (t) => [
     dataIndex: SupervisionFields.CHECK_ADVICE,
     key: SupervisionFields.CHECK_ADVICE,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/entities/viprule.entity.js b/src/entities/viprule.entity.js
index c996ece..2524ffb 100644
--- a/src/entities/viprule.entity.js
+++ b/src/entities/viprule.entity.js
@@ -22,6 +22,17 @@ export const initialFormValues = {
 };
 
 export const getColumns = (t) => [
+  {
+    title: "",
+    dataIndex: "selection",
+    key: "selection",
+    width: 50,
+  },
+  {
+    title: t("message.action"),
+    key: "action",
+    width: 100,
+  },
   {
     title: t("message.vipRuleId"),
     dataIndex: VipRuleFields.NUMBER,
@@ -48,10 +59,6 @@ export const getColumns = (t) => [
     dataIndex: VipRuleFields.CUSTOMER_TYPE_NAME,
     key: VipRuleFields.CUSTOMER_TYPE_NAME,
   },
-  {
-    title: t("message.operation"),
-    key: "operation",
-  },
 ];
 
 export const getFormRules = (t) => ({
diff --git a/src/i18n.js b/src/i18n.js
index 2d25f81..82261e8 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -41,6 +41,7 @@ const messages = {
       loginExpired: "Login Expired, please login again",
       uploading: "Uploading...",
       uploadSuccess: "Upload Success",
+      batchDeleteSuccess: "Batch Delete Success",
       resetPassword: "Reset Password",
       selectYourLang: "Please choose your language",
       refreshData: "Refresh Data",
@@ -189,6 +190,8 @@ const messages = {
       qualification: "Qualification Management",
       insertQualification: "Create Qualification",
       updateQualification: "Edit Qualification",
+      viewQualification: "View Qualification",
+      deleteQualification: "Delete Qualification",
       pleaseInputQualificationName: "Please input qualification name",
       pleaseInputQualificationNo: "Please input qualification no",
       qualificationNo: "Qualification No",
@@ -197,6 +200,8 @@ const messages = {
       passport: "Passport Management",
       insertPassport: "Create Passport",
       updatePassport: "Edit Passport",
+      viewPassport: "View Passport",
+      deletePassport: "Delete Passport",
       pleaseInputPassportName: "Please input passport name",
       pleaseInputPassportNo: "Please input passport no",
       passportNo: "Passport No",
@@ -205,6 +210,8 @@ const messages = {
       noticetype: "Notice Type Management",
       insertNoticeType: "Create Notice Type",
       updateNoticeType: "Edit Notice Type",
+      viewNoticeType: "View Notice Type",
+      deleteNoticeType: "Delete Notice Type",
       pleaseInputNoticeTypeName: "Please input notice type name",
       pleaseInputNoticeTypeNumber: "Please input notice type number",
       noticeTypeNumber: "Notice Type No",
@@ -213,6 +220,8 @@ const messages = {
       internalfinance: "Internal Finance Bill",
       insertInternalFinance: "Create Internal Finance",
       updateInternalFinance: "Edit Internal Finance",
+      viewInternalFinance: "View Internal Finance",
+      deleteInternalFinance: "Delete Internal Finance",
       pleaseInputInternalFinanceName: "Please input internal finance name",
       pleaseInputInternalFinanceNo: "Please input internal finance no",
       pleaseInputInternalFinancePrice: "Please input internal finance price",
@@ -249,6 +258,8 @@ const messages = {
       supervisioninfo: "Supervision Information",
       insertSupervisionInfo: "Create SupervisionInfo",
       updateSupervisionInfo: "Edit SupervisionInfo",
+      viewSupervisionInfo: "View SupervisionInfo",
+      deleteSupervisionInfo: "Delete SupervisionInfo",
       pleaseInputCheckDepartment:
         "Please input SupervisionInfo Check Department",
       pleaseInputCheckProgres: "Please input SupervisionInfo Check Progress",
@@ -257,7 +268,7 @@ const messages = {
       pleaseInputCheckPerson: "Please input SupervisionInfo Check Person",
       pleaseInputCheckAdvice: "Please input SupervisionInfo Check Advice",
       checkNo: "SupervisionInfo No",
-      checkDepartment: "Check Depeartment",
+      checkDepartment: "Check Department",
       checkProgres: "Check Progress",
       checkCash: "Check Cash",
       checkScore: "Check Score",
@@ -270,6 +281,8 @@ const messages = {
       roommanagement: "Room Management",
       insertRoom: "Create Room",
       updateRoom: "Edit Room",
+      viewRoom: "View Room",
+      deleteRoom: "Delete Room",
       pleaseInputRoomNo: "Please input Room No",
       pleaseInputRoomType: "Please input Room Type",
       pleaseInputCustoNo: "Please input Room Customer",
@@ -289,6 +302,8 @@ const messages = {
       roomconfig: "Room Configuration",
       insertRoomConfig: "Create Room Configuration",
       updateRoomConfig: "Edit Room Configuration",
+      viewRoomConfig: "View Room Configuration",
+      deleteRoomConfig: "Delete Room Configuration",
       pleaseInputRoomTypeCode: "Please input Room Type Code",
       pleaseInputRoomTypeName: "Please input Room Type Name",
       roomTypeCode: "Room Type Code",
@@ -298,6 +313,8 @@ const messages = {
       viprule: "Vip Rule Management",
       insertVipRule: "Create Vip Rule",
       updateVipRule: "Edit Vip Rule",
+      viewVipRule: "View Vip Rule",
+      deleteVipRule: "Delete Vip Rule",
       pleaseInputVipRuleId: "Please input Vip Rule ID",
       pleaseInputVipRuleName: "Please input Vip Rule Name",
       pleaseInputVipRuleValue: "Please input Vip Rule Value",
@@ -310,6 +327,8 @@ const messages = {
       customermanagement: "Customer Management",
       insertCustomer: "Create Customer",
       updateCustomer: "Edit Customer",
+      viewCustomer: "View Customer",
+      deleteCustomer: "Delete Customer",
       pleaseInputCustomerNo: "Please input customer no",
       pleaseInputCustomerName: "Please input customer name",
       pleaseInputCustomerSex: "Please input customer sex",
@@ -335,6 +354,8 @@ const messages = {
       customertype: "Customer Type Management",
       insertCustomerType: "Create Customer Type",
       updateCustomerType: "Edit Customer Type",
+      viewCustomerType: "View Customer Type",
+      deleteCustomerType: "Delete Customer Type",
       pleaseInputCustomerTypeNo: "Please input customer type number",
       pleaseInputCustomerTypeName: "Please input customer type name",
       pleaseInputCustomerTypeDiscount: "Please input customer type discount",
@@ -347,6 +368,8 @@ const messages = {
       customerspend: "Customer Spending Bill",
       insertSpend: "Create Spending Bill",
       updateSpend: "Edit Spending Bill",
+      viewSpend: "View Spending Bill",
+      deleteSpend: "Delete Spending Bill",
       pleaseInputSpendName: "Please input customer name",
       pleaseInputSpendAmount: "Please input customer sex",
       pleaseInputSpendPrice: "Please input customer telephone number",
@@ -364,6 +387,7 @@ const messages = {
 
       insertStaff: "Create Staff",
       updateStaff: "Edit Staff",
+      viewStaff: "View Staff",
       pleaseInputStaffName: "Please input staff name",
       pleaseInputEmployeeName: "Please input employee name",
       pleaseInputPhoneNumber: "Please input phone number",
@@ -428,6 +452,8 @@ const messages = {
 
       insertGoods: "Create Goods",
       updateGoods: "Edit Goods",
+      viewGoods: "View Goods",
+      deleteGoods: "Delete Goods",
       pleaseInputGoodsNumber: "Please input goods number",
       pleaseInputGoodsName: "Please input goods name",
       pleaseInputGoodsPrice: "Please input goods price",
@@ -445,6 +471,8 @@ const messages = {
       resermanagement: "Reser Management",
       insertReser: "Create Reser",
       updateReser: "Edit Reser",
+      viewReser: "View Reser",
+      deleteReser: "Delete Reser",
       pleaseInputReserNumber: "Please input reservation number",
       pleaseInputReserPhoneNumberName: "Please input phone number",
       pleaseInputReserCustomerName: "Please input customer name",
@@ -464,6 +492,8 @@ const messages = {
       administratormanagement: "Administrator Management",
       insertAdministrator: "Create Administrator",
       updateAdministrator: "Edit Administrator",
+      viewAdministrator: "View Administrator",
+      deleteAdministrator: "Delete Administrator",
       pleaseInputAdminNumber: "Please input administrator number",
       pleaseInputAdminAccount: "Please input administrator account",
       pleaseInputAdminName: "Please input administrator name",
@@ -480,6 +510,8 @@ const messages = {
       admintypemanagement: "Administrator Type Management",
       insertAdminType: "Create Administrator Type",
       updateAdminType: "Edit Administrator Type",
+      viewAdminType: "View Administrator Type",
+      deleteAdminType: "Delete Administrator Type",
       pleaseInputAdminTypeNumber: "Please input administrator type number",
       pleaseInputAdminTypeName: "Please input administrator type name",
       adminTypeNumber: "Administrator Type Number",
@@ -488,6 +520,8 @@ const messages = {
       rolemanagement: "Role Management",
       insertRole: "Create Role",
       updateRole: "Edit Role",
+      viewRole: "View Role",
+      deleteRole: "Delete Role",
       pleaseInputRoleNumber: "Please input role number",
       pleaseInputRoleName: "Please input role name",
       pleaseInputRoleDescription: "Please input role description",
@@ -498,6 +532,8 @@ const messages = {
       menumanagement: "Menu Management",
       insertMenu: "Create Menu",
       updateMenu: "Edit Menu",
+      viewMenu: "View Menu",
+      deleteMenu: "Delete Menu",
       pleaseInputMenuKey: "Please input menu key",
       pleaseInputMenuTitle: "Please input menu title",
       pleaseInputMenuPath: "Please input menu path",
@@ -516,6 +552,8 @@ const messages = {
       promotioncontent: "Promotion Content Management",
       insertPromotionContent: "Create Promotion Content",
       updatePromotionContent: "Edit Promotion Content",
+      viewPromotionContent: "View Promotion Content",
+      deletePromotionContent: "Delete Promotion Content",
       pleaseInputPromotionContentNumber:
         "Please input promotion content number",
       pleaseInputPromotionContentMessage:
@@ -665,6 +703,7 @@ const messages = {
       loginExpired: "登录已过期,请重新登录",
       uploading: "上传中...",
       uploadSuccess: "上传成功",
+      batchDeleteSuccess: "批量删除成功",
       resetPassword: "重置密码",
       selectYourLang: "请选择您的语言",
       refreshData: "刷新数据",
@@ -817,6 +856,8 @@ const messages = {
       qualification: "学历管理",
       insertQualification: "添加学历",
       updateQualification: "编辑学历",
+      viewQualification: "查看学历",
+      deleteQualification: "删除学历",
       pleaseInputQualificationName: "请输入学历名称",
       pleaseInputQualificationNo: "请输入学历编号",
       qualificationNo: "学历编号",
@@ -825,6 +866,8 @@ const messages = {
       passport: "证件管理",
       insertPassport: "添加证件",
       updatePassport: "编辑证件",
+      viewPassport: "查看证件",
+      deletePassport: "删除证件",
       pleaseInputPassportName: "请输入证件名称",
       pleaseInputPassportNo: "请输入证件编号",
       passportNo: "证件编号",
@@ -833,6 +876,8 @@ const messages = {
       noticetype: "公告类型管理",
       insertNoticeType: "添加公告类型",
       updateNoticeType: "编辑公告类型",
+      viewNoticeType: "查看公告类型",
+      deleteNoticeType: "删除公告类型",
       pleaseInputNoticeTypeName: "请输入公告类型名称",
       pleaseInputNoticeTypeNumber: "请输入公告类型编号",
       noticeTypeNumber: "公告类型编号",
@@ -841,6 +886,8 @@ const messages = {
       internalfinance: "内部资产管理",
       insertInternalFinance: "添加内部资产",
       updateInternalFinance: "编辑内部资产",
+      viewInternalFinance: "查看内部资产",
+      deleteInternalFinance: "删除内部资产",
       pleaseInputInternalFinanceName: "请输入内部资产名称",
       pleaseInputInternalFinanceNo: "请输入内部资产编号",
       pleaseInputInternalFinancePrice: "请输入内部资产价格",
@@ -876,6 +923,8 @@ const messages = {
       supervisioninfo: "监管情况",
       insertSupervisionInfo: "添加监管情况",
       updateSupervisionInfo: "编辑监管情况",
+      viewSupervisionInfo: "查看监管情况",
+      deleteSupervisionInfo: "删除监管情况",
       pleaseInputCheckDepartment: "请输入本次受监管部门",
       pleaseInputCheckProgres: "请输入本次监管进度",
       pleaseInputCheckCash: "请输入本次监管损失",
@@ -896,6 +945,8 @@ const messages = {
       roommanagement: "房间管理",
       insertRoom: "添加房间",
       updateRoom: "编辑房间",
+      viewRoom: "查看房间",
+      deleteRoom: "删除房间",
       pleaseInputRoomNo: "请输入房间编号",
       pleaseInputRoomType: "请输入房间类型",
       pleaseInputRoomState: "请输入房间状态",
@@ -910,6 +961,8 @@ const messages = {
       roomconfig: "客房配置",
       insertRoomConfig: "添加客房配置",
       updateRoomConfig: "编辑客房配置",
+      viewRoomConfig: "查看客房配置",
+      deleteRoomConfig: "删除客房配置",
       pleaseInputRoomTypeCode: "请输入客房类型代码",
       pleaseInputRoomTypeName: "请输入客房类型名称",
       roomTypeCode: "客房类型代码",
@@ -921,6 +974,8 @@ const messages = {
       viprule: "会员规则",
       insertVipRule: "添加会员规则",
       updateVipRule: "编辑会员规则",
+      viewVipRule: "查看会员规则",
+      deleteVipRule: "删除会员规则",
       pleaseInputVipRuleId: "请输入会员规则 ID",
       pleaseInputVipRuleName: "请输入会员规则名称",
       pleaseInputVipRuleValue: "请输入会员规则值",
@@ -933,6 +988,8 @@ const messages = {
       customermanagement: "客户管理",
       insertCustomer: "添加客户",
       updateCustomer: "编辑客户",
+      viewCustomer: "查看客户",
+      deleteCustomer: "删除客户",
       pleaseInputCustomerNo: "请输入客户编号",
       pleaseInputCustomerName: "请输入客户姓名",
       pleaseInputCustomerSex: "请输入客户性别",
@@ -958,6 +1015,8 @@ const messages = {
       customertype: "客户类型管理",
       insertCustomerType: "添加客户类型",
       updateCustomerType: "编辑客户类型",
+      viewCustomerType: "查看客户类型",
+      deleteCustomerType: "删除客户类型",
       pleaseInputCustomerTypeNo: "请输入客户类型编号",
       pleaseInputCustomerTypeName: "请输入客户类型名称",
       pleaseInputCustomerTypeDiscount: "请输入客户类型折扣",
@@ -970,6 +1029,8 @@ const messages = {
       customerspend: "客户消费记录",
       insertSpend: "添加消费记录",
       updateSpend: "编辑消费记录",
+      viewSpend: "查看消费记录",
+      deleteSpend: "删除消费记录",
       pleaseInputSpendName: "请输入商品名称",
       pleaseInputSpendAmount: "请输入商品数量",
       pleaseInputSpendPrice: "请输入单价",
@@ -987,6 +1048,7 @@ const messages = {
 
       insertStaff: "添加员工",
       updateStaff: "编辑员工",
+      viewStaff: "查看员工",
       pleaseInputStaffName: "请输入员工姓名",
       pleaseInputEmployeeName: "请输入员工姓名",
       pleaseInputPhoneNumber: "请输入电话号码",
@@ -1050,6 +1112,8 @@ const messages = {
 
       insertGoods: "创建商品",
       updateGoods: "编辑商品",
+      viewGoods: "查看商品",
+      deleteGoods: "删除商品",
       pleaseInputGoodsNumber: "请输入商品编号",
       pleaseInputGoodsName: "请输入商品名称",
       pleaseInputGoodsPrice: "请输入商品价格",
@@ -1067,6 +1131,8 @@ const messages = {
       resermanagement: "预约管理",
       insertReser: "创建预约",
       updateReser: "编辑预约",
+      viewReser: "查看预约",
+      deleteReser: "删除预约",
       pleaseInputReserNumber: "请输入预约编号",
       pleaseInputReserPhoneNumberName: "请输入电话号码",
       pleaseInputReserCustomerName: "请输入客户姓名",
@@ -1086,6 +1152,8 @@ const messages = {
       administratormanagement: "管理员管理",
       insertAdministrator: "创建管理员",
       updateAdministrator: "编辑管理员",
+      viewAdministrator: "查看管理员",
+      deleteAdministrator: "删除管理员",
       pleaseInputAdminNumber: "请输入管理员编号",
       pleaseInputAdminAccount: "请输入管理员账号",
       pleaseInputAdminName: "请输入管理员姓名",
@@ -1102,6 +1170,8 @@ const messages = {
       admintypemanagement: "管理员类型管理",
       insertAdminType: "创建管理员类型",
       updateAdminType: "编辑管理员类型",
+      viewAdminType: "查看管理员类型",
+      deleteAdminType: "删除管理员类型",
       pleaseInputAdminTypeNumber: "请输入管理员类型编号",
       pleaseInputAdminTypeName: "请输入管理员类型名称",
       adminTypeNumber: "管理员类型编号",
@@ -1110,6 +1180,8 @@ const messages = {
       rolemanagement: "角色管理",
       insertRole: "创建角色",
       updateRole: "编辑角色",
+      viewRole: "查看角色",
+      deleteRole: "删除角色",
       pleaseInputRoleNumber: "请输入角色编号",
       pleaseInputRoleName: "请输入角色名称",
       pleaseInputRoleDescription: "请输入角色描述",
@@ -1120,6 +1192,8 @@ const messages = {
       menumanagement: "菜单管理",
       insertMenu: "创建菜单",
       updateMenu: "编辑菜单",
+      viewMenu: "查看菜单",
+      deleteMenu: "删除菜单",
       pleaseInputMenuKey: "请输入菜单键值",
       pleaseInputMenuTitle: "请输入菜单标题",
       pleaseInputMenuPath: "请输入菜单路径",
@@ -1138,6 +1212,8 @@ const messages = {
       promotioncontent: "宣传联动内容管理",
       insertPromotionContent: "创建宣传联动内容",
       updatePromotionContent: "编辑宣传联动内容",
+      viewPromotionContent: "查看宣传联动内容",
+      deletePromotionContent: "删除宣传联动内容",
       pleaseInputPromotionContentNumber: "请输入宣传联动内容编号",
       pleaseInputPromotionContentMessage: "请输入宣传联动内容",
       promotionContentNumber: "宣传联动内容编号",
@@ -1245,6 +1321,47 @@ const messages = {
 
       pleaseInputPath: "请输入请求路径",
       pleaseInputUserName: "请输入用户名",
+      roomStatusDistribution: "房间状态分布",
+      roomTypeInventory: "房型库存",
+      reservationAlerts: "预约预警",
+      businessOverview: "商务概览",
+      customerGender: "客户性别",
+      memberDistribution: "会员分布",
+      consumptionStats: "消费统计",
+      todayConsumption: "当日消费",
+      weeklyConsumption: "本周消费",
+      logisticsOverview: "后勤概览",
+      totalProducts: "商品总数",
+      lowStock: "低库存商品",
+      recentRecords: "最近出入库",
+      inbound: "入库",
+      outbound: "出库",
+      hrOverview: "人事概览",
+      totalEmployees: "员工总数",
+      totalDepartments: "部门总数",
+      monthlyAttendance: "本月考勤",
+      alerts: "暂无预警信息",
+      genders: "暂无性别数据",
+      members: "暂无会员数据",
+      inventory: "暂无库存数据",
+      records: "暂无出入库记录",
+      attendance: "暂无考勤数据",
+      quantity: "数量",
+      totalRooms: "总房数",
+      availableRooms: "可用房数",
+      roomTypeInventory: "房型库存分布",
+      unknownGuest: "未知客户",
+      unknownPhoneNo: "未知电话号码",
+      settled: "已结算",
+      yearConsumption: "年度消费",
+      consumptionTrend: "消费趋势分析",
+      settledAmount: "已结算金额",
+      dailyAttendance: "日常考勤",
+      morningPresent: "早班打卡",
+      eveningPresent: "晚班打卡",
+      present: "正常",
+      late: "迟到",
+      absent: "旷工",
     },
   },
 };
diff --git a/src/views/base/DepartmentView.vue b/src/views/base/DepartmentView.vue
index e79be0b..7d9919d 100644
--- a/src/views/base/DepartmentView.vue
+++ b/src/views/base/DepartmentView.vue
@@ -111,6 +111,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -164,7 +165,7 @@
       v-if="viewModalVisible"
       v-model:open="viewModalVisible"
       :title="t('message.viewDepartment')"
-      width="600px"
+      :width="'60%'"
       :footer="null"
     >
       <a-descriptions bordered :column="2">
diff --git a/src/views/base/NationView.vue b/src/views/base/NationView.vue
index 3e0e20f..7f7c09c 100644
--- a/src/views/base/NationView.vue
+++ b/src/views/base/NationView.vue
@@ -86,8 +86,6 @@
           >
             <EyeOutlined style="font-size: 16px" />
           </a-button>
-        </template>
-        <template v-if="column.key === 'operation'">
           <template v-if="record[NationFields.IS_DELETED] == 1">
             <a-popconfirm
               :title="t('message.areYouSureToRestoreRecord')"
@@ -95,10 +93,12 @@
             >
               <a-button
                 v-perm="NationPermissions.UPDATE"
-                type="default"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
                 style="color: green"
               >
-                <UndoOutlined /> {{ $t("message.restore") || "Restore" }}
+                <UndoOutlined style="font-size: 16px" />
               </a-button>
             </a-popconfirm>
           </template>
@@ -109,6 +109,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -127,7 +128,7 @@
       v-if="viewModalVisible"
       v-model:open="viewModalVisible"
       :title="t('message.viewNation')"
-      width="600px"
+      :width="'60%'"
       :footer="null"
     >
       <a-descriptions bordered :column="2">
@@ -211,32 +212,6 @@ const handleSelectChange = (record, e) => {
   }
 };
 
-// 处理全选
-const handleSelectAll = () => {
-  const allIds = nations.value
-    .filter((record) => record[NationFields.IS_DELETED] != 1)
-    .map((record) => record[NationFields.ID]);
-  if (selectedRowKeys.value.length === allIds.length) {
-    // 取消全选
-    selectedRowKeys.value = [];
-    selectedRows.value = [];
-    nations.value.forEach((record) => {
-      record.selected = false;
-    });
-  } else {
-    // 全选
-    selectedRowKeys.value = allIds;
-    selectedRows.value = nations.value.filter(
-      (record) => record[NationFields.IS_DELETED] != 1,
-    );
-    nations.value.forEach((record) => {
-      if (record[NationFields.IS_DELETED] != 1) {
-        record.selected = true;
-      }
-    });
-  }
-};
-
 // 清空选择
 const clearSelection = () => {
   selectedRowKeys.value = [];
@@ -314,6 +289,7 @@ const handleFilterSearch = (values) => {
     }
     currentFilterParams[key] = val;
   });
+  clearSelection();
   fetchNationData();
 };
 
@@ -326,6 +302,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection(); // 重置选择
   fetchNationData();
 };
 const confirmLoading = ref(false);
@@ -362,6 +339,7 @@ const fetchNationData = async () => {
         [NationFields.ID]: item[NationFields.ID],
         [NationFields.NUMBER]: item[NationFields.NUMBER],
         [NationFields.NAME]: item[NationFields.NAME],
+        [NationFields.IS_DELETED]: item[NationFields.IS_DELETED],
         [NationFields.SELECTED]: false,
       }));
       pagination.total = result.TotlalCount;
@@ -455,6 +433,7 @@ const restoreNation = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchNationData();
 };
 
diff --git a/src/views/base/NoticeTypeView.vue b/src/views/base/NoticeTypeView.vue
index f4ff556..d053292 100644
--- a/src/views/base/NoticeTypeView.vue
+++ b/src/views/base/NoticeTypeView.vue
@@ -1,19 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="NoticeTypePermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertNoticeType") }}</a-button
-    >
-
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="NoticeTypePermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertNoticeType") }}
+      </a-button>
+      <a-button
+        v-perm="NoticeTypePermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateNoticeType") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="NoticeTypePermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteNoticeType") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -33,30 +58,49 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[NoticeTypeFields.ID]"
       :columns="columns"
       :data-source="notices"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="NoticeTypePermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editNoticeType(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="NoticeTypePermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[NoticeTypeFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreNoticeType(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="NoticeTypePermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -64,6 +108,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -81,6 +126,22 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewNoticeType')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="noticeTypeNoLabel">
+          {{ selectedRecord?.[NoticeTypeFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="noticeTypeNameLabel">
+          {{ selectedRecord?.[NoticeTypeFields.NAME] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -113,12 +174,108 @@ const pageTitleKey = computed(() => getPageTitle(route.path));
 const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const notices = ref([]);
+const viewModalVisible = ref(false);
 const modalVisible = ref(false);
 const modalTitle = ref("");
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 const noticeTypeFilterConfig = computed(() => getNoticeTypeFilterConfig(t));
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[NoticeTypeFields.IS_DELETED] == 1,
+  }),
+}));
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[NoticeTypeFields.ID])) {
+      selectedRowKeys.value.push(record[NoticeTypeFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[NoticeTypeFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  notices.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRows.value.length === 1) {
+    editNoticeType(selectedRows.value[0]);
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteNoticeType(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchNoticeTypeData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -134,6 +291,7 @@ const handleFilterSearch = (values) => {
     }
     currentFilterParams[key] = val;
   });
+  clearSelection(); // 重置选择
   fetchNoticeTypeData();
 };
 
@@ -147,6 +305,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection(); // 重置选择
   fetchNoticeTypeData();
 };
 const confirmLoading = ref(false);
@@ -160,8 +319,6 @@ const rules = getFormRules(t);
 const noticeTypeNoLabel = computed(() => t("message.noticeTypeNumber"));
 const noticeTypeNameLabel = computed(() => t("message.noticeTypeName"));
 
-const columns = computed(() => getColumns(t));
-
 const pagination = reactive({
   current: 1,
   pageSize: 15,
@@ -186,6 +343,7 @@ const fetchNoticeTypeData = async () => {
         [NoticeTypeFields.NUMBER]: item[NoticeTypeFields.NUMBER],
         [NoticeTypeFields.NAME]: item[NoticeTypeFields.NAME],
         [NoticeTypeFields.IS_DELETED]: item[NoticeTypeFields.IS_DELETED],
+        [NoticeTypeFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -197,6 +355,7 @@ const fetchNoticeTypeData = async () => {
 };
 
 onMounted(() => {
+  clearSelection(); // 重置选择
   fetchNoticeTypeData();
 });
 
@@ -212,6 +371,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchNoticeTypeData();
 };
 
@@ -244,6 +404,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchNoticeTypeData();
   } catch (error) {
     showErrorNotification(t("message.pleaseTryAgainLater"));
@@ -256,24 +417,25 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreNoticeType = async (record) => {
   try {
-    record[NoticeTypeFields.IS_DELETED] = 1;
-    var response = await deleteNoticeType(record);
+    record[NoticeTypeFields.IS_DELETED] = 0;
+    const response = await updateNoticeType(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(response.Message);
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchNoticeTypeData();
   } catch (error) {
-    showErrorNotification(t("message.pleaseTryAgainLater"));
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
   }
 };
 
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchNoticeTypeData();
 };
 
diff --git a/src/views/base/PassportView.vue b/src/views/base/PassportView.vue
index df098b4..2ed4cf6 100644
--- a/src/views/base/PassportView.vue
+++ b/src/views/base/PassportView.vue
@@ -1,19 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="PassportPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertPassport") }}</a-button
-    >
-
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="PassportPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertPassport") }}
+      </a-button>
+      <a-button
+        v-perm="PassportPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updatePassport") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="PassportPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deletePassport") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -33,30 +58,49 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[PassportFields.ID]"
       :columns="columns"
       :data-source="passports"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="PassportPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editPassport(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="PassportPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[PassportFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restorePassport(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="PassportPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -64,6 +108,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -80,6 +125,22 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewPassport')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="passportNoLabel">
+          {{ selectedRecord?.[PassportFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="passportNameLabel">
+          {{ selectedRecord?.[PassportFields.NAME] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -111,12 +172,108 @@ const pageTitleKey = computed(() => getPageTitle(route.path));
 const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const passports = ref([]);
+const viewModalVisible = ref(false);
 const modalVisible = ref(false);
 const modalTitle = ref("");
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 const passportFilterConfig = computed(() => getPassportFilterConfig(t));
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[PassportFields.IS_DELETED] == 1,
+  }),
+}));
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[PassportFields.ID])) {
+      selectedRowKeys.value.push(record[PassportFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[PassportFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  passports.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRows.value.length === 1) {
+    editPassport(selectedRows.value[0]);
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deletePassport(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchPassportData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -157,8 +314,6 @@ const rules = getFormRules(t);
 const passportNoLabel = computed(() => t("message.passportNo"));
 const passportNameLabel = computed(() => t("message.passportName"));
 
-const columns = computed(() => getColumns(t));
-
 const pagination = reactive({
   current: 1,
   pageSize: 15,
@@ -182,6 +337,8 @@ const fetchPassportData = async () => {
         [PassportFields.ID]: item[PassportFields.ID],
         [PassportFields.NUMBER]: item[PassportFields.NUMBER],
         [PassportFields.NAME]: item[PassportFields.NAME],
+        [PassportFields.IS_DELETED]: item[PassportFields.IS_DELETED],
+        [PassportFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -193,6 +350,7 @@ const fetchPassportData = async () => {
 };
 
 onMounted(() => {
+  clearSelection(); // 重置选择
   fetchPassportData();
 });
 
@@ -205,6 +363,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchPassportData();
 };
 
@@ -237,6 +396,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchPassportData();
   } catch (error) {
     showErrorNotification(t("message.pleaseTryAgainLater"));
@@ -249,24 +409,25 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restorePassport = async (record) => {
   try {
-    record[PassportFields.IS_DELETED] = 1;
-    var response = await deletePassport(record);
+    record[PassportFields.IS_DELETED] = 0;
+    const response = await updatePassport(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(response.Message);
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchPassportData();
   } catch (error) {
-    showErrorNotification(t("message.pleaseTryAgainLater"));
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
   }
 };
 
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchPassportData();
 };
 
diff --git a/src/views/base/PositionView.vue b/src/views/base/PositionView.vue
index 6771257..9935852 100644
--- a/src/views/base/PositionView.vue
+++ b/src/views/base/PositionView.vue
@@ -79,8 +79,6 @@
           >
             <EyeOutlined style="font-size: 16px" />
           </a-button>
-        </template>
-        <template v-if="column.key === 'operation'">
           <template v-if="record[PositionFields.IS_DELETED] == 1">
             <a-popconfirm
               :title="t('message.areYouSureToRestoreRecord')"
@@ -88,10 +86,12 @@
             >
               <a-button
                 v-perm="PositionPermissions.UPDATE"
-                type="default"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
                 style="color: green"
               >
-                <UndoOutlined /> {{ $t("message.restore") || "Restore" }}
+                <UndoOutlined style="font-size: 16px" />
               </a-button>
             </a-popconfirm>
           </template>
@@ -102,6 +102,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -120,7 +121,7 @@
       v-if="viewModalVisible"
       v-model:open="viewModalVisible"
       :title="t('message.viewPosition')"
-      width="600px"
+      :width="'60%'"
       :footer="null"
     >
       <a-descriptions bordered :column="2">
@@ -310,6 +311,8 @@ const fetchPositionData = async () => {
         [PositionFields.ID]: item[PositionFields.ID],
         [PositionFields.NUMBER]: item[PositionFields.NUMBER],
         [PositionFields.NAME]: item[PositionFields.NAME],
+        [PositionFields.IS_DELETED]: item[PositionFields.IS_DELETED],
+        [PositionFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
diff --git a/src/views/base/PromotionContentView.vue b/src/views/base/PromotionContentView.vue
index ab86f46..d51998c 100644
--- a/src/views/base/PromotionContentView.vue
+++ b/src/views/base/PromotionContentView.vue
@@ -1,19 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="PromotionContentPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertPromotionContent") }}</a-button
-    >
-
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="PromotionContentPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertPromotionContent") }}
+      </a-button>
+      <a-button
+        v-perm="PromotionContentPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updatePromotionContent") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="PromotionContentPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deletePromotionContent") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -33,30 +58,49 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[PromotionContentFields.ID]"
       :columns="columns"
       :data-source="promotionContents"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="PromotionContentPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editPromotionContent(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <a-button v-perm="PromotionContentPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[PromotionContentFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restorePromotionContent(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="PromotionContentPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -65,6 +109,7 @@
       :open="modalVisible"
       :title="modalTitle"
       :confirm-loading="confirmLoading"
+      :width="'80%'"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
     >
@@ -86,10 +131,27 @@
           <a-textarea
             v-model:value="form[PromotionContentFields.MESSAGE]"
             allow-clear
+            rows="4"
           />
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewPromotionContent')"
+      :width="'80%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="promotionContentNoLabel">
+          {{ selectedRecord?.[PromotionContentFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="promotionContentMessageLabel">
+          {{ selectedRecord?.[PromotionContentFields.MESSAGE] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -122,14 +184,112 @@ const pageTitleKey = computed(() => getPageTitle(route.path));
 const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const promotionContents = ref([]);
+const viewModalVisible = ref(false);
 const modalVisible = ref(false);
 const modalTitle = ref("");
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 const promotionContentFilterConfig = computed(() =>
   getPromotionContentFilterConfig(t),
 );
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[PromotionContentFields.IS_DELETED] == 1,
+  }),
+}));
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[PromotionContentFields.ID])) {
+      selectedRowKeys.value.push(record[PromotionContentFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(
+      record[PromotionContentFields.ID],
+    );
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  promotionContents.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRows.value.length === 1) {
+    editPromotionContent(selectedRows.value[0]);
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deletePromotionContent(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchPromotionContentData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -145,6 +305,7 @@ const handleFilterSearch = (values) => {
     }
     currentFilterParams[key] = val;
   });
+  clearSelection();
   fetchPromotionContentData();
 };
 
@@ -157,6 +318,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection();
   fetchPromotionContentData();
 };
 const confirmLoading = ref(false);
@@ -174,8 +336,6 @@ const promotionContentMessageLabel = computed(() =>
   t("message.promotionContentMessage"),
 );
 
-const columns = computed(() => getColumns(t));
-
 const pagination = reactive({
   current: 1,
   pageSize: 15,
@@ -199,6 +359,9 @@ const fetchPromotionContentData = async () => {
         [PromotionContentFields.ID]: item[PromotionContentFields.ID],
         [PromotionContentFields.NUMBER]: item[PromotionContentFields.NUMBER],
         [PromotionContentFields.MESSAGE]: item[PromotionContentFields.MESSAGE],
+        [PromotionContentFields.IS_DELETED]:
+          item[PromotionContentFields.IS_DELETED],
+        [PromotionContentFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -210,6 +373,7 @@ const fetchPromotionContentData = async () => {
 };
 
 onMounted(() => {
+  clearSelection(); // 重置选择
   fetchPromotionContentData();
 });
 
@@ -226,6 +390,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchPromotionContentData();
 };
 
@@ -258,6 +423,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchPromotionContentData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -270,14 +436,14 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restorePromotionContent = async (record) => {
   try {
-    record[PromotionContentFields.IS_DELETED] = 1;
-    var response = await deletePromotionContent(record);
+    record[PromotionContentFields.IS_DELETED] = 0;
+    const response = await updatePromotionContent(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(t("message.pleaseTryAgainLater"));
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchPromotionContentData();
   } catch (error) {
@@ -288,6 +454,7 @@ const handleDelete = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchPromotionContentData();
 };
 
diff --git a/src/views/base/QualificationView.vue b/src/views/base/QualificationView.vue
index 9857f23..7ad7b05 100644
--- a/src/views/base/QualificationView.vue
+++ b/src/views/base/QualificationView.vue
@@ -1,19 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="QualificationPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertQualification") }}</a-button
-    >
-
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="QualificationPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertQualification") }}
+      </a-button>
+      <a-button
+        v-perm="QualificationPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateQualification") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="QualificationPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteQualification") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -33,30 +58,49 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[EducationFields.ID]"
       :columns="columns"
       :data-source="qualifications"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="QualificationPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editQualification(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="QualificationPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[EducationFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreQualification(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="QualificationPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -64,6 +108,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -84,6 +129,22 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewQualification')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="qualificationNoLabel">
+          {{ selectedRecord?.[EducationFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="qualificationNameLabel">
+          {{ selectedRecord?.[EducationFields.NAME] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -116,14 +177,110 @@ const pageTitleKey = computed(() => getPageTitle(route.path));
 const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const qualifications = ref([]);
+const viewModalVisible = ref(false);
 const modalVisible = ref(false);
 const modalTitle = ref("");
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 const qualificationFilterConfig = computed(() =>
   getQualificationFilterConfig(t),
 );
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[EducationFields.IS_DELETED] == 1,
+  }),
+}));
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[EducationFields.ID])) {
+      selectedRowKeys.value.push(record[EducationFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[EducationFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  qualifications.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRows.value.length === 1) {
+    editQualification(selectedRows.value[0]);
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteQualification(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchQualificationData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -139,6 +296,7 @@ const handleFilterSearch = (values) => {
     }
     currentFilterParams[key] = val;
   });
+  clearSelection();
   fetchQualificationData();
 };
 
@@ -151,6 +309,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection();
   fetchQualificationData();
 };
 const confirmLoading = ref(false);
@@ -162,8 +321,6 @@ const sortedInfo = ref({ order: null, columnKey: null });
 const qualificationNoLabel = computed(() => t("message.qualificationNo"));
 const qualificationNameLabel = computed(() => t("message.qualificationName"));
 
-const columns = computed(() => getColumns(t));
-
 const pagination = reactive({
   current: 1,
   pageSize: 15,
@@ -187,6 +344,8 @@ const fetchQualificationData = async () => {
         [EducationFields.ID]: item[EducationFields.ID],
         [EducationFields.NUMBER]: item[EducationFields.NUMBER],
         [EducationFields.NAME]: item[EducationFields.NAME],
+        [EducationFields.IS_DELETED]: item[EducationFields.IS_DELETED],
+        [EducationFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -215,6 +374,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchQualificationData();
 };
 
@@ -243,6 +403,7 @@ const handleModalOk = async () => {
       } else showErrorNotification(t("message.pleaseTryAgainLater"));
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchQualificationData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -255,13 +416,15 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreQualification = async (record) => {
   try {
-    record[EducationFields.IS_DELETED] = 1;
-    var response = await deleteQualification(record);
+    record[EducationFields.IS_DELETED] = 0;
+    const response = await updateQualification(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
-    } else showErrorNotification(t("message.pleaseTryAgainLater"));
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
+    }
     fetchQualificationData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -271,6 +434,7 @@ const handleDelete = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchQualificationData();
 };
 
-- 
Gitee


From 5a0b549d69e85f2cf517fe105c3a0c88c6d71b65 Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sun, 25 Jan 2026 03:01:12 +0800
Subject: [PATCH 04/10] upgrade package.

---
 package-lock.json | 567 +++++++++++++++++++++++++---------------------
 package.json      |   4 +-
 2 files changed, 315 insertions(+), 256 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 4c6993a..35efb47 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "topsky-hotel-management-system-vue3",
-  "version": "0.0.0",
+  "version": "1.0.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "topsky-hotel-management-system-vue3",
-      "version": "0.0.0",
+      "version": "1.0.0",
       "dependencies": {
         "@akashrajpurohit/snowflake-id": "^2.0.0",
         "@vueuse/core": "^13.1.0",
@@ -26,7 +26,7 @@
       },
       "devDependencies": {
         "@ant-design/icons-vue": "^7.0.1",
-        "@vitejs/plugin-vue": "^5.2.1",
+        "@vitejs/plugin-vue": "^6.0.3",
         "@vue/eslint-config-prettier": "^9.0.0",
         "eslint": "^8.57.0",
         "eslint-plugin-vue": "^9.26.0",
@@ -90,12 +90,12 @@
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.28.5",
-      "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.28.5.tgz",
-      "integrity": "sha512-KKBU1VGYR7ORr3At5HAtUQ+TV3SzRCXmA/8OdDZiLDBIZxVyzXuztPjfLd3BV1PRAQGCMWWSHYhL0F8d5uHBDQ==",
+      "version": "7.28.6",
+      "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.28.6.tgz",
+      "integrity": "sha512-TeR9zWR18BvbfPmGbLampPMW+uW1NZnJlRuuHso8i87QZNq2JRF9i6RgxRqtEq+wQGsS19NNTWr2duhnE49mfQ==",
       "license": "MIT",
       "dependencies": {
-        "@babel/types": "^7.28.5"
+        "@babel/types": "^7.28.6"
       },
       "bin": {
         "parser": "bin/babel-parser.js"
@@ -105,18 +105,18 @@
       }
     },
     "node_modules/@babel/runtime": {
-      "version": "7.28.4",
-      "resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.28.4.tgz",
-      "integrity": "sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==",
+      "version": "7.28.6",
+      "resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.28.6.tgz",
+      "integrity": "sha512-05WQkdpL9COIMz4LjTxGpPNCdlpyimKppYNoJ5Di5EUObifl8t4tuLuUBBZEpoLYOmfvIWrsp9fCl0HoPRVTdA==",
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.28.5",
-      "resolved": "https://registry.npmmirror.com/@babel/types/-/types-7.28.5.tgz",
-      "integrity": "sha512-qQ5m48eI/MFLQ5PxQj4PFaprjyCTLI37ElWMmNs0K8Lk3dVeOdNpB3ks8jc7yM5CDmVC73eMVk/trk3fgmrUpA==",
+      "version": "7.28.6",
+      "resolved": "https://registry.npmmirror.com/@babel/types/-/types-7.28.6.tgz",
+      "integrity": "sha512-0ZrskXVEHSWIqZM/sQZ4EV3jZJXRkio/WCxaqKZP1g//CEWEPSfeZFcms4XeKBCHU0ZKnIkdJeU/kF+eRp5lBg==",
       "license": "MIT",
       "dependencies": {
         "@babel/helper-string-parser": "^7.27.1",
@@ -590,9 +590,9 @@
       }
     },
     "node_modules/@eslint-community/eslint-utils": {
-      "version": "4.9.0",
-      "resolved": "https://registry.npmmirror.com/@eslint-community/eslint-utils/-/eslint-utils-4.9.0.tgz",
-      "integrity": "sha512-ayVFHdtZ+hsq1t2Dy24wCmGXGe4q9Gu3smhLYALJrr473ZH27MsnSL+LKUlimp4BWJqMDMLmPpx/Q9R3OAlL4g==",
+      "version": "4.9.1",
+      "resolved": "https://registry.npmmirror.com/@eslint-community/eslint-utils/-/eslint-utils-4.9.1.tgz",
+      "integrity": "sha512-phrYmNiYppR7znFEdqgfWHXR6NCkZEK7hwWDHZUjit/2/U0r6XvkDl0SYnoM51Hq7FhCGdLDT6zxCCOY1hexsQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -691,13 +691,13 @@
       "license": "BSD-3-Clause"
     },
     "node_modules/@intlify/core-base": {
-      "version": "9.14.5",
-      "resolved": "https://registry.npmmirror.com/@intlify/core-base/-/core-base-9.14.5.tgz",
-      "integrity": "sha512-5ah5FqZG4pOoHjkvs8mjtv+gPKYU0zCISaYNjBNNqYiaITxW8ZtVih3GS/oTOqN8d9/mDLyrjD46GBApNxmlsA==",
+      "version": "9.14.4",
+      "resolved": "https://registry.npmmirror.com/@intlify/core-base/-/core-base-9.14.4.tgz",
+      "integrity": "sha512-vtZCt7NqWhKEtHa3SD/322DlgP5uR9MqWxnE0y8Q0tjDs9H5Lxhss+b5wv8rmuXRoHKLESNgw9d+EN9ybBbj9g==",
       "license": "MIT",
       "dependencies": {
-        "@intlify/message-compiler": "9.14.5",
-        "@intlify/shared": "9.14.5"
+        "@intlify/message-compiler": "9.14.4",
+        "@intlify/shared": "9.14.4"
       },
       "engines": {
         "node": ">= 16"
@@ -707,12 +707,12 @@
       }
     },
     "node_modules/@intlify/message-compiler": {
-      "version": "9.14.5",
-      "resolved": "https://registry.npmmirror.com/@intlify/message-compiler/-/message-compiler-9.14.5.tgz",
-      "integrity": "sha512-IHzgEu61/YIpQV5Pc3aRWScDcnFKWvQA9kigcINcCBXN8mbW+vk9SK+lDxA6STzKQsVJxUPg9ACC52pKKo3SVQ==",
+      "version": "9.14.4",
+      "resolved": "https://registry.npmmirror.com/@intlify/message-compiler/-/message-compiler-9.14.4.tgz",
+      "integrity": "sha512-vcyCLiVRN628U38c3PbahrhbbXrckrM9zpy0KZVlDk2Z0OnGwv8uQNNXP3twwGtfLsCf4gu3ci6FMIZnPaqZsw==",
       "license": "MIT",
       "dependencies": {
-        "@intlify/shared": "9.14.5",
+        "@intlify/shared": "9.14.4",
         "source-map-js": "^1.0.2"
       },
       "engines": {
@@ -723,9 +723,9 @@
       }
     },
     "node_modules/@intlify/shared": {
-      "version": "9.14.5",
-      "resolved": "https://registry.npmmirror.com/@intlify/shared/-/shared-9.14.5.tgz",
-      "integrity": "sha512-9gB+E53BYuAEMhbCAxVgG38EZrk59sxBtv3jSizNL2hEWlgjBjAw1AwpLHtNaeda12pe6W20OGEa0TwuMSRbyQ==",
+      "version": "9.14.4",
+      "resolved": "https://registry.npmmirror.com/@intlify/shared/-/shared-9.14.4.tgz",
+      "integrity": "sha512-P9zv6i1WvMc9qDBWvIgKkymjY2ptIiQ065PjDv7z7fDqH3J/HBRBN5IoiR46r/ujRcU7hCuSIZWvCAFCyuOYZA==",
       "license": "MIT",
       "engines": {
         "node": ">= 16"
@@ -845,10 +845,17 @@
         "url": "https://opencollective.com/pkgr"
       }
     },
+    "node_modules/@rolldown/pluginutils": {
+      "version": "1.0.0-beta.53",
+      "resolved": "https://registry.npmmirror.com/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.53.tgz",
+      "integrity": "sha512-vENRlFU4YbrwVqNDZ7fLvy+JR1CRkyr01jhSiDpE1u6py3OMzQfztQU2jxykW3ALNxO4kSlqIDeYyD0Y9RcQeQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.52.5.tgz",
-      "integrity": "sha512-8c1vW4ocv3UOMp9K+gToY5zL2XiiVw3k7f1ksf4yO1FlDFQ1C2u72iACFnSOceJFsWskc2WZNqeRhFRPzv+wtQ==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.56.0.tgz",
+      "integrity": "sha512-LNKIPA5k8PF1+jAFomGe3qN3bbIgJe/IlpDBwuVjrDKrJhVWywgnJvflMt/zkbVNLFtF1+94SljYQS6e99klnw==",
       "cpu": [
         "arm"
       ],
@@ -860,9 +867,9 @@
       ]
     },
     "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.52.5.tgz",
-      "integrity": "sha512-mQGfsIEFcu21mvqkEKKu2dYmtuSZOBMmAl5CFlPGLY94Vlcm+zWApK7F/eocsNzp8tKmbeBP8yXyAbx0XHsFNA==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.56.0.tgz",
+      "integrity": "sha512-lfbVUbelYqXlYiU/HApNMJzT1E87UPGvzveGg2h0ktUNlOCxKlWuJ9jtfvs1sKHdwU4fzY7Pl8sAl49/XaEk6Q==",
       "cpu": [
         "arm64"
       ],
@@ -874,9 +881,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.52.5.tgz",
-      "integrity": "sha512-takF3CR71mCAGA+v794QUZ0b6ZSrgJkArC+gUiG6LB6TQty9T0Mqh3m2ImRBOxS2IeYBo4lKWIieSvnEk2OQWA==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.56.0.tgz",
+      "integrity": "sha512-EgxD1ocWfhoD6xSOeEEwyE7tDvwTgZc8Bss7wCWe+uc7wO8G34HHCUH+Q6cHqJubxIAnQzAsyUsClt0yFLu06w==",
       "cpu": [
         "arm64"
       ],
@@ -888,9 +895,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.52.5.tgz",
-      "integrity": "sha512-W901Pla8Ya95WpxDn//VF9K9u2JbocwV/v75TE0YIHNTbhqUTv9w4VuQ9MaWlNOkkEfFwkdNhXgcLqPSmHy0fA==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.56.0.tgz",
+      "integrity": "sha512-1vXe1vcMOssb/hOF8iv52A7feWW2xnu+c8BV4t1F//m9QVLTfNVpEdja5ia762j/UEJe2Z1jAmEqZAK42tVW3g==",
       "cpu": [
         "x64"
       ],
@@ -902,9 +909,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-arm64": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.52.5.tgz",
-      "integrity": "sha512-QofO7i7JycsYOWxe0GFqhLmF6l1TqBswJMvICnRUjqCx8b47MTo46W8AoeQwiokAx3zVryVnxtBMcGcnX12LvA==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.56.0.tgz",
+      "integrity": "sha512-bof7fbIlvqsyv/DtaXSck4VYQ9lPtoWNFCB/JY4snlFuJREXfZnm+Ej6yaCHfQvofJDXLDMTVxWscVSuQvVWUQ==",
       "cpu": [
         "arm64"
       ],
@@ -916,9 +923,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-x64": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.52.5.tgz",
-      "integrity": "sha512-jr21b/99ew8ujZubPo9skbrItHEIE50WdV86cdSoRkKtmWa+DDr6fu2c/xyRT0F/WazZpam6kk7IHBerSL7LDQ==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.56.0.tgz",
+      "integrity": "sha512-KNa6lYHloW+7lTEkYGa37fpvPq+NKG/EHKM8+G/g9WDU7ls4sMqbVRV78J6LdNuVaeeK5WB9/9VAFbKxcbXKYg==",
       "cpu": [
         "x64"
       ],
@@ -930,9 +937,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.52.5.tgz",
-      "integrity": "sha512-PsNAbcyv9CcecAUagQefwX8fQn9LQ4nZkpDboBOttmyffnInRy8R8dSg6hxxl2Re5QhHBf6FYIDhIj5v982ATQ==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.56.0.tgz",
+      "integrity": "sha512-E8jKK87uOvLrrLN28jnAAAChNq5LeCd2mGgZF+fGF5D507WlG/Noct3lP/QzQ6MrqJ5BCKNwI9ipADB6jyiq2A==",
       "cpu": [
         "arm"
       ],
@@ -944,9 +951,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-musleabihf": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.52.5.tgz",
-      "integrity": "sha512-Fw4tysRutyQc/wwkmcyoqFtJhh0u31K+Q6jYjeicsGJJ7bbEq8LwPWV/w0cnzOqR2m694/Af6hpFayLJZkG2VQ==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.56.0.tgz",
+      "integrity": "sha512-jQosa5FMYF5Z6prEpTCCmzCXz6eKr/tCBssSmQGEeozA9tkRUty/5Vx06ibaOP9RCrW1Pvb8yp3gvZhHwTDsJw==",
       "cpu": [
         "arm"
       ],
@@ -958,9 +965,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.52.5.tgz",
-      "integrity": "sha512-a+3wVnAYdQClOTlyapKmyI6BLPAFYs0JM8HRpgYZQO02rMR09ZcV9LbQB+NL6sljzG38869YqThrRnfPMCDtZg==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.56.0.tgz",
+      "integrity": "sha512-uQVoKkrC1KGEV6udrdVahASIsaF8h7iLG0U0W+Xn14ucFwi6uS539PsAr24IEF9/FoDtzMeeJXJIBo5RkbNWvQ==",
       "cpu": [
         "arm64"
       ],
@@ -972,9 +979,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.52.5.tgz",
-      "integrity": "sha512-AvttBOMwO9Pcuuf7m9PkC1PUIKsfaAJ4AYhy944qeTJgQOqJYJ9oVl2nYgY7Rk0mkbsuOpCAYSs6wLYB2Xiw0Q==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.56.0.tgz",
+      "integrity": "sha512-vLZ1yJKLxhQLFKTs42RwTwa6zkGln+bnXc8ueFGMYmBTLfNu58sl5/eXyxRa2RarTkJbXl8TKPgfS6V5ijNqEA==",
       "cpu": [
         "arm64"
       ],
@@ -986,9 +993,23 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-loong64-gnu": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.52.5.tgz",
-      "integrity": "sha512-DkDk8pmXQV2wVrF6oq5tONK6UHLz/XcEVow4JTTerdeV1uqPeHxwcg7aFsfnSm9L+OO8WJsWotKM2JJPMWrQtA==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.56.0.tgz",
+      "integrity": "sha512-FWfHOCub564kSE3xJQLLIC/hbKqHSVxy8vY75/YHHzWvbJL7aYJkdgwD/xGfUlL5UV2SB7otapLrcCj2xnF1dg==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-musl": {
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.56.0.tgz",
+      "integrity": "sha512-z1EkujxIh7nbrKL1lmIpqFTc/sr0u8Uk0zK/qIEFldbt6EDKWFk/pxFq3gYj4Bjn3aa9eEhYRlL3H8ZbPT1xvA==",
       "cpu": [
         "loong64"
       ],
@@ -1000,9 +1021,23 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-ppc64-gnu": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.52.5.tgz",
-      "integrity": "sha512-W/b9ZN/U9+hPQVvlGwjzi+Wy4xdoH2I8EjaCkMvzpI7wJUs8sWJ03Rq96jRnHkSrcHTpQe8h5Tg3ZzUPGauvAw==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.56.0.tgz",
+      "integrity": "sha512-iNFTluqgdoQC7AIE8Q34R3AuPrJGJirj5wMUErxj22deOcY7XwZRaqYmB6ZKFHoVGqRcRd0mqO+845jAibKCkw==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-musl": {
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.56.0.tgz",
+      "integrity": "sha512-MtMeFVlD2LIKjp2sE2xM2slq3Zxf9zwVuw0jemsxvh1QOpHSsSzfNOTH9uYW9i1MXFxUSMmLpeVeUzoNOKBaWg==",
       "cpu": [
         "ppc64"
       ],
@@ -1014,9 +1049,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.52.5.tgz",
-      "integrity": "sha512-sjQLr9BW7R/ZiXnQiWPkErNfLMkkWIoCz7YMn27HldKsADEKa5WYdobaa1hmN6slu9oWQbB6/jFpJ+P2IkVrmw==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.56.0.tgz",
+      "integrity": "sha512-in+v6wiHdzzVhYKXIk5U74dEZHdKN9KH0Q4ANHOTvyXPG41bajYRsy7a8TPKbYPl34hU7PP7hMVHRvv/5aCSew==",
       "cpu": [
         "riscv64"
       ],
@@ -1028,9 +1063,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-musl": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.52.5.tgz",
-      "integrity": "sha512-hq3jU/kGyjXWTvAh2awn8oHroCbrPm8JqM7RUpKjalIRWWXE01CQOf/tUNWNHjmbMHg/hmNCwc/Pz3k1T/j/Lg==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.56.0.tgz",
+      "integrity": "sha512-yni2raKHB8m9NQpI9fPVwN754mn6dHQSbDTwxdr9SE0ks38DTjLMMBjrwvB5+mXrX+C0npX0CVeCUcvvvD8CNQ==",
       "cpu": [
         "riscv64"
       ],
@@ -1042,9 +1077,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-s390x-gnu": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.52.5.tgz",
-      "integrity": "sha512-gn8kHOrku8D4NGHMK1Y7NA7INQTRdVOntt1OCYypZPRt6skGbddska44K8iocdpxHTMMNui5oH4elPH4QOLrFQ==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.56.0.tgz",
+      "integrity": "sha512-zhLLJx9nQPu7wezbxt2ut+CI4YlXi68ndEve16tPc/iwoylWS9B3FxpLS2PkmfYgDQtosah07Mj9E0khc3Y+vQ==",
       "cpu": [
         "s390x"
       ],
@@ -1056,9 +1091,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.52.5.tgz",
-      "integrity": "sha512-hXGLYpdhiNElzN770+H2nlx+jRog8TyynpTVzdlc6bndktjKWyZyiCsuDAlpd+j+W+WNqfcyAWz9HxxIGfZm1Q==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.56.0.tgz",
+      "integrity": "sha512-MVC6UDp16ZSH7x4rtuJPAEoE1RwS8N4oK9DLHy3FTEdFoUTCFVzMfJl/BVJ330C+hx8FfprA5Wqx4FhZXkj2Kw==",
       "cpu": [
         "x64"
       ],
@@ -1070,9 +1105,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.52.5.tgz",
-      "integrity": "sha512-arCGIcuNKjBoKAXD+y7XomR9gY6Mw7HnFBv5Rw7wQRvwYLR7gBAgV7Mb2QTyjXfTveBNFAtPt46/36vV9STLNg==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.56.0.tgz",
+      "integrity": "sha512-ZhGH1eA4Qv0lxaV00azCIS1ChedK0V32952Md3FtnxSqZTBTd6tgil4nZT5cU8B+SIw3PFYkvyR4FKo2oyZIHA==",
       "cpu": [
         "x64"
       ],
@@ -1083,10 +1118,24 @@
         "linux"
       ]
     },
+    "node_modules/@rollup/rollup-openbsd-x64": {
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.56.0.tgz",
+      "integrity": "sha512-O16XcmyDeFI9879pEcmtWvD/2nyxR9mF7Gs44lf1vGGx8Vg2DRNx11aVXBEqOQhWb92WN4z7fW/q4+2NYzCbBA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ]
+    },
     "node_modules/@rollup/rollup-openharmony-arm64": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.52.5.tgz",
-      "integrity": "sha512-QoFqB6+/9Rly/RiPjaomPLmR/13cgkIGfA40LHly9zcH1S0bN2HVFYk3a1eAyHQyjs3ZJYlXvIGtcCs5tko9Cw==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.56.0.tgz",
+      "integrity": "sha512-LhN/Reh+7F3RCgQIRbgw8ZMwUwyqJM+8pXNT6IIJAqm2IdKkzpCh/V9EdgOMBKuebIrzswqy4ATlrDgiOwbRcQ==",
       "cpu": [
         "arm64"
       ],
@@ -1098,9 +1147,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.52.5.tgz",
-      "integrity": "sha512-w0cDWVR6MlTstla1cIfOGyl8+qb93FlAVutcor14Gf5Md5ap5ySfQ7R9S/NjNaMLSFdUnKGEasmVnu3lCMqB7w==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.56.0.tgz",
+      "integrity": "sha512-kbFsOObXp3LBULg1d3JIUQMa9Kv4UitDmpS+k0tinPBz3watcUiV2/LUDMMucA6pZO3WGE27P7DsfaN54l9ing==",
       "cpu": [
         "arm64"
       ],
@@ -1112,9 +1161,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.52.5.tgz",
-      "integrity": "sha512-Aufdpzp7DpOTULJCuvzqcItSGDH73pF3ko/f+ckJhxQyHtp67rHw3HMNxoIdDMUITJESNE6a8uh4Lo4SLouOUg==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.56.0.tgz",
+      "integrity": "sha512-vSSgny54D6P4vf2izbtFm/TcWYedw7f8eBrOiGGecyHyQB9q4Kqentjaj8hToe+995nob/Wv48pDqL5a62EWtg==",
       "cpu": [
         "ia32"
       ],
@@ -1126,9 +1175,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-gnu": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.52.5.tgz",
-      "integrity": "sha512-UGBUGPFp1vkj6p8wCRraqNhqwX/4kNQPS57BCFc8wYh0g94iVIW33wJtQAx3G7vrjjNtRaxiMUylM0ktp/TRSQ==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.56.0.tgz",
+      "integrity": "sha512-FeCnkPCTHQJFbiGG49KjV5YGW/8b9rrXAM2Mz2kiIoktq2qsJxRD5giEMEOD2lPdgs72upzefaUvS+nc8E3UzQ==",
       "cpu": [
         "x64"
       ],
@@ -1140,9 +1189,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.52.5.tgz",
-      "integrity": "sha512-TAcgQh2sSkykPRWLrdyy2AiceMckNf5loITqXxFI5VuQjS5tSuw3WlwdN8qv8vzjLAUTvYaH/mVjSFpbkFbpTg==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.56.0.tgz",
+      "integrity": "sha512-H8AE9Ur/t0+1VXujj90w0HrSOuv0Nq9r1vSZF2t5km20NTfosQsGGUXDaKdQZzwuLts7IyL1fYT4hM95TI9c4g==",
       "cpu": [
         "x64"
       ],
@@ -1184,67 +1233,70 @@
       "license": "ISC"
     },
     "node_modules/@vitejs/plugin-vue": {
-      "version": "5.2.4",
-      "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-5.2.4.tgz",
-      "integrity": "sha512-7Yx/SXSOcQq5HiiV3orevHUFn+pmMB4cgbEkDYgnkUWb0WfeQ/wa2yFv6D5ICiCQOVpjA7vYDXrC7AGO8yjDHA==",
+      "version": "6.0.3",
+      "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-6.0.3.tgz",
+      "integrity": "sha512-TlGPkLFLVOY3T7fZrwdvKpjprR3s4fxRln0ORDo1VQ7HHyxJwTlrjKU3kpVWTlaAjIEuCTokmjkZnr8Tpc925w==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "@rolldown/pluginutils": "1.0.0-beta.53"
+      },
       "engines": {
-        "node": "^18.0.0 || >=20.0.0"
+        "node": "^20.19.0 || >=22.12.0"
       },
       "peerDependencies": {
-        "vite": "^5.0.0 || ^6.0.0",
+        "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0",
         "vue": "^3.2.25"
       }
     },
     "node_modules/@vue/compiler-core": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.5.22.tgz",
-      "integrity": "sha512-jQ0pFPmZwTEiRNSb+i9Ow/I/cHv2tXYqsnHKKyCQ08irI2kdF5qmYedmF8si8mA7zepUFmJ2hqzS8CQmNOWOkQ==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.5.27.tgz",
+      "integrity": "sha512-gnSBQjZA+//qDZen+6a2EdHqJ68Z7uybrMf3SPjEGgG4dicklwDVmMC1AeIHxtLVPT7sn6sH1KOO+tS6gwOUeQ==",
       "license": "MIT",
       "dependencies": {
-        "@babel/parser": "^7.28.4",
-        "@vue/shared": "3.5.22",
-        "entities": "^4.5.0",
+        "@babel/parser": "^7.28.5",
+        "@vue/shared": "3.5.27",
+        "entities": "^7.0.0",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.2.1"
       }
     },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.5.22.tgz",
-      "integrity": "sha512-W8RknzUM1BLkypvdz10OVsGxnMAuSIZs9Wdx1vzA3mL5fNMN15rhrSCLiTm6blWeACwUwizzPVqGJgOGBEN/hA==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.5.27.tgz",
+      "integrity": "sha512-oAFea8dZgCtVVVTEC7fv3T5CbZW9BxpFzGGxC79xakTr6ooeEqmRuvQydIiDAkglZEAd09LgVf1RoDnL54fu5w==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-core": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/compiler-core": "3.5.27",
+        "@vue/shared": "3.5.27"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.5.22.tgz",
-      "integrity": "sha512-tbTR1zKGce4Lj+JLzFXDq36K4vcSZbJ1RBu8FxcDv1IGRz//Dh2EBqksyGVypz3kXpshIfWKGOCcqpSbyGWRJQ==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.5.27.tgz",
+      "integrity": "sha512-sHZu9QyDPeDmN/MRoshhggVOWE5WlGFStKFwu8G52swATgSny27hJRWteKDSUUzUH+wp+bmeNbhJnEAel/auUQ==",
       "license": "MIT",
       "dependencies": {
-        "@babel/parser": "^7.28.4",
-        "@vue/compiler-core": "3.5.22",
-        "@vue/compiler-dom": "3.5.22",
-        "@vue/compiler-ssr": "3.5.22",
-        "@vue/shared": "3.5.22",
+        "@babel/parser": "^7.28.5",
+        "@vue/compiler-core": "3.5.27",
+        "@vue/compiler-dom": "3.5.27",
+        "@vue/compiler-ssr": "3.5.27",
+        "@vue/shared": "3.5.27",
         "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.19",
+        "magic-string": "^0.30.21",
         "postcss": "^8.5.6",
         "source-map-js": "^1.2.1"
       }
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.5.22.tgz",
-      "integrity": "sha512-GdgyLvg4R+7T8Nk2Mlighx7XGxq/fJf9jaVofc3IL0EPesTE86cP/8DD1lT3h1JeZr2ySBvyqKQJgbS54IX1Ww==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.5.27.tgz",
+      "integrity": "sha512-Sj7h+JHt512fV1cTxKlYhg7qxBvack+BGncSpH+8vnN+KN95iPIcqB5rsbblX40XorP+ilO7VIKlkuu3Xq2vjw==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-dom": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/compiler-dom": "3.5.27",
+        "@vue/shared": "3.5.27"
       }
     },
     "node_modules/@vue/devtools-api": {
@@ -1269,53 +1321,53 @@
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.5.22.tgz",
-      "integrity": "sha512-f2Wux4v/Z2pqc9+4SmgZC1p73Z53fyD90NFWXiX9AKVnVBEvLFOWCEgJD3GdGnlxPZt01PSlfmLqbLYzY/Fw4A==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.5.27.tgz",
+      "integrity": "sha512-vvorxn2KXfJ0nBEnj4GYshSgsyMNFnIQah/wczXlsNXt+ijhugmW+PpJ2cNPe4V6jpnBcs0MhCODKllWG+nvoQ==",
       "license": "MIT",
       "dependencies": {
-        "@vue/shared": "3.5.22"
+        "@vue/shared": "3.5.27"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.5.22.tgz",
-      "integrity": "sha512-EHo4W/eiYeAzRTN5PCextDUZ0dMs9I8mQ2Fy+OkzvRPUYQEyK9yAjbasrMCXbLNhF7P0OUyivLjIy0yc6VrLJQ==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.5.27.tgz",
+      "integrity": "sha512-fxVuX/fzgzeMPn/CLQecWeDIFNt3gQVhxM0rW02Tvp/YmZfXQgcTXlakq7IMutuZ/+Ogbn+K0oct9J3JZfyk3A==",
       "license": "MIT",
       "dependencies": {
-        "@vue/reactivity": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/reactivity": "3.5.27",
+        "@vue/shared": "3.5.27"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.5.22.tgz",
-      "integrity": "sha512-Av60jsryAkI023PlN7LsqrfPvwfxOd2yAwtReCjeuugTJTkgrksYJJstg1e12qle0NarkfhfFu1ox2D+cQotww==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.5.27.tgz",
+      "integrity": "sha512-/QnLslQgYqSJ5aUmb5F0z0caZPGHRB8LEAQ1s81vHFM5CBfnun63rxhvE/scVb/j3TbBuoZwkJyiLCkBluMpeg==",
       "license": "MIT",
       "dependencies": {
-        "@vue/reactivity": "3.5.22",
-        "@vue/runtime-core": "3.5.22",
-        "@vue/shared": "3.5.22",
-        "csstype": "^3.1.3"
+        "@vue/reactivity": "3.5.27",
+        "@vue/runtime-core": "3.5.27",
+        "@vue/shared": "3.5.27",
+        "csstype": "^3.2.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.5.22.tgz",
-      "integrity": "sha512-gXjo+ao0oHYTSswF+a3KRHZ1WszxIqO7u6XwNHqcqb9JfyIL/pbWrrh/xLv7jeDqla9u+LK7yfZKHih1e1RKAQ==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.5.27.tgz",
+      "integrity": "sha512-qOz/5thjeP1vAFc4+BY3Nr6wxyLhpeQgAE/8dDtKo6a6xdk+L4W46HDZgNmLOBUDEkFXV3G7pRiUqxjX0/2zWA==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-ssr": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/compiler-ssr": "3.5.27",
+        "@vue/shared": "3.5.27"
       },
       "peerDependencies": {
-        "vue": "3.5.22"
+        "vue": "3.5.27"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.5.22.tgz",
-      "integrity": "sha512-F4yc6palwq3TT0u+FYf0Ns4Tfl9GRFURDN2gWG7L1ecIaS/4fCIuFOjMTnCyjsu/OK6vaDKLCrGAa+KvvH+h4w==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.5.27.tgz",
+      "integrity": "sha512-dXr/3CgqXsJkZ0n9F3I4elY8wM9jMJpP3pvRG52r6m0tu/MsAFIe6JpXVGeNMd/D9F4hQynWT8Rfuj0bdm9kFQ==",
       "license": "MIT"
     },
     "node_modules/@vueuse/core": {
@@ -1720,9 +1772,9 @@
       }
     },
     "node_modules/core-js": {
-      "version": "3.46.0",
-      "resolved": "https://registry.npmmirror.com/core-js/-/core-js-3.46.0.tgz",
-      "integrity": "sha512-vDMm9B0xnqqZ8uSBpZ8sNtRtOdmfShrvT6h2TuQGLs0Is+cR0DYbj/KWP6ALVNbWPpqA/qPLoOuppJN07humpA==",
+      "version": "3.48.0",
+      "resolved": "https://registry.npmmirror.com/core-js/-/core-js-3.48.0.tgz",
+      "integrity": "sha512-zpEHTy1fjTMZCKLHUZoVeylt9XrzaIN2rbPXEt0k+q7JE5CkCZdo6bNq55bn24a69CH7ErAVLKijxJja4fw+UQ==",
       "hasInstallScript": true,
       "license": "MIT",
       "funding": {
@@ -1759,9 +1811,9 @@
       }
     },
     "node_modules/csstype": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.1.3.tgz",
-      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+      "version": "3.2.3",
+      "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.2.3.tgz",
+      "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
       "license": "MIT"
     },
     "node_modules/dayjs": {
@@ -1854,9 +1906,9 @@
       }
     },
     "node_modules/entities": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmmirror.com/entities/-/entities-4.5.0.tgz",
-      "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+      "version": "7.0.1",
+      "resolved": "https://registry.npmmirror.com/entities/-/entities-7.0.1.tgz",
+      "integrity": "sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA==",
       "license": "BSD-2-Clause",
       "engines": {
         "node": ">=0.12"
@@ -2056,14 +2108,14 @@
       }
     },
     "node_modules/eslint-plugin-prettier": {
-      "version": "5.5.4",
-      "resolved": "https://registry.npmmirror.com/eslint-plugin-prettier/-/eslint-plugin-prettier-5.5.4.tgz",
-      "integrity": "sha512-swNtI95SToIz05YINMA6Ox5R057IMAmWZ26GqPxusAp1TZzj+IdY9tXNWWD3vkF/wEqydCONcwjTFpxybBqZsg==",
+      "version": "5.5.5",
+      "resolved": "https://registry.npmmirror.com/eslint-plugin-prettier/-/eslint-plugin-prettier-5.5.5.tgz",
+      "integrity": "sha512-hscXkbqUZ2sPithAuLm5MXL+Wph+U7wHngPBv9OMWwlP8iaflyxpjTYZkmdgB4/vPIhemRlBEoLrH7UC1n7aUw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "prettier-linter-helpers": "^1.0.0",
-        "synckit": "^0.11.7"
+        "prettier-linter-helpers": "^1.0.1",
+        "synckit": "^0.11.12"
       },
       "engines": {
         "node": "^14.18.0 || >=16.0.0"
@@ -2158,9 +2210,9 @@
       }
     },
     "node_modules/esquery": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmmirror.com/esquery/-/esquery-1.6.0.tgz",
-      "integrity": "sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==",
+      "version": "1.7.0",
+      "resolved": "https://registry.npmmirror.com/esquery/-/esquery-1.7.0.tgz",
+      "integrity": "sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -2210,9 +2262,9 @@
       }
     },
     "node_modules/exsolve": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmmirror.com/exsolve/-/exsolve-1.0.7.tgz",
-      "integrity": "sha512-VO5fQUzZtI6C+vx4w/4BWJpg3s/5l+6pRQEHzFRM8WFi4XffSP1Z+4qi7GbjWbvRQEbdIco5mIMq+zX4rPuLrw==",
+      "version": "1.0.8",
+      "resolved": "https://registry.npmmirror.com/exsolve/-/exsolve-1.0.8.tgz",
+      "integrity": "sha512-LmDxfWXwcTArk8fUEnOfSZpHOJ6zOMUJKOtFLFqJLoKJetuQG874Uc7/Kki7zFLzYybmZhp1M7+98pfMqeX8yA==",
       "dev": true,
       "license": "MIT"
     },
@@ -2275,9 +2327,9 @@
       "license": "MIT"
     },
     "node_modules/fastq": {
-      "version": "1.19.1",
-      "resolved": "https://registry.npmmirror.com/fastq/-/fastq-1.19.1.tgz",
-      "integrity": "sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==",
+      "version": "1.20.1",
+      "resolved": "https://registry.npmmirror.com/fastq/-/fastq-1.20.1.tgz",
+      "integrity": "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -2370,9 +2422,9 @@
       }
     },
     "node_modules/form-data": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmmirror.com/form-data/-/form-data-4.0.4.tgz",
-      "integrity": "sha512-KrGhL9Q4zjj0kiUt5OO4Mr/A/jlI2jDYs5eHBpYHPcBEVSiipAvn2Ko2HnPe20rmcuuvMHNdZFp+4IlGTMF0Ow==",
+      "version": "4.0.5",
+      "resolved": "https://registry.npmmirror.com/form-data/-/form-data-4.0.5.tgz",
+      "integrity": "sha512-8RipRLol37bNs2bhoV67fiTEvdTrbMUYcFTiy3+wuuOnUog2QBHCZWXDRijWQfAkhBj2Uf5UnVaiWwA5vdd82w==",
       "license": "MIT",
       "dependencies": {
         "asynckit": "^0.4.0",
@@ -2755,9 +2807,9 @@
       "license": "MIT"
     },
     "node_modules/js-yaml": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmmirror.com/js-yaml/-/js-yaml-4.1.0.tgz",
-      "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
+      "version": "4.1.1",
+      "resolved": "https://registry.npmmirror.com/js-yaml/-/js-yaml-4.1.1.tgz",
+      "integrity": "sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2808,9 +2860,10 @@
       }
     },
     "node_modules/less": {
-      "version": "4.4.2",
-      "resolved": "https://registry.npmmirror.com/less/-/less-4.4.2.tgz",
-      "integrity": "sha512-j1n1IuTX1VQjIy3tT7cyGbX7nvQOsFLoIqobZv4ttI5axP923gA44zUj6miiA6R5Aoms4sEGVIIcucXUbRI14g==",
+      "version": "4.5.1",
+      "resolved": "https://registry.npmmirror.com/less/-/less-4.5.1.tgz",
+      "integrity": "sha512-UKgI3/KON4u6ngSsnDADsUERqhZknsVZbnuzlRZXLQCmfC/MDld42fTydUE9B+Mla1AL6SJ/Pp6SlEFi/AVGfw==",
+      "hasInstallScript": true,
       "license": "Apache-2.0",
       "dependencies": {
         "copy-anything": "^2.0.1",
@@ -2882,15 +2935,15 @@
       }
     },
     "node_modules/lodash": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmmirror.com/lodash/-/lodash-4.17.21.tgz",
-      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
+      "version": "4.17.23",
+      "resolved": "https://registry.npmmirror.com/lodash/-/lodash-4.17.23.tgz",
+      "integrity": "sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==",
       "license": "MIT"
     },
     "node_modules/lodash-es": {
-      "version": "4.17.21",
-      "resolved": "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.21.tgz",
-      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
+      "version": "4.17.23",
+      "resolved": "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.23.tgz",
+      "integrity": "sha512-kVI48u3PZr38HdYz98UmfPnXl2DXrpdctLrFLCd3kOx1xUkOmpFPx7gCWWM5MPkL/fD8zb+Ph0QzjGFs4+hHWg==",
       "license": "MIT"
     },
     "node_modules/lodash.merge": {
@@ -3354,9 +3407,9 @@
       }
     },
     "node_modules/prettier": {
-      "version": "3.6.2",
-      "resolved": "https://registry.npmmirror.com/prettier/-/prettier-3.6.2.tgz",
-      "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==",
+      "version": "3.8.1",
+      "resolved": "https://registry.npmmirror.com/prettier/-/prettier-3.8.1.tgz",
+      "integrity": "sha512-UOnG6LftzbdaHZcKoPFtOcCKztrQ57WkHDeRD9t/PTQtmT0NHSeWWepj6pS0z/N7+08BHFDQVUrfmfMRcZwbMg==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -3370,9 +3423,9 @@
       }
     },
     "node_modules/prettier-linter-helpers": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmmirror.com/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz",
-      "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmmirror.com/prettier-linter-helpers/-/prettier-linter-helpers-1.0.1.tgz",
+      "integrity": "sha512-SxToR7P8Y2lWmv/kTzVLC1t/GDI2WGjMwNhLLE9qtH8Q13C+aEmuRlzDst4Up4s0Wc8sF2M+J57iB3cMLqftfg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3501,9 +3554,9 @@
       }
     },
     "node_modules/rollup": {
-      "version": "4.52.5",
-      "resolved": "https://registry.npmmirror.com/rollup/-/rollup-4.52.5.tgz",
-      "integrity": "sha512-3GuObel8h7Kqdjt0gxkEzaifHTqLVW56Y/bjN7PSQtkKr0w3V/QYSdt6QWYtd7A1xUtYQigtdUfgj1RvWVtorw==",
+      "version": "4.56.0",
+      "resolved": "https://registry.npmmirror.com/rollup/-/rollup-4.56.0.tgz",
+      "integrity": "sha512-9FwVqlgUHzbXtDg9RCMgodF3Ua4Na6Gau+Sdt9vyCN4RhHfVKX2DCHy3BjMLTDd47ITDhYAnTwGulWTblJSDLg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3517,28 +3570,31 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.52.5",
-        "@rollup/rollup-android-arm64": "4.52.5",
-        "@rollup/rollup-darwin-arm64": "4.52.5",
-        "@rollup/rollup-darwin-x64": "4.52.5",
-        "@rollup/rollup-freebsd-arm64": "4.52.5",
-        "@rollup/rollup-freebsd-x64": "4.52.5",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.52.5",
-        "@rollup/rollup-linux-arm-musleabihf": "4.52.5",
-        "@rollup/rollup-linux-arm64-gnu": "4.52.5",
-        "@rollup/rollup-linux-arm64-musl": "4.52.5",
-        "@rollup/rollup-linux-loong64-gnu": "4.52.5",
-        "@rollup/rollup-linux-ppc64-gnu": "4.52.5",
-        "@rollup/rollup-linux-riscv64-gnu": "4.52.5",
-        "@rollup/rollup-linux-riscv64-musl": "4.52.5",
-        "@rollup/rollup-linux-s390x-gnu": "4.52.5",
-        "@rollup/rollup-linux-x64-gnu": "4.52.5",
-        "@rollup/rollup-linux-x64-musl": "4.52.5",
-        "@rollup/rollup-openharmony-arm64": "4.52.5",
-        "@rollup/rollup-win32-arm64-msvc": "4.52.5",
-        "@rollup/rollup-win32-ia32-msvc": "4.52.5",
-        "@rollup/rollup-win32-x64-gnu": "4.52.5",
-        "@rollup/rollup-win32-x64-msvc": "4.52.5",
+        "@rollup/rollup-android-arm-eabi": "4.56.0",
+        "@rollup/rollup-android-arm64": "4.56.0",
+        "@rollup/rollup-darwin-arm64": "4.56.0",
+        "@rollup/rollup-darwin-x64": "4.56.0",
+        "@rollup/rollup-freebsd-arm64": "4.56.0",
+        "@rollup/rollup-freebsd-x64": "4.56.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.56.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.56.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.56.0",
+        "@rollup/rollup-linux-arm64-musl": "4.56.0",
+        "@rollup/rollup-linux-loong64-gnu": "4.56.0",
+        "@rollup/rollup-linux-loong64-musl": "4.56.0",
+        "@rollup/rollup-linux-ppc64-gnu": "4.56.0",
+        "@rollup/rollup-linux-ppc64-musl": "4.56.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.56.0",
+        "@rollup/rollup-linux-riscv64-musl": "4.56.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.56.0",
+        "@rollup/rollup-linux-x64-gnu": "4.56.0",
+        "@rollup/rollup-linux-x64-musl": "4.56.0",
+        "@rollup/rollup-openbsd-x64": "4.56.0",
+        "@rollup/rollup-openharmony-arm64": "4.56.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.56.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.56.0",
+        "@rollup/rollup-win32-x64-gnu": "4.56.0",
+        "@rollup/rollup-win32-x64-msvc": "4.56.0",
         "fsevents": "~2.3.2"
       }
     },
@@ -3574,11 +3630,14 @@
       "optional": true
     },
     "node_modules/sax": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmmirror.com/sax/-/sax-1.4.1.tgz",
-      "integrity": "sha512-+aWOz7yVScEGoKNd4PA10LZ8sk0A/z5+nXQG5giUO5rprX9jgYsTdov9qCchZiPIZezbZH+jRut8nPodFAX4Jg==",
-      "license": "ISC",
-      "optional": true
+      "version": "1.4.4",
+      "resolved": "https://registry.npmmirror.com/sax/-/sax-1.4.4.tgz",
+      "integrity": "sha512-1n3r/tGXO6b6VXMdFT54SHzT9ytu9yr7TaELowdYpMqY/Ao7EnlQGmAQ1+RatX7Tkkdm6hONI2owqNx2aZj5Sw==",
+      "license": "BlueOak-1.0.0",
+      "optional": true,
+      "engines": {
+        "node": ">=11.0.0"
+      }
     },
     "node_modules/scroll-into-view-if-needed": {
       "version": "2.2.31",
@@ -3707,9 +3766,9 @@
       }
     },
     "node_modules/synckit": {
-      "version": "0.11.11",
-      "resolved": "https://registry.npmmirror.com/synckit/-/synckit-0.11.11.tgz",
-      "integrity": "sha512-MeQTA1r0litLUf0Rp/iisCaL8761lKAZHaimlbGK4j0HysC4PLfqygQj9srcs0m2RdtDYnF8UuYyKpbjHYp7Jw==",
+      "version": "0.11.12",
+      "resolved": "https://registry.npmmirror.com/synckit/-/synckit-0.11.12.tgz",
+      "integrity": "sha512-Bh7QjT8/SuKUIfObSXNHNSK6WHo6J1tHCqJsuaFDP7gP0fkzSfTxI8y85JrppZ0h8l0maIgc2tfuZQ6/t3GtnQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3723,9 +3782,9 @@
       }
     },
     "node_modules/terser": {
-      "version": "5.44.1",
-      "resolved": "https://registry.npmmirror.com/terser/-/terser-5.44.1.tgz",
-      "integrity": "sha512-t/R3R/n0MSwnnazuPpPNVO60LX0SKL45pyl9YlvxIdkH0Of7D5qM2EVe+yASRIlY5pZ73nclYJfNANGWPwFDZw==",
+      "version": "5.46.0",
+      "resolved": "https://registry.npmmirror.com/terser/-/terser-5.46.0.tgz",
+      "integrity": "sha512-jTwoImyr/QbOWFFso3YoU3ik0jBBDJ6JTOQiy/J2YxVJdZCc+5u7skhNwiOR3FQIygFqVUPHl7qbbxtjW2K3Qg==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -3851,16 +3910,16 @@
       }
     },
     "node_modules/ufo": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmmirror.com/ufo/-/ufo-1.6.1.tgz",
-      "integrity": "sha512-9a4/uxlTWJ4+a5i0ooc1rU7C7YOw3wT+UGqdeNNHWnOF9qcMBgLRS+4IYUqbczewFx4mLEig6gawh7X6mFlEkA==",
+      "version": "1.6.3",
+      "resolved": "https://registry.npmmirror.com/ufo/-/ufo-1.6.3.tgz",
+      "integrity": "sha512-yDJTmhydvl5lJzBmy/hyOAA0d+aqCBuwl818haVdYCRrWV84o7YyeVm4QlVHStqNrrJSTb6jKuFAVqAFsr+K3Q==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/unplugin": {
-      "version": "2.3.10",
-      "resolved": "https://registry.npmmirror.com/unplugin/-/unplugin-2.3.10.tgz",
-      "integrity": "sha512-6NCPkv1ClwH+/BGE9QeoTIl09nuiAt0gS28nn1PvYXsGKRwM2TCbFA2QiilmehPDTXIe684k4rZI1yl3A1PCUw==",
+      "version": "2.3.11",
+      "resolved": "https://registry.npmmirror.com/unplugin/-/unplugin-2.3.11.tgz",
+      "integrity": "sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3970,9 +4029,9 @@
       "license": "MIT"
     },
     "node_modules/vite": {
-      "version": "7.3.0",
-      "resolved": "https://registry.npmmirror.com/vite/-/vite-7.3.0.tgz",
-      "integrity": "sha512-dZwN5L1VlUBewiP6H9s2+B3e3Jg96D0vzN+Ry73sOefebhYr9f94wwkMNN/9ouoU8pV1BqA1d1zGk8928cx0rg==",
+      "version": "7.3.1",
+      "resolved": "https://registry.npmmirror.com/vite/-/vite-7.3.1.tgz",
+      "integrity": "sha512-w+N7Hifpc3gRjZ63vYBXA56dvvRlNWRczTdmCBBa+CotUzAPf5b7YMdMR/8CQoeYE5LX3W4wj6RYTgonm1b9DA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4101,16 +4160,16 @@
       }
     },
     "node_modules/vue": {
-      "version": "3.5.22",
-      "resolved": "https://registry.npmmirror.com/vue/-/vue-3.5.22.tgz",
-      "integrity": "sha512-toaZjQ3a/G/mYaLSbV+QsQhIdMo9x5rrqIpYRObsJ6T/J+RyCSFwN2LHNVH9v8uIcljDNa3QzPVdv3Y6b9hAJQ==",
+      "version": "3.5.27",
+      "resolved": "https://registry.npmmirror.com/vue/-/vue-3.5.27.tgz",
+      "integrity": "sha512-aJ/UtoEyFySPBGarREmN4z6qNKpbEguYHMmXSiOGk69czc+zhs0NF6tEFrY8TZKAl8N/LYAkd4JHVd5E/AsSmw==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-dom": "3.5.22",
-        "@vue/compiler-sfc": "3.5.22",
-        "@vue/runtime-dom": "3.5.22",
-        "@vue/server-renderer": "3.5.22",
-        "@vue/shared": "3.5.22"
+        "@vue/compiler-dom": "3.5.27",
+        "@vue/compiler-sfc": "3.5.27",
+        "@vue/runtime-dom": "3.5.27",
+        "@vue/server-renderer": "3.5.27",
+        "@vue/shared": "3.5.27"
       },
       "peerDependencies": {
         "typescript": "*"
@@ -4192,13 +4251,13 @@
       }
     },
     "node_modules/vue-i18n": {
-      "version": "9.14.5",
-      "resolved": "https://registry.npmmirror.com/vue-i18n/-/vue-i18n-9.14.5.tgz",
-      "integrity": "sha512-0jQ9Em3ymWngyiIkj0+c/k7WgaPO+TNzjKSNq9BvBQaKJECqn9cd9fL4tkDhB5G1QBskGl9YxxbDAhgbFtpe2g==",
+      "version": "9.14.4",
+      "resolved": "https://registry.npmmirror.com/vue-i18n/-/vue-i18n-9.14.4.tgz",
+      "integrity": "sha512-B934C8yUyWLT0EMud3DySrwSUJI7ZNiWYsEEz2gknTthqKiG4dzWE/WSa8AzCuSQzwBEv4HtG1jZDhgzPfWSKQ==",
       "license": "MIT",
       "dependencies": {
-        "@intlify/core-base": "9.14.5",
-        "@intlify/shared": "9.14.5",
+        "@intlify/core-base": "9.14.4",
+        "@intlify/shared": "9.14.4",
         "@vue/devtools-api": "^6.5.0"
       },
       "engines": {
@@ -4212,9 +4271,9 @@
       }
     },
     "node_modules/vue-router": {
-      "version": "4.6.3",
-      "resolved": "https://registry.npmmirror.com/vue-router/-/vue-router-4.6.3.tgz",
-      "integrity": "sha512-ARBedLm9YlbvQomnmq91Os7ck6efydTSpRP3nuOKCvgJOHNrhRoJDSKtee8kcL1Vf7nz6U+PMBL+hTvR3bTVQg==",
+      "version": "4.6.4",
+      "resolved": "https://registry.npmmirror.com/vue-router/-/vue-router-4.6.4.tgz",
+      "integrity": "sha512-Hz9q5sa33Yhduglwz6g9skT8OBPii+4bFn88w6J+J4MfEo4KRRpmiNG/hHHkdbRFlLBOqxN8y8gf2Fb0MTUgVg==",
       "license": "MIT",
       "dependencies": {
         "@vue/devtools-api": "^6.6.4"
diff --git a/package.json b/package.json
index 0ede051..1af3b10 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "topsky-hotel-management-system-vue3",
   "private": true,
-  "version": "0.0.0",
+  "version": "1.0.0",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -30,7 +30,7 @@
   },
   "devDependencies": {
     "@ant-design/icons-vue": "^7.0.1",
-    "@vitejs/plugin-vue": "^5.2.1",
+    "@vitejs/plugin-vue": "^6.0.3",
     "@vue/eslint-config-prettier": "^9.0.0",
     "eslint": "^8.57.0",
     "eslint-plugin-vue": "^9.26.0",
-- 
Gitee


From fc47fd0d2572e1617606828bf4239e8f8a8ad5ee Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sat, 31 Jan 2026 15:58:51 +0800
Subject: [PATCH 05/10] add bulk action data for views.

---
 src/filters/supervision.filter.config.js      |  40 ++
 src/i18n.js                                   |   4 +
 src/views/base/DepartmentView.vue             |  92 +++-
 src/views/base/NationView.vue                 |  39 +-
 src/views/base/NoticeTypeView.vue             |  39 +-
 src/views/base/PassportView.vue               |  39 +-
 src/views/base/PositionView.vue               |  63 ++-
 src/views/base/PromotionContentView.vue       |  41 +-
 src/views/base/QualificationView.vue          |  40 +-
 .../customermanagement/CustomerSpendView.vue  | 171 +++++++-
 .../customermanagement/CustomerTypeView.vue   | 297 +++++++++++--
 src/views/customermanagement/CustomerView.vue | 342 ++++++++++++---
 src/views/customermanagement/VipLevelView.vue | 265 ++++++++++--
 src/views/finance/InternalFinanceView.vue     | 402 +++++++++++-------
 .../HydroelectricityInfoView.vue              | 239 +++++++++--
 src/views/supervision/SupervisionView.vue     | 394 +++++++++++++++--
 16 files changed, 2125 insertions(+), 382 deletions(-)
 create mode 100644 src/filters/supervision.filter.config.js

diff --git a/src/filters/supervision.filter.config.js b/src/filters/supervision.filter.config.js
new file mode 100644
index 0000000..da0e923
--- /dev/null
+++ b/src/filters/supervision.filter.config.js
@@ -0,0 +1,40 @@
+import { SupervisionFields } from "@/entities/supervision.entity";
+
+export const getSupervisionFilterConfig = (t, departmentOptions) => {
+  return {
+    title: t("message.supervisionFilter"),
+    fields: [
+      {
+        name: SupervisionFields.CHECK_NO,
+        type: "text",
+        label: t("message.checkNo"),
+        placeholder: t("message.pleaseInputCheckNo"),
+      },
+      {
+        name: SupervisionFields.CHECK_CLUB,
+        type: "select",
+        label: t("message.checkDepartment"),
+        placeholder: t("message.pleaseSelect"),
+        options: departmentOptions,
+      },
+      {
+        name: SupervisionFields.CHECK_PROGRES,
+        type: "text",
+        label: t("message.checkProgres"),
+        placeholder: t("message.pleaseInputCheckProgres"),
+      },
+      {
+        name: SupervisionFields.CHECK_PERSON,
+        type: "text",
+        label: t("message.checkPerson"),
+        placeholder: t("message.pleaseInputCheckPerson"),
+      },
+      {
+        name: SupervisionFields.CHECK_ADVICE,
+        type: "text",
+        label: t("message.checkAdvice"),
+        placeholder: t("message.pleaseInputCheckAdvice"),
+      },
+    ],
+  };
+};
diff --git a/src/i18n.js b/src/i18n.js
index 82261e8..8c448bb 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -34,6 +34,7 @@ const messages = {
       changeAvatar: "Change Avatar",
       uploadFailed: "Upload Failed",
       avatarUpdateSuccess: "Avatar Update Success",
+      selectedRecordNotFound: "Selected record not found",
       uploadImageOnly: "Only image format is supported",
       imageSizeLimit: "Image size cannot exceed 1MB",
       loading: "Loading...",
@@ -260,6 +261,7 @@ const messages = {
       updateSupervisionInfo: "Edit SupervisionInfo",
       viewSupervisionInfo: "View SupervisionInfo",
       deleteSupervisionInfo: "Delete SupervisionInfo",
+      pleaseInputCheckNo: "Please input SupervisionInfo Check No",
       pleaseInputCheckDepartment:
         "Please input SupervisionInfo Check Department",
       pleaseInputCheckProgres: "Please input SupervisionInfo Check Progress",
@@ -696,6 +698,7 @@ const messages = {
       changeAvatar: "更换头像",
       uploadFailed: "上传失败",
       avatarUpdateSuccess: "头像更新成功",
+      selectedRecordNotFound: "选中的记录未找到",
       uploadImageOnly: "仅支持图片格式",
       imageSizeLimit: "图片大小不能超过 1MB",
       loading: "加载中...",
@@ -925,6 +928,7 @@ const messages = {
       updateSupervisionInfo: "编辑监管情况",
       viewSupervisionInfo: "查看监管情况",
       deleteSupervisionInfo: "删除监管情况",
+      pleaseInputCheckNo: "请输入本次监管情况编号",
       pleaseInputCheckDepartment: "请输入本次受监管部门",
       pleaseInputCheckProgres: "请输入本次监管进度",
       pleaseInputCheckCash: "请输入本次监管损失",
diff --git a/src/views/base/DepartmentView.vue b/src/views/base/DepartmentView.vue
index 7d9919d..f5e8e0a 100644
--- a/src/views/base/DepartmentView.vue
+++ b/src/views/base/DepartmentView.vue
@@ -64,6 +64,7 @@
       :loading="loading"
       :pagination="pagination"
       :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
@@ -85,19 +86,19 @@
           >
             <EyeOutlined style="font-size: 16px" />
           </a-button>
-        </template>
-        <template v-else-if="column.key === 'operation'">
           <template v-if="record[DepartmentFields.IS_DELETED] == 1">
             <a-popconfirm
               :title="t('message.areYouSureToRestoreRecord')"
               @confirm="restoreDepartment(record)"
             >
               <a-button
-                v-perm="DepartmentPermissions.UPDATE"
-                type="default"
+                v-perm="DepartmentFields.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
                 style="color: green"
               >
-                <UndoOutlined /> {{ $t("message.restore") || "Restore" }}
+                <UndoOutlined style="font-size: 16px" />
               </a-button>
             </a-popconfirm>
           </template>
@@ -257,6 +258,33 @@ const rowSelection = computed(() => ({
   }),
 }));
 
+const selectRow = (record) => {
+  const recordId = record[DepartmentFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = departments.value.filter(
+    (item) => item[DepartmentFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[DepartmentFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
 // 处理单行选择变化
 const handleSelectChange = (record, e) => {
   const checked = e.target.checked;
@@ -292,8 +320,15 @@ const handleView = (record) => {
 
 // 编辑选中的单条记录
 const handleEdit = () => {
-  if (selectedRows.value.length === 1) {
-    editDepartment(selectedRows.value[0]);
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = departments.value.find(
+      (dept) => dept[DepartmentFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editDepartment(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
   }
 };
 
@@ -339,9 +374,14 @@ const columns = computed(() => {
 
 const buildServerParamsFromFilters = () => {
   let params = {};
-  const fields = departmentFilterConfig.value?.fields || [];
-  fields.forEach((f) => {
-    const val = filterValues[f.name];
+  // 包含动态添加的字段，使用 effectiveConfig 而不是原始配置
+  const allFieldKeys = [
+    ...departmentFilterConfig.value?.fields.map((f) => f.name),
+    DepartmentFields.IS_DELETED, // 确保包含 IsDelete 字段
+  ];
+
+  allFieldKeys.forEach((fieldName) => {
+    const val = filterValues[fieldName];
     if (
       val === null ||
       val === undefined ||
@@ -350,29 +390,43 @@ const buildServerParamsFromFilters = () => {
     ) {
       return;
     }
-    switch (f.type) {
+
+    // 对于动态字段，直接赋值
+    if (fieldName === DepartmentFields.IS_DELETED) {
+      params[fieldName] = val;
+      return;
+    }
+
+    // 对于配置中的字段，按类型处理
+    const fieldConfig = departmentFilterConfig.value?.fields.find(
+      (f) => f.name === fieldName,
+    );
+    if (!fieldConfig) return;
+
+    switch (fieldConfig.type) {
       case "text":
-        params[f.name] = val.toString().trim();
+        params[fieldName] = val.toString().trim();
         break;
       case "number":
       case "select":
       case "boolean":
-        params[f.name] = val;
+        params[fieldName] = val;
         break;
       case "date":
-        params[f.name] = dayjs(val).format("YYYY-MM-DD");
+        params[fieldName] = dayjs(val).format("YYYY-MM-DD");
         break;
       case "date-range":
         if (Array.isArray(val) && val.length === 2) {
           const [start, end] = val;
-          params[`${f.name}.Start`] = dayjs(start).format("YYYY-MM-DD");
-          params[`${f.name}.End`] = dayjs(end).format("YYYY-MM-DD");
+          params[`${fieldName}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${fieldName}.End`] = dayjs(end).format("YYYY-MM-DD");
         }
         break;
       default:
         break;
     }
   });
+
   return params;
 };
 
@@ -441,9 +495,7 @@ const fetchDepartmentData = async () => {
         [DepartmentFields.PARENT]: item[DepartmentFields.PARENT],
         [DepartmentFields.PARENTNAME]: item[DepartmentFields.PARENTNAME],
         [DepartmentFields.CREATIONDATE]: item[DepartmentFields.CREATIONDATE],
-        [DepartmentFields.IS_DELETED]:
-          item[DepartmentFields.IS_DELETED] ?? item.IsDelete ?? 0,
-        [DepartmentFields.VERSION]: item[DepartmentFields.VERSION],
+        [DepartmentFields.IS_DELETED]: item[DepartmentFields.IS_DELETED] ?? 0,
         [DepartmentFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
@@ -523,10 +575,10 @@ const editDepartment = (record) => {
   form[DepartmentFields.DESCRIPTION] = record[DepartmentFields.DESCRIPTION];
   form[DepartmentFields.LEADER] = record[DepartmentFields.LEADER];
   form[DepartmentFields.PARENT] = record[DepartmentFields.PARENT];
+  form[DepartmentFields.IS_DELETED] = record[DepartmentFields.IS_DELETED];
   form[DepartmentFields.CREATIONDATE] = record[DepartmentFields.CREATIONDATE]
     ? dayjs(record[DepartmentFields.CREATIONDATE])
     : null;
-  form[DepartmentFields.VERSION] = record[DepartmentFields.VERSION];
   form[DepartmentFields.MODIFYSTATUS] = "update";
 };
 
diff --git a/src/views/base/NationView.vue b/src/views/base/NationView.vue
index 7f7c09c..d20089a 100644
--- a/src/views/base/NationView.vue
+++ b/src/views/base/NationView.vue
@@ -65,6 +65,7 @@
       :loading="loading"
       :pagination="pagination"
       :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
@@ -194,6 +195,33 @@ const rowSelection = computed(() => ({
   }),
 }));
 
+const selectRow = (record) => {
+  const recordId = record[NationFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = nations.value.filter(
+    (item) => item[NationFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[NationFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
 // 处理单行选择变化
 const handleSelectChange = (record, e) => {
   const checked = e.target.checked;
@@ -229,8 +257,15 @@ const handleView = (record) => {
 
 // 编辑选中的单条记录
 const handleEdit = () => {
-  if (selectedRows.value.length === 1) {
-    editNation(selectedRows.value[0]);
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = nations.value.find(
+      (nation) => nation[NationFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editNation(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
   }
 };
 
diff --git a/src/views/base/NoticeTypeView.vue b/src/views/base/NoticeTypeView.vue
index d053292..c32b149 100644
--- a/src/views/base/NoticeTypeView.vue
+++ b/src/views/base/NoticeTypeView.vue
@@ -64,6 +64,7 @@
       :loading="loading"
       :pagination="pagination"
       :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
@@ -196,6 +197,33 @@ const rowSelection = computed(() => ({
   }),
 }));
 
+const selectRow = (record) => {
+  const recordId = record[NoticeTypeFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = notices.value.filter(
+    (item) => item[NoticeTypeFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[NoticeTypeFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
 // 处理单行选择变化
 const handleSelectChange = (record, e) => {
   const checked = e.target.checked;
@@ -231,8 +259,15 @@ const handleView = (record) => {
 
 // 编辑选中的单条记录
 const handleEdit = () => {
-  if (selectedRows.value.length === 1) {
-    editNoticeType(selectedRows.value[0]);
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = notices.value.find(
+      (noticeType) => noticeType[NoticeTypeFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editNoticeType(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
   }
 };
 
diff --git a/src/views/base/PassportView.vue b/src/views/base/PassportView.vue
index 2ed4cf6..d91c7ec 100644
--- a/src/views/base/PassportView.vue
+++ b/src/views/base/PassportView.vue
@@ -64,6 +64,7 @@
       :loading="loading"
       :pagination="pagination"
       :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
@@ -194,6 +195,33 @@ const rowSelection = computed(() => ({
   }),
 }));
 
+const selectRow = (record) => {
+  const recordId = record[PassportFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = passports.value.filter(
+    (item) => item[PassportFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[PassportFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
 // 处理单行选择变化
 const handleSelectChange = (record, e) => {
   const checked = e.target.checked;
@@ -229,8 +257,15 @@ const handleView = (record) => {
 
 // 编辑选中的单条记录
 const handleEdit = () => {
-  if (selectedRows.value.length === 1) {
-    editPassport(selectedRows.value[0]);
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = passports.value.find(
+      (passport) => passport[PassportFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editPassport(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
   }
 };
 
diff --git a/src/views/base/PositionView.vue b/src/views/base/PositionView.vue
index 9935852..9087afe 100644
--- a/src/views/base/PositionView.vue
+++ b/src/views/base/PositionView.vue
@@ -64,11 +64,18 @@
       :loading="loading"
       :pagination="pagination"
       :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
         <template v-if="column.key === 'action'">
           <a-button
             type="link"
@@ -187,6 +194,51 @@ const rowSelection = computed(() => ({
   }),
 }));
 
+const selectRow = (record) => {
+  const recordId = record[PositionFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = positions.value.filter(
+    (item) => item[PositionFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[PositionFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[PositionFields.ID])) {
+      selectedRowKeys.value.push(record[PositionFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[PositionFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
 // 清空选择
 const clearSelection = () => {
   selectedRowKeys.value = [];
@@ -201,8 +253,15 @@ const handleView = (record) => {
 
 // 编辑选中的单条记录
 const handleEdit = () => {
-  if (selectedRows.value.length === 1) {
-    editPosition(selectedRows.value[0]);
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = positions.value.find(
+      (position) => position[PositionFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editPosition(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
   }
 };
 
diff --git a/src/views/base/PromotionContentView.vue b/src/views/base/PromotionContentView.vue
index d51998c..fbc1357 100644
--- a/src/views/base/PromotionContentView.vue
+++ b/src/views/base/PromotionContentView.vue
@@ -64,6 +64,7 @@
       :loading="loading"
       :pagination="pagination"
       :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
@@ -208,6 +209,33 @@ const rowSelection = computed(() => ({
   }),
 }));
 
+const selectRow = (record) => {
+  const recordId = record[PromotionContentFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = promotionContents.value.filter(
+    (item) => item[PromotionContentFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[PromotionContentFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
 // 处理单行选择变化
 const handleSelectChange = (record, e) => {
   const checked = e.target.checked;
@@ -245,8 +273,17 @@ const handleView = (record) => {
 
 // 编辑选中的单条记录
 const handleEdit = () => {
-  if (selectedRows.value.length === 1) {
-    editPromotionContent(selectedRows.value[0]);
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = promotionContents.value.find(
+      (promotionContent) =>
+        promotionContent[PromotionContentFields.ID] ===
+        selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editPromotionContent(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
   }
 };
 
diff --git a/src/views/base/QualificationView.vue b/src/views/base/QualificationView.vue
index 7ad7b05..a48b30a 100644
--- a/src/views/base/QualificationView.vue
+++ b/src/views/base/QualificationView.vue
@@ -64,6 +64,7 @@
       :loading="loading"
       :pagination="pagination"
       :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
@@ -201,6 +202,33 @@ const rowSelection = computed(() => ({
   }),
 }));
 
+const selectRow = (record) => {
+  const recordId = record[EducationFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = qualifications.value.filter(
+    (item) => item[EducationFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[EducationFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
 // 处理单行选择变化
 const handleSelectChange = (record, e) => {
   const checked = e.target.checked;
@@ -236,8 +264,16 @@ const handleView = (record) => {
 
 // 编辑选中的单条记录
 const handleEdit = () => {
-  if (selectedRows.value.length === 1) {
-    editQualification(selectedRows.value[0]);
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = qualifications.value.find(
+      (qualification) =>
+        qualification[EducationFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editQualification(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
   }
 };
 
diff --git a/src/views/customermanagement/CustomerSpendView.vue b/src/views/customermanagement/CustomerSpendView.vue
index e850f8b..b74e4ae 100644
--- a/src/views/customermanagement/CustomerSpendView.vue
+++ b/src/views/customermanagement/CustomerSpendView.vue
@@ -1,11 +1,19 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="CustomerSpendPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateSpend") }}
+      </a-button>
+    </div>
 
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
@@ -26,32 +34,43 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[SpendInfoFields.ID]"
       :columns="filteredColumns"
       :data-source="spends"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
+          <a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
+          >
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
           <template v-if="record[SpendInfoFields.IS_DELETED] == 1">
             <a-popconfirm
               :title="t('message.areYouSureToRestoreRecord')"
-              @confirm="restoreDepartment(record)"
+              @confirm="restoreSpendInfo(record)"
             >
-              <a-button v-perm="DepartmentPermissions.UPDATE" type="default">
+              <a-button v-perm="SpendInfoFields.UPDATE" type="default">
                 <UndoOutlined /> {{ $t("message.restore") || "Restore" }}
               </a-button>
             </a-popconfirm>
           </template>
-          <a-button
-            v-perm="CustomerSpendPermissions.UPDATE"
-            style="margin-right: -5px"
-            @click="editSpend(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
         </template>
         <template v-else-if="column.key === SpendInfoFields.STATE">
           <a-tag :color="getStateColor(record[SpendInfoFields.STATE])">
@@ -64,6 +83,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -153,6 +173,40 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewSpend')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="t('message.spendNumber')">
+          {{ selectedRecord?.[SpendInfoFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.roomNo')">
+          {{ selectedRecord?.[SpendInfoFields.ROOM_NO] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.customerNo')">
+          {{ selectedRecord?.[SpendInfoFields.CUSTO_NO] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.spendName')">
+          {{ selectedRecord?.[SpendInfoFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.spendAmount')">
+          {{ selectedRecord?.[SpendInfoFields.AMOUNT] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.spendPrice')">
+          {{ selectedRecord?.[SpendInfoFields.PRICE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.spendMoney')">
+          {{ selectedRecord?.[SpendInfoFields.MONEY] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.spendTime')">
+          {{ formatDateTime(selectedRecord?.[SpendInfoFields.TIME]) }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -169,7 +223,11 @@ import {
   getFormRules,
   StateColors,
 } from "@/entities/spendinfo.entity";
-import { showErrorNotification, showSuccessNotification } from "@/utils/index";
+import {
+  showErrorNotification,
+  showSuccessNotification,
+  formatDateTime,
+} from "@/utils/index";
 import { useI18n } from "vue-i18n";
 import { CustomerSpendPermissions } from "@/common/permissioncode";
 import dayjs from "dayjs";
@@ -183,11 +241,15 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const spends = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
 const sortedInfo = ref({ order: null, columnKey: null });
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 
 const form = reactive({ ...initialFormValues });
@@ -205,8 +267,6 @@ const spendTimeLabel = computed(() => t("message.spendTime"));
 
 const spendInfoFilterConfig = computed(() => getSpendInfoFilterConfig(t));
 
-const columns = computed(() => getColumns(t));
-
 const filteredColumns = computed(() =>
   columns.value.filter((column) => !column.hidden),
 );
@@ -220,6 +280,80 @@ const pagination = reactive({
   showTotal: (total) => t("message.totalRecords", { total }),
 });
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[SpendInfoFields.IS_DELETED] == 1,
+  }),
+}));
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[SpendInfoFields.ID])) {
+      selectedRowKeys.value.push(record[SpendInfoFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[SpendInfoFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  spends.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = spends.value.find(
+      (spend) => spend[SpendInfoFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editSpend(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const buildServerParamsFromFilters = () => {
   const params = {};
   const fields = spendInfoFilterConfig.value?.fields || [];
@@ -308,6 +442,7 @@ const fetchSpendInfoData = async () => {
         [SpendInfoFields.TIME]: item[SpendInfoFields.TIME],
         [SpendInfoFields.STATE]: item[SpendInfoFields.STATE],
         [SpendInfoFields.STATE_NAME]: item[SpendInfoFields.STATE_NAME],
+        [SpendInfoFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -323,6 +458,7 @@ onMounted(() => {
 });
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchSpendInfoData();
 };
 
@@ -357,6 +493,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchSpendInfoData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
diff --git a/src/views/customermanagement/CustomerTypeView.vue b/src/views/customermanagement/CustomerTypeView.vue
index 21e7661..d9b5ab7 100644
--- a/src/views/customermanagement/CustomerTypeView.vue
+++ b/src/views/customermanagement/CustomerTypeView.vue
@@ -1,17 +1,43 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <div class="operation-bar">
-      <a-button style="margin-right: 12px" @click="refreshData">
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
         <SyncOutlined /> {{ $t("message.refreshData") }}
       </a-button>
       <a-button
         v-perm="CustomerTypePermissions.CREATE"
         type="primary"
+        style="margin-right: 15px"
         @click="showModal"
       >
         <PlusOutlined /> {{ $t("message.insertCustomerType") }}
       </a-button>
+      <a-button
+        v-perm="CustomerTypePermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateCustomerType") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="CustomerTypePermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteCustomerType") }}
+        </a-button>
+      </a-popconfirm>
     </div>
 
     <a-collapse style="margin-bottom: 15px">
@@ -33,31 +59,50 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[CustomerTypeFields.ID]"
       :columns="columns"
       :data-source="customerTypes"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       :handle-sorter-change="handleSorterChange"
       @change="handleTableChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="CustomerTypePermissions.UPDATE"
-            style="margin-right: 12px"
-            @click="editCustomerType(record)"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <EditOutlined /> {{ $t("message.edit") }}
+            <EyeOutlined style="font-size: 16px" />
           </a-button>
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="CustomerTypePermissions.DELETE" danger>
-              <DeleteOutlined /> {{ $t("message.delete") }}
-            </a-button>
-          </a-popconfirm>
+          <template v-if="record[CustomerTypeFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreCustomerType(record)"
+            >
+              <a-button
+                v-perm="CustomerTypePermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -65,6 +110,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -85,7 +131,7 @@
         >
           <a-input
             v-model:value="form[CustomerTypeFields.NAME]"
-            :placeholder="t('message.pleaseInputCustomerTypeNo')"
+            :placeholder="t('message.pleaseInputCustomerTypeName')"
           />
         </a-form-item>
         <a-form-item
@@ -103,6 +149,25 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewCustomerType')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="t('message.customerTypeNo')">
+          {{ selectedRecord?.[CustomerTypeFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.customerTypeName')">
+          {{ selectedRecord?.[CustomerTypeFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.customerTypeDiscount')">
+          {{ selectedRecord?.[CustomerTypeFields.DISCOUNT] }}%
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -134,10 +199,14 @@ const route = useRoute();
 const loading = ref(false);
 const customerTypes = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 
 const form = reactive({ ...initialFormValues });
@@ -152,38 +221,195 @@ const pagination = reactive({
 });
 
 const translatedPageTitle = computed(() => t(getPageTitle(route.path)));
-const columns = computed(() => getColumns(t));
 const rules = getFormRules(t);
 
 const customerTypeFilterConfig = computed(() => getCustomerTypeFilterConfig(t));
 
-const handleFilterSearch = (values) => {
-  Object.keys(currentFilterParams).forEach(
-    (k) => delete currentFilterParams[k],
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[CustomerTypeFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[CustomerTypeFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = customerTypes.value.filter(
+    (item) => item[CustomerTypeFields.ID] === recordId,
   );
-  Object.entries(values).forEach(([key, val]) => {
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[CustomerTypeFields.ID])) {
+      selectedRowKeys.value.push(record[CustomerTypeFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[CustomerTypeFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = customerTypes.value.find(
+      (customerType) =>
+        customerType[CustomerTypeFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editCustomerType(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteCustomerType(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchCustomerTypeData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
+const buildServerParamsFromFilters = () => {
+  let params = {};
+  const fields = internalfinanceFilterConfig.value?.fields || [];
+  fields.forEach((f) => {
+    const val = filterValues[f.name];
     if (
       val === null ||
       val === undefined ||
-      (Array.isArray(val) && val.length === 0) ||
-      (typeof val === "string" && val.trim() === "")
+      (typeof val === "string" && val.trim() === "") ||
+      (Array.isArray(val) && val.length === 0)
     ) {
       return;
     }
-    currentFilterParams[key] = val;
+    switch (f.type) {
+      case "text":
+        params[f.name] = val.toString().trim();
+        break;
+      case "number":
+      case "select":
+      case "boolean":
+        params[f.name] = val;
+        break;
+      case "date":
+        params[f.name] = dayjs(val).format("YYYY-MM-DD");
+        break;
+      case "date-range":
+        if (Array.isArray(val) && val.length === 2) {
+          const [start, end] = val;
+          params[`${f.name}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${f.name}.End`] = dayjs(end).format("YYYY-MM-DD");
+        }
+        break;
+      default:
+        break;
+    }
   });
-  fetchCustomerTypeData();
+  return params;
 };
 
-const handleFilterReset = (vals) => {
+const handleFilterSearch = (values) => {
+  Object.assign(filterValues, values);
+  const built = buildServerParamsFromFilters();
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
   );
+  Object.assign(currentFilterParams, built);
+  pagination.current = 1;
+  clearSelection(); // 重置选择
+  fetchCustomerTypeData();
+};
+
+const handleFilterReset = (vals) => {
   if (vals && typeof vals === "object") {
-    filterValues.value = { ...vals };
+    // filterValues is reactive
+    Object.keys(filterValues).forEach((k) => delete filterValues[k]);
+    Object.assign(filterValues, vals);
   } else {
-    filterValues.value = {};
+    Object.keys(filterValues).forEach((k) => (filterValues[k] = null));
   }
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  pagination.current = 1;
+  clearSelection(); // 重置选择
   fetchCustomerTypeData();
 };
 
@@ -202,6 +428,9 @@ const fetchCustomerTypeData = async () => {
         [CustomerTypeFields.NUMBER]: item[CustomerTypeFields.NUMBER],
         [CustomerTypeFields.NAME]: item[CustomerTypeFields.NAME],
         [CustomerTypeFields.DISCOUNT]: item[CustomerTypeFields.DISCOUNT],
+        [CustomerTypeFields.IS_DELETED]:
+          item[CustomerTypeFields.IS_DELETED] ?? 0,
+        [CustomerTypeFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -226,6 +455,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchCustomerTypeData();
 };
 
@@ -259,6 +489,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection();
     fetchCustomerTypeData();
   } catch (error) {
     showNotification(t("message.pleaseTryAgainLater"));
@@ -271,14 +502,14 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreCustomerType = async (record) => {
   try {
-    record[CustomerTypeFields.IS_DELETED] = 1;
-    var response = await deleteCustomerType(record);
+    record[CustomerTypeFields.IS_DELETED] = 0;
+    var response = await updateCustomerType(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(t("message.pleaseTryAgainLater"));
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchCustomerTypeData();
   } catch (error) {
diff --git a/src/views/customermanagement/CustomerView.vue b/src/views/customermanagement/CustomerView.vue
index e5a1c17..14bb76e 100644
--- a/src/views/customermanagement/CustomerView.vue
+++ b/src/views/customermanagement/CustomerView.vue
@@ -1,18 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="CustomerPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertCustomer") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="CustomerPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertCustomer") }}
+      </a-button>
+      <a-button
+        v-perm="CustomerPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateCustomer") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="CustomerPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteCustomer") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
 
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
@@ -33,37 +59,59 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[CustomerFields.ID]"
       :columns="filteredColumns"
       :data-source="customers"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="CustomerPermissions.ASSIGN_VIEW"
-            style="margin-right: 15px"
-            @click="goPermissionRelation(record)"
-            ><SafetyCertificateOutlined />
-            {{ $t("message.permissionAsscialion") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
           <a-button
-            v-perm="CustomerPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editCustomer(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="CustomerPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            v-perm="CustomerPermissions.ASSIGN_VIEW"
+            type="link"
+            size="small"
+            :title="$t('message.permissionAsscialion')"
+            style="padding: 0 4px"
+            @click="goPermissionRelation(record)"
+            ><SafetyCertificateOutlined style="font-size: 16px"
+          /></a-button>
+          <template v-if="record[CustomerFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreCustomer(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="CustomerFields.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
         <template v-if="column.key === CustomerFields.BIRTH_DATE">
           {{ formatDate(record[CustomerFields.BIRTH_DATE]) }}
@@ -74,6 +122,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -87,7 +136,7 @@
           <a-input v-model:value="form[CustomerFields.NAME]" />
         </a-form-item>
 
-        <a-form-item :label="customerSexLabel" :name="CustomerFields.GENDER">
+        <a-form-item :label="customerGenderLabel" :name="CustomerFields.GENDER">
           <a-radio-group v-model:value="form[CustomerFields.GENDER]">
             <a-radio-button :value="Gender.FEMALE">{{
               $t("message.female")
@@ -145,6 +194,47 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewDepartment')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="customerNoLabel">
+          {{ selectedRecord?.[CustomerFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="customerNameLabel">
+          {{ selectedRecord?.[CustomerFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="customerGenderLabel">
+          {{
+            selectedRecord?.[CustomerFields.GENDER] === Gender.FEMALE
+              ? t("message.female")
+              : t("message.male")
+          }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="t('message.customerBirthday')">
+          {{ formatDate(selectedRecord?.[CustomerFields.BIRTH_DATE]) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="customerTypeLabel">
+          {{ selectedRecord?.[CustomerFields.TYPE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="customerPassportTypeLabel">
+          {{ selectedRecord?.[CustomerFields.PASSPORTTYPE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="customerPassportIDLabel">
+          {{ selectedRecord?.[CustomerFields.ID_NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="customerTelLabel">
+          {{ selectedRecord?.[CustomerFields.PHONE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="customerAddressLabel">
+          {{ selectedRecord?.[CustomerFields.ADDRESS] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -198,6 +288,7 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const customers = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
@@ -205,6 +296,9 @@ const sortedInfo = ref({ order: null, columnKey: null });
 const customerTypeOptions = ref([]);
 const passportTypeOptions = ref([]);
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 
 const form = reactive({ ...initialFormValues });
@@ -213,7 +307,7 @@ const rules = getFormRules(t);
 
 const customerNoLabel = computed(() => t("message.customerNo"));
 const customerNameLabel = computed(() => t("message.customerName"));
-const customerSexLabel = computed(() => t("message.customerSex"));
+const customerGenderLabel = computed(() => t("message.customerSex"));
 const customerPassportTypeLabel = computed(() =>
   t("message.customerPassportType"),
 );
@@ -227,8 +321,6 @@ const customerFilterConfig = computed(() =>
   getCustomerFilterConfig(t, customerTypeOptions.value),
 );
 
-const columns = computed(() => getColumns(t));
-
 const filteredColumns = computed(() =>
   columns.value.filter((column) => !column.hidden),
 );
@@ -266,11 +358,142 @@ onBeforeUnmount(() => {
   queryAddress.cancel();
 });
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[CustomerFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[CustomerFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = customers.value.filter(
+    (item) => item[CustomerFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[CustomerFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[CustomerFields.ID])) {
+      selectedRowKeys.value.push(record[CustomerFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[CustomerFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  customers.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = customers.value.find(
+      (customer) => customer[CustomerFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editCustomer(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteCustomer(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchCustomerData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const buildServerParamsFromFilters = () => {
-  const params = {};
-  const fields = customerFilterConfig.value?.fields || [];
-  fields.forEach((f) => {
-    const val = filterValues[f.name];
+  let params = {};
+  // 包含动态添加的字段，使用 effectiveConfig 而不是原始配置
+  const allFieldKeys = [
+    ...customerFilterConfig.value?.fields.map((f) => f.name),
+    CustomerFields.IS_DELETED, // 确保包含 IsDelete 字段
+  ];
+
+  allFieldKeys.forEach((fieldName) => {
+    const val = filterValues[fieldName];
     if (
       val === null ||
       val === undefined ||
@@ -279,29 +502,43 @@ const buildServerParamsFromFilters = () => {
     ) {
       return;
     }
-    switch (f.type) {
+
+    // 对于动态字段，直接赋值
+    if (fieldName === CustomerFields.IS_DELETED) {
+      params[fieldName] = val;
+      return;
+    }
+
+    // 对于配置中的字段，按类型处理
+    const fieldConfig = customerFilterConfig.value?.fields.find(
+      (f) => f.name === fieldName,
+    );
+    if (!fieldConfig) return;
+
+    switch (fieldConfig.type) {
       case "text":
-        params[f.name] = val.toString().trim();
+        params[fieldName] = val.toString().trim();
         break;
       case "number":
       case "select":
       case "boolean":
-        params[f.name] = val;
+        params[fieldName] = val;
         break;
       case "date":
-        params[f.name] = dayjs(val).format("YYYY-MM-DD");
+        params[fieldName] = dayjs(val).format("YYYY-MM-DD");
         break;
       case "date-range":
         if (Array.isArray(val) && val.length === 2) {
           const [start, end] = val;
-          params[`${f.name}.Start`] = dayjs(start).format("YYYY-MM-DD");
-          params[`${f.name}.End`] = dayjs(end).format("YYYY-MM-DD");
+          params[`${fieldName}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${fieldName}.End`] = dayjs(end).format("YYYY-MM-DD");
         }
         break;
       default:
         break;
     }
   });
+
   return params;
 };
 
@@ -313,6 +550,7 @@ const handleFilterSearch = (values) => {
   );
   Object.assign(currentFilterParams, built);
   pagination.current = 1;
+  clearSelection();
   fetchCustomerData();
 };
 
@@ -325,6 +563,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection();
   fetchCustomerData();
 };
 
@@ -364,7 +603,8 @@ const fetchCustomerData = async () => {
         [CustomerFields.ID_NUMBER]: item[CustomerFields.ID_NUMBER],
         [CustomerFields.PHONE]: item[CustomerFields.PHONE],
         [CustomerFields.ADDRESS]: item[CustomerFields.ADDRESS],
-        [CustomerFields.IS_DELETED]: item[CustomerFields.IS_DELETE],
+        [CustomerFields.IS_DELETED]: item[CustomerFields.IS_DELETED],
+        [CustomerFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -425,6 +665,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchCustomerData();
 };
 
@@ -484,6 +725,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchCustomerData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -496,14 +738,14 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreCustomer = async (record) => {
   try {
-    record[CustomerFields.IS_DELETED] = 1;
-    var response = await deleteCustomer(record);
+    record[CustomerFields.IS_DELETED] = 0;
+    const response = await updateCustomer(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(t("message.pleaseTryAgainLater"));
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchCustomerData();
   } catch (error) {
diff --git a/src/views/customermanagement/VipLevelView.vue b/src/views/customermanagement/VipLevelView.vue
index 340c599..0fdc378 100644
--- a/src/views/customermanagement/VipLevelView.vue
+++ b/src/views/customermanagement/VipLevelView.vue
@@ -1,19 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="VipLevelPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertVipRule") }}</a-button
-    >
-
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="VipLevelPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertVipRule") }}
+      </a-button>
+      <a-button
+        v-perm="VipLevelPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateVipRule") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="VipLevelPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteVipRule") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -33,30 +58,50 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[VipRuleFields.ID]"
       :columns="filteredColumns"
       :data-source="viprules"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="VipLevelPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editVipRule(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <a-button v-perm="VipLevelPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[VipRuleFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreVipRule(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="VipRuleFields.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
         <template v-if="column.key === VipRuleFields.VALUE">
           {{ formatCurrency(record[VipRuleFields.VALUE]) }}
@@ -67,6 +112,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -113,6 +159,28 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewVipRule')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="vipruleIdLabel">
+          {{ selectedRecord?.[VipRuleFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="vipruleNameLabel">
+          {{ selectedRecord?.[VipRuleFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="vipruleValueLabel">
+          {{ formatCurrency(selectedRecord?.[VipRuleFields.VALUE]) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="vipruleCustomerTypeLabel">
+          {{ selectedRecord?.[VipRuleFields.CUSTOMER_TYPE_NAME] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -148,12 +216,16 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const viprules = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
 const sortedInfo = ref({ order: null, columnKey: null });
 const custoTypeOptions = ref([]);
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 
 const form = reactive({ ...initialFormValues });
@@ -167,8 +239,6 @@ const vipruleCustomerTypeLabel = computed(() =>
   t("message.vipRuleCustomerType"),
 );
 
-const columns = computed(() => getColumns(t));
-
 const filteredColumns = computed(() =>
   columns.value.filter((column) => !column.hidden),
 );
@@ -186,6 +256,132 @@ const pagination = reactive({
   showTotal: (total) => t("message.totalRecords", { total }),
 });
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[VipRuleFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[VipRuleFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = viprules.value.filter(
+    (item) => item[VipRuleFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[VipRuleFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[VipRuleFields.ID])) {
+      selectedRowKeys.value.push(record[VipRuleFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[VipRuleFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  viprules.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = viprules.value.find(
+      (rule) => rule[VipRuleFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editVipRule(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteVipRule(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchVipRuleData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -234,6 +430,8 @@ const fetchVipRuleData = async () => {
         [VipRuleFields.CUSTOMER_TYPE_ID]: item[VipRuleFields.CUSTOMER_TYPE_ID],
         [VipRuleFields.CUSTOMER_TYPE_NAME]:
           item[VipRuleFields.CUSTOMER_TYPE_NAME],
+        [VipRuleFields.IS_DELETED]: item[VipRuleFields.IS_DELETED] ?? 0,
+        [VipRuleFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -278,6 +476,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchVipRuleData();
 };
 
@@ -313,6 +512,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchVipRuleData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -325,14 +525,14 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreVipRule = async (record) => {
   try {
-    record[VipRuleFields.IS_DELETED] = 1;
-    var response = await deleteVipRule(record);
+    record[VipRuleFields.IS_DELETED] = 0;
+    const response = await updateVipRule(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(t("message.pleaseTryAgainLater"));
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchVipRuleData();
   } catch (error) {
@@ -343,6 +543,7 @@ const handleDelete = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchVipRuleData();
 };
 
diff --git a/src/views/finance/InternalFinanceView.vue b/src/views/finance/InternalFinanceView.vue
index f8604aa..3b39299 100644
--- a/src/views/finance/InternalFinanceView.vue
+++ b/src/views/finance/InternalFinanceView.vue
@@ -1,18 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="InternalFinancePermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertInternalFinance") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="InternalFinancePermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertInternalFinance") }}
+      </a-button>
+      <a-button
+        v-perm="InternalFinancePermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateInternalFinance") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="InternalFinancePermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteInternalFinance") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -31,16 +57,34 @@
       </a-collapse-panel>
     </a-collapse>
     <a-table
+      :row-key="(record) => record[InternalFinanceFields.ID]"
       :columns="filteredColumns"
-      :data-source="displayCashs"
+      :data-source="cashs"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
+          <a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
+          >
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
           <template v-if="record[InternalFinanceFields.IS_DELETED] == 1">
             <a-popconfirm
               :title="t('message.areYouSureToRestoreRecord')"
@@ -48,28 +92,15 @@
             >
               <a-button
                 v-perm="InternalFinancePermissions.UPDATE"
-                type="default"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
               >
-                <UndoOutlined /> {{ $t("message.restore") || "Restore" }}
+                <UndoOutlined style="font-size: 16px" />
               </a-button>
             </a-popconfirm>
           </template>
-          <template v-else>
-            <a-button
-              v-perm="InternalFinancePermissions.UPDATE"
-              style="margin-right: 15px"
-              @click="editInternalfinance(record)"
-              ><EditOutlined /> {{ $t("message.edit") }}</a-button
-            >
-            <a-popconfirm
-              :title="t('message.areYouSureToDeleteRecord')"
-              @confirm="handleDelete(record)"
-            >
-              <a-button v-perm="InternalFinancePermissions.DELETE" danger
-                ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
-              >
-            </a-popconfirm>
-          </template>
         </template>
         <template
           v-else-if="column.key === InternalFinanceFields.ACQUISITIONDATE"
@@ -82,6 +113,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -151,6 +183,36 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewInternalFinance')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="cashNoLabel">
+          {{ selectedRecord?.[InternalFinanceFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="cashNameLabel">
+          {{ selectedRecord?.[InternalFinanceFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="cashPriceLabel">
+          {{ selectedRecord?.[InternalFinanceFields.ASSETVALUE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="cashClubLabel">
+          {{ selectedRecord?.[InternalFinanceFields.DEPARTMENTNAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="cashTimeLabel">
+          {{
+            formatDate(selectedRecord?.[InternalFinanceFields.ACQUISITIONDATE])
+          }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="cashSourceLabel">
+          {{ selectedRecord?.[InternalFinanceFields.ASSETSOURCE] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -193,6 +255,7 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const cashs = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
@@ -208,6 +271,9 @@ const internalfinanceFilterConfig = computed(() =>
   ),
 );
 const filterValues = ref({ [InternalFinanceFields.IS_DELETED]: 0 });
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 
 const form = reactive({ ...initialFormValues });
@@ -222,8 +288,6 @@ const cashPriceLabel = computed(() => t("message.internalfinancePrice"));
 const cashSourceLabel = computed(() => t("message.internalfinanceSource"));
 const cashTimeLabel = computed(() => t("message.internalfinanceTime"));
 
-const columns = computed(() => getColumns(t));
-
 const filteredColumns = computed(() =>
   columns.value.filter((column) => !column.hidden),
 );
@@ -237,78 +301,141 @@ const pagination = reactive({
   showTotal: (total) => t("message.totalRecords", { total }),
 });
 
-// 本地过滤展示
-const displayCashs = computed(() => {
-  const items = cashs.value || [];
-  let fields = internalfinanceFilterConfig.value?.fields || [];
-  // 支持 ListFilter 通过 showIsDeleted 注入的 IsDelete 字段的本地过滤
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[InternalFinanceFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[InternalFinanceFields.ID];
+
   if (
-    filterValues[InternalFinanceFields.IS_DELETED] !== null &&
-    filterValues[InternalFinanceFields.IS_DELETED] !== undefined &&
-    !fields.some((f) => f.name === InternalFinanceFields.IS_DELETED)
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
   ) {
-    fields = fields.concat({
-      name: InternalFinanceFields.IS_DELETED,
-      type: "select",
-    });
+    return;
   }
-  const values = filterValues;
-
-  return items.filter((item) =>
-    fields.every((f) => {
-      const val = values[f.name];
-      if (
-        val === null ||
-        val === undefined ||
-        (Array.isArray(val) && val.length === 0) ||
-        (typeof val === "string" && val.trim() === "")
-      ) {
-        return true;
-      }
-      const itemValue = item[f.name];
 
-      if (typeof f.filterFn === "function") {
-        try {
-          return f.filterFn(val, itemValue, item);
-        } catch (e) {
-          return true;
-        }
-      }
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = cashs.value.filter(
+    (item) => item[InternalFinanceFields.ID] === recordId,
+  );
+};
 
-      switch (f.type) {
-        case "text": {
-          const iv = (itemValue ?? "").toString().toLowerCase();
-          const query = (val ?? "").toString().trim().toLowerCase();
-          return iv.includes(query);
-        }
-        case "number":
-          return Number(itemValue) === Number(val);
-        case "select":
-          return itemValue === val;
-        case "boolean":
-          return itemValue === val;
-        case "date":
-          return itemValue ? dayjs(itemValue).isSame(val, "day") : false;
-        case "date-range": {
-          if (!Array.isArray(val) || val.length !== 2) return true;
-          const [start, end] = val;
-          const d = itemValue ? dayjs(itemValue) : null;
-          if (!d) return false;
-          return d.isAfter(dayjs(start)) && d.isBefore(dayjs(end));
-        }
-        default:
-          return true;
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[InternalFinanceFields.IS_DELETED] === 1) {
+        return;
       }
-    }),
-  );
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[InternalFinanceFields.ID])) {
+      selectedRowKeys.value.push(record[InternalFinanceFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(
+      record[InternalFinanceFields.ID],
+    );
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = cashs.value.find(
+      (cash) => cash[InternalFinanceFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editInternalfinance(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteInternalFinance(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchInternalfinanceData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
 });
 
-// 将过滤表单值转换为接口查询参数
 const buildServerParamsFromFilters = () => {
-  const params = {};
-  const fields = internalfinanceFilterConfig.value?.fields || [];
-  fields.forEach((f) => {
-    const val = filterValues[f.name];
+  let params = {};
+  // 包含动态添加的字段，使用 effectiveConfig 而不是原始配置
+  const allFieldKeys = [
+    ...internalfinanceFilterConfig.value?.fields.map((f) => f.name),
+    InternalFinanceFields.IS_DELETED, // 确保包含 IsDelete 字段
+  ];
+
+  allFieldKeys.forEach((fieldName) => {
+    const val = filterValues[fieldName];
     if (
       val === null ||
       val === undefined ||
@@ -317,64 +444,43 @@ const buildServerParamsFromFilters = () => {
     ) {
       return;
     }
-    switch (f.type) {
+
+    // 对于动态字段，直接赋值
+    if (fieldName === InternalFinanceFields.IS_DELETED) {
+      params[fieldName] = val;
+      return;
+    }
+
+    // 对于配置中的字段，按类型处理
+    const fieldConfig = internalfinanceFilterConfig.value?.fields.find(
+      (f) => f.name === fieldName,
+    );
+    if (!fieldConfig) return;
+
+    switch (fieldConfig.type) {
       case "text":
-        params[f.name] = val.toString().trim();
+        params[fieldName] = val.toString().trim();
         break;
       case "number":
       case "select":
       case "boolean":
-        params[f.name] = val;
+        params[fieldName] = val;
         break;
       case "date":
-        params[f.name] = dayjs(val).format("YYYY-MM-DD");
+        params[fieldName] = dayjs(val).format("YYYY-MM-DD");
         break;
       case "date-range":
         if (Array.isArray(val) && val.length === 2) {
           const [start, end] = val;
-          params[`${f.name}Start`] = dayjs(start).format("YYYY-MM-DD");
-          params[`${f.name}End`] = dayjs(end).format("YYYY-MM-DD");
+          params[`${fieldName}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${fieldName}.End`] = dayjs(end).format("YYYY-MM-DD");
         }
         break;
       default:
         break;
     }
   });
-  // include any keys in filterValues that were not present in the config fields (eg: IsDelete added by ListFilter)
-  const configFieldNames = (
-    internalfinanceFilterConfig.value?.fields || []
-  ).map((f) => f.name);
-  Object.entries(filterValues).forEach(([k, v]) => {
-    if (
-      v === null ||
-      v === undefined ||
-      (Array.isArray(v) && v.length === 0) ||
-      (typeof v === "string" && v.trim() === "")
-    ) {
-      return;
-    }
-    if (!configFieldNames.includes(k)) {
-      if (Array.isArray(v) && v.length === 2) {
-        const [start, end] = v;
-        params[`${k}Start`] = dayjs(start).format("YYYY-MM-DD");
-        params[`${k}End`] = dayjs(end).format("YYYY-MM-DD");
-      } else if (typeof v === "boolean") {
-        params[k] = v ? 1 : 0;
-        if (
-          k.toLowerCase() === InternalFinanceFields.IS_DELETED.toLowerCase()
-        ) {
-          params[InternalFinanceFields.IS_DELETED] = params[k];
-        }
-      } else {
-        params[k] = v;
-        if (
-          k.toLowerCase() === InternalFinanceFields.IS_DELETED.toLowerCase()
-        ) {
-          params[InternalFinanceFields.IS_DELETED] = v;
-        }
-      }
-    }
-  });
+
   return params;
 };
 
@@ -410,6 +516,7 @@ const fetchInternalfinanceData = async () => {
           item[InternalFinanceFields.ACQUIREDBYEMPLOYEENAME],
         [InternalFinanceFields.IS_DELETED]:
           item[InternalFinanceFields.IS_DELETED] ?? 0,
+        [InternalFinanceFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -464,6 +571,7 @@ const handleFilterSearch = (vals) => {
   );
   Object.assign(currentFilterParams, built);
   pagination.current = 1;
+  clearSelection(); // 重置选择
   fetchInternalfinanceData();
 };
 
@@ -479,6 +587,7 @@ const handleFilterReset = (vals) => {
     (k) => delete currentFilterParams[k],
   );
   pagination.current = 1;
+  clearSelection(); // 重置选择
   fetchInternalfinanceData();
 };
 
@@ -500,6 +609,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchInternalfinanceData();
 };
 
@@ -544,6 +654,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection();
     fetchInternalfinanceData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -556,21 +667,6 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
-  try {
-    record[InternalFinanceFields.IS_DELETED] = 1;
-    var response = await deleteInternalFinance(record);
-    if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
-    } else {
-      showErrorNotification(t("message.pleaseTryAgainLater"));
-    }
-    fetchInternalfinanceData();
-  } catch (error) {
-    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
-  }
-};
-
 const restoreInternalfinance = async (record) => {
   try {
     record[InternalFinanceFields.IS_DELETED] = 0;
diff --git a/src/views/hydroelectricity/HydroelectricityInfoView.vue b/src/views/hydroelectricity/HydroelectricityInfoView.vue
index 5238ed9..28c59ac 100644
--- a/src/views/hydroelectricity/HydroelectricityInfoView.vue
+++ b/src/views/hydroelectricity/HydroelectricityInfoView.vue
@@ -1,11 +1,19 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="HydroelectricityPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateHydroelectricity") }}
+      </a-button>
+    </div>
 
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
@@ -26,30 +34,44 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[EnergyManagementFields.ID]"
       :columns="columns"
       :data-source="hydroelectricitys"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="HydroelectricityPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editHydroelectricity(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="HydroelectricityPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[EnergyManagementFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreEnergyManagement(record)"
             >
-          </a-popconfirm>
+              <a-button v-perm="EnergyManagementFields.UPDATE" type="default">
+                <UndoOutlined /> {{ $t("message.restore") || "Restore" }}
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
         <template v-else-if="column.key === EnergyManagementFields.STARTDATE">
           {{ formatDate(record[EnergyManagementFields.STARTDATE]) }}
@@ -63,6 +85,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -109,6 +132,37 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewHydroelectricityInfo')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="wtiNoLabel">
+          {{ selectedRecord?.[EnergyManagementFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roomNoLabel">
+          {{ selectedRecord?.[EnergyManagementFields.ROOMNUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="custoNoLabel">
+          {{ selectedRecord?.[EnergyManagementFields.CUSTOMERNUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="useDateLabel">
+          {{ formatDate(selectedRecord?.[EnergyManagementFields.STARTDATE]) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="endDateLabel">
+          {{ formatDate(selectedRecord?.[EnergyManagementFields.ENDDATE]) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="waterUseLabel">
+          {{ selectedRecord?.[EnergyManagementFields.WATERUSAGE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="powerUseLabel">
+          {{ selectedRecord?.[EnergyManagementFields.POWERUSAGE] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -145,11 +199,15 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const hydroelectricitys = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
 const sortedInfo = ref({ order: null, columnKey: null });
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 
 const form = reactive({ ...initialFormValues });
@@ -164,7 +222,20 @@ const endDateLabel = computed(() => t("message.endDate"));
 const waterUseLabel = computed(() => t("message.waterUse"));
 const powerUseLabel = computed(() => t("message.powerUse"));
 
-const columns = computed(() => getColumns(t));
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
 
 const energyManagementFilterConfig = computed(() =>
   getEnergyManagementFilterConfig(t),
@@ -179,6 +250,119 @@ const pagination = reactive({
   showTotal: (total) => t("message.totalRecords", { total }),
 });
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[EnergyManagementFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[EnergyManagementFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = hydroelectricitys.value.filter(
+    (item) => item[EnergyManagementFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[EnergyManagementFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[EnergyManagementFields.ID])) {
+      selectedRowKeys.value.push(record[EnergyManagementFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(
+      record[EnergyManagementFields.ID],
+    );
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  hydroelectricitys.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = hydroelectricitys.value.find(
+      (dept) => dept[EnergyManagementFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editHydroelectricity(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteHydroelectricity(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchHydroelectricityData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
 const handleFilterSearch = (vals) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -198,6 +382,7 @@ const handleFilterSearch = (vals) => {
       currentFilterParams[key] = val;
     }
   });
+  clearSelection(); // 重置选择
   fetchHydroelectricityData();
 };
 
@@ -210,6 +395,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection(); // 重置选择
   fetchHydroelectricityData();
 };
 
@@ -241,6 +427,7 @@ const fetchHydroelectricityData = async () => {
           item[EnergyManagementFields.RECORDER],
         [EnergyManagementFields.IS_DELETED]:
           item[EnergyManagementFields.IS_DELETED],
+        [EnergyManagementFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     } else {
@@ -313,6 +500,7 @@ const handleModalOk = async () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchHydroelectricityData();
 };
 
@@ -320,22 +508,25 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreEnergyManagement = async (record) => {
   try {
-    record[EnergyManagementFields.IS_DELETED] = 1;
-    var response = await deleteHydroelectricity(record);
-    if (response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+    record[EnergyManagementFields.IS_DELETED] = 0;
+    const response = await updateHydroelectricity(record);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchHydroelectricityData();
   } catch (error) {
-    showErrorNotification(t("message.pleaseTryAgainLater"));
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
   }
 };
 
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchHydroelectricityData();
 };
 
diff --git a/src/views/supervision/SupervisionView.vue b/src/views/supervision/SupervisionView.vue
index 608b076..8144516 100644
--- a/src/views/supervision/SupervisionView.vue
+++ b/src/views/supervision/SupervisionView.vue
@@ -1,46 +1,106 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><sync-outlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="SupervisionPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><plus-outlined /> {{ $t("message.insertSupervisionInfo") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="SupervisionPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertSupervisionInfo") }}
+      </a-button>
+      <a-button
+        v-perm="SupervisionPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateSupervisionInfo") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="SupervisionPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteSupervisionInfo") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
+    <a-collapse style="margin-bottom: 15px">
+      <a-collapse-panel key="1" :header="$t('message.filter')">
+        <template #expandIcon="{ isActive }">
+          <caret-right-outlined
+            :style="{ transform: isActive ? 'rotate(90deg)' : 'rotate(0deg)' }"
+          />
+        </template>
+        <ListFilter
+          v-model:values="filterValues"
+          :config="supervisionFilterConfig"
+          :show-is-deleted="true"
+          :is-deleted-default-value="0"
+          @search="handleFilterSearch"
+          @reset="handleFilterReset"
+        />
+      </a-collapse-panel>
+    </a-collapse>
     <a-table
+      :row-key="(record) => record[SupervisionFields.ID]"
       :columns="filteredColumns"
       :data-source="supervisioninfos"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="SupervisionPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editSupervisionInfo(record)"
-            ><edit-outlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <a-button v-perm="SupervisionPermissions.DELETE" danger
-              ><delete-outlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[SupervisionFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreSupervisionInfo(record)"
             >
-          </a-popconfirm>
-        </template>
-        <template v-else-if="column.key === SupervisionFields.DATA_INS_DATE">
-          {{ formatDate(record[SupervisionFields.DATA_INS_DATE]) }}
+              <a-button
+                v-perm="SupervisionPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green; padding: 0 4px"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -48,6 +108,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -102,6 +163,37 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewSupervisionInfo')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="checkNoLabel">
+          {{ selectedRecord?.[SupervisionFields.CHECK_NO] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="checkDepartmentLabel">
+          {{ selectedRecord?.[SupervisionFields.CHECK_CLUB_NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="checkProgresLabel">
+          {{ selectedRecord?.[SupervisionFields.CHECK_PROGRES] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="checkCashLabel">
+          {{ selectedRecord?.[SupervisionFields.CHECK_CASH] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="checkScoreLabel">
+          {{ selectedRecord?.[SupervisionFields.CHECK_SCORE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="checkPersonLabel">
+          {{ selectedRecord?.[SupervisionFields.CHECK_PERSON] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="checkAdviceLabel">
+          {{ selectedRecord?.[SupervisionFields.CHECK_ADVICE] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -128,6 +220,8 @@ import {
   showErrorNotification,
   showSuccessNotification,
 } from "@/utils/index";
+import ListFilter from "@/components/common/ListFilter.vue";
+import { getSupervisionFilterConfig } from "@/filters/supervision.filter.config";
 import { useI18n } from "vue-i18n";
 import generateSnowflakeId from "@/utils/snowflake";
 import { SupervisionPermissions } from "@/common/permissioncode";
@@ -139,9 +233,14 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const supervisioninfos = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
+const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const sortedInfo = ref({ order: null, columnKey: null });
 const departmentOptions = ref([]);
 
@@ -157,7 +256,220 @@ const checkScoreLabel = computed(() => t("message.checkScore"));
 const checkPersonLabel = computed(() => t("message.checkPerson"));
 const checkAdviceLabel = computed(() => t("message.checkAdvice"));
 
-const columns = computed(() => getColumns(t));
+const currentFilterParams = reactive({});
+const supervisionFilterConfig = computed(() =>
+  getSupervisionFilterConfig(t, departmentOptions.value),
+);
+
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[SupervisionFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[SupervisionFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = supervisioninfos.value.filter(
+    (item) => item[SupervisionFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[SupervisionFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[SupervisionFields.ID])) {
+      selectedRowKeys.value.push(record[SupervisionFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[SupervisionFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  supervisioninfos.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = supervisioninfos.value.find(
+      (sup) => sup[SupervisionFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editSupervisionInfo(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteSupervisionInfo(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchSupervisionInfoData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
+const buildServerParamsFromFilters = () => {
+  let params = {};
+  // 包含动态添加的字段，使用 effectiveConfig 而不是原始配置
+  const allFieldKeys = [
+    ...supervisionFilterConfig.value?.fields.map((f) => f.name),
+    SupervisionFields.IS_DELETED, // 确保包含 IsDelete 字段
+  ];
+
+  allFieldKeys.forEach((fieldName) => {
+    const val = filterValues[fieldName];
+    if (
+      val === null ||
+      val === undefined ||
+      (typeof val === "string" && val.trim() === "") ||
+      (Array.isArray(val) && val.length === 0)
+    ) {
+      return;
+    }
+
+    // 对于动态字段，直接赋值
+    if (fieldName === SupervisionFields.IS_DELETED) {
+      params[fieldName] = val;
+      return;
+    }
+
+    // 对于配置中的字段，按类型处理
+    const fieldConfig = supervisionFilterConfig.value?.fields.find(
+      (f) => f.name === fieldName,
+    );
+    if (!fieldConfig) return;
+
+    switch (fieldConfig.type) {
+      case "text":
+        params[fieldName] = val.toString().trim();
+        break;
+      case "number":
+      case "select":
+      case "boolean":
+        params[fieldName] = val;
+        break;
+      case "date":
+        params[fieldName] = dayjs(val).format("YYYY-MM-DD");
+        break;
+      case "date-range":
+        if (Array.isArray(val) && val.length === 2) {
+          const [start, end] = val;
+          params[`${fieldName}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${fieldName}.End`] = dayjs(end).format("YYYY-MM-DD");
+        }
+        break;
+      default:
+        break;
+    }
+  });
+
+  return params;
+};
+
+const handleFilterSearch = (vals) => {
+  Object.assign(filterValues, vals);
+  const built = buildServerParamsFromFilters();
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  Object.assign(currentFilterParams, built);
+  pagination.current = 1;
+  clearSelection(); // 重置选择
+  fetchSupervisionInfoData();
+};
+
+const handleFilterReset = (vals) => {
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  if (vals && typeof vals === "object") {
+    filterValues.value = { ...vals };
+  } else {
+    filterValues.value = {};
+  }
+  clearSelection(); // 重置选择
+  fetchSupervisionInfoData();
+};
+
 const filteredColumns = computed(() =>
   columns.value.filter((column) => !column.hidden),
 );
@@ -178,6 +490,7 @@ const fetchSupervisionInfoData = async () => {
       [SupervisionFields.PAGE]: pagination.current,
       [SupervisionFields.PAGE_SIZE]: pagination.pageSize,
       [SupervisionFields.IS_DELETED]: 0,
+      ...currentFilterParams,
     });
     if (result?.Items) {
       supervisioninfos.value = result.Items.map((item) => ({
@@ -192,12 +505,8 @@ const fetchSupervisionInfoData = async () => {
         [SupervisionFields.CHECK_SCORE]: item[SupervisionFields.CHECK_SCORE],
         [SupervisionFields.CHECK_PERSON]: item[SupervisionFields.CHECK_PERSON],
         [SupervisionFields.CHECK_ADVICE]: item[SupervisionFields.CHECK_ADVICE],
-        [SupervisionFields.DATA_INS_USR]: item[SupervisionFields.DATA_INS_USR],
-        [SupervisionFields.DATA_INS_DATE]:
-          item[SupervisionFields.DATA_INS_DATE],
-        [SupervisionFields.DATA_CHG_USR]: item[SupervisionFields.DATA_CHG_USR],
-        [SupervisionFields.DATA_CHG_DATE]:
-          item[SupervisionFields.DATA_CHG_DATE],
+        [SupervisionFields.IS_DELETED]: item[SupervisionFields.IS_DELETED] ?? 0,
+        [SupervisionFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     } else {
@@ -241,6 +550,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchSupervisionInfoData();
 };
 
@@ -283,6 +593,7 @@ const handleModalOk = async () => {
       showSuccessNotification(t("message.addSuccess"));
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchSupervisionInfoData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -295,15 +606,15 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreSupervisionInfo = async (record) => {
   try {
-    record[SupervisionFields.IS_DELETED] = 1;
-    var response = await deleteSupervisionInfo(record);
-    if (response && response.Success !== true) {
-      showErrorNotification(t("message.deleteFailed"));
-      return;
+    record[SupervisionFields.IS_DELETED] = 0;
+    const response = await updateSupervisionInfo(record);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
-    showSuccessNotification(t("message.deleteSuccess"));
     fetchSupervisionInfoData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -313,6 +624,7 @@ const handleDelete = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchSupervisionInfoData();
 };
 
-- 
Gitee


From daae4fe47c12f831c5a26173390a0d2efce9327f Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sun, 1 Feb 2026 18:02:58 +0800
Subject: [PATCH 06/10] add bulk select data.

---
 src/entities/customer.entity.js               |   6 +-
 src/entities/department.entity.js             |   4 +-
 src/entities/employee.entity.js               |   6 +-
 src/filters/customer.filter.config.js         |   2 +-
 src/filters/employee.filter.config.js         |   8 +
 src/i18n.js                                   |  24 +-
 src/views/customermanagement/CustomerView.vue |   2 +-
 .../StaffManagementView.vue                   | 367 ++++++++++++++----
 .../HydroelectricityInfoView.vue              |   2 +-
 .../GoodsmanagementView.vue                   | 274 +++++++++++--
 .../UnifiedAccountPermissionView.vue          |   2 +-
 11 files changed, 569 insertions(+), 128 deletions(-)

diff --git a/src/entities/customer.entity.js b/src/entities/customer.entity.js
index e1bd6f1..d417803 100644
--- a/src/entities/customer.entity.js
+++ b/src/entities/customer.entity.js
@@ -75,7 +75,7 @@ export const getColumns = (t) => [
       a[CustomerFields.NAME].localeCompare(b[CustomerFields.NAME]),
   },
   {
-    title: t("message.customerSex"),
+    title: t("message.customerGender"),
     dataIndex: CustomerFields.GENDER_NAME,
     key: CustomerFields.GENDER_NAME,
   },
@@ -141,8 +141,8 @@ export const getFormRules = (t) => ({
   [CustomerFields.GENDER]: [
     {
       required: true,
-      message: t("message.pleaseInputCustomerSex", {
-        field: t("message.customerSex"),
+      message: t("message.pleaseInputCustomerGender", {
+        field: t("message.customerGender"),
       }),
       trigger: "change",
     },
diff --git a/src/entities/department.entity.js b/src/entities/department.entity.js
index b73d32b..8f4b1bb 100644
--- a/src/entities/department.entity.js
+++ b/src/entities/department.entity.js
@@ -78,7 +78,7 @@ export const getColumns = (t, handleView) => [
     title: t("message.departmentDate"),
     dataIndex: DepartmentFields.CREATIONDATE,
     key: DepartmentFields.CREATIONDATE,
-  }
+  },
 ];
 
 export const getFormRules = (t) => ({
@@ -89,4 +89,4 @@ export const getFormRules = (t) => ({
       trigger: "blur",
     },
   ],
-});
\ No newline at end of file
+});
diff --git a/src/entities/employee.entity.js b/src/entities/employee.entity.js
index 363e603..0d6099e 100644
--- a/src/entities/employee.entity.js
+++ b/src/entities/employee.entity.js
@@ -95,13 +95,13 @@ export const getColumns = (t) => [
     key: EmployeeFields.NAME,
   },
   {
-    title: t("message.staffSex"),
+    title: t("message.staffGender"),
     dataIndex: EmployeeFields.GENDER,
     key: EmployeeFields.GENDER,
     hidden: true,
   },
   {
-    title: t("message.staffSex"),
+    title: t("message.staffGender"),
     dataIndex: EmployeeFields.GENDERNAME,
     key: EmployeeFields.GENDERNAME,
   },
@@ -200,7 +200,7 @@ export const getFormRules = (t) => ({
   [EmployeeFields.GENDER]: [
     {
       required: true,
-      message: t("message.pleaseInputStaffSex"),
+      message: t("message.pleaseInputStaffGender"),
       trigger: "blur",
     },
   ],
diff --git a/src/filters/customer.filter.config.js b/src/filters/customer.filter.config.js
index df1d79b..8602f45 100644
--- a/src/filters/customer.filter.config.js
+++ b/src/filters/customer.filter.config.js
@@ -32,7 +32,7 @@ export const getCustomerFilterConfig = (t, customerTypeOptions) => {
       {
         name: CustomerFields.GENDER,
         type: "select",
-        label: t("message.customerSex"),
+        label: t("message.customerGender"),
         placeholder: t("message.pleaseSelect"),
         options: [
           { value: 0, label: t("message.female") },
diff --git a/src/filters/employee.filter.config.js b/src/filters/employee.filter.config.js
index 7cd3c0d..0964cb2 100644
--- a/src/filters/employee.filter.config.js
+++ b/src/filters/employee.filter.config.js
@@ -5,6 +5,7 @@ export const getEmployeeFilterConfig = (
   t,
   departmentOptions,
   positionOptions,
+  educationOptions,
 ) => {
   return {
     title: t("message.employeeFilter"),
@@ -35,6 +36,13 @@ export const getEmployeeFilterConfig = (
         placeholder: t("message.pleaseSelect"),
         options: positionOptions,
       },
+      {
+        name: EmployeeFields.EDUCATIONLEVEL,
+        type: "select",
+        label: t("message.staffEducation"),
+        placeholder: t("message.pleaseSelect"),
+        options: educationOptions,
+      },
       {
         name: EmployeeFields.GENDER,
         type: "select",
diff --git a/src/i18n.js b/src/i18n.js
index 8c448bb..5047445 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -19,6 +19,7 @@ const messages = {
       view: "View",
       disabled: "Disabled",
       enabled: "Enabled",
+      disableEnable: "Disable/Enable",
       yes: "Yes",
       no: "No",
       ok: "OK",
@@ -50,6 +51,7 @@ const messages = {
       updateSuccess: "Update Success",
       deleteSuccess: "Delete Success",
       restoreSuccess: "Restore Success",
+      operationSuccess: "Operation Success",
       restore: "Restore",
       operationFailed: "Operation Failed",
       deleteFailed: "Delete Failed",
@@ -240,6 +242,7 @@ const messages = {
       internalfinancePerson: "Internal Finance Person",
 
       hydroelectricity: "Hydroelectricity Management",
+      viewHydroelectricity: "View Hydroelectricity",
       updateHydroelectricity: "Edit Hydroelectricity",
       pleaseInputWaterUse: "Please input Hydroelectricity Use Date",
       pleaseInputPowerUse: "Please input Hydroelectricity End Date",
@@ -333,7 +336,7 @@ const messages = {
       deleteCustomer: "Delete Customer",
       pleaseInputCustomerNo: "Please input customer no",
       pleaseInputCustomerName: "Please input customer name",
-      pleaseInputCustomerSex: "Please input customer sex",
+      pleaseInputCustomerGender: "Please input customer Gender",
       pleaseInputCustomerTel: "Please input customer telephone number",
       pleaseInputCustomerPassportType: "Please input customer passport type",
       pleaseInputCustomerPassportID: "Please input customer passport ID",
@@ -344,7 +347,7 @@ const messages = {
       invalidIdNumber: "Invalid ID Number",
       customerNo: "Customer No",
       customerName: "Customer Name",
-      customerSex: "Customer Sex",
+      customerGender: "Customer Gender",
       customerTel: "Customer Telephone Number",
       customerPassportType: "Customer Passport Type",
       customerPassportID: "Customer Passport ID",
@@ -373,7 +376,7 @@ const messages = {
       viewSpend: "View Spending Bill",
       deleteSpend: "Delete Spending Bill",
       pleaseInputSpendName: "Please input customer name",
-      pleaseInputSpendAmount: "Please input customer sex",
+      pleaseInputSpendAmount: "Please input customer Gender",
       pleaseInputSpendPrice: "Please input customer telephone number",
       pleaseInputSpendMoney: "Please input customer passport type",
       pleaseInputSpendTime: "Please input customer passport ID",
@@ -395,7 +398,7 @@ const messages = {
       pleaseInputPhoneNumber: "Please input phone number",
       pleaseInputHireDate: "Please select hire date",
       pleaseInputStaffBirthday: "Please input staff birthday",
-      pleaseInputStaffSex: "Please input staff sex",
+      pleaseInputStaffGender: "Please input staff gender",
       pleaseInputStaffNation: "Please input staff nation",
       pleaseInputStaffTel: "Please input staff telephone number",
       pleaseInputStaffDepartment: "Please input staff department",
@@ -414,7 +417,7 @@ const messages = {
       phoneNumber: "Phone Number",
       hireDate: "Hire Date",
       staffBirthday: "Staff Birthday",
-      staffSex: "Staff Sex",
+      staffGender: "Staff Gender",
       staffNation: "Staff Nation",
       staffTel: "Telephone Number",
       staffDepartment: "Staff Department",
@@ -685,6 +688,7 @@ const messages = {
       view: "查看",
       disabled: "禁用",
       enabled: "启用",
+      disableEnable: "禁用/启用",
       yes: "是",
       no: "否",
       ok: "确定",
@@ -714,6 +718,7 @@ const messages = {
       updateSuccess: "更新成功",
       deleteSuccess: "删除成功",
       restoreSuccess: "恢复成功",
+      operationSuccess: "操作成功",
       restore: "恢复",
       operationFailed: "操作失败",
       deleteFailed: "删除失败",
@@ -907,6 +912,7 @@ const messages = {
       internalfinancePerson: "内部资产经办人",
 
       hydroelectricity: "水电信息管理",
+      viewHydroelectricity: "查看水电信息",
       updateHydroelectricity: "编辑水电信息",
       pleaseInputWaterUse: "请输入水资源用量",
       pleaseInputPowerUse: "请输入电资源用量",
@@ -996,7 +1002,7 @@ const messages = {
       deleteCustomer: "删除客户",
       pleaseInputCustomerNo: "请输入客户编号",
       pleaseInputCustomerName: "请输入客户姓名",
-      pleaseInputCustomerSex: "请输入客户性别",
+      pleaseInputCustomerGender: "请输入客户性别",
       pleaseInputCustomerTel: "请输入客户电话号码",
       pleaseInputCustomerPassportType: "请输入客户证件类型",
       pleaseInputCustomerPassportID: "请输入客户证件号码",
@@ -1007,7 +1013,7 @@ const messages = {
       invalidIdNumber: "无效的身份证号码",
       customerNo: "客户编号",
       customerName: "客户姓名",
-      customerSex: "客户性别",
+      customerGender: "客户性别",
       customerTel: "客户电话号码",
       customerPassportType: "证件类型",
       customerPassportID: "证件号码",
@@ -1058,7 +1064,7 @@ const messages = {
       pleaseInputPhoneNumber: "请输入电话号码",
       pleaseInputHireDate: "请选择入职日期",
       pleaseInputStaffBirthday: "请选择员工出生日期",
-      pleaseInputStaffSex: "请选择员工性别",
+      pleaseInputStaffGender: "请选择员工性别",
       pleaseInputStaffNation: "请输入员工民族",
       pleaseInputStaffTel: "请输入员工电话号码",
       pleaseInputStaffDepartment: "请输入员工部门",
@@ -1076,7 +1082,7 @@ const messages = {
       phoneNumber: "电话号码",
       hireDate: "入职日期",
       staffBirthday: "出生日期",
-      staffSex: "性别",
+      staffGender: "性别",
       staffNation: "民族",
       staffTel: "电话号码",
       staffDepartment: "部门",
diff --git a/src/views/customermanagement/CustomerView.vue b/src/views/customermanagement/CustomerView.vue
index 14bb76e..7af0362 100644
--- a/src/views/customermanagement/CustomerView.vue
+++ b/src/views/customermanagement/CustomerView.vue
@@ -307,7 +307,7 @@ const rules = getFormRules(t);
 
 const customerNoLabel = computed(() => t("message.customerNo"));
 const customerNameLabel = computed(() => t("message.customerName"));
-const customerGenderLabel = computed(() => t("message.customerSex"));
+const customerGenderLabel = computed(() => t("message.customerGender"));
 const customerPassportTypeLabel = computed(() =>
   t("message.customerPassportType"),
 );
diff --git a/src/views/humanresourcemanagement/StaffManagementView.vue b/src/views/humanresourcemanagement/StaffManagementView.vue
index b931528..ef2bea7 100644
--- a/src/views/humanresourcemanagement/StaffManagementView.vue
+++ b/src/views/humanresourcemanagement/StaffManagementView.vue
@@ -1,18 +1,27 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="StaffManagementPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertStaff") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="StaffManagementPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertStaff") }}
+      </a-button>
+      <a-button
+        v-perm="StaffManagementPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateStaff") }}
+      </a-button>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -23,46 +32,58 @@
         <ListFilter
           v-model:values="filterValues"
           :config="employeeFilterConfig"
-          :show-is-deleted="true"
-          :is-deleted-default-value="0"
           @search="handleFilterSearch"
           @reset="handleFilterReset"
         />
       </a-collapse-panel>
     </a-collapse>
     <a-table
+      :row-key="(record) => record[EmployeeFields.ID]"
       :columns="filteredColumns"
       :data-source="staffs"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
+      :width="'100%'"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
-          <a-button
-            v-perm="StaffManagementPermissions.ASSIGN_VIEW"
-            style="margin-right: 15px"
-            @click="goPermissionRelation(record)"
-            ><SafetyCertificateOutlined />
-            {{ $t("message.permissionAsscialion") }}</a-button
-          >
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
             v-perm="StaffManagementPermissions.VIEW"
-            style="margin-right: 15px"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
             @click="viewDetail(record)"
-            ><EyeOutlined /> {{ $t("message.view") }}</a-button
           >
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
           <a-button
-            v-perm="StaffManagementPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editStaff(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
+            v-perm="StaffManagementPermissions.ASSIGN_VIEW"
+            type="link"
+            size="small"
+            :title="$t('message.permissionAsscialion')"
+            @click="goPermissionRelation(record)"
+            ><SafetyCertificateOutlined style="font-size: 16px"
+          /></a-button>
           <a-button
             v-perm="StaffManagementPermissions.STATUS"
-            style="margin-right: 15px"
+            type="link"
+            size="small"
+            :title="
+              record[EmployeeFields.ISENABLE] === 1
+                ? $t('message.disabled')
+                : $t('message.enabled')
+            "
             :danger="record[EmployeeFields.ISENABLE] === 1"
             @click="disabledStaff(record)"
           >
@@ -72,26 +93,31 @@
                   record[EmployeeFields.ISENABLE] === 0 ? '#52c41a' : '#ff4d4f',
               }"
             />
-            {{
-              record[EmployeeFields.ISENABLE] === 1
-                ? $t("message.disabled")
-                : $t("message.enabled")
-            }}
           </a-button>
           <a-button
             v-perm="StaffManagementPermissions.RESET"
-            style="margin-right: 15px"
+            type="link"
+            size="small"
+            :title="$t('message.resetPassword')"
             @click="resetPassword(record)"
-            ><RetweetOutlined /> {{ $t("message.resetPassword") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="StaffManagementPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            ><RetweetOutlined style="font-size: 16px"
+          /></a-button>
+          <template v-if="record[EmployeeFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreStaff(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="StaffManagementPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
         <template v-if="column.key === EmployeeFields.DATEOFBIRTH">
           {{ dayjs(record[EmployeeFields.DATEOFBIRTH]).format("YYYY-MM-DD") }}
@@ -117,6 +143,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -140,7 +167,10 @@
 
         <a-row :gutter="24">
           <a-col :span="8">
-            <a-form-item :label="staffSexLabel" :name="EmployeeFields.GENDER">
+            <a-form-item
+              :label="staffGenderLabel"
+              :name="EmployeeFields.GENDER"
+            >
               <a-radio-group v-model:value="form[EmployeeFields.GENDER]">
                 <a-radio-button :value="Gender.FEMALE">{{
                   $t("message.female")
@@ -253,7 +283,7 @@
         <a-row :gutter="24">
           <a-col :span="12">
             <a-form-item
-              :label="staffCardIDLabel"
+              :label="staffCardTypeLabel"
               :name="EmployeeFields.IDCARDTYPE"
             >
               <a-select
@@ -309,6 +339,65 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewStaff')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="staffNoLabel">
+          {{ selectedRecord?.[EmployeeFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffNameLabel">
+          {{ selectedRecord?.[EmployeeFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffGenderLabel">
+          {{
+            selectedRecord?.[EmployeeFields.GENDER] === Gender.FEMALE
+              ? t("message.female")
+              : t("message.male")
+          }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffBirthdayLabel">
+          {{ formatDate(selectedRecord?.[EmployeeFields.DATEOFBIRTH]) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffTimeLabel">
+          {{ formatDate(selectedRecord?.[EmployeeFields.HIREDATE]) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffEthnicityLabel">
+          {{ selectedRecord?.[EmployeeFields.ETHNICITY] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffFaceLabel">
+          {{ selectedRecord?.[EmployeeFields.POLITICALAFFILIATIONNAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffEducationLabel">
+          {{ selectedRecord?.[EmployeeFields.EDUCATIONLEVELNAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffDepartmentLabel">
+          {{ selectedRecord?.[EmployeeFields.DEPARTMENTNAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffPositionLabel">
+          {{ selectedRecord?.[EmployeeFields.POSITION] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffCardTypeLabel">
+          {{ selectedRecord?.[EmployeeFields.IDCARDTYPE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffCardIDLabel">
+          {{ selectedRecord?.[EmployeeFields.IDCARDNUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffTelLabel">
+          {{ selectedRecord?.[EmployeeFields.PHONENUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffEmailAddressLabel">
+          {{ selectedRecord?.[EmployeeFields.EMAILADDRESS] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="staffAddressLabel">
+          {{ selectedRecord?.[EmployeeFields.ADDRESS] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -370,6 +459,7 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const staffs = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
@@ -390,9 +480,13 @@ const employeeFilterConfig = computed(() =>
     t,
     staffDepartmentOptions.value,
     staffPositionOptions.value,
+    staffQualificationOptions.value,
   ),
 );
 const filterValues = ref({ [EmployeeFields.IS_DELETED]: 0 });
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 
 const viewDetail = (record) => {
   router.push({
@@ -406,7 +500,7 @@ const rules = getFormRules(t);
 
 const staffNoLabel = computed(() => t("message.staffId"));
 const staffNameLabel = computed(() => t("message.staffName"));
-const staffSexLabel = computed(() => t("message.staffSex"));
+const staffGenderLabel = computed(() => t("message.staffGender"));
 const staffNationLabel = computed(() => t("message.staffNation"));
 const staffTelLabel = computed(() => t("message.staffTel"));
 const staffEducationLabel = computed(() => t("message.staffEducation"));
@@ -418,8 +512,7 @@ const staffEmailAddressLabel = computed(() => t("message.staffEmailAddress"));
 const staffFaceLabel = computed(() => t("message.staffFace"));
 const staffTimeLabel = computed(() => t("message.staffTime"));
 const staffCardIDLabel = computed(() => t("message.staffCardID"));
-
-const columns = computed(() => getColumns(t));
+const staffCardTypeLabel = computed(() => t("message.staffCardType"));
 
 const filteredColumns = computed(() =>
   columns.value.filter((column) => !column.hidden),
@@ -467,12 +560,118 @@ const pagination = reactive({
   showTotal: (total) => t("message.totalRecords", { total }),
 });
 
-// 将过滤表单值转换为接口查询参数
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[EmployeeFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[EmployeeFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = staffs.value.filter(
+    (item) => item[EmployeeFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[EmployeeFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[EmployeeFields.ID])) {
+      selectedRowKeys.value.push(record[EmployeeFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[EmployeeFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  staffs.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = staffs.value.find(
+      (employee) => employee[EmployeeFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editStaff(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(
+    t,
+    viewDetail,
+    disabledStaff,
+    resetPassword,
+    restoreStaff,
+  );
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 180,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const buildServerParamsFromFilters = () => {
-  const params = {};
-  const fields = employeeFilterConfig.value?.fields || [];
-  fields.forEach((f) => {
-    const val = filterValues.value[f.name];
+  let params = {};
+  // 包含动态添加的字段，使用 effectiveConfig 而不是原始配置
+  const allFieldKeys = [
+    ...employeeFilterConfig.value?.fields.map((f) => f.name),
+    EmployeeFields.IS_DELETED, // 确保包含 IsDelete 字段
+    EmployeeFields.ISENABLE,
+  ];
+
+  allFieldKeys.forEach((fieldName) => {
+    const val = filterValues[fieldName];
     if (
       val === null ||
       val === undefined ||
@@ -481,50 +680,69 @@ const buildServerParamsFromFilters = () => {
     ) {
       return;
     }
-    switch (f.type) {
+
+    // 对于配置中的字段，按类型处理
+    const fieldConfig = employeeFilterConfig.value?.fields.find(
+      (f) => f.name === fieldName,
+    );
+    if (!fieldConfig) return;
+
+    switch (fieldConfig.type) {
       case "text":
-        params[f.name] = val.toString().trim();
+        params[fieldName] = val.toString().trim();
         break;
       case "number":
       case "select":
       case "boolean":
-        params[f.name] = val;
+        if (
+          fieldConfig.type === "select" &&
+          fieldName === EmployeeFields.ISENABLE
+        ) {
+          params[fieldName] = val === 1 ? true : false;
+        } else {
+          params[fieldName] = val;
+        }
         break;
       case "date":
-        params[f.name] = dayjs(val).format("YYYY-MM-DD");
+        params[fieldName] = dayjs(val).format("YYYY-MM-DD");
         break;
       case "date-range":
         if (Array.isArray(val) && val.length === 2) {
           const [start, end] = val;
-          params[`${f.name}.Start`] = dayjs(start).format("YYYY-MM-DD");
-          params[`${f.name}.End`] = dayjs(end).format("YYYY-MM-DD");
+          params[`${fieldName}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${fieldName}.End`] = dayjs(end).format("YYYY-MM-DD");
         }
         break;
       default:
         break;
     }
   });
+
   return params;
 };
 
 const handleFilterSearch = (vals) => {
-  filterValues.value = { ...vals };
+  Object.assign(filterValues, vals);
   const built = buildServerParamsFromFilters();
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
   );
   Object.assign(currentFilterParams, built);
   pagination.current = 1;
+  clearSelection(); // 重置选择
   fetchStaffData();
 };
 
 const handleFilterReset = (vals) => {
-  // 使用ref的value属性更新值
-  filterValues.value = vals ? { ...vals } : {};
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
   );
-  pagination.current = 1;
+  if (vals && typeof vals === "object") {
+    filterValues.value = { ...vals };
+  } else {
+    filterValues.value = {};
+  }
+  clearSelection(); // 重置选择
   fetchStaffData();
 };
 
@@ -534,7 +752,8 @@ const fetchStaffData = async () => {
     const result = await fetchEmployees({
       [EmployeeFields.PAGE]: pagination.current,
       [EmployeeFields.PAGE_SIZE]: pagination.pageSize,
-      [EmployeeFields.IS_DELETED]: filterValues.value[EmployeeFields.IS_DELETED],
+      [EmployeeFields.IS_DELETED]:
+        filterValues.value[EmployeeFields.IS_DELETED],
       ...currentFilterParams,
     });
     if (result?.Items) {
@@ -570,6 +789,7 @@ const fetchStaffData = async () => {
         [EmployeeFields.EMAILADDRESS]: item[EmployeeFields.EMAILADDRESS],
         [EmployeeFields.ISENABLE]: item[EmployeeFields.ISENABLE],
         [EmployeeFields.IS_DELETED]: item[EmployeeFields.IS_DELETED],
+        [EducationFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -701,6 +921,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchStaffData();
 };
 
@@ -743,14 +964,17 @@ const editStaff = (record) => {
 
 const disabledStaff = async (record) => {
   await managerEmployeeAccount({
+    ...record,
     [EmployeeFields.NUMBER]: record[EmployeeFields.NUMBER],
     [EmployeeFields.ISENABLE]: record[EmployeeFields.ISENABLE] === 1 ? 0 : 1,
   });
+  showSuccessNotification(t("message.operationSuccess"));
   fetchStaffData();
 };
 
 const resetPassword = async (record) => {
   var result = await resetEmployeePassword({
+    ...record,
     [EmployeeFields.NUMBER]: record[EmployeeFields.NUMBER],
   });
   if (result.Success === false) {
@@ -786,6 +1010,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchStaffData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -798,14 +1023,14 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreStaff = async (record) => {
   try {
-    record[EmployeeFields.IS_DELETED] = 1;
-    var response = await updateEmployee(record);
+    record[EmployeeFields.IS_DELETED] = 0;
+    const response = await updateEmployee(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(t("message.pleaseTryAgainLater"));
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
     fetchStaffData();
   } catch (error) {
diff --git a/src/views/hydroelectricity/HydroelectricityInfoView.vue b/src/views/hydroelectricity/HydroelectricityInfoView.vue
index 28c59ac..5acd731 100644
--- a/src/views/hydroelectricity/HydroelectricityInfoView.vue
+++ b/src/views/hydroelectricity/HydroelectricityInfoView.vue
@@ -135,7 +135,7 @@
     <a-modal
       v-if="viewModalVisible"
       v-model:open="viewModalVisible"
-      :title="t('message.viewHydroelectricityInfo')"
+      :title="t('message.viewHydroelectricity')"
       :width="'60%'"
       :footer="null"
     >
diff --git a/src/views/materialmanagement/GoodsmanagementView.vue b/src/views/materialmanagement/GoodsmanagementView.vue
index a2b1799..38f8237 100644
--- a/src/views/materialmanagement/GoodsmanagementView.vue
+++ b/src/views/materialmanagement/GoodsmanagementView.vue
@@ -1,19 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="GoodsManagementPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertGoods") }}</a-button
-    >
-
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="GoodsManagementPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertGoods") }}
+      </a-button>
+      <a-button
+        v-perm="GoodsManagementPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateGoods") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="GoodsManagementPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteGoods") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -33,30 +58,50 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[GoodsFields.ID]"
       :columns="columns"
       :data-source="goodss"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="GoodsManagementPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editGoods(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <a-button v-perm="GoodsManagementPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[GoodsFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreGoods(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="GoodsManagementPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
         <template v-else-if="column.key === GoodsFields.PRICE">
           ￥{{ Number(record[GoodsFields.PRICE]).toFixed(2) }}
@@ -106,6 +151,31 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewGoods')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="goodsNoLabel">
+          {{ selectedRecord?.[GoodsFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="goodsNameLabel">
+          {{ selectedRecord?.[GoodsFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="goodsPriceLabel">
+          ￥{{ Number(selectedRecord?.[GoodsFields.PRICE]).toFixed(2) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="specificationLabel">
+          {{ selectedRecord?.[GoodsFields.SPECIFICATION] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="stockLabel">
+          {{ Math.floor(selectedRecord?.[GoodsFields.STOCK]) }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -139,10 +209,14 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const goodss = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 
 const form = reactive({ ...initialFormValues });
@@ -155,8 +229,6 @@ const goodsPriceLabel = computed(() => t("message.goodsPrice"));
 const specificationLabel = computed(() => t("message.goodsSpecification"));
 const stockLabel = computed(() => t("message.goodsStock"));
 
-const columns = computed(() => getColumns(t));
-
 const goodsFilterConfig = computed(() => getGoodsFilterConfig(t));
 
 const pagination = reactive({
@@ -168,6 +240,132 @@ const pagination = reactive({
   showTotal: (total) => t("message.totalRecords", { total }),
 });
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[GoodsFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[GoodsFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = goodss.value.filter(
+    (item) => item[GoodsFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[GoodsFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[GoodsFields.ID])) {
+      selectedRowKeys.value.push(record[GoodsFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[GoodsFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  goodss.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = goodss.value.find(
+      (goods) => goods[GoodsFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editGoods(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteGoods(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchGoodsData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -216,6 +414,7 @@ const fetchGoodsData = async () => {
         [GoodsFields.PRICE]: item[GoodsFields.PRICE],
         [GoodsFields.STOCK]: item[GoodsFields.STOCK],
         [GoodsFields.IS_DELETED]: item[GoodsFields.IS_DELETED],
+        [GoodsFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -243,6 +442,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchGoodsData();
 };
 
@@ -287,6 +487,7 @@ const handleModalOk = async () => {
     }
 
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchGoodsData();
   } catch (error) {
     showErrorNotification(error.message);
@@ -299,16 +500,16 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreGoods = async (record) => {
   try {
-    record[GoodsFields.IS_DELETED] = 1;
-    var response = await deleteGoods(record);
-    if (response && response.Success === false) {
-      showErrorNotification(response.message);
-      return;
+    record[GoodsFields.IS_DELETED] = 0;
+    const response = await updateGoods(record);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
-    showSuccessNotification(t("message.deleteSuccess"));
-    fetchDepartmentData();
+    fetchGoodsData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
   }
@@ -317,7 +518,8 @@ const handleDelete = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
-  fetchDepartmentData();
+  clearSelection(); // 重置选择
+  fetchGoodsData();
 };
 
 const handleSorterChange = (pagination, filters, sorter) => {
diff --git a/src/views/systemmanagement/UnifiedAccountPermissionView.vue b/src/views/systemmanagement/UnifiedAccountPermissionView.vue
index 43fa040..b8683e2 100644
--- a/src/views/systemmanagement/UnifiedAccountPermissionView.vue
+++ b/src/views/systemmanagement/UnifiedAccountPermissionView.vue
@@ -462,7 +462,7 @@ const configByType = {
     columns: empColumns,
     fetchList: async (pag) => {
       return await fetchEmployees({
-        [EmployeeFields.IGNOREPAGING]: 0,
+        [EmployeeFields.IGNOREPAGING]: false,
         [EmployeeFields.PAGE]: pag.current,
         [EmployeeFields.PAGE_SIZE]: pag.pageSize,
       });
-- 
Gitee


From 8e8bf1870242fc05e05121cef941f17335d9ff95 Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sat, 7 Feb 2026 16:00:17 +0800
Subject: [PATCH 07/10] add bulk action for room information management module.

---
 components.d.ts                               |   7 +
 src/i18n.js                                   |  12 +
 src/utils/icons.js                            |  10 +
 src/views/base/DepartmentView.vue             |  14 +-
 .../roominformation/ReserManagementView.vue   | 277 +++++++++++++++--
 src/views/roominformation/RoomConfigView.vue  | 272 ++++++++++++++---
 .../roominformation/RoomManagementView.vue    | 279 +++++++++++++++---
 src/views/roominformation/RoomMapView.vue     | 130 +++++++-
 8 files changed, 883 insertions(+), 118 deletions(-)

diff --git a/components.d.ts b/components.d.ts
index 8ee84d4..93fddf8 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -21,6 +21,7 @@ declare module 'vue' {
     ADescriptions: typeof import('ant-design-vue/es')['Descriptions']
     ADescriptionsItem: typeof import('ant-design-vue/es')['DescriptionsItem']
     ADivider: typeof import('ant-design-vue/es')['Divider']
+    ADropdown: typeof import('ant-design-vue/es')['Dropdown']
     AEmpty: typeof import('ant-design-vue/es')['Empty']
     AForm: typeof import('ant-design-vue/es')['Form']
     AFormItem: typeof import('ant-design-vue/es')['FormItem']
@@ -64,14 +65,19 @@ declare module 'vue' {
     ATooltip: typeof import('ant-design-vue/es')['Tooltip']
     AUpload: typeof import('ant-design-vue/es')['Upload']
     CaretRightOutlined: typeof import('@ant-design/icons-vue')['CaretRightOutlined']
+    CarryOutOutlined: typeof import('@ant-design/icons-vue')['CarryOutOutlined']
     DeleteOutlined: typeof import('@ant-design/icons-vue')['DeleteOutlined']
     EditOutlined: typeof import('@ant-design/icons-vue')['EditOutlined']
     EyeOutlined: typeof import('@ant-design/icons-vue')['EyeOutlined']
     GlobalNotification: typeof import('./src/components/GlobalNotification.vue')['default']
     GlobalOutlined: typeof import('@ant-design/icons-vue')['GlobalOutlined']
+    HomeOutlined: typeof import('@ant-design/icons-vue')['HomeOutlined']
+    ImportOutlined: typeof import('@ant-design/icons-vue')['ImportOutlined']
+    InteractionOutlined: typeof import('@ant-design/icons-vue')['InteractionOutlined']
     LinkOutlined: typeof import('@ant-design/icons-vue')['LinkOutlined']
     ListFilter: typeof import('./src/components/common/ListFilter.vue')['default']
     LoadingOutlined: typeof import('@ant-design/icons-vue')['LoadingOutlined']
+    MoneyCollectOutlined: typeof import('@ant-design/icons-vue')['MoneyCollectOutlined']
     PlusOutlined: typeof import('@ant-design/icons-vue')['PlusOutlined']
     ReloadOutlined: typeof import('@ant-design/icons-vue')['ReloadOutlined']
     RetweetOutlined: typeof import('@ant-design/icons-vue')['RetweetOutlined']
@@ -82,6 +88,7 @@ declare module 'vue' {
     SaveOutlined: typeof import('@ant-design/icons-vue')['SaveOutlined']
     SearchOutlined: typeof import('@ant-design/icons-vue')['SearchOutlined']
     StopOutlined: typeof import('@ant-design/icons-vue')['StopOutlined']
+    SwapOutlined: typeof import('@ant-design/icons-vue')['SwapOutlined']
     SycnOutlined: typeof import('@ant-design/icons-vue')['SycnOutlined']
     SyncOutlined: typeof import('@ant-design/icons-vue')['SyncOutlined']
     UndoOutlined: typeof import('@ant-design/icons-vue')['UndoOutlined']
diff --git a/src/i18n.js b/src/i18n.js
index 5047445..3728063 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -610,6 +610,12 @@ const messages = {
       normal: "INFO",
       error: "CRITICAL",
       warning: "WARNING",
+      reserve: "Reserve",
+      checkIn: "Check In",
+      transferRoom: "Transfer Room",
+      checkOut: "Check Out",
+      changeRoomState: "Change Room State",
+      viewCustomerInfo: "View Customer Info",
 
       roomOverview: "Room Overview",
       roomStatusDistribution: "Room Status Distribution",
@@ -1273,6 +1279,12 @@ const messages = {
       normal: "常规操作",
       error: "严重操作",
       warning: "敏感操作",
+      reserve: "预约",
+      checkIn: "入住",
+      transferRoom: "转房",
+      checkOut: "退房",
+      changeRoomState: "更改房间状态",
+      viewCustomerInfo: "查看客户信息",
 
       roomOverview: "客房概览",
       roomStatusDistribution: "房间状态分布",
diff --git a/src/utils/icons.js b/src/utils/icons.js
index c99383f..1db31c1 100644
--- a/src/utils/icons.js
+++ b/src/utils/icons.js
@@ -48,6 +48,11 @@ import {
   SafetyOutlined,
   UndoOutlined,
   GlobalOutlined,
+  CarryOutOutlined,
+  MoneyCollectOutlined,
+  ImportOutlined,
+  SwapOutlined,
+  InteractionOutlined,
 } from "@ant-design/icons-vue";
 
 export function registerAntdIcons(app) {
@@ -99,4 +104,9 @@ export function registerAntdIcons(app) {
   app.component("SafetyOutlined", SafetyOutlined);
   app.component("UndoOutlined", UndoOutlined);
   app.component("GlobalOutlined", GlobalOutlined);
+  app.component("CarryOutOutlined", CarryOutOutlined);
+  app.component("MoneyCollectOutlined", MoneyCollectOutlined);
+  app.component("ImportOutlined", ImportOutlined);
+  app.component("SwapOutlined", SwapOutlined);
+  app.component("InteractionOutlined", InteractionOutlined);
 }
diff --git a/src/views/base/DepartmentView.vue b/src/views/base/DepartmentView.vue
index f5e8e0a..6748cdb 100644
--- a/src/views/base/DepartmentView.vue
+++ b/src/views/base/DepartmentView.vue
@@ -170,22 +170,22 @@
       :footer="null"
     >
       <a-descriptions bordered :column="2">
-        <a-descriptions-item :label="t('message.departmentNo')">
+        <a-descriptions-item :label="departmentNoLabel">
           {{ selectedRecord?.[DepartmentFields.NUMBER] }}
         </a-descriptions-item>
-        <a-descriptions-item :label="t('message.departmentName')">
+        <a-descriptions-item :label="departmentNameLabel">
           {{ selectedRecord?.[DepartmentFields.NAME] }}
         </a-descriptions-item>
-        <a-descriptions-item :label="t('message.departmentDesc')">
+        <a-descriptions-item :label="departmentDescLabel">
           {{ selectedRecord?.[DepartmentFields.DESCRIPTION] }}
         </a-descriptions-item>
-        <a-descriptions-item :label="t('message.departmentLeader')">
+        <a-descriptions-item :label="departmentLeaderLabel">
           {{ selectedRecord?.[DepartmentFields.LEADERNAME] }}
         </a-descriptions-item>
-        <a-descriptions-item :label="t('message.departmentParent')">
+        <a-descriptions-item :label="departmentParentLabel">
           {{ selectedRecord?.[DepartmentFields.PARENTNAME] }}
         </a-descriptions-item>
-        <a-descriptions-item :label="t('message.departmentDate')">
+        <a-descriptions-item :label="departmentDateLabel">
           {{ formatDate(selectedRecord?.[DepartmentFields.CREATIONDATE]) }}
         </a-descriptions-item>
       </a-descriptions>
@@ -194,7 +194,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, computed, reactive, watch } from "vue";
+import { ref, onMounted, computed, reactive } from "vue";
 import { useRoute } from "vue-router";
 import { getPageTitle } from "@/utils/pageTitle";
 import {
diff --git a/src/views/roominformation/ReserManagementView.vue b/src/views/roominformation/ReserManagementView.vue
index 9c548b5..f35889f 100644
--- a/src/views/roominformation/ReserManagementView.vue
+++ b/src/views/roominformation/ReserManagementView.vue
@@ -1,18 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="ReservationManagementPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertReser") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="ReservationManagementPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertReser") }}
+      </a-button>
+      <a-button
+        v-perm="ReservationManagementPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateReser") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="ReservationManagementPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteReser") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -31,30 +57,50 @@
       </a-collapse-panel>
     </a-collapse>
     <a-table
+      :row-key="(record) => record[ReserFields.ID]"
       :columns="filteredColumns"
       :data-source="displayResers"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="ReservationManagementPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editReser(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <a-button v-perm="ReservationManagementPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[ReserFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreReser(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="ReservationManagementPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
         <template v-else-if="column.key === ReserFields.STARTDATE">
           {{ formatDate(record[ReserFields.STARTDATE]) }}
@@ -68,6 +114,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -114,6 +161,37 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewReser')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="reserNoLabel">
+          {{ selectedRecord?.[ReserFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="reserCustomerNameLabel">
+          {{ selectedRecord?.[ReserFields.CUSTOMERNAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="reserPhoneNumberLabel">
+          {{ selectedRecord?.[ReserFields.PHONENUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="reserChannelLabel">
+          {{ selectedRecord?.[ReserFields.CHANNELDESCRIPTION] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="reserRoomNumberLabel">
+          {{ selectedRecord?.[ReserFields.ROOMNUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="reserStartDateLabel">
+          {{ formatDate(selectedRecord?.[ReserFields.STARTDATE]) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="reserEndDateLabel">
+          {{ formatDate(selectedRecord?.[ReserFields.ENDDATE]) }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -156,6 +234,7 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const resers = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
@@ -171,6 +250,9 @@ const reserFilterConfig = computed(() =>
   getReserFilterConfig(t, roomOptions.value, reserTypeOptions.value),
 );
 const filterValues = ref({ [ReserFields.IS_DELETED]: 0 });
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const displayResers = computed(() => {
   const items = resers.value || [];
   let fields = reserFilterConfig.value?.fields || [];
@@ -197,7 +279,131 @@ const reserRoomNumberLabel = computed(() => t("message.reserRoomNumber"));
 const reserStartDateLabel = computed(() => t("message.reserStartDate"));
 const reserEndDateLabel = computed(() => t("message.reserEndDate"));
 
-const columns = computed(() => getColumns(t));
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[ReserFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[ReserFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = resers.value.filter(
+    (item) => item[ReserFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[ReserFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[ReserFields.ID])) {
+      selectedRowKeys.value.push(record[ReserFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[ReserFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  resers.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = resers.value.find(
+      (reser) => reser[ReserFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editReser(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteReser(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchReserData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
 
 const filteredColumns = computed(() =>
   columns.value.filter((column) => !column.hidden),
@@ -231,6 +437,8 @@ const fetchReserData = async () => {
       [ReserFields.ROOMNUMBER]: item[ReserFields.ROOMNUMBER],
       [ReserFields.STARTDATE]: item[ReserFields.STARTDATE],
       [ReserFields.ENDDATE]: item[ReserFields.ENDDATE],
+      [ReserFields.IS_DELETED]: item[ReserFields.IS_DELETED] ?? 0,
+      [ReserFields.SELECTED]: false,
     }));
     pagination.total = result.TotalCount;
   } catch (error) {
@@ -309,6 +517,7 @@ const handleFilterSearch = (vals) => {
   );
   Object.assign(currentFilterParams, built);
   pagination.current = 1;
+  clearSelection(); // 重置选择
   fetchReserData();
 };
 
@@ -324,6 +533,7 @@ const handleFilterReset = (vals) => {
     (k) => delete currentFilterParams[k],
   );
   pagination.current = 1;
+  clearSelection(); // 重置选择
   fetchReserData();
 };
 
@@ -375,6 +585,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchReserData();
 };
 
@@ -417,6 +628,7 @@ const handleModalOk = async () => {
       showSuccessNotification(t("message.addSuccess"));
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchReserData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -429,15 +641,15 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreReser = async (record) => {
   try {
-    record[ReserFields.IS_DELETED] = 1;
-    var response = await deleteReser(record);
-    if (response && response.Success !== true) {
-      showErrorNotification(t("message.deleteFailed"));
-      return;
+    record[ReserFields.IS_DELETED] = 0;
+    const response = await updateReser(record);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
-    showSuccessNotification(t("message.deleteSuccess"));
     fetchReserData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -447,6 +659,7 @@ const handleDelete = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchReserData();
 };
 
diff --git a/src/views/roominformation/RoomConfigView.vue b/src/views/roominformation/RoomConfigView.vue
index 028a15f..ee92953 100644
--- a/src/views/roominformation/RoomConfigView.vue
+++ b/src/views/roominformation/RoomConfigView.vue
@@ -1,19 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="RoomConfigPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertRoomConfig") }}</a-button
-    >
-
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="RoomConfigPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertRoomConfig") }}
+      </a-button>
+      <a-button
+        v-perm="RoomConfigPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateRoomConfig") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="RoomConfigPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteRoomConfig") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -33,30 +58,50 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[RoomConfigFields.ID]"
       :columns="columns"
       :data-source="roomconfigs"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="RoomConfigPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editRoomConfig(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <a-button v-perm="RoomConfigPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[RoomConfigFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreRoomConfig(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="RoomConfigFields.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
         <template v-if="column.key === RoomConfigFields.RENT">
           {{ formatCurrency(record[RoomConfigFields.RENT]) }}
@@ -106,6 +151,28 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewRoomConfig')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="roomTypeCodeLabel">
+          {{ selectedRecord?.[RoomConfigFields.NO] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roomTypeNameLabel">
+          {{ selectedRecord?.[RoomConfigFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roomRentLabel">
+          {{ formatCurrency(selectedRecord?.[RoomConfigFields.RENT]) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roomDepositLabel">
+          {{ formatCurrency(selectedRecord?.[RoomConfigFields.DEPOSIT]) }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -139,11 +206,15 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const roomconfigs = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref([]);
 const sortedInfo = ref({ order: null, columnKey: null });
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 
 const form = reactive({ ...initialFormValues });
@@ -155,8 +226,6 @@ const roomTypeNameLabel = computed(() => t("message.roomTypeName"));
 const roomRentLabel = computed(() => t("message.roomRent"));
 const roomDepositLabel = computed(() => t("message.roomDeposit"));
 
-const columns = computed(() => getColumns(t));
-
 const roomConfigFilterConfig = computed(() => getRoomConfigFilterConfig(t));
 
 const pagination = reactive({
@@ -168,6 +237,132 @@ const pagination = reactive({
   showTotal: (total) => t("message.totalRecords", { total }),
 });
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[RoomConfigFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[RoomConfigFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = roomconfigs.value.filter(
+    (item) => item[RoomConfigFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[RoomConfigFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[RoomConfigFields.ID])) {
+      selectedRowKeys.value.push(record[RoomConfigFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[RoomConfigFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  roomconfigs.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = roomconfigs.value.find(
+      (room) => room[RoomConfigFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editRoomConfig(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteRoomConfig(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchRoomConfigData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -183,6 +378,7 @@ const handleFilterSearch = (values) => {
     }
     currentFilterParams[key] = val;
   });
+  clearSelection(); // 重置选择
   fetchRoomConfigData();
 };
 
@@ -195,6 +391,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection(); // 重置选择
   fetchRoomConfigData();
 };
 
@@ -214,6 +411,8 @@ const fetchRoomConfigData = async () => {
         [RoomConfigFields.NAME]: item[RoomConfigFields.NAME],
         [RoomConfigFields.RENT]: item[RoomConfigFields.RENT],
         [RoomConfigFields.DEPOSIT]: item[RoomConfigFields.DEPOSIT],
+        [RoomConfigFields.IS_DELETED]: item[RoomConfigFields.IS_DELETED] ?? 0,
+        [RoomConfigFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -240,6 +439,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchRoomConfigData();
 };
 
@@ -275,6 +475,7 @@ const handleModalOk = async () => {
       showSuccessNotification(t("message.addSuccess"));
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchRoomConfigData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -287,24 +488,25 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreRoomConfig = async (record) => {
   try {
-    record[RoomConfigFields.IS_DELETED] = 1;
-    var response = await deleteRoomType(record);
-    if (response && response.Success !== true) {
-      showErrorNotification(t("message.deleteFailed"));
-      return;
+    record[RoomConfigFields.IS_DELETED] = 0;
+    const response = await updateRoomType(record);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
-    showSuccessNotification(t("message.deleteSuccess"));
     fetchRoomConfigData();
   } catch (error) {
-    showErrorNotification(t("message.pleaseTryAgainLater"));
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
   }
 };
 
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchRoomConfigData();
 };
 
diff --git a/src/views/roominformation/RoomManagementView.vue b/src/views/roominformation/RoomManagementView.vue
index 3187310..4c0dc99 100644
--- a/src/views/roominformation/RoomManagementView.vue
+++ b/src/views/roominformation/RoomManagementView.vue
@@ -1,19 +1,44 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><SyncOutlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="RoomManagementPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><PlusOutlined /> {{ $t("message.insertRoom") }}</a-button
-    >
-
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="RoomManagementPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertRoom") }}
+      </a-button>
+      <a-button
+        v-perm="RoomManagementPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateRoom") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="RoomManagementPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteRoom") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-collapse style="margin-bottom: 15px">
       <a-collapse-panel key="1" :header="$t('message.filter')">
         <template #expandIcon="{ isActive }">
@@ -33,30 +58,50 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[RoomFields.ID]"
       :columns="filteredColumns"
       :data-source="rooms"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="RoomManagementPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editRoom(record)"
-            ><EditOutlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <a-button v-perm="RoomManagementPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[RoomFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreRoom(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="RoomManagementPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
         <template v-if="column.key === RoomFields.STATE">
           <a-tag :color="getTagColor(record[RoomFields.STATE])">{{
@@ -69,6 +114,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -111,6 +157,36 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewRoom')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="roomNoLabel">
+          {{ selectedRecord?.[RoomFields.NO] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roomTypeLabel">
+          {{ selectedRecord?.[RoomFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roomStateLabel">
+          <a-tag :color="getTagColor(selectedRecord?.[RoomFields.STATE])">
+            {{ selectedRecord?.[RoomFields.STATE] }}
+          </a-tag>
+        </a-descriptions-item>
+        <a-descriptions-item :label="roomRentLabel">
+          {{ selectedRecord?.[RoomFields.RENT] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roomDepositLabel">
+          {{ selectedRecord?.[RoomFields.DEPOSIT] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roomPositionLabel">
+          {{ selectedRecord?.[RoomFields.POSITION] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -141,6 +217,7 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const rooms = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
@@ -149,6 +226,9 @@ const roomTypeOptions = ref([]);
 const roomStateOptions = ref([]);
 const roomTypes = ref([]);
 const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 const currentFilterParams = reactive({});
 
 const form = reactive({ ...initialFormValues });
@@ -162,8 +242,6 @@ const roomRentLabel = computed(() => t("message.roomRent"));
 const roomDepositLabel = computed(() => t("message.roomDeposit"));
 const roomPositionLabel = computed(() => t("message.roomPosition"));
 
-const columns = computed(() => getColumns(t));
-
 const getTagColor = (state) => RoomStateColors[state] || "#888";
 
 const filteredColumns = computed(() =>
@@ -183,6 +261,132 @@ const pagination = reactive({
   showTotal: (total) => t("message.totalRecords", { total }),
 });
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[RoomFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[RoomFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = rooms.value.filter(
+    (item) => item[RoomFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[RoomFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[RoomFields.ID])) {
+      selectedRowKeys.value.push(record[RoomFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[RoomFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  rooms.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = rooms.value.find(
+      (room) => room[RoomFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editRoom(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteRoom(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchRoomData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const handleFilterSearch = (values) => {
   Object.keys(currentFilterParams).forEach(
     (k) => delete currentFilterParams[k],
@@ -198,6 +402,7 @@ const handleFilterSearch = (values) => {
     }
     currentFilterParams[key] = val;
   });
+  clearSelection(); // 重置选择
   fetchRoomData();
 };
 
@@ -210,6 +415,7 @@ const handleFilterReset = (vals) => {
   } else {
     filterValues.value = {};
   }
+  clearSelection(); // 重置选择
   fetchRoomData();
 };
 
@@ -233,6 +439,8 @@ const fetchRoomData = async () => {
       [RoomFields.RENT]: item[RoomFields.RENT],
       [RoomFields.DEPOSIT]: item[RoomFields.DEPOSIT],
       [RoomFields.POSITION]: item[RoomFields.POSITION],
+      [RoomFields.IS_DELETED]: item[RoomFields.IS_DELETED] ?? 0,
+      [RoomFields.SELECTED]: false,
     }));
     pagination.total = result.TotalCount;
   } catch (error) {
@@ -290,6 +498,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchRoomData();
 };
 
@@ -327,6 +536,7 @@ const handleModalOk = async () => {
       showSuccessNotification(t("message.addSuccess"));
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchRoomData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -339,15 +549,15 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreRoom = async (record) => {
   try {
-    record[RoomFields.IS_DELETED] = 1;
-    var response = await deleteRoom(record);
-    if (response && response.Success !== true) {
-      showErrorNotification(t("message.deleteFailed"));
-      return;
+    record[RoomFields.IS_DELETED] = 0;
+    const response = await updateRoom(record);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
-    showSuccessNotification(t("message.deleteSuccess"));
     fetchRoomData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -357,6 +567,7 @@ const handleDelete = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection(); // 重置选择
   fetchRoomData();
 };
 
diff --git a/src/views/roominformation/RoomMapView.vue b/src/views/roominformation/RoomMapView.vue
index 47fb167..a699cae 100644
--- a/src/views/roominformation/RoomMapView.vue
+++ b/src/views/roominformation/RoomMapView.vue
@@ -16,12 +16,30 @@
           >
             <a-tooltip placement="right">
               <template #title>
-                <div v-html="getTooltipContent(room)"></div>
+                <div class="tooltip-content">
+                  <p>
+                    {{ $t("message.checkInTime") }}:
+                    {{ formatDate(room[RoomFields.CHECK_IN_TIME]) }}
+                  </p>
+                  <p>
+                    {{ $t("message.checkOutTime") }}:
+                    {{ formatDate(room[RoomFields.CHECK_OUT_TIME]) }}
+                  </p>
+                  <p>
+                    {{ $t("message.roomRent") }}:
+                    {{ formatCurrency(room[RoomFields.RENT]) }}
+                  </p>
+                  <p>
+                    {{ $t("message.roomDeposit") }}:
+                    {{ formatCurrency(room[RoomFields.DEPOSIT]) }}
+                  </p>
+                </div>
               </template>
               <a-card
                 :title="room[RoomFields.NAME]"
                 class="room-card"
                 hoverable
+                @contextmenu.prevent="(e) => handleRightClick(e, room)"
               >
                 <template #extra>
                   <a-tag
@@ -49,6 +67,47 @@
       </div>
     </div>
     <a-spin v-else size="large" />
+
+    <!-- 右键菜单 -->
+    <a-dropdown
+      v-model:open="contextMenuVisible"
+      :trigger="['contextmenu']"
+      :get-popup-container="() => $el"
+      placement="topLeft"
+      :overlay-style="{
+        position: 'fixed',
+        left: contextMenuX + 'px',
+        top: contextMenuY - 10 + 'px',
+      }"
+    >
+      <div
+        class="context-menu-anchor"
+        :style="{ left: contextMenuX + 'px', top: contextMenuY + 'px' }"
+      ></div>
+      <template #overlay>
+        <a-menu @click="handleMenuClick">
+          <a-menu-item key="reserve">
+            <CarryOutOutlined /> {{ $t("message.reserve") }}</a-menu-item
+          >
+          <a-menu-item key="checkin">
+            <ImportOutlined /> {{ $t("message.checkIn") }}</a-menu-item
+          >
+          <a-menu-item key="transfer">
+            <SwapOutlined /> {{ $t("message.transferRoom") }}</a-menu-item
+          >
+          <a-menu-item key="checkout">
+            <MoneyCollectOutlined /> {{ $t("message.checkOut") }}</a-menu-item
+          >
+          <a-menu-item key="changeState">
+            <InteractionOutlined />
+            {{ $t("message.changeRoomState") }}</a-menu-item
+          >
+          <a-menu-item key="viewCustomer">
+            <UserOutlined /> {{ $t("message.viewCustomerInfo") }}</a-menu-item
+          >
+        </a-menu>
+      </template>
+    </a-dropdown>
   </div>
 </template>
 
@@ -74,6 +133,10 @@ const { t } = useI18n();
 const route = useRoute();
 const loading = ref(false);
 const rooms = ref([]);
+const contextMenuVisible = ref(false);
+const contextMenuX = ref(0);
+const contextMenuY = ref(0);
+const selectedRoom = ref(null);
 
 const pageTitleKey = computed(() => getPageTitle(route.path));
 const translatedPageTitle = computed(() => t(pageTitleKey.value));
@@ -123,17 +186,48 @@ const calculateDaysLived = (checkInTime) => {
   return dayjs().diff(dayjs(checkInTime), "day") + t("message.dayUnit");
 };
 
-const getTooltipContent = (room) => `
-  <div class="tooltip-content">
-    <p>${t("message.checkInTime")}: ${formatDate(room[RoomFields.CHECK_IN_TIME])}</p>
-    <p>${t("message.checkOutTime")}: ${formatDate(room[RoomFields.CHECK_OUT_TIME])}</p>
-    <p>${t("message.roomRent")}: ${formatCurrency(room[RoomFields.RENT])}</p>
-    <p>${t("message.roomDeposit")}: ${formatCurrency(room[RoomFields.DEPOSIT])}</p>
-  </div>
-`;
-
 const getTagColor = (state) => RoomStateColors[state] || "#888";
 
+const handleRightClick = (event, room) => {
+  event.preventDefault();
+  selectedRoom.value = room;
+  contextMenuX.value = event.clientX;
+  contextMenuY.value = event.clientY;
+  contextMenuVisible.value = true;
+};
+
+const handleMenuClick = ({ key }) => {
+  if (!selectedRoom.value) return;
+  const room = selectedRoom.value;
+  switch (key) {
+    case "reserve":
+      // 预约逻辑
+      // Todo: 打开预约对话框，传入room信息
+      break;
+    case "checkin":
+      // 入住逻辑
+      // Todo: 打开入住对话框，传入room信息
+      break;
+    case "transfer":
+      // 转房逻辑
+      // Todo: 打开转房对话框，传入room信息
+      break;
+    case "checkout":
+      // 退房逻辑
+      // Todo: 打开退房对话框，传入room信息
+      break;
+    case "changeState":
+      // 更改状态逻辑
+      // Todo: 打开更改状态对话框，传入room信息
+      break;
+    case "viewCustomer":
+      // 查看客户信息逻辑
+      // Todo: 打开客户信息对话框，传入room信息
+      break;
+  }
+  contextMenuVisible.value = false;
+};
+
 onMounted(fetchRoomData);
 
 const refreshData = () => {
@@ -156,6 +250,7 @@ const refreshData = () => {
 
 .room-card {
   padding: 10px;
+  position: relative;
 }
 
 .room-card :deep(.ant-card-head-title) {
@@ -174,4 +269,19 @@ const refreshData = () => {
 .tooltip-content p {
   margin: 3px 0;
 }
+
+.context-menu-anchor {
+  position: fixed;
+  width: 0;
+  height: 0;
+  pointer-events: none;
+}
+
+:deep(.ant-dropdown) {
+  z-index: 1050;
+  box-shadow:
+    0 3px 6px -4px rgba(0, 0, 0, 0.12),
+    0 6px 16px 0 rgba(0, 0, 0, 0.08),
+    0 9px 28px 8px rgba(0, 0, 0, 0.05);
+}
 </style>
-- 
Gitee


From 42f5635bc8c3ed02d0e200bbbc09f523c67ff4b9 Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sat, 7 Feb 2026 17:18:35 +0800
Subject: [PATCH 08/10] adjustment function.

---
 src/entities/common.entity.js                 |   4 +-
 src/i18n.js                                   |   4 +
 .../operationmanagement/OperationLogView.vue  | 219 ++++++++++++--
 .../AdministratorManagementView.vue           | 285 +++++++++++++++---
 4 files changed, 446 insertions(+), 66 deletions(-)

diff --git a/src/entities/common.entity.js b/src/entities/common.entity.js
index bf46bef..c0fc0e1 100644
--- a/src/entities/common.entity.js
+++ b/src/entities/common.entity.js
@@ -6,7 +6,7 @@ export const BaseFields = {
   MODIFYSTATUS: "ModifyStatus",
   PAGE: "Page",
   PAGE_SIZE: "PageSize",
-  VERSION: "RowVersion",
+  ROWVERSION: "RowVersion",
   SELECTED: "selected",
 };
 
@@ -18,5 +18,5 @@ export const BaseInitialValues = {
   [BaseFields.MODIFYSTATUS]: "",
   [BaseFields.PAGE]: 1,
   [BaseFields.PAGE_SIZE]: 15,
-  [BaseFields.VERSION]: 0,
+  [BaseFields.ROWVERSION]: 0,
 };
diff --git a/src/i18n.js b/src/i18n.js
index 3728063..c7eba71 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -566,6 +566,7 @@ const messages = {
       promotionContentNumber: "Promotion Content Number",
       promotionContentMessage: "Promotion Content Message",
 
+      viewLog: "View Log",
       operationTime: "Operation Time",
       logContent: "Log Content",
       operator: "Operator",
@@ -579,6 +580,7 @@ const messages = {
       selectLogLevel: "Select Log Level",
       confirmDeleteLog: "Are you sure to delete this log?",
       deleteLogBySevenDays: "Delete logs older than 7 days",
+      deleteLog: "Delete Log",
 
       path: "Path",
       method: "Method",
@@ -1235,6 +1237,7 @@ const messages = {
       promotionContentNumber: "宣传联动内容编号",
       promotionContentMessage: "宣传联动内容",
 
+      viewLog: "查看日志",
       operationTime: "操作时间",
       logContent: "日志内容",
       operator: "操作人",
@@ -1248,6 +1251,7 @@ const messages = {
       selectLogLevel: "请选择日志级别",
       confirmDeleteLog: "确定要删除操作日志吗？",
       deleteLogBySevenDays: "删除7天前的日志",
+      deleteLog: "删除日志",
 
       path: "请求路径",
       method: "请求方法",
diff --git a/src/views/operationmanagement/OperationLogView.vue b/src/views/operationmanagement/OperationLogView.vue
index d0aba7a..118d046 100644
--- a/src/views/operationmanagement/OperationLogView.vue
+++ b/src/views/operationmanagement/OperationLogView.vue
@@ -5,11 +5,28 @@
       <a-button style="margin-right: 12px" @click="refreshData">
         <SyncOutlined /> {{ $t("message.refreshData") }}
       </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="OperationLogPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteLog") }}
+        </a-button>
+      </a-popconfirm>
       <a-popconfirm
         :title="t('message.deleteLogBySevenDays')"
         @confirm="deleteLogBySevenDays"
       >
-        <a-button danger
+        <a-button v-perm="OperationLogPermissions.DELETE" danger
           ><DeleteOutlined /> {{ $t("message.deleteLogBySevenDays") }}</a-button
         >
       </a-popconfirm>
@@ -25,8 +42,6 @@
         <ListFilter
           v-model:values="filterValues"
           :config="logFilterConfig"
-          :show-is-deleted="true"
-          :is-deleted-default-value="0"
           @search="handleFilterSearch"
           @reset="handleFilterReset"
         />
@@ -34,24 +49,34 @@
     </a-collapse>
 
     <a-table
+      :row-key="(record) => record[LogFields.ID]"
       :columns="columns"
       :data-source="logs"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       :scroll="{ x: 1500 }"
       bordered
       @change="handleTableChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
-          <a-popconfirm
-            :title="t('message.confirmDeleteLog')"
-            @confirm="handleDelete(record)"
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
+          <a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-            <a-button v-perm="OperationLogPermissions.DELETE" danger
-              ><DeleteOutlined /> {{ $t("message.delete") }}</a-button
-            >
-          </a-popconfirm>
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
         </template>
         <template v-else-if="column.key === LogFields.LEVELNAME">
           <a-tag :color="getLogLevelColor(record[LogFields.LEVEL])">
@@ -63,6 +88,36 @@
         </template>
       </template>
     </a-table>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewLog')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="logTimeLabel">
+          {{ formatDate(selectedRecord?.[LogFields.TIME]) }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="logLevelLabel">
+          <a-tag :color="getLogLevelColor(selectedRecord[LogFields.LEVEL])">
+            {{ selectedRecord?.[LogFields.LEVELNAME] }}
+          </a-tag>
+        </a-descriptions-item>
+        <a-descriptions-item :label="operationAccountLabel">
+          {{ selectedRecord?.[LogFields.ACCOUNT] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="ipAddressLabel">
+          {{ selectedRecord?.[LogFields.IPADDRESS] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="softwareVersionLabel">
+          {{ selectedRecord?.[LogFields.VERSION] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="logContentLabel" :span="2">
+          {{ selectedRecord?.[LogFields.CONTENT] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -78,6 +133,7 @@ import {
   deleteOperationlog,
 } from "@/api/utilityapi";
 import {
+  formatDate,
   showErrorNotification,
   showSuccessNotification,
   getLocalDate,
@@ -91,6 +147,7 @@ const { t } = useI18n();
 const route = useRoute();
 
 const loading = ref(false);
+const viewModalVisible = ref(false);
 const logs = ref([]);
 const logLevelFilter = ref(null);
 const dateRange = ref([]);
@@ -98,6 +155,16 @@ const dateRange = ref([]);
 // 通用列表过滤配置与值
 const logFilterConfig = computed(() => getLogFilterConfig(t));
 const filterValues = ref({ [LogFields.IS_DELETED]: 0 });
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
+
+const logTimeLabel = computed(() => t("message.operationTime"));
+const logContentLabel = computed(() => t("message.logContent"));
+const operationAccountLabel = computed(() => t("message.operationAccount"));
+const ipAddressLabel = computed(() => t("message.ipAddress"));
+const logLevelLabel = computed(() => t("message.logLevel"));
+const softwareVersionLabel = computed(() => t("message.softwareVersion"));
 
 const pagination = reactive({
   current: 1,
@@ -109,11 +176,122 @@ const pagination = reactive({
 });
 
 const translatedPageTitle = computed(() => t(getPageTitle(route.path)));
-const columns = computed(() => getColumns(t));
 
 // 将过滤表单值转换为接口查询参数
 const currentFilterParams = reactive({});
 
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[LogFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[LogFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = logs.value.filter(
+    (item) => item[LogFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[LogFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[LogFields.ID])) {
+      selectedRowKeys.value.push(record[LogFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[LogFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  logs.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteOperationlog(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchLogData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
 const buildServerParamsFromFilters = () => {
   const params = {};
   const fields = logFilterConfig.value?.fields || [];
@@ -161,6 +339,7 @@ const handleFilterSearch = (values) => {
   );
   Object.assign(currentFilterParams, built);
   pagination.current = 1;
+  clearSelection(); // 重置选择
   fetchLogData();
 };
 
@@ -175,6 +354,7 @@ const handleFilterReset = (vals) => {
     Object.keys(filterValues).forEach((k) => delete filterValues[k]);
     Object.assign(filterValues, { [LogFields.IS_DELETED]: 0 });
   }
+  clearSelection(); // 重置选择
   fetchLogData();
 };
 
@@ -193,6 +373,7 @@ const fetchLogData = async () => {
       logs.value = result.Items.map((item) => ({
         ...item,
         [LogFields.LEVELNAME]: getLevelName(item[LogFields.LEVEL]),
+        [LogFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -247,20 +428,6 @@ const deleteLogBySevenDays = async () => {
   }
 };
 
-const handleDelete = async (record) => {
-  try {
-    var response = await deleteOperationlog(record[LogFields.NUMBER]);
-    if (response && response.Success !== true) {
-      showErrorNotification(response?.Error || t("message.deleteFailed"));
-      return;
-    }
-    showSuccessNotification(t("message.deleteSuccess"));
-    fetchLogData();
-  } catch (error) {
-    showErrorNotification(error.message);
-  }
-};
-
 const refreshData = () => {
   pagination.current = 1;
   dateRange.value = [];
diff --git a/src/views/systemmanagement/AdministratorManagementView.vue b/src/views/systemmanagement/AdministratorManagementView.vue
index 67b05a6..f2fb256 100644
--- a/src/views/systemmanagement/AdministratorManagementView.vue
+++ b/src/views/systemmanagement/AdministratorManagementView.vue
@@ -1,50 +1,95 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><sync-outlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="AdministratorManagementPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><plus-outlined /> {{ $t("message.insertAdministrator") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="AdministratorManagementPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertAdministrator") }}
+      </a-button>
+      <a-button
+        v-perm="AdministratorManagementPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateAdministrator") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="AdministratorManagementPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteAdministrator") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
     <a-table
+      :row-key="(record) => record[AdministratorFields.ID]"
       :columns="filteredColumns"
       :data-source="admins"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="AdministratorManagementPermissions.ASSIGN_VIEW"
-            style="margin-right: 15px"
-            @click="goPermissionRelation(record)"
-            ><safety-certificate-outlined />
-            {{ $t("message.permissionAsscialion") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            @click="handleView(record)"
           >
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
           <a-button
-            v-perm="AdministratorManagementPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editAdministrator(record)"
-            ><edit-outlined /> {{ $t("message.edit") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="AdministratorManagementPermissions.DELETE" danger
-              ><delete-outlined /> {{ $t("message.delete") }}</a-button
+            v-perm="AdministratorManagementPermissions.ASSIGN_VIEW"
+            type="link"
+            size="small"
+            @click="goPermissionRelation(record)"
+            ><SafetyCertificateOutlined style="font-size: 16px"
+          /></a-button>
+          <template v-if="record[AdministratorFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreAdministrator(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="AdministratorManagementPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -52,6 +97,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -117,6 +163,36 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewAdministrator')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="adminNumberLabel">
+          {{ selectedRecord?.[AdministratorFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="adminNameLabel">
+          {{ selectedRecord?.[AdministratorFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="adminAccountLabel">
+          {{ selectedRecord?.[AdministratorFields.ACCOUNT] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="adminTypeLabel">
+          {{ selectedRecord?.[AdministratorFields.TYPE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="isSuperAdminLabel">
+          {{
+            selectedRecord?.[AdministratorFields.ISSUPERADMIN] ===
+            SuperAdmin.YES
+              ? t("message.yes")
+              : t("message.no")
+          }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -152,11 +228,15 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const admins = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
 const sortedInfo = ref({ order: null, columnKey: null });
 const adminTypeOptions = ref([]);
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
 
 const form = reactive({ ...initialFormValues });
 
@@ -169,7 +249,131 @@ const adminPasswordLabel = computed(() => t("message.adminPassword"));
 const adminTypeLabel = computed(() => t("message.adminType"));
 const isSuperAdminLabel = computed(() => t("message.isSuperAdminFlag"));
 
-const columns = computed(() => getColumns(t));
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[AdministratorFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[AdministratorFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = admins.value.filter(
+    (item) => item[AdministratorFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[AdministratorFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[AdministratorFields.ID])) {
+      selectedRowKeys.value.push(record[AdministratorFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[AdministratorFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  admins.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = admins.value.find(
+      (admin) => admin[AdministratorFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editAdministrator(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteAdmin(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchAdministratorData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
 
 const filteredColumns = computed(() =>
   columns.value.filter((column) => !column.hidden),
@@ -205,6 +409,9 @@ const fetchAdministratorData = async () => {
           item[AdministratorFields.ISSUPERADMIN],
         [AdministratorFields.ISSUPERADMINDESCRIPTION]:
           item[AdministratorFields.ISSUPERADMINDESCRIPTION],
+        [AdministratorFields.IS_DELETED]:
+          item[AdministratorFields.IS_DELETED] ?? 0,
+        [AdministratorFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -250,6 +457,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchAdministratorData();
 };
 
@@ -310,6 +518,7 @@ const handleModalOk = async () => {
       showSuccessNotification(t("message.addSuccess"));
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchAdministratorData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -322,15 +531,15 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreAdministrator = async (record) => {
   try {
-    record[AdministratorFields.IS_DELETED] = 1;
-    var response = await deleteAdmin(record);
-    if (response && response.Success === false) {
-      showErrorNotification(t("message.deleteFailed"));
-      return;
+    record[AdministratorFields.IS_DELETED] = 0;
+    const response = await updateAdministrator(record);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
-    showSuccessNotification(t("message.deleteSuccess"));
     fetchAdministratorData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
-- 
Gitee


From db61f8188ff9fa29931284de27e8644441b61dc0 Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sun, 8 Feb 2026 02:02:39 +0800
Subject: [PATCH 09/10] add bulk select action.

---
 src/filters/administrator.filter.config.js    |  28 ++
 src/filters/menu.filter.config.js             |  15 +
 src/filters/role.filter.config.js             |  21 +
 src/i18n.js                                   |   4 +
 .../AdministratorManagementView.vue           | 109 +++++
 .../systemmanagement/MenuManagementView.vue   | 389 +++++++++++++++--
 .../systemmanagement/RoleManagementView.vue   | 395 ++++++++++++++++--
 7 files changed, 876 insertions(+), 85 deletions(-)
 create mode 100644 src/filters/administrator.filter.config.js
 create mode 100644 src/filters/menu.filter.config.js
 create mode 100644 src/filters/role.filter.config.js

diff --git a/src/filters/administrator.filter.config.js b/src/filters/administrator.filter.config.js
new file mode 100644
index 0000000..8d774d9
--- /dev/null
+++ b/src/filters/administrator.filter.config.js
@@ -0,0 +1,28 @@
+import { AdministratorFields } from "@/entities/administrator.entity";
+
+export const getAdministratorFilterConfig = (t, adminTypeOptions) => {
+  return {
+    title: t("message.administratorFilter"),
+    fields: [
+      {
+        name: AdministratorFields.ACCOUNT,
+        type: "text",
+        label: t("message.adminAccount"),
+        placeholder: t("message.pleaseInputAdminAccount"),
+      },
+      {
+        name: AdministratorFields.NAME,
+        type: "text",
+        label: t("message.adminName"),
+        placeholder: t("message.pleaseInputAdminName"),
+      },
+      {
+        name: AdministratorFields.TYPE,
+        type: "select",
+        label: t("message.adminType"),
+        placeholder: t("message.pleaseInputAdminType"),
+        options: adminTypeOptions,
+      },
+    ],
+  };
+};
diff --git a/src/filters/menu.filter.config.js b/src/filters/menu.filter.config.js
new file mode 100644
index 0000000..2d65baf
--- /dev/null
+++ b/src/filters/menu.filter.config.js
@@ -0,0 +1,15 @@
+import { MenuFields } from "@/entities/menu.entity";
+
+export const getMenuFilterConfig = (t) => {
+  return {
+    title: t("message.menuFilter"),
+    fields: [
+      {
+        name: MenuFields.TITLE,
+        type: "text",
+        label: t("message.menuTitle"),
+        placeholder: t("message.pleaseInputMenuTitle"),
+      },
+    ],
+  };
+};
diff --git a/src/filters/role.filter.config.js b/src/filters/role.filter.config.js
new file mode 100644
index 0000000..8dd2bdb
--- /dev/null
+++ b/src/filters/role.filter.config.js
@@ -0,0 +1,21 @@
+import { RoleFields } from "@/entities/role.entity";
+
+export const getRoleFilterConfig = (t) => {
+  return {
+    title: t("message.roleFilter"),
+    fields: [
+      {
+        name: RoleFields.NUMBER,
+        type: "text",
+        label: t("message.roleNumber"),
+        placeholder: t("message.pleaseInputRoleNumber"),
+      },
+      {
+        name: RoleFields.NAME,
+        type: "text",
+        label: t("message.roleName"),
+        placeholder: t("message.pleaseInputRoleName"),
+      },
+    ],
+  };
+};
diff --git a/src/i18n.js b/src/i18n.js
index c7eba71..53211a3 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -511,6 +511,7 @@ const messages = {
       adminType: "Administrator Type",
       adminPassword: "Administrator Password",
       isSuperAdminFlag: "Super Administrator Flag",
+      administratorFilter: "Administrator Filter",
 
       admintypemanagement: "Administrator Type Management",
       insertAdminType: "Create Administrator Type",
@@ -553,6 +554,7 @@ const messages = {
       menuIcon: "Menu Icon",
       permissionNumber: "Permission Number",
       permissionName: "Permission Name",
+      menuFilter: "Menu Filter",
 
       promotioncontent: "Promotion Content Management",
       insertPromotionContent: "Create Promotion Content",
@@ -1184,6 +1186,7 @@ const messages = {
       adminType: "管理员类型",
       adminPassword: "管理员密码",
       isSuperAdminFlag: "超级管理员标志",
+      administratorFilter: "管理员筛选",
 
       admintypemanagement: "管理员类型管理",
       insertAdminType: "创建管理员类型",
@@ -1226,6 +1229,7 @@ const messages = {
       menuIcon: "菜单图标",
       permissionNumber: "权限编码",
       permissionName: "权限名称",
+      menuFilter: "菜单筛选",
 
       promotioncontent: "宣传联动内容管理",
       insertPromotionContent: "创建宣传联动内容",
diff --git a/src/views/systemmanagement/AdministratorManagementView.vue b/src/views/systemmanagement/AdministratorManagementView.vue
index f2fb256..0cb270f 100644
--- a/src/views/systemmanagement/AdministratorManagementView.vue
+++ b/src/views/systemmanagement/AdministratorManagementView.vue
@@ -39,6 +39,23 @@
         </a-button>
       </a-popconfirm>
     </div>
+    <a-collapse style="margin-bottom: 15px">
+      <a-collapse-panel key="1" :header="$t('message.filter')">
+        <template #expandIcon="{ isActive }">
+          <caret-right-outlined
+            :style="{ transform: isActive ? 'rotate(90deg)' : 'rotate(0deg)' }"
+          />
+        </template>
+        <ListFilter
+          v-model:values="filterValues"
+          :config="administratorFilterConfig"
+          :show-is-deleted="true"
+          :is-deleted-default-value="0"
+          @search="handleFilterSearch"
+          @reset="handleFilterReset"
+        />
+      </a-collapse-panel>
+    </a-collapse>
     <a-table
       :row-key="(record) => record[AdministratorFields.ID]"
       :columns="filteredColumns"
@@ -218,6 +235,8 @@ import {
 } from "@/entities/administrator.entity";
 import { useI18n } from "vue-i18n";
 import generateSnowflakeId from "@/utils/snowflake";
+import ListFilter from "@/components/common/ListFilter.vue";
+import { getAdministratorFilterConfig } from "@/filters/administrator.filter.config";
 import { AdministratorManagementPermissions } from "@/common/permissioncode";
 
 const { t } = useI18n();
@@ -234,10 +253,16 @@ const confirmLoading = ref(false);
 const formRef = ref(null);
 const sortedInfo = ref({ order: null, columnKey: null });
 const adminTypeOptions = ref([]);
+const filterValues = ref({});
 const selectedRecord = ref(null);
 const selectedRowKeys = ref([]);
 const selectedRows = ref([]);
 
+const currentFilterParams = reactive({});
+const administratorFilterConfig = computed(() =>
+  getAdministratorFilterConfig(t, adminTypeOptions.value),
+);
+
 const form = reactive({ ...initialFormValues });
 
 const rules = computed(() => getFormRules(t, form.modifystatus === "update"));
@@ -375,6 +400,89 @@ const columns = computed(() => {
   ];
 });
 
+const buildServerParamsFromFilters = () => {
+  let params = {};
+  // 包含动态添加的字段，使用 effectiveConfig 而不是原始配置
+  const allFieldKeys = [
+    ...administratorFilterConfig.value?.fields.map((f) => f.name),
+    AdministratorFields.IS_DELETED, // 确保包含 IsDelete 字段
+  ];
+
+  allFieldKeys.forEach((fieldName) => {
+    const val = filterValues[fieldName];
+    if (
+      val === null ||
+      val === undefined ||
+      (typeof val === "string" && val.trim() === "") ||
+      (Array.isArray(val) && val.length === 0)
+    ) {
+      return;
+    }
+
+    // 对于动态字段，直接赋值
+    if (fieldName === AdministratorFields.IS_DELETED) {
+      params[fieldName] = val;
+      return;
+    }
+
+    // 对于配置中的字段，按类型处理
+    const fieldConfig = administratorFilterConfig.value?.fields.find(
+      (f) => f.name === fieldName,
+    );
+    if (!fieldConfig) return;
+
+    switch (fieldConfig.type) {
+      case "text":
+        params[fieldName] = val.toString().trim();
+        break;
+      case "number":
+      case "select":
+      case "boolean":
+        params[fieldName] = val;
+        break;
+      case "date":
+        params[fieldName] = dayjs(val).format("YYYY-MM-DD");
+        break;
+      case "date-range":
+        if (Array.isArray(val) && val.length === 2) {
+          const [start, end] = val;
+          params[`${fieldName}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${fieldName}.End`] = dayjs(end).format("YYYY-MM-DD");
+        }
+        break;
+      default:
+        break;
+    }
+  });
+
+  return params;
+};
+
+const handleFilterSearch = (vals) => {
+  Object.assign(filterValues, vals);
+  const built = buildServerParamsFromFilters();
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  Object.assign(currentFilterParams, built);
+  pagination.current = 1;
+  clearSelection(); // 重置选择
+  fetchAdministratorData();
+};
+
+const handleFilterReset = (vals) => {
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  if (vals && typeof vals === "object") {
+    filterValues.value = { ...vals };
+  } else {
+    filterValues.value = {};
+  }
+  clearSelection(); // 重置选择
+  fetchAdministratorData();
+};
+
 const filteredColumns = computed(() =>
   columns.value.filter((column) => !column.hidden),
 );
@@ -395,6 +503,7 @@ const fetchAdministratorData = async () => {
       [AdministratorFields.PAGE]: pagination.current,
       [AdministratorFields.PAGE_SIZE]: pagination.pageSize,
       [AdministratorFields.IS_DELETED]: 0,
+      ...currentFilterParams,
     });
     if (result?.Items) {
       admins.value = result.Items.map((item) => ({
diff --git a/src/views/systemmanagement/MenuManagementView.vue b/src/views/systemmanagement/MenuManagementView.vue
index f1eeffa..7ff8c21 100644
--- a/src/views/systemmanagement/MenuManagementView.vue
+++ b/src/views/systemmanagement/MenuManagementView.vue
@@ -1,43 +1,105 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><sync-outlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="MenuManagementPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><plus-outlined /> {{ $t("message.insertMenu") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="MenuManagementPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertMenu") }}
+      </a-button>
+      <a-button
+        v-perm="MenuManagementPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateMenu") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="MenuManagementPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteMenu") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
+    <a-collapse style="margin-bottom: 15px">
+      <a-collapse-panel key="1" :header="$t('message.filter')">
+        <template #expandIcon="{ isActive }">
+          <caret-right-outlined
+            :style="{ transform: isActive ? 'rotate(90deg)' : 'rotate(0deg)' }"
+          />
+        </template>
+        <ListFilter
+          v-model:values="filterValues"
+          :config="menuFilterConfig"
+          :show-is-deleted="true"
+          :is-deleted-default-value="0"
+          @search="handleFilterSearch"
+          @reset="handleFilterReset"
+        />
+      </a-collapse-panel>
+    </a-collapse>
     <a-table
+      :row-key="(record) => record[MenuFields.ID]"
       :columns="columns"
-      :data-source="roles"
+      :data-source="menus"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="MenuManagementPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editMenu(record)"
-            ><edit-outlined /> {{ $t("message.edit") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            @click="handleView(record)"
           >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="MenuManagementPermissions.DELETE" danger
-              ><delete-outlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[MenuFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreMenu(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="MenuManagementPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -74,6 +136,35 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewMenu')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="menuKeyLabel">
+          {{ selectedRecord?.[MenuFields.KEY] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="menuTitleLabel">
+          {{ selectedRecord?.[MenuFields.TITLE] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="menuPathLabel">
+          {{ selectedRecord?.[MenuFields.PATH] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="menuParentLabel">
+          {{
+            menus.find(
+              (m) => m[MenuFields.ID] === selectedRecord?.[MenuFields.PARENT],
+            )?.[MenuFields.TITLE] || "-"
+          }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="menuIconLabel">
+          {{ selectedRecord?.[MenuFields.ICON] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -91,6 +182,8 @@ import {
 } from "@/entities/menu.entity";
 import { useI18n } from "vue-i18n";
 import { emitter } from "@/utils/eventBus";
+import ListFilter from "@/components/common/ListFilter.vue";
+import { getMenuFilterConfig } from "@/filters/menu.filter.config";
 import { MenuManagementPermissions } from "@/common/permissioncode";
 
 const { t } = useI18n();
@@ -98,13 +191,21 @@ const route = useRoute();
 const pageTitleKey = computed(() => getPageTitle(route.path));
 const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
-const roles = ref([]);
+const menus = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
 const sortedInfo = ref({ order: null, columnKey: null });
 const menuOptions = ref([]);
+const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
+
+const currentFilterParams = reactive({});
+const menuFilterConfig = computed(() => getMenuFilterConfig(t));
 
 const form = reactive({ ...initialFormValues });
 
@@ -116,7 +217,214 @@ const menuPathLabel = computed(() => t("message.menuPath"));
 const menuParentLabel = computed(() => t("message.menuParent"));
 const menuIconLabel = computed(() => t("message.menuIcon"));
 
-const columns = computed(() => getColumns(t));
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[MenuFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[MenuFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = menuOptions.value.filter(
+    (item) => item[MenuFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[MenuFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[MenuFields.ID])) {
+      selectedRowKeys.value.push(record[MenuFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[MenuFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  menus.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = menus.value.find(
+      (menu) => menu[MenuFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editMenu(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteMenu(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchMenuData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
+const buildServerParamsFromFilters = () => {
+  let params = {};
+  // 包含动态添加的字段，使用 effectiveConfig 而不是原始配置
+  const allFieldKeys = [
+    ...menuFilterConfig.value?.fields.map((f) => f.name),
+    MenuFields.IS_DELETED, // 确保包含 IsDelete 字段
+  ];
+
+  allFieldKeys.forEach((fieldName) => {
+    const val = filterValues[fieldName];
+    if (
+      val === null ||
+      val === undefined ||
+      (typeof val === "string" && val.trim() === "") ||
+      (Array.isArray(val) && val.length === 0)
+    ) {
+      return;
+    }
+
+    // 对于动态字段，直接赋值
+    if (fieldName === MenuFields.IS_DELETED) {
+      params[fieldName] = val;
+      return;
+    }
+
+    // 对于配置中的字段，按类型处理
+    const fieldConfig = menuFilterConfig.value?.fields.find(
+      (f) => f.name === fieldName,
+    );
+    if (!fieldConfig) return;
+
+    switch (fieldConfig.type) {
+      case "text":
+        params[fieldName] = val.toString().trim();
+        break;
+      case "number":
+      case "select":
+      case "boolean":
+        params[fieldName] = val;
+        break;
+      case "date":
+        params[fieldName] = dayjs(val).format("YYYY-MM-DD");
+        break;
+      case "date-range":
+        if (Array.isArray(val) && val.length === 2) {
+          const [start, end] = val;
+          params[`${fieldName}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${fieldName}.End`] = dayjs(end).format("YYYY-MM-DD");
+        }
+        break;
+      default:
+        break;
+    }
+  });
+
+  return params;
+};
+
+const handleFilterSearch = (vals) => {
+  Object.assign(filterValues, vals);
+  const built = buildServerParamsFromFilters();
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  Object.assign(currentFilterParams, built);
+  pagination.current = 1;
+  clearSelection(); // 重置选择
+  fetchMenuData();
+};
+
+const handleFilterReset = (vals) => {
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  if (vals && typeof vals === "object") {
+    filterValues.value = { ...vals };
+  } else {
+    filterValues.value = {};
+  }
+  clearSelection(); // 重置选择
+  fetchMenuData();
+};
 
 const pagination = reactive({
   current: 1,
@@ -134,15 +442,18 @@ const fetchMenuData = async () => {
       [MenuFields.PAGE]: pagination.current,
       [MenuFields.PAGE_SIZE]: pagination.pageSize,
       [MenuFields.IS_DELETED]: 0,
+      ...currentFilterParams,
     });
     if (result?.Items) {
-      roles.value = result.Items.map((item) => ({
+      menus.value = result.Items.map((item) => ({
         [MenuFields.ID]: item[MenuFields.ID],
         [MenuFields.KEY]: item[MenuFields.KEY],
         [MenuFields.TITLE]: item[MenuFields.TITLE],
         [MenuFields.PATH]: item[MenuFields.PATH],
         [MenuFields.PARENT]: item[MenuFields.PARENT],
         [MenuFields.ICON]: item[MenuFields.ICON],
+        [MenuFields.IS_DELETED]: item[MenuFields.IS_DELETED] ?? 0,
+        [MenuFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -186,6 +497,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection();
   fetchMenuData();
 };
 
@@ -221,6 +533,7 @@ const handleModalOk = async () => {
       }
     }
     modalVisible.value = false;
+    clearSelection();
     fetchMenuData();
     emitter.emit("refresh-menu");
   } catch (error) {
@@ -234,31 +547,25 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreMenu = async (record) => {
   try {
-    record[MenuFields.ID] = record[MenuFields.ID];
-    record[MenuFields.KEY] = record[MenuFields.KEY];
-    record[MenuFields.TITLE] = record[MenuFields.TITLE];
-    record[MenuFields.PATH] = record[MenuFields.PATH];
-    record[MenuFields.PARENT] = record[MenuFields.PARENT];
-    record[MenuFields.ICON] = record[MenuFields.ICON];
-    record[MenuFields.IS_DELETED] = 1;
-    var response = await deleteMenu(record);
+    record[MenuFields.IS_DELETED] = 0;
+    const response = await updateMenu(record);
     if (response && response.Success) {
-      showSuccessNotification(t("message.deleteSuccess"));
+      showSuccessNotification(t("message.restoreSuccess"));
     } else {
-      showErrorNotification(response.Message);
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
-    emitter.emit("refresh-menu");
     fetchMenuData();
   } catch (error) {
-    showErrorNotification(t("message.pleaseTryAgainLater"));
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
   }
 };
 
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection();
   fetchMenuData();
 };
 
diff --git a/src/views/systemmanagement/RoleManagementView.vue b/src/views/systemmanagement/RoleManagementView.vue
index 67f8493..8a682e2 100644
--- a/src/views/systemmanagement/RoleManagementView.vue
+++ b/src/views/systemmanagement/RoleManagementView.vue
@@ -1,55 +1,120 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><sync-outlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="RoleManagementPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><plus-outlined /> {{ $t("message.insertRole") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="RoleManagementPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertRole") }}
+      </a-button>
+      <a-button
+        v-perm="RoleManagementPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateRole") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="RoleManagementPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteRole") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
+    <a-collapse style="margin-bottom: 15px">
+      <a-collapse-panel key="1" :header="$t('message.filter')">
+        <template #expandIcon="{ isActive }">
+          <caret-right-outlined
+            :style="{ transform: isActive ? 'rotate(90deg)' : 'rotate(0deg)' }"
+          />
+        </template>
+        <ListFilter
+          v-model:values="filterValues"
+          :config="roleFilterConfig"
+          :show-is-deleted="true"
+          :is-deleted-default-value="0"
+          @search="handleFilterSearch"
+          @reset="handleFilterReset"
+        />
+      </a-collapse-panel>
+    </a-collapse>
     <a-table
       :columns="columns"
       :data-source="roles"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="RoleManagementPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editRole(record)"
-            ><edit-outlined /> {{ $t("message.edit") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            @click="handleView(record)"
           >
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
           <a-button
             v-perm="RoleManagementPermissions.GRANT"
-            style="margin-right: 15px"
+            type="link"
+            size="small"
+            :title="$t('message.assignPermissions')"
             @click="openRolePermModal(record)"
-            ><safety-outlined /> {{ $t("message.assignPermissions") }}</a-button
-          >
+            ><SafetyOutlined style="font-size: 16px"
+          /></a-button>
           <a-button
             v-perm="RoleManagementPermissions.SYSTEM_ROLE_GRANT"
-            style="margin-right: 15px"
+            type="link"
+            size="small"
+            :title="$t('message.asscialionAccount')"
             @click="openRoleUserModal(record)"
-            ><LinkOutlined /> {{ $t("message.asscialionAccount") }}</a-button
-          >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="RoleManagementPermissions.DELETE" danger
-              ><delete-outlined /> {{ $t("message.delete") }}</a-button
+            ><LinkOutlined style="font-size: 16px"
+          /></a-button>
+          <template v-if="record[RoleFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreRole(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="RoleManagementPermissions.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -57,6 +122,7 @@
     <a-modal
       :open="modalVisible"
       :title="modalTitle"
+      :width="'60%'"
       :confirm-loading="confirmLoading"
       @ok="handleModalOk"
       @cancel="handleModalCancel"
@@ -80,6 +146,25 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewRole')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="roleNoLabel">
+          {{ selectedRecord?.[RoleFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roleNameLabel">
+          {{ selectedRecord?.[RoleFields.NAME] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="roleDescriptionLabel">
+          {{ selectedRecord?.[RoleFields.DESCRIPTION] || "-" }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
 
     <!-- 角色权限分配弹窗 -->
     <a-modal
@@ -208,6 +293,8 @@ import {
 } from "@/entities/role.entity";
 import { useI18n } from "vue-i18n";
 import generateSnowflakeId from "@/utils/snowflake";
+import ListFilter from "@/components/common/ListFilter.vue";
+import { getRoleFilterConfig } from "@/filters/role.filter.config";
 import { RoleManagementPermissions } from "@/common/permissioncode";
 
 const { t } = useI18n();
@@ -217,10 +304,18 @@ const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
 const roles = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
 const formRef = ref(null);
 const sortedInfo = ref({ order: null, columnKey: null });
+const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
+
+const currentFilterParams = reactive({});
+const roleFilterConfig = computed(() => getRoleFilterConfig(t));
 
 const form = reactive({ ...initialFormValues });
 
@@ -230,7 +325,214 @@ const roleNoLabel = computed(() => t("message.roleNumber"));
 const roleNameLabel = computed(() => t("message.roleName"));
 const roleDescriptionLabel = computed(() => t("message.roleDescription"));
 
-const columns = computed(() => getColumns(t));
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[RoleFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[RoleFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = roles.value.filter(
+    (item) => item[RoleFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[RoleFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[RoleFields.ID])) {
+      selectedRowKeys.value.push(record[RoleFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(record[RoleFields.ID]);
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  roles.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = roles.value.find(
+      (role) => role[RoleFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editRole(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteRole(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchRoleData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 130,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
+const buildServerParamsFromFilters = () => {
+  let params = {};
+  // 包含动态添加的字段，使用 effectiveConfig 而不是原始配置
+  const allFieldKeys = [
+    ...roleFilterConfig.value?.fields.map((f) => f.name),
+    RoleFields.IS_DELETED, // 确保包含 IsDelete 字段
+  ];
+
+  allFieldKeys.forEach((fieldName) => {
+    const val = filterValues[fieldName];
+    if (
+      val === null ||
+      val === undefined ||
+      (typeof val === "string" && val.trim() === "") ||
+      (Array.isArray(val) && val.length === 0)
+    ) {
+      return;
+    }
+
+    // 对于动态字段，直接赋值
+    if (fieldName === RoleFields.IS_DELETED) {
+      params[fieldName] = val;
+      return;
+    }
+
+    // 对于配置中的字段，按类型处理
+    const fieldConfig = roleFilterConfig.value?.fields.find(
+      (f) => f.name === fieldName,
+    );
+    if (!fieldConfig) return;
+
+    switch (fieldConfig.type) {
+      case "text":
+        params[fieldName] = val.toString().trim();
+        break;
+      case "number":
+      case "select":
+      case "boolean":
+        params[fieldName] = val;
+        break;
+      case "date":
+        params[fieldName] = dayjs(val).format("YYYY-MM-DD");
+        break;
+      case "date-range":
+        if (Array.isArray(val) && val.length === 2) {
+          const [start, end] = val;
+          params[`${fieldName}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${fieldName}.End`] = dayjs(end).format("YYYY-MM-DD");
+        }
+        break;
+      default:
+        break;
+    }
+  });
+
+  return params;
+};
+
+const handleFilterSearch = (vals) => {
+  Object.assign(filterValues, vals);
+  const built = buildServerParamsFromFilters();
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  Object.assign(currentFilterParams, built);
+  pagination.current = 1;
+  clearSelection(); // 重置选择
+  fetchRoleData();
+};
+
+const handleFilterReset = (vals) => {
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  if (vals && typeof vals === "object") {
+    filterValues.value = { ...vals };
+  } else {
+    filterValues.value = {};
+  }
+  clearSelection(); // 重置选择
+  fetchRoleData();
+};
 
 const pagination = reactive({
   current: 1,
@@ -248,6 +550,7 @@ const fetchRoleData = async () => {
       [RoleFields.PAGE]: pagination.current,
       [RoleFields.PAGE_SIZE]: pagination.pageSize,
       [RoleFields.IS_DELETED]: 0,
+      ...currentFilterParams,
     });
     if (result?.Items) {
       roles.value = result.Items.map((item) => ({
@@ -255,6 +558,8 @@ const fetchRoleData = async () => {
         [RoleFields.NUMBER]: item[RoleFields.NUMBER],
         [RoleFields.NAME]: item[RoleFields.NAME],
         [RoleFields.DESCRIPTION]: item[RoleFields.DESCRIPTION],
+        [RoleFields.IS_DELETED]: item[RoleFields.IS_DELETED] ?? 0,
+        [RoleFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -282,6 +587,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection();
   fetchRoleData();
 };
 
@@ -315,6 +621,7 @@ const handleModalOk = async () => {
       showSuccessNotification(t("message.addSuccess"));
     }
     modalVisible.value = false;
+    clearSelection();
     fetchRoleData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -327,15 +634,15 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreRole = async (record) => {
   try {
-    record[RoleFields.IS_DELETED] = 1;
-    var response = await deleteRole(record);
-    if (response && response.Success !== true) {
-      showErrorNotification(t("message.deleteFailed"));
-      return;
+    record[RoleFields.IS_DELETED] = 0;
+    const response = await updateRole(record);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
-    showSuccessNotification(t("message.deleteSuccess"));
     fetchRoleData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -345,6 +652,7 @@ const handleDelete = async (record) => {
 const handleTableChange = (newPagination) => {
   pagination.current = newPagination.current;
   pagination.pageSize = newPagination.pageSize;
+  clearSelection();
   fetchRoleData();
 };
 
@@ -557,14 +865,13 @@ const loadAdminOptions = async () => {
 // 加载客户选项（不分页）
 const loadCustomerOptions = async () => {
   try {
-    const res = await fetchCustomers({
-      [CustomerFields.IGNOREPAGING]: true,
+    const result = await fetchCustomers({
       [CustomerFields.IS_DELETED]: 0,
+      [CustomerFields.IGNOREPAGING]: true,
     });
-    const items = Array.isArray(res?.Items) ? res.Items : [];
-    customerOptions.value = items.map((it) => ({
-      label: `${it[CustomerFields.NAME]} (${it[CustomerFields.PHONE]})`,
-      value: it[CustomerFields.NUMBER],
+    customerOptions.value = result.Items.map((item) => ({
+      label: item[CustomerFields.NAME],
+      value: item[CustomerFields.NUMBER],
     }));
   } catch (e) {
     showErrorNotification(e?.message || t("message.pleaseTryAgainLater"));
-- 
Gitee


From ac4ae6d286a1fc24698a38790b5bb7c5e944061b Mon Sep 17 00:00:00 2001
From: ck_yeun9 <jackson@oscode.top>
Date: Sat, 14 Feb 2026 18:49:25 +0800
Subject: [PATCH 10/10] =?UTF-8?q?=E8=A1=A5=E5=85=85=E5=A4=9A=E9=80=89?=
 =?UTF-8?q?=E6=93=8D=E4=BD=9C=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/index.js                              |   2 +-
 src/common/errorHandler.js                    |  41 +-
 src/filters/administatortype.filter.config.js |  15 +
 src/i18n.js                                   |   4 +
 src/utils/index.js                            |  19 +-
 src/views/customermanagement/CustomerView.vue |   4 +-
 .../AdminTypeManagementView.vue               | 376 ++++++++++++++++--
 .../systemmanagement/RoleManagementView.vue   | 374 ++++++++++++++---
 8 files changed, 734 insertions(+), 101 deletions(-)
 create mode 100644 src/filters/administatortype.filter.config.js

diff --git a/src/api/index.js b/src/api/index.js
index 0719d54..23922dd 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -5,7 +5,7 @@ import { handleApiError, handleHttpError } from "@/common/errorHandler";
 
 const api = axios.create({
   baseURL: import.meta.env.VITE_API_URL,
-  timeout: 10000,
+  timeout: 30000,
   withCredentials: true,
 });
 
diff --git a/src/common/errorHandler.js b/src/common/errorHandler.js
index 93c2e1f..8b43ae2 100644
--- a/src/common/errorHandler.js
+++ b/src/common/errorHandler.js
@@ -1,4 +1,3 @@
-import router from "@/router";
 import i18n from "@/i18n";
 import { showErrorNotification, showWarningNotification } from "@/utils";
 import { redirectToLogin, handleLogout } from "@/utils/auth";
@@ -121,6 +120,18 @@ export function handleApiError(resData, response) {
 
 // 处理网络或 HTTP 层错误
 export function handleHttpError(error) {
+  if (import.meta.env.DEV) {
+    // eslint-disable-next-line no-console
+    console.error("[HTTP Error]", {
+      code: error?.code,
+      message: error?.message,
+      url: error?.config?.url,
+      method: error?.config?.method,
+      status: error?.response?.status,
+      params: error?.config?.params,
+    });
+  }
+
   if (error && error.response) {
     const status = error.response.status;
     const resData = error.response.data;
@@ -171,18 +182,26 @@ export function handleHttpError(error) {
   }
 
   // 网络或其他错误
-  // 清理敏感信息并跳转登录作为兜底
-  localStorage.removeItem("token");
-  localStorage.removeItem("username");
-  localStorage.removeItem("account");
-  showErrorNotification(
-    i18n.global.t("message.networkError") || "网络连接异常，请检查网络",
-  );
-  router.push("/signin");
+  // 网络异常时不强制退出或跳转，仅提示错误
+  const isTimeout =
+    error?.code === "ECONNABORTED" ||
+    (typeof error?.message === "string" &&
+      error.message.toLowerCase().includes("timeout"));
+  const fallbackMessage = isTimeout
+    ? "请求超时，请稍后重试"
+    : "网络连接异常，请检查网络";
+  const displayMessage = isTimeout
+    ? i18n.global.te("message.requestTimeout")
+      ? i18n.global.t("message.requestTimeout")
+      : fallbackMessage
+    : i18n.global.te("message.networkError")
+      ? i18n.global.t("message.networkError")
+      : fallbackMessage;
+  showErrorNotification(displayMessage);
   return Promise.reject({
     success: false,
-    code: 9001,
-    message: i18n.global.t("message.networkError") || "网络连接错误",
+    code: isTimeout ? 9002 : 9001,
+    message: displayMessage,
   });
 }
 
diff --git a/src/filters/administatortype.filter.config.js b/src/filters/administatortype.filter.config.js
new file mode 100644
index 0000000..c785ee8
--- /dev/null
+++ b/src/filters/administatortype.filter.config.js
@@ -0,0 +1,15 @@
+import { AdministratorTypeFields } from "@/entities/administratortype.entity";
+
+export const getAdminTypeFilterConfig = (t) => {
+  return {
+    title: t("message.adminTypeFilter"),
+    fields: [
+      {
+        name: AdministratorTypeFields.NAME,
+        type: "text",
+        label: t("message.adminTypeName"),
+        placeholder: t("message.pleaseInputAdminTypeName"),
+      },
+    ],
+  };
+};
diff --git a/src/i18n.js b/src/i18n.js
index 53211a3..cb0915a 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -522,6 +522,7 @@ const messages = {
       pleaseInputAdminTypeName: "Please input administrator type name",
       adminTypeNumber: "Administrator Type Number",
       adminTypeName: "Administrator Type Name",
+      adminTypeFilter: "Administrator Type Filter",
 
       rolemanagement: "Role Management",
       insertRole: "Create Role",
@@ -534,6 +535,7 @@ const messages = {
       roleNumber: "Role Number",
       roleName: "Role Name",
       roleDescription: "Role Description",
+      roleFilter: "Role Filter",
 
       menumanagement: "Menu Management",
       insertMenu: "Create Menu",
@@ -1197,6 +1199,7 @@ const messages = {
       pleaseInputAdminTypeName: "请输入管理员类型名称",
       adminTypeNumber: "管理员类型编号",
       adminTypeName: "管理员类型名称",
+      adminTypeFilter: "管理员类型筛选",
 
       rolemanagement: "角色管理",
       insertRole: "创建角色",
@@ -1209,6 +1212,7 @@ const messages = {
       roleNumber: "角色编号",
       roleName: "角色名称",
       roleDescription: "角色描述",
+      roleFilter: "角色筛选",
 
       menumanagement: "菜单管理",
       insertMenu: "创建菜单",
diff --git a/src/utils/index.js b/src/utils/index.js
index 74c250b..925039d 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -3,6 +3,21 @@ import dayjs from "dayjs";
 import { dateFieldConfig } from "@/config/dateFields";
 import i18n from "@/i18n";
 
+const normalizeNotificationDescription = (description) => {
+  if (description === null || description === undefined) return "";
+  if (typeof description === "string") return description;
+  if (description instanceof Error) return description.message || String(description);
+  if (typeof description === "object" && description.message) {
+    return String(description.message);
+  }
+  return String(description);
+};
+
+const buildNotificationKey = (type, description) => {
+  const normalized = normalizeNotificationDescription(description).trim();
+  return `${type}:${normalized}`;
+};
+
 export const utcToChinaTime = (utcDate) => {
   if (!utcDate) return "";
   const utc = new Date(utcDate);
@@ -19,9 +34,11 @@ export const showWarningNotification = (description) => {
 };
 
 export const showErrorNotification = (description) => {
+  const normalizedDescription = normalizeNotificationDescription(description);
   notification["error"]({
+    key: buildNotificationKey("error", normalizedDescription),
     message: i18n.global.t("message.operationTitle"),
-    description: description,
+    description: normalizedDescription,
     duration: 3,
   });
 };
diff --git a/src/views/customermanagement/CustomerView.vue b/src/views/customermanagement/CustomerView.vue
index 7af0362..d7f40ba 100644
--- a/src/views/customermanagement/CustomerView.vue
+++ b/src/views/customermanagement/CustomerView.vue
@@ -197,7 +197,7 @@
     <a-modal
       v-if="viewModalVisible"
       v-model:open="viewModalVisible"
-      :title="t('message.viewDepartment')"
+      :title="t('message.viewCustomer')"
       :width="'60%'"
       :footer="null"
     >
@@ -215,7 +215,7 @@
               : t("message.male")
           }}
         </a-descriptions-item>
-        <a-descriptions-item :label="t('message.customerBirthday')">
+        <a-descriptions-item :label="customerBirthdayLabel">
           {{ formatDate(selectedRecord?.[CustomerFields.BIRTH_DATE]) }}
         </a-descriptions-item>
         <a-descriptions-item :label="customerTypeLabel">
diff --git a/src/views/systemmanagement/AdminTypeManagementView.vue b/src/views/systemmanagement/AdminTypeManagementView.vue
index 78ab783..333112a 100644
--- a/src/views/systemmanagement/AdminTypeManagementView.vue
+++ b/src/views/systemmanagement/AdminTypeManagementView.vue
@@ -1,43 +1,106 @@
 <template>
   <div>
     <h1 style="margin-bottom: 15px">{{ translatedPageTitle }}</h1>
-    <a-button
-      style="margin-bottom: 15px; margin-right: 15px"
-      @click="refreshData"
-      ><sync-outlined /> {{ $t("message.refreshData") }}</a-button
-    >
-    <a-button
-      v-perm="AdminTypeManagementPermissions.CREATE"
-      type="primary"
-      style="margin-bottom: 15px"
-      @click="showModal"
-      ><plus-outlined /> {{ $t("message.insertAdminType") }}</a-button
-    >
+    <div style="margin-bottom: 15px">
+      <a-button style="margin-right: 15px" @click="refreshData">
+        <SyncOutlined /> {{ $t("message.refreshData") }}
+      </a-button>
+      <a-button
+        v-perm="AdminTypeManagementPermissions.CREATE"
+        type="primary"
+        style="margin-right: 15px"
+        @click="showModal"
+      >
+        <PlusOutlined /> {{ $t("message.insertAdminType") }}
+      </a-button>
+      <a-button
+        v-perm="AdminTypeManagementPermissions.UPDATE"
+        :disabled="selectedRowKeys.length !== 1"
+        style="margin-right: 15px"
+        @click="handleEdit"
+      >
+        <EditOutlined /> {{ $t("message.updateAdminType") }}
+      </a-button>
+      <a-popconfirm
+        :title="
+          t('message.areYouSureToDeleteSelectedRecords', {
+            count: selectedRowKeys.length,
+          })
+        "
+        :disabled="selectedRowKeys.length === 0"
+        @confirm="handleBatchDelete"
+      >
+        <a-button
+          v-perm="AdminTypeManagementPermissions.DELETE"
+          danger
+          :disabled="selectedRowKeys.length === 0"
+        >
+          <DeleteOutlined /> {{ $t("message.deleteAdminType") }}
+        </a-button>
+      </a-popconfirm>
+    </div>
+    <a-collapse style="margin-bottom: 15px">
+      <a-collapse-panel key="1" :header="$t('message.filter')">
+        <template #expandIcon="{ isActive }">
+          <caret-right-outlined
+            :style="{ transform: isActive ? 'rotate(90deg)' : 'rotate(0deg)' }"
+          />
+        </template>
+        <ListFilter
+          v-model:values="filterValues"
+          :config="adminTypeFilterConfig"
+          :show-is-deleted="true"
+          :is-deleted-default-value="0"
+          @search="handleFilterSearch"
+          @reset="handleFilterReset"
+        />
+      </a-collapse-panel>
+    </a-collapse>
     <a-table
+      :row-key="(record) => record[AdministratorTypeFields.ID]"
       :columns="columns"
-      :data-source="roles"
+      :data-source="admintypes"
       :loading="loading"
       :pagination="pagination"
+      :row-selection="rowSelection"
+      :custom-row="customRow"
       bordered
       @change="handleTableChange"
       @sorter-change="handleSorterChange"
     >
       <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'operation'">
+        <template v-if="column.key === 'selection'">
+          <a-checkbox
+            v-model:checked="record.selected"
+            @change="handleSelectChange(record, $event)"
+          />
+        </template>
+        <template v-else-if="column.key === 'action'">
           <a-button
-            v-perm="AdminTypeManagementPermissions.UPDATE"
-            style="margin-right: 15px"
-            @click="editAdminType(record)"
-            ><edit-outlined /> {{ $t("message.edit") }}</a-button
+            type="link"
+            size="small"
+            :title="$t('message.view')"
+            style="padding: 0 4px"
+            @click="handleView(record)"
           >
-          <a-popconfirm
-            :title="t('message.areYouSureToDeleteRecord')"
-            @confirm="handleDelete(record)"
-          >
-            <a-button v-perm="AdminTypeManagementPermissions.DELETE" danger
-              ><delete-outlined /> {{ $t("message.delete") }}</a-button
+            <EyeOutlined style="font-size: 16px" />
+          </a-button>
+          <template v-if="record[AdministratorTypeFields.IS_DELETED] == 1">
+            <a-popconfirm
+              :title="t('message.areYouSureToRestoreRecord')"
+              @confirm="restoreAdminType(record)"
             >
-          </a-popconfirm>
+              <a-button
+                v-perm="AdministratorTypeFields.UPDATE"
+                type="link"
+                size="small"
+                :title="$t('message.restore')"
+                style="color: green"
+              >
+                <UndoOutlined style="font-size: 16px" />
+              </a-button>
+            </a-popconfirm>
+          </template>
         </template>
       </template>
     </a-table>
@@ -68,6 +131,22 @@
         </a-form-item>
       </a-form>
     </a-modal>
+    <a-modal
+      v-if="viewModalVisible"
+      v-model:open="viewModalVisible"
+      :title="t('message.viewAdminType')"
+      :width="'60%'"
+      :footer="null"
+    >
+      <a-descriptions bordered :column="2">
+        <a-descriptions-item :label="typeNoLabel">
+          {{ selectedRecord?.[AdministratorTypeFields.NUMBER] }}
+        </a-descriptions-item>
+        <a-descriptions-item :label="typeNameLabel">
+          {{ selectedRecord?.[AdministratorTypeFields.NAME] }}
+        </a-descriptions-item>
+      </a-descriptions>
+    </a-modal>
   </div>
 </template>
 
@@ -90,6 +169,8 @@ import {
 } from "@/entities/administratortype.entity";
 import { useI18n } from "vue-i18n";
 import generateSnowflakeId from "@/utils/snowflake";
+import ListFilter from "@/components/common/ListFilter.vue";
+import { getAdminTypeFilterConfig } from "@/filters/administatortype.filter.config";
 import { AdminTypeManagementPermissions } from "@/common/permissioncode";
 
 const { t } = useI18n();
@@ -97,10 +178,17 @@ const route = useRoute();
 const pageTitleKey = computed(() => getPageTitle(route.path));
 const translatedPageTitle = computed(() => t(pageTitleKey.value));
 const loading = ref(false);
-const roles = ref([]);
+const admintypes = ref([]);
 const modalVisible = ref(false);
+const viewModalVisible = ref(false);
 const modalTitle = ref("");
 const confirmLoading = ref(false);
+const filterValues = ref({});
+const selectedRecord = ref(null);
+const selectedRowKeys = ref([]);
+const selectedRows = ref([]);
+const currentFilterParams = reactive({});
+const adminTypeFilterConfig = computed(() => getAdminTypeFilterConfig(t));
 const formRef = ref(null);
 const sortedInfo = ref({ order: null, columnKey: null });
 
@@ -111,7 +199,217 @@ const rules = getFormRules(t);
 const typeNoLabel = computed(() => t("message.adminTypeNumber"));
 const typeNameLabel = computed(() => t("message.adminTypeName"));
 
-const columns = computed(() => getColumns(t));
+// 行选择配置
+const rowSelection = computed(() => ({
+  selectedRowKeys: selectedRowKeys.value,
+  onChange: (selectedKeys, selectedRows) => {
+    selectedRowKeys.value = selectedKeys;
+    selectedRows.value = selectedRows;
+  },
+  getCheckboxProps: (record) => ({
+    disabled: record[AdministratorTypeFields.IS_DELETED] == 1,
+  }),
+}));
+
+const selectRow = (record) => {
+  const recordId = record[AdministratorTypeFields.ID];
+
+  if (
+    selectedRowKeys.value.length === 1 &&
+    selectedRowKeys.value[0] === recordId
+  ) {
+    return;
+  }
+
+  selectedRowKeys.value = [recordId];
+  selectedRows.value = admintypes.value.filter(
+    (item) => item[AdministratorTypeFields.ID] === recordId,
+  );
+};
+
+const customRow = (record) => {
+  return {
+    onClick: () => {
+      if (record[AdministratorTypeFields.IS_DELETED] === 1) {
+        return;
+      }
+      selectRow(record);
+    },
+  };
+};
+
+// 处理单行选择变化
+const handleSelectChange = (record, e) => {
+  const checked = e.target.checked;
+  record.selected = checked;
+  if (checked) {
+    if (!selectedRowKeys.value.includes(record[AdministratorTypeFields.ID])) {
+      selectedRowKeys.value.push(record[AdministratorTypeFields.ID]);
+      selectedRows.value.push(record);
+    }
+  } else {
+    const index = selectedRowKeys.value.indexOf(
+      record[AdministratorTypeFields.ID],
+    );
+    if (index > -1) {
+      selectedRowKeys.value.splice(index, 1);
+      selectedRows.value.splice(index, 1);
+    }
+  }
+};
+
+// 清空选择
+const clearSelection = () => {
+  selectedRowKeys.value = [];
+  selectedRows.value = [];
+  admintypes.value.forEach((record) => {
+    record.selected = false;
+  });
+};
+
+// 查看详情
+const handleView = (record) => {
+  selectedRecord.value = record;
+  viewModalVisible.value = true;
+};
+
+// 编辑选中的单条记录
+const handleEdit = () => {
+  if (selectedRowKeys.value.length === 1) {
+    const selectedRecord = admintypes.value.find(
+      (adminType) =>
+        adminType[AdministratorTypeFields.ID] === selectedRowKeys.value[0],
+    );
+    if (selectedRecord) {
+      editAdminType(selectedRecord);
+    } else {
+      showErrorNotification(t("message.selectedRecordNotFound"));
+    }
+  }
+};
+
+// 批量删除
+const handleBatchDelete = async () => {
+  if (selectedRowKeys.value.length === 0) {
+    showErrorNotification(t("message.pleaseSelectRecords"));
+    return;
+  }
+
+  try {
+    // 创建批量删除的请求对象
+    const deleteRequest = {
+      DelIds: selectedRowKeys.value, // 使用DelIds字段传递要删除的ID列表
+    };
+    const response = await deleteAdminType(deleteRequest);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.batchDeleteSuccess"));
+      clearSelection();
+      fetchAdminTypeData();
+    } else {
+      showErrorNotification(response?.Message || t("message.operationFailed"));
+    }
+  } catch (error) {
+    showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
+  }
+};
+
+// 修改列定义，包含选择列和操作列
+const columns = computed(() => {
+  const baseColumns = getColumns(t, handleView);
+  return [
+    {
+      title: t("message.action"),
+      key: "action",
+      width: 100,
+      fixed: "left",
+      align: "center",
+    },
+    ...baseColumns.slice(2), // 跳过原有的前两列
+  ];
+});
+
+const buildServerParamsFromFilters = () => {
+  let params = {};
+  // 包含动态添加的字段，使用 effectiveConfig 而不是原始配置
+  const allFieldKeys = [
+    ...adminTypeFilterConfig.value?.fields.map((f) => f.name),
+    AdministratorTypeFields.IS_DELETED, // 确保包含 IsDelete 字段
+  ];
+
+  allFieldKeys.forEach((fieldName) => {
+    const val = filterValues[fieldName];
+    if (
+      val === null ||
+      val === undefined ||
+      (typeof val === "string" && val.trim() === "") ||
+      (Array.isArray(val) && val.length === 0)
+    ) {
+      return;
+    }
+
+    // 对于动态字段，直接赋值
+    if (fieldName === AdministratorTypeFields.IS_DELETED) {
+      params[fieldName] = val;
+      return;
+    }
+
+    // 对于配置中的字段，按类型处理
+    const fieldConfig = adminTypeFilterConfig.value?.fields.find(
+      (f) => f.name === fieldName,
+    );
+    if (!fieldConfig) return;
+
+    switch (fieldConfig.type) {
+      case "text":
+        params[fieldName] = val.toString().trim();
+        break;
+      case "number":
+      case "select":
+      case "boolean":
+        params[fieldName] = val;
+        break;
+      case "date":
+        params[fieldName] = dayjs(val).format("YYYY-MM-DD");
+        break;
+      case "date-range":
+        if (Array.isArray(val) && val.length === 2) {
+          const [start, end] = val;
+          params[`${fieldName}.Start`] = dayjs(start).format("YYYY-MM-DD");
+          params[`${fieldName}.End`] = dayjs(end).format("YYYY-MM-DD");
+        }
+        break;
+      default:
+        break;
+    }
+  });
+
+  return params;
+};
+
+const handleFilterSearch = (vals) => {
+  Object.assign(filterValues, vals);
+  const built = buildServerParamsFromFilters();
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  Object.assign(currentFilterParams, built);
+  pagination.current = 1;
+  clearSelection(); // 重置选择
+  fetchAdminTypeData();
+};
+
+const handleFilterReset = (vals) => {
+  Object.keys(currentFilterParams).forEach(
+    (k) => delete currentFilterParams[k],
+  );
+  if (vals && typeof vals === "object") {
+    filterValues.value = { ...vals };
+  } else {
+    filterValues.value = {};
+  }
+  clearSelection(); // 重置选择
+  fetchAdminTypeData();
+};
 
 const pagination = reactive({
   current: 1,
@@ -129,14 +427,16 @@ const fetchAdminTypeData = async () => {
       [AdministratorTypeFields.PAGE]: pagination.current,
       [AdministratorTypeFields.PAGE_SIZE]: pagination.pageSize,
       [AdministratorTypeFields.IS_DELETED]: 0,
+      ...currentFilterParams,
     });
     if (result?.Items) {
-      roles.value = result.Items.map((item) => ({
+      admintypes.value = result.Items.map((item) => ({
         [AdministratorTypeFields.ID]: item[AdministratorTypeFields.ID],
         [AdministratorTypeFields.NUMBER]: item[AdministratorTypeFields.NUMBER],
         [AdministratorTypeFields.NAME]: item[AdministratorTypeFields.NAME],
         [AdministratorTypeFields.IS_DELETED]:
-          item[AdministratorTypeFields.IS_DELETED],
+          item[AdministratorTypeFields.IS_DELETED] ?? 0,
+        [AdministratorTypeFields.SELECTED]: false,
       }));
       pagination.total = result.TotalCount;
     }
@@ -163,6 +463,7 @@ const showModal = () => {
 };
 
 const refreshData = () => {
+  clearSelection(); // 重置选择
   fetchAdminTypeData();
 };
 
@@ -195,6 +496,7 @@ const handleModalOk = async () => {
       showSuccessNotification(t("message.addSuccess"));
     }
     modalVisible.value = false;
+    clearSelection(); // 重置选择
     fetchAdminTypeData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
@@ -207,16 +509,16 @@ const handleModalCancel = () => {
   modalVisible.value = false;
 };
 
-const handleDelete = async (record) => {
+const restoreAdminType = async (record) => {
   try {
-    record[AdministratorTypeFields.IS_DELETED] = 1;
-    var response = await deleteAdminType(record);
-    if (response && response.Success !== true) {
-      showErrorNotification(t("message.deleteFailed"));
-      return;
+    record[AdministratorTypeFields.IS_DELETED] = 0;
+    const response = await updateAdminType(record);
+    if (response && response.Success) {
+      showSuccessNotification(t("message.restoreSuccess"));
+    } else {
+      showErrorNotification(response.Message || t("message.operationFailed"));
     }
-    showSuccessNotification(t("message.deleteSuccess"));
-    fetchAdminTypeData();
+    fetchDepartmentData();
   } catch (error) {
     showErrorNotification(error.message || t("message.pleaseTryAgainLater"));
   }
diff --git a/src/views/systemmanagement/RoleManagementView.vue b/src/views/systemmanagement/RoleManagementView.vue
index 8a682e2..08fd474 100644
--- a/src/views/systemmanagement/RoleManagementView.vue
+++ b/src/views/systemmanagement/RoleManagementView.vue
@@ -57,6 +57,7 @@
       </a-collapse-panel>
     </a-collapse>
     <a-table
+      :row-key="(record) => record[RoleFields.ID]"
       :columns="columns"
       :data-source="roles"
       :loading="loading"
@@ -241,15 +242,8 @@
         <b>{{ currentRoleNumberUsers }}</b>
       </div>
       <div style="margin-bottom: 8px">
-        <a-segmented
-          v-model:value="currentUserGroupType"
-          :options="[
-            { label: '管理员', value: 'administrator' },
-            { label: '客户', value: 'customer' },
-            { label: '员工', value: 'employee' },
-          ]"
-          @change="handleUserGroupChange"
-        />
+        <span style="color: #666; margin-right: 8px">账号类型:</span>
+        <b>{{ currentUserGroupTypeLabel }}</b>
       </div>
       <a-select
         v-model:value="selectedRoleUserNumbers"
@@ -259,13 +253,24 @@
         :options="displayedRoleUserOptions"
         :max-tag-count="10"
         :allow-clear="true"
+        :loading="activeRoleUserOptionsLoading"
+        show-search
+        :filter-option="false"
+        @search="handleRoleUserSearch"
+        @popup-scroll="handleRoleUserPopupScroll"
       />
+      <div
+        v-if="roleUserOptionsHint"
+        style="margin-top: 8px; color: #999; font-size: 12px"
+      >
+        {{ roleUserOptionsHint }}
+      </div>
     </a-modal>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted, computed, reactive } from "vue";
+import { ref, onMounted, computed, reactive, onBeforeUnmount } from "vue";
 import { useRoute } from "vue-router";
 import { getPageTitle } from "@/utils/pageTitle";
 import { showErrorNotification, showSuccessNotification } from "@/utils/index";
@@ -283,6 +288,7 @@ import { fetchAdmins } from "@/api/administratorapi";
 import { selectPermissionList } from "@/api/permissionapi";
 import { fetchCustomers } from "@/api/customerapi";
 import { fetchEmployees } from "@/api/employeeapi";
+import { AdministratorFields } from "@/entities/administrator.entity";
 import { CustomerFields } from "@/entities/customer.entity";
 import { EmployeeFields } from "@/entities/employee.entity";
 import {
@@ -296,6 +302,7 @@ import generateSnowflakeId from "@/utils/snowflake";
 import ListFilter from "@/components/common/ListFilter.vue";
 import { getRoleFilterConfig } from "@/filters/role.filter.config";
 import { RoleManagementPermissions } from "@/common/permissioncode";
+import { debounce } from "lodash-es";
 
 const { t } = useI18n();
 const route = useRoute();
@@ -328,9 +335,9 @@ const roleDescriptionLabel = computed(() => t("message.roleDescription"));
 // 行选择配置
 const rowSelection = computed(() => ({
   selectedRowKeys: selectedRowKeys.value,
-  onChange: (selectedKeys, selectedRows) => {
+  onChange: (selectedKeys, rows) => {
     selectedRowKeys.value = selectedKeys;
-    selectedRows.value = selectedRows;
+    selectedRows.value = rows;
   },
   getCheckboxProps: (record) => ({
     disabled: record[RoleFields.IS_DELETED] == 1,
@@ -554,6 +561,7 @@ const fetchRoleData = async () => {
     });
     if (result?.Items) {
       roles.value = result.Items.map((item) => ({
+        ...item,
         [RoleFields.ID]: item[RoleFields.ID],
         [RoleFields.NUMBER]: item[RoleFields.NUMBER],
         [RoleFields.NAME]: item[RoleFields.NAME],
@@ -831,12 +839,54 @@ const handleRolePermCancel = () => {
 const roleUserModalVisible = ref(false);
 const roleUserModalTitle = ref("关联账号");
 const roleUserModalLoading = ref(false);
+const roleUserModalRequestId = ref(0);
 const currentRoleNumberUsers = ref("");
 const adminOptions = ref([]);
 const customerOptions = ref([]);
 const employeeOptions = ref([]);
+const adminOptionsLoading = ref(false);
+const customerOptionsLoading = ref(false);
+const employeeOptionsLoading = ref(false);
+const adminOptionPaging = reactive({
+  page: 1,
+  pageSize: 30,
+  total: 0,
+  keyword: "",
+  hasMore: true,
+});
+const customerOptionPaging = reactive({
+  page: 1,
+  pageSize: 30,
+  total: 0,
+  keyword: "",
+  hasMore: true,
+});
+const employeeOptionPaging = reactive({
+  page: 1,
+  pageSize: 30,
+  total: 0,
+  keyword: "",
+  hasMore: true,
+});
 const currentUserGroupType = ref("administrator");
+const currentUserGroupTypeLabel = computed(() => {
+  if (currentUserGroupType.value === "customer") return "客户";
+  if (currentUserGroupType.value === "employee") return "员工";
+  return "管理员";
+});
 const selectedRoleUserNumbers = ref([]);
+const activeRoleUserOptionsLoading = computed(() => {
+  if (currentUserGroupType.value === "administrator") {
+    return adminOptionsLoading.value;
+  }
+  if (currentUserGroupType.value === "customer") {
+    return customerOptionsLoading.value;
+  }
+  return employeeOptionsLoading.value;
+});
+const roleUserOptionsHint = computed(() =>
+  activeRoleUserOptionsLoading.value ? "加载中..." : "下拉到底自动加载更多",
+);
 const displayedRoleUserOptions = computed(() => {
   switch (currentUserGroupType.value) {
     case "customer":
@@ -848,77 +898,282 @@ const displayedRoleUserOptions = computed(() => {
   }
 });
 
-// 加载管理员选项（不分页）
-const loadAdminOptions = async () => {
+// 加载管理员选项（分页）
+const mergeUniqueOptions = (oldOptions, nextOptions) => {
+  const merged = [...oldOptions, ...nextOptions];
+  const uniqMap = new Map();
+  merged.forEach((opt) => uniqMap.set(String(opt.value), opt));
+  return Array.from(uniqMap.values());
+};
+
+const loadAdminOptions = async (reset = true) => {
+  if (adminOptionsLoading.value) return;
+  if (!reset && !adminOptionPaging.hasMore) return;
+
+  if (reset) {
+    adminOptionPaging.page = 1;
+    adminOptionPaging.total = 0;
+    adminOptionPaging.hasMore = true;
+    adminOptions.value = [];
+  }
+
+  adminOptionsLoading.value = true;
   try {
-    const res = await fetchAdmins({ IgnorePaging: true, IsDelete: 0 });
+    const params = {
+      [AdministratorFields.IS_DELETED]: 0,
+      [AdministratorFields.PAGE]: adminOptionPaging.page,
+      [AdministratorFields.PAGE_SIZE]: adminOptionPaging.pageSize,
+    };
+    if (adminOptionPaging.keyword) {
+      params[AdministratorFields.NAME] = adminOptionPaging.keyword;
+    }
+
+    const res = await fetchAdmins(params);
     const items = Array.isArray(res?.Items) ? res.Items : [];
-    adminOptions.value = items.map((it) => ({
-      label: `${it.Name} (${it.Account})`,
-      value: it.Number,
+    const nextOptions = items.map((it) => ({
+      label: `${it[AdministratorFields.TYPENAME]} - ${it[AdministratorFields.NAME]} (${it[AdministratorFields.ACCOUNT]})`,
+      value: it[AdministratorFields.NUMBER],
     }));
+    adminOptions.value = mergeUniqueOptions(adminOptions.value, nextOptions);
+    adminOptionPaging.total = Number(res?.TotalCount || 0);
+    adminOptionPaging.page += 1;
+    adminOptionPaging.hasMore =
+      adminOptions.value.length < adminOptionPaging.total;
   } catch (e) {
     showErrorNotification(e?.message || t("message.pleaseTryAgainLater"));
+  } finally {
+    adminOptionsLoading.value = false;
   }
 };
 
-// 加载客户选项（不分页）
-const loadCustomerOptions = async () => {
+// 加载客户选项（分页）
+const loadCustomerOptions = async (reset = true) => {
+  if (customerOptionsLoading.value) return;
+  if (!reset && !customerOptionPaging.hasMore) return;
+
+  if (reset) {
+    customerOptionPaging.page = 1;
+    customerOptionPaging.total = 0;
+    customerOptionPaging.hasMore = true;
+    customerOptions.value = [];
+  }
+
+  customerOptionsLoading.value = true;
   try {
-    const result = await fetchCustomers({
+    const params = {
       [CustomerFields.IS_DELETED]: 0,
-      [CustomerFields.IGNOREPAGING]: true,
+      [CustomerFields.PAGE]: customerOptionPaging.page,
+      [CustomerFields.PAGE_SIZE]: customerOptionPaging.pageSize,
+    };
+    if (customerOptionPaging.keyword) {
+      params[CustomerFields.NAME] = customerOptionPaging.keyword;
+    }
+
+    const result = await fetchCustomers({
+      ...params,
     });
-    customerOptions.value = result.Items.map((item) => ({
-      label: item[CustomerFields.NAME],
+    const items = Array.isArray(result?.Items) ? result.Items : [];
+    const nextOptions = items.map((item) => ({
+      label: `${item[CustomerFields.TYPE_NAME]} - ${item[CustomerFields.NAME]} (${item[CustomerFields.NUMBER]})`,
       value: item[CustomerFields.NUMBER],
     }));
+
+    customerOptions.value = mergeUniqueOptions(
+      customerOptions.value,
+      nextOptions,
+    );
+
+    customerOptionPaging.total = Number(result?.TotalCount || 0);
+    customerOptionPaging.page += 1;
+    customerOptionPaging.hasMore =
+      customerOptions.value.length < customerOptionPaging.total;
   } catch (e) {
     showErrorNotification(e?.message || t("message.pleaseTryAgainLater"));
+  } finally {
+    customerOptionsLoading.value = false;
   }
 };
 
-// 加载员工选项（不分页）
-const loadEmployeeOptions = async () => {
+const loadMoreCustomerOptions = () => loadCustomerOptions(false);
+
+const loadMoreAdminOptions = () => loadAdminOptions(false);
+
+const doSearchCustomerOptions = debounce((val) => {
+  customerOptionPaging.keyword = String(val || "").trim();
+  loadCustomerOptions(true);
+}, 350);
+
+const doSearchAdminOptions = debounce((val) => {
+  adminOptionPaging.keyword = String(val || "").trim();
+  loadAdminOptions(true);
+}, 350);
+
+// 加载员工选项（分页）
+const loadEmployeeOptions = async (reset = true) => {
+  if (employeeOptionsLoading.value) return;
+  if (!reset && !employeeOptionPaging.hasMore) return;
+
+  if (reset) {
+    employeeOptionPaging.page = 1;
+    employeeOptionPaging.total = 0;
+    employeeOptionPaging.hasMore = true;
+    employeeOptions.value = [];
+  }
+
+  employeeOptionsLoading.value = true;
   try {
-    const res = await fetchEmployees({
-      [EmployeeFields.IGNOREPAGING]: true,
+    const params = {
       [EmployeeFields.IS_DELETED]: 0,
-    });
+      [EmployeeFields.PAGE]: employeeOptionPaging.page,
+      [EmployeeFields.PAGE_SIZE]: employeeOptionPaging.pageSize,
+    };
+    if (employeeOptionPaging.keyword) {
+      params[EmployeeFields.NAME] = employeeOptionPaging.keyword;
+    }
+
+    const res = await fetchEmployees(params);
     const items = Array.isArray(res?.Items) ? res.Items : [];
-    employeeOptions.value = items.map((it) => ({
-      label: `${it[EmployeeFields.NAME]} (${it[EmployeeFields.DEPARTMENTNAME] || ""})`,
+    const nextOptions = items.map((it) => ({
+      label: `${it[EmployeeFields.POSITIONNAME]} - ${it[EmployeeFields.NAME]} (${it[EmployeeFields.DEPARTMENTNAME] || ""})`,
       value: it[EmployeeFields.NUMBER],
     }));
+    employeeOptions.value = mergeUniqueOptions(
+      employeeOptions.value,
+      nextOptions,
+    );
+    employeeOptionPaging.total = Number(res?.TotalCount || 0);
+    employeeOptionPaging.page += 1;
+    employeeOptionPaging.hasMore =
+      employeeOptions.value.length < employeeOptionPaging.total;
   } catch (e) {
     showErrorNotification(e?.message || t("message.pleaseTryAgainLater"));
+  } finally {
+    employeeOptionsLoading.value = false;
   }
 };
 
+const loadMoreEmployeeOptions = () => loadEmployeeOptions(false);
+
+const doSearchEmployeeOptions = debounce((val) => {
+  employeeOptionPaging.keyword = String(val || "").trim();
+  loadEmployeeOptions(true);
+}, 350);
+
 // 加载角色当前已关联的管理员
-const loadRoleUsers = async (roleNumber) => {
+const loadRoleUsers = async (roleNumber, requestId) => {
   try {
     const list = await readRoleUsers(roleNumber);
+    if (requestId !== roleUserModalRequestId.value) return;
     selectedRoleUserNumbers.value = Array.isArray(list) ? list : [];
   } catch (e) {
+    if (requestId !== roleUserModalRequestId.value) return;
     showErrorNotification(e?.message || t("message.pleaseTryAgainLater"));
   }
 };
 
+const normalizeRoleUserGroupType = (raw) => {
+  if (raw === null || raw === undefined) return "";
+  const txt = String(raw).trim().toLowerCase();
+  if (!txt) return "";
+
+  if (
+    txt.includes("customer") ||
+    txt.includes("guest") ||
+    txt.includes("client") ||
+    txt.includes("客户")
+  ) {
+    return "customer";
+  }
+  if (
+    txt.includes("employee") ||
+    txt.includes("staff") ||
+    txt.includes("worker") ||
+    txt.includes("员工")
+  ) {
+    return "employee";
+  }
+  if (
+    txt.includes("admin") ||
+    txt.includes("administrator") ||
+    txt.includes("manager") ||
+    txt.includes("管理员")
+  ) {
+    return "administrator";
+  }
+
+  // 常见数值枚举兜底：0=管理员，1=员工，2=客户
+  if (txt === "0") return "administrator";
+  if (txt === "1") return "employee";
+  if (txt === "2") return "customer";
+
+  return "";
+};
+
+const inferRoleUserGroupType = (record) => {
+  if (!record || typeof record !== "object") {
+    return "employee";
+  }
+
+  const strongKeys = [
+    "UserGroupType",
+    "RoleUserType",
+    "AccountType",
+    "RoleType",
+    "BelongType",
+    "TargetUserType",
+    "ApplicableUserType",
+    "Type",
+    "TypeName",
+  ];
+
+  for (const key of strongKeys) {
+    if (Object.prototype.hasOwnProperty.call(record, key)) {
+      const mapped = normalizeRoleUserGroupType(record[key]);
+      if (mapped) return mapped;
+    }
+  }
+
+  // 弱匹配：遍历可能与 type 相关字段
+  for (const [key, val] of Object.entries(record)) {
+    if (!/type|group|scope|belong|target/i.test(String(key))) continue;
+    const mapped = normalizeRoleUserGroupType(val);
+    if (mapped) return mapped;
+  }
+
+  // 最后按角色编号/名称兜底推断
+  const marker = `${record[RoleFields.NUMBER] || ""} ${record[RoleFields.NAME] || ""}`;
+  const mappedByName = normalizeRoleUserGroupType(marker);
+  return mappedByName || "employee";
+};
+
 // 打开“关联管理员”弹窗
 // 打开“关联账号”弹窗
 const openRoleUserModal = async (record) => {
   const roleNo = record?.[RoleFields.NUMBER];
   if (!roleNo) return;
+  const requestId = Date.now();
+  roleUserModalRequestId.value = requestId;
+  const userType = inferRoleUserGroupType(record);
   currentRoleNumberUsers.value = roleNo;
-  roleUserModalTitle.value = "关联账号";
+  roleUserModalTitle.value = `关联账号 - ${userType === "customer" ? "客户" : userType === "employee" ? "员工" : "管理员"}`;
+  selectedRoleUserNumbers.value = [];
   roleUserModalVisible.value = true;
   roleUserModalLoading.value = true;
   try {
-    currentUserGroupType.value = "administrator";
-    await loadAdminOptions();
-    await loadRoleUsers(roleNo);
+    adminOptionPaging.keyword = "";
+    customerOptionPaging.keyword = "";
+    employeeOptionPaging.keyword = "";
+    currentUserGroupType.value = userType;
+    if (userType === "administrator") {
+      await loadAdminOptions(true);
+    } else if (userType === "customer") {
+      await loadCustomerOptions(true);
+    } else {
+      await loadEmployeeOptions(true);
+    }
+    await loadRoleUsers(roleNo, requestId);
   } finally {
+    if (requestId !== roleUserModalRequestId.value) return;
     roleUserModalLoading.value = false;
   }
 };
@@ -945,26 +1200,47 @@ const handleRoleUserSave = async () => {
   }
 };
 
-// 切换账号分组（管理员/客户/员工）
-const handleUserGroupChange = async (val) => {
-  currentUserGroupType.value = val;
-  roleUserModalLoading.value = true;
-  try {
-    if (val === "administrator") {
-      await loadAdminOptions();
-    } else if (val === "customer") {
-      await loadCustomerOptions();
-    } else {
-      await loadEmployeeOptions();
+const handleRoleUserSearch = (val) => {
+  if (currentUserGroupType.value === "administrator") {
+    doSearchAdminOptions(val);
+    return;
+  }
+  if (currentUserGroupType.value === "customer") {
+    doSearchCustomerOptions(val);
+    return;
+  }
+  doSearchEmployeeOptions(val);
+};
+
+const handleRoleUserPopupScroll = (e) => {
+  const target = e?.target;
+  if (!target) return;
+  const distanceToBottom =
+    target.scrollHeight - target.scrollTop - target.clientHeight;
+  if (distanceToBottom <= 24) {
+    if (currentUserGroupType.value === "administrator") {
+      loadMoreAdminOptions();
+      return;
     }
-  } finally {
-    roleUserModalLoading.value = false;
+    if (currentUserGroupType.value === "customer") {
+      loadMoreCustomerOptions();
+      return;
+    }
+    loadMoreEmployeeOptions();
   }
 };
 
 const handleRoleUserCancel = () => {
+  roleUserModalRequestId.value = Date.now();
+  selectedRoleUserNumbers.value = [];
   roleUserModalVisible.value = false;
 };
+
+onBeforeUnmount(() => {
+  doSearchAdminOptions.cancel();
+  doSearchCustomerOptions.cancel();
+  doSearchEmployeeOptions.cancel();
+});
 </script>
 
 <style scoped>
-- 
Gitee