Now I have a thorough understanding of the 导航管理 spec. It's a complex module with multiple nested views. Let me check the current state and plan the implementation.
Now let me build the first page - the application query list page:
Now building the detail page with 5 tabs. This is a large component with the View tab, Resource tab (with tree/CRUD), Role tab (with CRUD + dialogs), User tab, and Data Rule Config tab:
Now building the Role Operation page with 3 tabs (分配组织, 分配用户, 分配资源):
Now I need to: 1) Add "统一门户" group under "系统管理" in menu data with "导航管理" entry, 2) Add imports and page views to page.tsx, 3) Wire up routing between the 3 page levels (list -> detail -> role operation):
Now update page.tsx with all the new imports, page views, and routing logic:
Now add state for the detail tab and role operation tab:
Add route mapping:
Now add the render cases before the default clause:
根据统一门户产品文档(第2.15节)完整实现了导航管理功能模块,并将其放置在系统管理二级菜单下的"统一门户"三级分组中。整个模块包含 3 个层级页面:应用查询界面(产品线名称/应用名称/应用编码三条件组合查询 + 应用列表展示,每行操作列含查看详情/应用资源/应用角色/应用用户/数据规则配置 5 个入口);应用操作详情界面(顶部 5 个固定页签 -- 查看页签展示 11 个字段含应用地址独占一行和状态勾选;应用资源页签含树形表格支持新增根级资源/编辑/添加子资源/删除,弹窗含 12 个字段按三列网格排列;应用角色页签含四条件查询/新增角色/批量删除/编辑弹窗,操作列含编辑/分配组织/分配用户/分配资源/删除;应用用户页签含四条件查询和用户列表;数据规则配置页签含新增/编辑弹窗含组织名称树结构);应用角色操作界面(分配组织/分配用户/分配资源三页签,均含添加关联弹窗和批量取消关联,分配资源页签为树形复选框表格支持根级资源全选)。
Now I have the full picture. The issue is in the ResourceTab component (lines 210-247). The resource tree table uses <tbody> inside the recursive renderResourceRows, creating multiple <tbody> elements which is structurally problematic. Also the odd/even row striping is broken because each recursion level resets the index. The tree indentation uses inline paddingLeft which can look disconnected. Let me fix the table structure, striping, and visual hierarchy:
Now update the table rendering to use the flattened rows with proper <tbody>:
Now let me also add more mock child data to make the tree richer so the visual hierarchy is more apparent:
Now fix the expanded default to show the first two levels:
Now update the type references used in the recursive helpers to use the new Resource type:
Now fix the flatten helper's type reference:
Also update the handleDialogConfirm for "new" mode to use proper typed object:
应用资源树形表格的样式已完成修复。主要改动包括:将递归渲染从多个 <tbody> 改为先扁平化树节点再在单个 <tbody> 中渲染,修复了隔行变色在展开子级时序号重置导致条纹错位的问题;为每列增加了 min-width 防止列宽挤压;名称列增加了树形连接线 SVG 图标、文件夹/文档图标区分父子节点、根节点字体加粗等视觉层级提示;类型列改用彩色标签(菜单蓝/按钮橙/数据绿);状态列增加圆点指示器;操作列按钮增加图标和 hover 背景色,并默认半透明在 hover 行时全显;mock 数据扩充为三级嵌套结构并默认展开前两层。
You can send messages while the preview loads