优化 添加行政区域 时，上级显示为层级名称

Web/src/views/system/region/component/editRegion.vue

@@ -27,9 +27,13 @@
 						</el-form-item>
 					</el-col> -->
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
-						<el-form-item label="上级行政Id" prop="pid" :rules="[{ required: true, message: '上级行政Id不能为空', trigger: 'blur' }]">
+						<el-form-item label="上级行政Id" prop="pid" v-show="false" :rules="[{ required: true, message: '上级行政Id不能为空', trigger: 'blur' }]">
 							<el-input v-model="state.ruleForm.pid" placeholder="上级行政Id或上级行政代码或默认0" clearable />
 						</el-form-item>
+                        <el-form-item label="上级行政" v-if="!state.ruleForm.id">
+                            <!-- <span>{{state.parentNamePath}}</span> -->
+                            <el-input v-model="state.parentNamePath" disabled></el-input>
+                        </el-form-item>
 					</el-col>
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
 						<el-form-item label="行政名称" prop="name" :rules="[{ required: true, message: '行政名称不能为空', trigger: 'blur' }]">
@@ -83,12 +87,13 @@ const ruleFormRef = ref();
 const state = reactive({
 	isShowDialog: false,
 	ruleForm: {} as UpdateRegionInput,
+    parentNamePath: '顶级'
 });
-// 级联选择器配置选项
-//const cascaderProps = { checkStrictly: true, emitPath: false, value: 'id', label: 'name' };
 
 // 打开弹窗
-const openDialog = (row: any) => {
+const openDialog = (row: any, parentNamePath?: string) => {
+    if(parentNamePath) state.parentNamePath = parentNamePath;
+
 	state.ruleForm = JSON.parse(JSON.stringify(row));
 	state.isShowDialog = true;
 	ruleFormRef.value?.resetFields();

Web/src/views/system/region/component/regionTree.vue

@@ -86,9 +86,52 @@ const loadNode = async (node: any, resolve: any) => {
 	resolve(data);
 };
 
-// 获取已经选择
+/**
+ * 获取选中节点的Keys
+ * @returns 选中节点的Key数组
+ */
 const getCheckedKeys = () => {
-	return treeRef.value!.getCheckedKeys();
+    return treeRef.value!.getCheckedKeys();
+};
+
+/**
+ * 获取当前选中节点
+ * @returns 当前选中节点
+ */
+const getCurrentNode = () => {
+    return treeRef.value!.getCurrentNode();
+};
+
+/**
+ * 获取当前选中节点的路径数组
+ * （从根节点到当前节点，按下标顺序排列）
+ * @returns {Array<{ id: number, name: string }>} 路径数组
+ */
+const getCurrentPath = () => {
+    const currentNode = getCurrentNode();
+    if(!currentNode) return null;
+
+    const cascaderData = getCascaderData(currentNode);
+    const path = [] as Array<{ id: number, name: string }>;
+    let node = cascaderData;
+    while(node) {
+        path.push({ id: node.id, name: node.name });
+        node = node.child;
+    }
+    return path;
+};
+
+// 递归获取当前选中级联数据
+const getCascaderData = (child: any) => {
+    const parent = treeRef.value!.getNode(child.pid)?.data as SysRegion & { child?: SysRegion };
+    if(!parent) return child;
+
+    parent.child = child;
+    if(parent.pid != 0) {
+        return getCascaderData(parent);
+    }
+
+    return parent;
 };
 
 const filterNode = (value: string, data: any) => {
@@ -119,7 +162,7 @@ const nodeClick = (node: any) => {
 };
 
 // 导出对象
-defineExpose({ initTreeData, getCheckedKeys });
+defineExpose({ initTreeData, getCheckedKeys, getCurrentNode, getCurrentPath });
 </script>
 
 <style lang="scss" scoped>

Web/src/views/system/region/index.vue

@@ -116,7 +116,9 @@ const resetQuery = async () => {
 // 打开新增页面
 const openAddRegion = () => {
 	state.editRegionTitle = '添加行政区域';
-	editRegionRef.value?.openDialog({ orderNo: 100 });
+    const parent = regionTreeRef.value?.getCurrentNode() ?? { id: 0, name: "顶级" };
+    const parentPath = regionTreeRef.value?.getCurrentPath() ?? null;
+	editRegionRef.value?.openDialog({ orderNo: 100, pid: parent.id }, parentPath ? parentPath.map(i => i.name).join(' / ') : '顶级');
 };
 
 // 打开编辑页面