feat: Add role code to system_role.json and update system_users.json creator_id to null

fix: Refactor initialize.py to handle nested children data during initialization

feat: Implement tree structure traversal functions in common_util.py

chore: Update requirements.txt to specify sqlalchemy-crud-plus version and add rich

refactor: Change API endpoints in dept.ts and menu.ts to return tree structure

feat: Add code field to role, dept, and menu interfaces in respective TypeScript files

fix: Update dept and role Vue components to display and handle code field

docs: Add comprehensive project documentation for FastAPI Vue3 Admin

frontend/src/views/system/dept/index.vue

@@ -90,13 +90,14 @@
       </div>
 
       <!-- 表格区域：系统配置列表 -->
-      <el-table ref="dataTableRef" v-loading="loading" row-key="id" :data="pageTableData" :tree-props="{children: 'children',hasChildren: 'hasChildren'}" highlight-current-row class="data-table__content" height="540" border stripe @selection-change="handleSelectionChange">
+      <el-table ref="dataTableRef" v-loading="loading" row-key="id" :data="pageTableData" :tree-props="{children: 'children'}" highlight-current-row class="data-table__content" height="540" border stripe @selection-change="handleSelectionChange">
         <template #empty>
           <el-empty :image-size="80" description="暂无数据" />
         </template>
         <el-table-column v-if="tableColumns.find(col => col.prop === 'selection')?.show" type="selection" min-width="55" align="center" />
         <el-table-column v-if="tableColumns.find(col => col.prop === 'index')?.show" type="index" fixed label="序号" min-width="60" />
         <el-table-column v-if="tableColumns.find(col => col.prop === 'name')?.show" key="name" label="部门名称" prop="name" min-width="120" />
+        <el-table-column v-if="tableColumns.find(col => col.prop === 'code')?.show" key="code" label="部门编码" prop="code" min-width="120" />')
         <el-table-column v-if="tableColumns.find(col => col.prop === 'status')?.show" key="status" label="状态" prop="status" min-width="60">
           <template #default="scope">
             <el-tag :type="scope.row.status === true ? 'success' : 'danger'">
@@ -127,6 +128,7 @@
       <template v-if="dialogVisible.type === 'detail'">
         <el-descriptions :column="4" border>
           <el-descriptions-item label="部门名称" :span="2">{{ detailFormData.name }}</el-descriptions-item>
+          <el-descriptions-item label="部门编码" :span="2">{{ detailFormData.code }}</el-descriptions-item>
           <el-descriptions-item label="上级部门" :span="2">{{ detailFormData.parent_name }}</el-descriptions-item>
           <el-descriptions-item label="状态" :span="2">
             <el-tag :type="detailFormData.status ? 'success' : 'danger'">
@@ -145,6 +147,9 @@
           <el-form-item label="部门名称" prop="name">
             <el-input v-model="formData.name" placeholder="请输入部门名称" :maxlength="50" />
           </el-form-item>
+          <el-form-item label="部门编码" prop="code">
+            <el-input v-model="formData.code" placeholder="请输入部门编码" :maxlength="50" />
+          </el-form-item>
           <el-form-item label="上级部门" prop="parent_id">
             <el-tree-select v-model="formData.parent_id" placeholder="请选择上级部门" :data="deptOptions" filterable check-strictly :render-after-expand="false" />
           </el-form-item>
@@ -184,11 +189,10 @@ defineOptions({
 
 import DeptAPI, { DeptTable, DeptForm, DeptPageQuery } from "@/api/system/dept";
 import { ElMessageBox } from "element-plus";
-import { listToTree, formatTree } from "@/utils/common";
+import { formatTree } from "@/utils/common";
 
 const queryFormRef = ref();
 const dataFormRef = ref();
-const total = ref(0);
 const selectIds = ref<number[]>([]);
 const loading = ref(false);
 
@@ -206,6 +210,7 @@ const tableColumns = ref([
   { prop: 'selection', label: '选择框', show: true },
   { prop: 'index', label: '序号', show: true },
   { prop: 'name', label: '部门名称', show: true },
+  { prop: 'code', label: '部门编码', show: true },
   { prop: 'order', label: '排序', show: true },
   { prop: 'status', label: '状态', show: true },
   { prop: 'description', label: '描述', show: true },
@@ -229,6 +234,7 @@ const queryFormData = reactive<DeptPageQuery>({
 const formData = reactive<DeptForm>({
   id: undefined,
   name: undefined,
+  code: undefined,
   order: 1,
   parent_id: undefined,
   status: true,
@@ -254,9 +260,7 @@ async function handleRefresh () {
   loading.value = true;
   try {
     const response = await DeptAPI.getDeptList(queryFormData);
-    const treeData = listToTree(response.data.data.items);
-    pageTableData.value = treeData;
-    total.value = response.data.data.total;
+    pageTableData.value = response.data.data;
   } catch (error: any) {
     console.error(error);
   } finally {
@@ -269,11 +273,9 @@ async function loadingData() {
   loading.value = true;
   try {
     const response = await DeptAPI.getDeptList(queryFormData);
-    const treeData = listToTree(response.data.data.items);
-    pageTableData.value = treeData;
-    total.value = response.data.data.total;
+    pageTableData.value = response.data.data;
     // 加载部门选项
-    deptOptions.value = formatTree(treeData);
+    deptOptions.value = formatTree(response.data.data);
   }
   catch (error: any) {
     console.error(error);

frontend/src/views/system/menu/index.vue

@@ -234,7 +234,7 @@
       <!-- 新增、编辑表单 -->
       <template v-else>
         <el-form ref="dataFormRef" :model="formData" :rules="rules" label-suffix=":" label-width="auto" label-position="right">
-          <el-form-item label="父级菜单" prop="parent_id" if v-if="formData.type !== MenuTypeEnum.CATALOG">
+          <el-form-item v-if="formData.type !== MenuTypeEnum.CATALOG" label="父级菜单" prop="parent_id" if >
             <el-tree-select v-model="formData.parent_id" placeholder="选择上级菜单" :data="menuOptions" filterable check-strictly :render-after-expand="false" />
           </el-form-item>
 
@@ -473,14 +473,13 @@ import { DeviceEnum } from "@/enums/settings/device.enum";
 
 import MenuAPI, { MenuPageQuery, MenuForm, MenuTable } from "@/api/system/menu";
 import { MenuTypeEnum } from "@/enums/system/menu.enum";
-import { formatTree, listToTree } from "@/utils/common";
+import { formatTree } from "@/utils/common";
 
 const appStore = useAppStore();
 const userStore = useUserStore();
 
 const queryFormRef = ref();
 const dataFormRef = ref();
-const total = ref(0);
 const selectIds = ref<number[]>([]);
 const loading = ref(false);
 
@@ -495,8 +494,6 @@ const detailFormData = ref<MenuTable>({});
 
 // 分页查询参数
 const queryFormData = reactive<MenuPageQuery>({
-  page_no: 1,
-  page_size: 10,
   name: undefined,
   status: undefined,
   start_time: undefined,
@@ -578,9 +575,7 @@ async function handleRefresh () {
   loading.value = true;
   try {
     const response = await MenuAPI.getMenuList(queryFormData);
-    const treeData = listToTree(response.data.data.items);
-    pageTableData.value = treeData;
-    total.value = response.data.data.total;
+    pageTableData.value = response.data.data
   } catch (error: any) {
     console.error(error);
   } finally {
@@ -603,11 +598,9 @@ async function loadingData() {
   loading.value = true;
   try {
     const response = await MenuAPI.getMenuList(queryFormData);
-    const treeData = listToTree(response.data.data.items);
-    pageTableData.value = treeData;
-    total.value = response.data.data.total;
-    // 加载部门选项，只显示目录、菜单
-    menuOptions.value = formatTree(filterMenuTypes(treeData));
+    pageTableData.value = response.data.data
+    // 加载菜单选项，只显示目录、菜单
+    menuOptions.value = formatTree(filterMenuTypes(response.data.data));
   }
   catch (error: any) {
     console.error(error);

frontend/src/views/system/role/index.vue

@@ -105,6 +105,7 @@
           </template>
         </el-table-column>
         <el-table-column v-if="tableColumns.find(col => col.prop === 'name')?.show" key="name" label="角色名称" prop="name" min-width="100" />
+        <el-table-column v-if="tableColumns.find(col => col.prop === 'code')?.show" key="code" label="角色编码" prop="code" min-width="100" />
         <el-table-column v-if="tableColumns.find(col => col.prop === 'data_scope')?.show" key="data_scope" label="数据权限" prop="data_scope" min-width="200">
           <template #default="scope">
             <el-tag v-if="scope.row.data_scope === 1" type="primary">仅本人数据权限</el-tag>
@@ -183,6 +184,7 @@
           <el-descriptions-item label="排序" :span="2">
             {{ detailFormData.order }}
           </el-descriptions-item>
+          <el-descriptions-item label="角色编码" :span="2">{{ detailFormData.code }}</el-descriptions-item>
           <el-descriptions-item label="数据权限" :span="2">
             <el-tag v-if="detailFormData.data_scope === 1" type="primary">仅本人数据权限</el-tag>
             <el-tag v-else-if="detailFormData.data_scope === 2" type="info">本部门数据权限</el-tag>
@@ -212,6 +214,10 @@
             <el-input-number v-model="formData.order" controls-position="right" :min="0" style="width: 100px" />
           </el-form-item>
 
+          <el-form-item label="角色编码" prop="code">
+            <el-input v-model="formData.code" placeholder="请输入角色编码" />
+          </el-form-item>
+
           <el-form-item label="状态" prop="status">
             <el-radio-group v-model="formData.status">
               <el-radio :value="true">启用</el-radio>
@@ -269,6 +275,7 @@ const tableColumns = ref([
   { prop: 'name', label: '角色名称', show: true },
   { prop: 'data_scope', label: '数据权限', show: true },
   { prop: 'order', label: '排序', show: true },
+  { prop: 'code', label: '角色编码', show: true },
   { prop: 'status', label: '状态', show: true },
   { prop: 'description', label: '描述', show: true },
   { prop: 'created_at', label: '创建时间', show: true },
@@ -297,6 +304,7 @@ const formData = reactive<RoleForm>({
   id: undefined,
   name: undefined,
   order: 1,
+  code: undefined,
   status: true,
   description: undefined,
 });
@@ -360,6 +368,7 @@ const initialFormData: RoleForm = {
   id: undefined,
   name: undefined,
   order: 1,
+  code: undefined,
   status: true,
   description: undefined,
 }

frontend/src/views/system/user/components/DeptTree.vue

@@ -76,8 +76,9 @@ const loading = ref(true);
 onBeforeMount(() => {
   loading.value = true;
   DeptAPI.getDeptList(queryFormData).then((response) => {
-    const treeData = listToTree(response.data.data.items);
-    deptOptions.value = formatTree(treeData);
+    // const treeData = listToTree(response.data.data.items);
+    // deptOptions.value = formatTree(treeData);
+    deptOptions.value = formatTree(response.data.data);
   }).finally(() => {
     loading.value = false;
   });

frontend/src/views/system/user/index.vue

@@ -568,7 +568,8 @@ async function handleOpenDialog(type: 'create' | 'update' | 'detail', id?: numbe
 
   // 获取部门树
   const deptResponse = await DeptAPI.getDeptList(queryFormData);
-  const treeData = listToTree(deptResponse.data.data.items);
+  // const treeData = listToTree(deptResponse.data.data.items);
+  const treeData = deptResponse.data.data;
   deptOptions.value = formatTree(treeData);
 
   // 获取角色列表