| .. | ||
| design-system | ||
| ui-ux-pro-max | ||
| backend-api.md | ||
| contest-detail-page.md | ||
| contest-list-page.md | ||
| README.md | ||
页面生成规范索引
文档列表
| 文档 | 用途 | 路径 |
|---|---|---|
| 列表页规范 | 生成赛事列表页(Tab + 搜索 + 表格) | contest-list-page.md |
| 详情页规范 | 生成详情页(返回 + 标题 + 搜索 + 表格) | contest-detail-page.md |
| 后端接口规范 | 生成 NestJS 接口(Controller + Service + DTO) | backend-api.md |
快速生成模板
一、列表页(如:赛果发布列表、报名管理列表)
请生成一个赛事列表页面:
页面名称:xxx
文件路径:xxx
搜索条件:
- 字段1(类型)
表格列:
- 序号
- 列名(数据字段)
- 操作(按钮列表)
详情跳转:路由路径
二、详情页(如:赛果详情、报名记录)
请生成一个详情页面:
页面名称:xxx
文件路径:xxx
标题:字段名
操作按钮:按钮名称 -> 处理函数
搜索条件:
- 字段1(类型)
表格列:
- 序号
- 列名(数据字段,渲染类型)
排序:字段名 + 排序方式
三、完整功能页面(前端 + 后端)
请生成完整功能页面:
【页面信息】
页面名称:xxx
文件路径:xxx
【接口信息】
接口路径:GET/POST /api/xxx
数据表:xxx
【搜索条件】
- 字段(类型)
【表格列】
- 列名(数据字段,渲染类型)
【操作按钮】
- 按钮名称 -> 处理逻辑
常用渲染类型
| 类型 | 说明 | 示例 |
|---|---|---|
| index | 序号 | 自动计算 |
| text | 纯文本 | 直接显示 |
| link | 可点击 | 跳转详情 |
| count | 统计数 | _count.registrations |
| score | 分数 | 保留2位小数 |
| tag | 标签 | 状态显示 |
| date | 日期 | YYYY-MM-DD HH:mm |
| dateRange | 日期范围 | 开始-结束 |
| org | 机构信息 | 学校+年级+班级 |
| array | 数组拼接 | 用顿号连接 |
常用数据字段路径
| 数据 | 字段路径 |
|---|---|
| 用户昵称 | user.nickname |
| 用户账号 | user.username |
| 学校名称 | user.tenant.name |
| 年级名称 | user.student.class.grade.name |
| 班级名称 | user.student.class.name |
| 指导老师 | teachers[].user.nickname |
| 报名人数 | _count.registrations |
| 作品数量 | _count.works |
| 团队名称 | team.teamName |