Page Template Builder

目标

生成统一页面骨架，保证页面结构、状态管理、交互反馈和埋点位的一致性。

输入信息采集

1. 页面类型（列表、详情、表单、工作台）。
2. 数据来源与加载方式（分页、筛选、排序）。
3. 权限和路由要求。
4. 空/错/加载状态的表现要求。

执行流程

1. 根据页面类型选择标准骨架。
2. 引入 references/page-template.md 作为输出基线。
3. 先确定页面文件结构，必须固定为三件套：index.vue、components/、column.js。
4. 明确 5 个状态块：loading、empty、error、success、forbidden。
5. 标准化区域划分：Header、Filter、Content、Footer。
6. 给出扩展位：操作栏、批量操作、埋点位、国际化文本位。

输出要求

1. 页面区块结构图（文本版即可）。
2. 状态流转说明。
3. 事件约定（查询、重置、刷新、导出）。
4. 示例代码骨架（与项目技术栈一致）。
5. 在 smart-admin 列表页场景中，必须满足：
• 页面结构必须固定为三件套：index.vue + components/ + column.js，禁止只生成单文件页面；
• 使用 admin-page-layout 作为页面容器；
• API 统一放在 src/api/** 并从该目录导入；
• 权限统一维护在 src/constants/permission-const.js；
• table-id 统一维护在 src/constants/support/table-id-const.js；
• table 列配置必须放在独立 column 文件（如 column.js / constant/column.js）中，页面文件仅允许 import { columns } ... 使用，禁止在页面内联声明列配置；
• show-add/show-delete/show-import/show-export 按权限点控制；
• 所有按钮（含新增）均绑定权限点；
• 页面内所有方法必须包含完整注释；
• filter 区输入框使用 admin-input，下拉/枚举使用 SmartEnumSelect；
• table 操作栏必须使用 more-button 组件承载操作项（禁止使用行内 a-button 直接平铺操作）；
• 禁止将 options 以行内按钮形式直接展示在表格行上（必须收敛到 more-button）；
• 所有 table column 列配置都必须显式设置 width，禁止省略列宽；
• 操作列必须命名为 operate 且配置 fieldType: "slot" 与 width，并在模板中通过 渲染。