From 11747a490c88f5749f1e48fb9d43b77468623e76 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A7=9C=E6=B0=B8=E6=98=A5?= <JSpringYC@gmail.com>
Date: Fri, 5 Dec 2025 16:55:36 +0800
Subject: [PATCH] =?UTF-8?q?feat-wip(components):=20=E8=A1=8C=E6=94=BF?=
 =?UTF-8?q?=E5=8C=BA=E5=88=92=E7=9B=B8=E5=85=B3=E9=A1=B5=E9=9D=A2=E4=BB=A3?=
 =?UTF-8?q?=E7=A0=81=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/typings/api/sys/rbac.d.ts                 |  4 +-
 src/views/sys/rbac/region/index.vue           | 37 ++++++++++++-------
 .../region/modules/region-operate-drawer.vue  | 17 +++++++--
 3 files changed, 39 insertions(+), 19 deletions(-)

diff --git a/src/typings/api/sys/rbac.d.ts b/src/typings/api/sys/rbac.d.ts
index 259eab4b..be96eebe 100644
--- a/src/typings/api/sys/rbac.d.ts
+++ b/src/typings/api/sys/rbac.d.ts
@@ -10,9 +10,9 @@ declare namespace Api {
         rootCode: string | null;
         name: string;
         code: string;
-        extCode: string;
+        extCode: string | null;
         sort: number;
-        description: string;
+        description: string | null;
         createTime: string;
         updateTime: string;
         children: RegionVO[];
diff --git a/src/views/sys/rbac/region/index.vue b/src/views/sys/rbac/region/index.vue
index 270e6966..d7707e1f 100644
--- a/src/views/sys/rbac/region/index.vue
+++ b/src/views/sys/rbac/region/index.vue
@@ -1,12 +1,14 @@
 <script setup lang="tsx">
 import { reactive } from 'vue';
 import { NButton, NPopconfirm } from 'naive-ui';
+import { jsonClone } from '@sa/utils';
 import { fetchRegionDelete, fetchRegionDeleteBatch, fetchRegionPaginate } from '@/service/api';
 import { useAppStore } from '@/store/modules/app';
 import { defaultTransform, useNaivePaginatedTable, useTableOperate } from '@/hooks/common/table';
 import { $t } from '@/locales';
 import RegionSearch from '@/views/sys/rbac/region/modules/region-search.vue';
 import RegionOperateDrawer from '@/views/sys/rbac/region/modules/region-operate-drawer.vue';
+import RegionVO = Api.Sys.Rbac.RegionVO;
 
 // ******************** 数据定义 ********************
 
@@ -43,13 +45,6 @@ const { columns, columnChecks, data, loading, getData, getDataByPage, pagination
       type: 'selection',
       align: 'center'
     },
-    {
-      key: 'index',
-      title: $t('common.index'),
-      width: 50,
-      align: 'center',
-      render: (_, index) => index + 1
-    },
     {
       key: 'name',
       title: $t('page.sys.rbac.region.fields.name'),
@@ -92,10 +87,10 @@ const { columns, columnChecks, data, loading, getData, getDataByPage, pagination
       align: 'center',
       render: row => (
         <div class="flex-center gap-8px">
-          <NButton type="primary" ghost size="small" onClick={() => handleAddChildren(row.id)}>
+          <NButton type="primary" ghost size="small" onClick={() => handleAddChildren(row)}>
             {$t('common.children')}
           </NButton>
-          <NButton type="primary" ghost size="small" onClick={() => edit(row.id)}>
+          <NButton type="primary" ghost size="small" onClick={() => edit(row)}>
             {$t('common.edit')}
           </NButton>
           <NPopconfirm onPositiveClick={() => handleDelete(row.id)}>
@@ -114,7 +109,7 @@ const { columns, columnChecks, data, loading, getData, getDataByPage, pagination
   ]
 });
 // 表格操作
-const { drawerVisible, operateType, editingData, checkedRowKeys, handleAdd, handleEdit, onDeleted, onBatchDeleted } =
+const { drawerVisible, operateType, editingData, checkedRowKeys, openDrawer, onDeleted, onBatchDeleted } =
   useTableOperate(data, 'id', getData);
 
 // ******************** 触发事件 ********************
@@ -131,11 +126,25 @@ function handleDelete(id: string) {
   });
 }
 
-function edit(id: string) {
-  handleEdit(id);
+function edit(row: RegionVO) {
+  operateType.value = 'edit';
+  editingData.value = jsonClone(row);
+  openDrawer();
 }
 
-function handleAddChildren(_: string) {}
+function add() {
+  operateType.value = 'add';
+  editingData.value = null;
+  openDrawer();
+}
+
+function handleAddChildren(row: RegionVO) {
+  operateType.value = 'add';
+  // 数据准备
+  editingData.value = jsonClone(row);
+  // 打开抽屉
+  openDrawer();
+}
 </script>
 
 <template>
@@ -152,7 +161,7 @@ function handleAddChildren(_: string) {}
           v-model:columns="columnChecks"
           :disabled-delete="checkedRowKeys.length === 0"
           :loading="loading"
-          @add="handleAdd"
+          @add="add"
           @delete="handleBatchDelete"
           @refresh="getData"
         />
diff --git a/src/views/sys/rbac/region/modules/region-operate-drawer.vue b/src/views/sys/rbac/region/modules/region-operate-drawer.vue
index a64c0bfd..7a6588a3 100644
--- a/src/views/sys/rbac/region/modules/region-operate-drawer.vue
+++ b/src/views/sys/rbac/region/modules/region-operate-drawer.vue
@@ -46,12 +46,14 @@ function createDefaultModel(): Api.Sys.Rbac.RegionDTO {
 }
 
 // 抽屉标题
+const realOperateType = ref('');
 const title = computed(() => {
-  const titles: Record<NaiveUI.TableOperateType, string> = {
+  const titles: Record<string, string> = {
     add: $t('common.add'),
-    edit: $t('common.edit')
+    edit: $t('common.edit'),
+    children: $t('common.children')
   };
-  return titles[props.operateType];
+  return titles[realOperateType.value];
 });
 
 // Form校验规则
@@ -67,8 +69,17 @@ const rules: Record<RuleKey, App.Global.FormRule> = {
 // ******************** 事件定义 ********************
 function handleInitModel() {
   model.value = createDefaultModel();
+
+  realOperateType.value = 'add';
   if (props.operateType === 'edit' && props.rowData) {
+    realOperateType.value = 'edit';
     Object.assign(model.value, jsonClone(props.rowData));
+  } else if (props.operateType === 'add' && props.rowData && props.rowData.id) {
+    realOperateType.value = 'children';
+    model.value.parentId = props.rowData.id;
+    model.value.parentCode = props.rowData.code;
+    model.value.rootId = props.rowData.rootId;
+    model.value.rootCode = props.rowData.rootCode;
   }
 }