Files
platforms/docs/项目文档_标准资源全页管理_v1.0.md

8.3 KiB
Raw Blame History

标准资源全页管理项目文档 v1.0

1. 项目概述

  • 项目名称:平台总后台标准资源全页管理。
  • 实施范围:仅端口 5173 的 frontend/platform_admin;气站后台、配送点后台和树形资源不在本次范围。
  • 主要功能:把标准资源的新建、详情和编辑从列表抽屉迁移为独立 URL 页面,同时保留审核、归档、重置密码和流程流转等短操作。
  • 技术栈Vue 3、TypeScript、Vue Router、Arco Design、Less、Go、Gin、GORM。
  • 资源覆盖48 个资源契约中46 类标准列表资源提供详情页25 类提供新建页23 类提供编辑页;ec_categoryplatform_menu 两类树形资源保持树页面交互。

2. 页面与路由约定

标准资源路由由列表路由自动扩展,三类 URL 约定如下:

列表路径/new                         # 新建页
列表路径/:identity                   # 详情页
列表路径/:identity/edit              # 编辑页
  • 路由元数据使用 resourcerecordModelistRouteName 驱动共享页面。
  • 隐藏详情路由通过 activeMenu 保持来源菜单高亮。
  • return_to 只接受站内绝对路径,防止开放重定向,并支持从钱包、机构账户等关联页面返回原记录。
  • 旧的账户资料 ?mode=edit 地址会转换到 /edit,保留已有书签兼容性。
  • /staff/add/gasorder/create 保留原业务入口名称,但直接渲染独立新建页。

3. 目录结构

platforms/
├── frontend/platform_admin/
│   ├── scripts/
│   │   ├── check-backend-contract.mjs       # 前后端资源契约检查
│   │   └── check-resource-pages.mjs         # 独立页面覆盖与抽屉残留检查
│   └── src/
│       ├── api/
│       │   ├── resource-page-rules.ts       # 新建、编辑、只读和状态限制规则
│       │   ├── resource-navigation.ts       # 页面地址与安全返回路径
│       │   ├── resource-display.ts          # 字段、状态、金额和日期展示
│       │   └── resource-record-form.ts      # 表单初始化与页面校验
│       ├── router/routes/modules/
│       │   ├── resource-route-builder.ts    # 自动生成详情、新建和编辑路由
│       │   ├── dashboard-route.ts           # 仪表盘路由分组
│       │   ├── finance-route.ts             # 钱包与财务路由分组
│       │   └── platform.ts                  # 平台业务列表路由
│       └── views/
│           ├── resource/                    # 共享全页详情、表单、动作和摘要组件
│           └── shared/CrudListPage.vue      # 列表与全页跳转入口
├── backend/api/internal/
│   ├── logic/platform/platform/account.go   # 平台账户头像受控读取
│   └── routers/platform.go                  # 平台账户头像路由
└── docs/                                    # 同步需求、安全、项目与操作日志

4. 核心设计

4.1 显式页面规则

resource-page-rules.ts 按“资源 + 字段”声明能力,不通过字段名猜测更新权限:

  • identity 永不进入创建或更新请求。
  • 账户用户名、密码和业务创建编码按服务端 DTO 设为仅创建或只读。
  • 工作人员资质所属人员、用户地址所属用户、服务关系所属用户、检修产品等归属字段在编辑时锁定;后端协议必传时只原样回传。
  • 智能气阀归属变更使用专属业务动作并提交动作、原因和备注,不混入普通编辑。
  • 配送合同仅草稿可编辑;已完成检修只允许维护备注;系统角色和平台角色权限按当前操作者锁定。
  • 保存时只从允许更新字段构造请求,保存后重新读取详情校验服务端结果。

4.2 详情内容

  • 详情页顶部只保留“列表 / 详情”面包屑、编辑和返回操作,不重复展示“详情资源名称”及说明文字。
  • 页面网格从顶部按内容自然排列,详情卡片统一使用 12px 间距、圆角、标题高度和内容内边距,不随剩余视口高度拉伸。
  • 普通资源使用响应式三列信息区,金额、状态、日期、布尔和关系字段统一格式化。
  • 聚合详情中的数组继续以页签和表格展示,例如合同产品、修订记录和订单轨迹。
  • 气站详情保留独立的紧凑启停区域;钱包归属资源保留钱包摘要和钱包详情入口,未开通钱包时显示单行紧凑提示。
  • 工作人员、用户和平台账户保留头像、用户名、唯一标识、创建时间的账户摘要。
  • 资源专属流程动作继续使用短模态框,危险动作显示风险提示,平台角色菜单分配保留专属适配。

4.3 新建与编辑

  • 新建和编辑卡片铺满主内容区,卡片内部使用最大 1440px 的内容容器控制输入框行长;标题、字段和操作按钮保持同一左基线。
  • 表单根据容器实际宽度响应:内容区达到约 900px 时使用双列,否则切换为单列;地址、备注、条款、参数和正文等长字段独占整行。
  • 页面网格从顶部自然排列;新建、编辑页只保留“列表 / 当前操作”面包屑和右侧返回按钮,不重复展示操作大标题及说明文字;保存和取消按钮位于表单末尾,不吸附浏览器底部。
  • 账户类资源继续保留头像和身份摘要的居中结构,详情页布局不受表单优化影响。
  • 编辑页展示创建后不可修改字段,但禁用字段不会进入更新请求。
  • 必填、密码最短 6 位、关系选项和金额转换复用统一校验与负载构建逻辑。
  • 页面检测表单和头像变更;返回、取消或浏览器路由离开时均提示是否放弃未保存内容。
  • 机构“账户管理”不再打开二级模态框,而是进入带机构过滤条件的隐藏账户列表及其独立 CRUD 页面。

4.4 安全与兼容

  • 详情始终调用现有受保护资源接口,不使用列表缓存绕过脱敏和对象权限。
  • 头像继续通过专用上传与受控读取接口;平台账户补充同等头像读取能力。
  • 平台账户普通编辑没有提交头像时保持原值,避免更新其他资料时意外清空头像。
  • return_to 拒绝协议相对地址和站外地址。
  • 附件查看未接入:现有通用响应会剥离敏感 URI待受控下载接口完成后再扩展。

5. 行为变化

场景 变更前 变更后
标准资源详情 列表内详情抽屉 独立详情 URL
标准资源新建/编辑 共用表单抽屉 独立新建/编辑 URL
账户管理 列表内二级模态框 隐藏账户列表与独立页面
审核、启停、删除 模态框或确认框 保持不变
树形资源 树页面抽屉 保持不变
返回来源 关闭抽屉 安全 return_to 返回
未保存修改 关闭即丢失 离开前二次确认

6. 验证方法

frontend/platform_admin 执行:

npm.cmd run resource-pages:check
npm.cmd run contract:check
npm.cmd run build

backend/api 执行:

go test ./...

浏览器回归至少覆盖:标准列表进入详情、详情进入编辑、新建页、只读资源 404、钱包跳转、机构账户管理、未保存取消/确认、/staff/add 专用入口和小屏单列布局。

7. 维护指南

  • 新增资源时先维护资源契约和 resources.ts,再在页面规则中显式声明可编辑字段。
  • 服务端 Update DTO 变化时必须同步 resource-page-rules.ts,禁止直接把创建字段复用于更新。
  • 新增详情专属内容时优先扩展详情区块或动作适配器,不把长流程塞回列表。
  • 新增关联跳转时必须使用安全返回路径工具,不直接信任查询参数。
  • 新增标准资源后必须运行页面覆盖检查,保证详情、新建和编辑能力与资源模式一致。

8. 已知边界

  • 气站后台 5175 和配送点后台 5176 尚未迁移。
  • 树形资源仍保留现有抽屉与确认交互。
  • 附件下载、预览和权限签名不在本次实现范围。
  • 聚合子表在本地没有完整业务样本时主要依赖结构检查和生产构建,后续应补充固定测试数据的端到端用例。