Files

T

fengpu af0dc7013f feat(ops): 实施运维小程序 5 个 Tab 全量落地 + mock 数据

- workbench: 告警列表/详情子页 + 统计卡 + 待办聚合
- workOrder: 工单列表/详情/维修上报纸页
- scan: 场景菜单 + 初始化/实施记录/维修上报/OTA/监测 5 子页
- inspect: 巡检任务列表 + 详情子页
- me: 个人中心 + 消息中心子页
- 配套 api.ts/types.ts 与 5 个 mock handler
- nav.ts 同步补全 ops 小程序页面路由
- 同步更新设备管理服务器功能现状文档 §8

2026-07-03 20:40:30 +08:00

28 KiB

Raw Blame History

yx-platform-prototype — 项目开发指南

项目定位

智养餐饮平台V3项目的高保真交互原型工程，采用 Vue 3 + Vite + Ant Design Vue + Vant 半工程化方案。

核心目标：让产品经理画的原型 = 开发要写的代码骨架，AI 还原代码时几乎零创造性工作。

四个终端

终端	key	UI 库	主要用户	业务定位
综合管理后台	`admin-portal`	Ant Design Vue	平台管理员	平台级管理（系统设置/运营中心/设备中心为顶部一级菜单，无子应用、无应用切换、无应用网格）
租户运营后台	`tenant-portal`	Ant Design Vue	租户运营人员	17 个独立可部署应用的统一入口（营养管理/健康监测/...），有应用网格首页
微信小程序	`miniprogram`	Vant 4（375×812）	多种	支持多个小程序实例并存，每个实例一组底部 Tab；URL `/miniprogram/<mpKey>/<tabPagePath>`
硬件终端屏	`hardware`	自定义（动态 viewport）	现场操作员	净菜柜屏 / 自助查询屏 / 大屏等

重要架构说明（admin / tenant / miniprogram 形态差异）：

综合管理后台为单应用形态：3 个一级菜单（系统设置 / 运营中心 / 设备中心）直接挂在 portal 下，URL = /admin-portal/<section>/<page>，无应用切换概念。

租户运营后台为多应用形态（对齐生产 vue 项目 D:\Work\platform-vue-tenant 的 qiankun 微前端）：下挂多个独立可部署的应用（NavApp），每个应用对应生产 vue 项目中的一个 subXxx 子应用。

进入某个应用后，顶部显示该应用内的一级菜单 tabs（NavSection），左侧显示当前一级菜单下的二/三级菜单（NavGroup → NavLeaf）

URL：/tenant-portal/<app>/<section>/<page>，例：/tenant-portal/nutrition/nutrition-farm/monitor/crop

应用首页（/tenant-portal）：展示应用网格卡片（参考 vue 项目 main 的 home.vue）

不支持在 TopBar 切换应用；切换应用通过"应用首页"或"返回原型首页"完成

微信小程序为多实例形态：每个实例 = 一个 NavMiniprogram（key / label / tabs[]），独立的一组底部 Tab。当前已落地 2 个：

customer：C 端用户小程序（吃 / 问 / 做 / 我），终端用户使用

ops：实施运维小程序（工作台 / 工单 / 扫码 / 巡检 / 我的），仅实施运维工程师使用，详见 src/docs/device/设备管理服务器功能现状.md §8

URL：/miniprogram/<mpKey>/<tabPagePath>，例：/miniprogram/ops/workbench

新增小程序只需在 src/meta/nav.ts 的 miniprograms 数组追加一条

最近打开菜单（PageHistory）按 portal + app 隔离：scope key 形如 admin-portal__admin / tenant-portal__nutrition / miniprogram__ops；切换应用 / 小程序后只显示当前 scope 打开过的菜单。

详细业务边界与各应用模块清单见 src/docs/business-architecture.md。AI 在生成原型前必须先读这份文档。

技术栈

类别	选型
框架	Vue 3.5 + TypeScript 5.9
构建	Vite 8
Web 端 UI	Ant Design Vue 4.2
移动端 UI	Vant 4
路由	Vue Router 4（Hash 模式）
状态管理	不引入 Pinia
样式	LESS + CSS 变量（设计令牌）
自动导入	unplugin-auto-import + unplugin-vue-components
Markdown 渲染	markdown-it（PRD 查看）
截图	puppeteer（优先）/ chrome-devtools MCP（降级）

启动命令

npm install       # 一次性安装
npm run dev       # 启动（端口 5180）
npm run build     # 构建产物到 dist/
npm run preview   # 预览构建产物

门禁密码（.env）：

设计：design2026（可见全部）
研发：dev2026（看不见 draft / designer-only 页面）

登录后 7 天有效；过期自动重新登录。

详细目录说明（重要）

yx-platform-prototype/
├── package.json                 npm 配置 + 依赖列表 + 脚本命令
├── vite.config.ts               Vite 构建配置：端口 5180、路径别名、自动导入插件
├── tsconfig.json                TS 项目根配置（references → tsconfig.app + node）
├── tsconfig.app.json            前端代码的 TS 编译配置（vue/dom）
├── tsconfig.node.json           Vite 配置自身的 TS 编译配置（node 环境）
├── index.html                   Vite 入口 HTML，挂载 #app
├── .env                         环境变量（门禁密码；可提交 git）
│
├── public/                      静态资源（不参与构建处理，直接拷到 dist 根）
│
├── CLAUDE.md                    本文件 —— 项目开发指南（AI 必读）
│
├── .claude/
│   ├── skills/                  项目专属技能（slash command 可触发）
│   │   ├── new-page.md          新建原型页骨架（init 三件套）
│   │   ├── gen-fields.md        单页字段清单（给后端/测试）
│   │   ├── gen-prd.md           生成 PRD 文档 + 截图（严格控制尺寸/体积）
│   │   ├── design-overview.md   设计总览：小程序/硬件版块平铺（含拼图）
│   │   ├── sync-nav.md          菜单与 pages/ 一致性检查
│   │   └── prototype-lint.md    代码规范检查
│   ├── agents/                  项目专属代理
│   │   ├── prototype-reviewer.md       PR / 变更综合评审（只读）
│   │   └── cross-role-doc-builder.md   模块级跨岗位文档包
│   └── memory/                  会话间持久化记忆
│       ├── MEMORY.md            索引
│       ├── decisions.md         关键决策
│       ├── feedback.md          协作规范
│       ├── project_overview.md  技术栈与架构
│       ├── project_progress.md  阶段进度
│       └── user_profile.md      用户画像
│
└── src/
    ├── main.ts                  应用入口：创建 Vue 实例、挂载 router、注册指令、初始化 antd 静态方法、加载 mock handlers
    ├── App.vue                  根组件，仅 <router-view />
    ├── style.css                全局设计令牌（CSS 变量）+ reset
    │
    ├── router/
    │   ├── index.ts             创建 router 实例 + 守卫（门禁 + designerOnly）
    │   └── routes.ts            路由表：由 nav.ts 自动派生 + 4 个工具路由（gate/console/prd/overview）
    │
    ├── meta/
    │   └── nav.ts               🌟 菜单数据单一来源
    │                            - 4 端类型定义（NavApp / NavSection / NavGroup / NavLeaf / NavMiniprogramTab / NavHardwareDevice）
    │                            - 后台层级：NavApp → NavSection → (NavGroup | NavLeaf) → NavLeaf
    │                            - admin: adminApps；tenant: tenantApps（含 nutrition / monitor 完整三层菜单）
    │                            - status + audience 字段控制可见性
    │
    ├── axios/                   🆕 假 axios 层（与 vue 研发项目签名 1:1，研发接手时整体替换）
    │   ├── index.ts             getRequest / postRequest / putRequest / deleteRequest / restfulRequest / uploadRequest / downloadRequest
    │   ├── mockBus.ts           mock 总线（registerMock / dispatchMock / 200~500ms 模拟延迟）
    │   ├── types.ts             ApiResponse / ServiceType / MockHandler 等
    │   └── handlers/            mock handler 注册（按 <模块>/<页面>.ts 组织）
    │       ├── index.ts         统一 import 触发副作用
    │       └── nutrition/employee.ts
    │
    ├── api/
    │   └── index.ts             🆕 跨模块公共接口（字典 / 部门树 / 组织树）
    │
    ├── utils/                   🆕 业务工具（与 vue 研发项目 @utils 1:1）
    │   └── antDesign/
    │       ├── table.ts         TableState / TableSort / createPaginationConfig / createDataSourceChange / createResetTable / resizeColumn / createRowSelection
    │       ├── popUp.ts         useAntdStaticMethods / initializeAntdStaticMethods
    │       └── select.ts        filterOption
    │
    ├── directives/              🆕 自定义指令（与 vue 研发项目 @directives 1:1）
    │   ├── index.ts             registerDirectives 全局注册
    │   ├── noSpace.ts           v-no-space
    │   ├── onlyNumber.ts        v-only-number
    │   ├── onlyAlphanumeric.ts  v-only-alphanumeric
    │   └── onlyAlphanumericSpecial.ts  v-only-alphanumeric-special
    │
    ├── assets/                  🆕 静态资源 + 公共样式
    │   └── styles/
    │       └── listPage.less    列表页统一布局（listPageForm / listPageRow / listPageTable / page-header / page-footer）
    │
    ├── composables/             复用逻辑
    │   └── useVisibility.ts     可见性核心：角色、过滤、覆写存取
    │
    ├── layouts/                 共享布局（菜单只写一次）
    │   ├── PortalLayout.vue     后台门户（admin/tenant 共用，按 route.meta.isAppGrid 切换"应用网格首页"/"应用内三层菜单"）
    │   ├── MiniprogramLayout.vue  小程序手机壳（375×812）
    │   ├── HardwareLayout.vue   硬件外壳（按 viewport 动态尺寸）
    │   └── components/
    │       ├── TopBar.vue       后台顶部（Logo + 应用名▾下拉切换 + 一级菜单 tabs + 返回首页 + 应用首页 + 用户区）
    │       ├── Sidebar.vue      后台侧边栏（二/三级菜单，支持 SubMenu 嵌套）
    │       ├── AppTabBar.vue    移动端底部 Tab（Vant Tabbar）
    │       └── RoleBadge.vue    顶部角色徽章 + PRD/总览快捷入口 + 登出
    │
    ├── components/              公共业务组件（被自动注册到 AntDV 风格）
    │   ├── StatCard.vue         统计卡（4 色配色）
    │   ├── FilterBar.vue        搜索栏（default slot 裸 a-form-item / 兼容 fields 配置驱动）
    │   ├── TableCard.vue        表格卡（接 :table 对象 TableState；#toolbar 左上、#extra 右上）
    │   ├── PageHeader.vue       页头（保留供详情页用，列表页不应使用）
    │   ├── PlaceholderPage.vue  后台占位页（接 title/name）
    │   └── AppPlaceholder.vue   移动端占位页（接 title/name）
    │
    ├── pages/                   原型页面（按端 + 应用 + 一级菜单 分目录）
    │   ├── home/Home.vue        🏠 全局导航首页（四端 Tab + 卡片网格）
    │   ├── gate/Gate.vue        🔒 门禁页（密码登录 → 设置角色 + 7 天 TTL）
    │   ├── console/
    │   │   └── VisibilityConsole.vue   🎛 设计完成度控制台（仅 designer）
    │   ├── prd/
    │   │   └── PrdViewer.vue    📄 PRD 在线查看（markdown-it 渲染 src/prd/**.md）
    │   ├── overview/
    │   │   └── DesignOverview.vue 🖼 设计总览（小程序/硬件页面平铺）
    │   │
    │   ├── admin-portal/        综合管理后台业务页面
    │   │   ├── system-settings/Overview.vue
    │   │   ├── operation-center/Overview.vue
    │   │   └── device-center/Overview.vue
    │   ├── tenant-portal/       租户运营后台业务页面（按 <app>/<section>/<page> 组织）
    │   │   ├── home/
    │   │   │   └── AppGrid.vue          🌟 租户应用网格首页（卡片入口）
    │   │   ├── nutrition/                营养管理应用
    │   │   │   ├── arc/                  档案（一级菜单）
    │   │   │   │   ├── arcEmployee/      ⭐ 新规范标准列表页样板（TableState + reactive 搜索 + mock handler + addOrEdit 弹框）
    │   │   │   │   └── ArcUnit.vue
    │   │   │   └── farm/                 绿色种采（一级菜单）
    │   │   │       └── FarmLand.vue
    │   │   └── monitor/                  健康监测应用（菜单结构占位，页面待开发）
    │   ├── miniprogram/         微信小程序业务页面（按实例分目录）
    │   │   ├── customer/              C 端用户小程序
    │   │   │   ├── eat/Home.vue
    │   │   │   ├── ask/Home.vue
    │   │   │   ├── make/Home.vue
    │   │   │   └── me/Home.vue
    │   │   └── ops/                    实施运维小程序（仅运维工程师）
    │   │       ├── workbench/          工作台 Tab（含告警入口）
    │   │       │   ├── Home.vue
    │   │       │   ├── alarmList.vue        告警列表子页
    │   │       │   └── alarmDetail.vue      告警详情子页
    │   │       ├── workOrder/         工单 Tab
    │   │       │   ├── Home.vue
    │   │       │   ├── detail.vue           工单详情子页
    │   │       │   └── repairReport.vue     关单前维修上报纸页
    │   │       ├── scan/              扫码 Tab（6 个子操作）
    │   │       │   ├── Home.vue
    │   │       │   ├── sceneMenu.vue        场景操作菜单
    │   │       │   ├── init.vue             设备初始化
    │   │       │   ├── implRecord.vue       实施记录上报
    │   │       │   ├── repair.vue           维修上报（双入口）
    │   │       │   ├── ota.vue              OTA 升级
    │   │       │   └── monitor.vue          设备监测（多 Tab 简化版）
    │   │       ├── inspect/           巡检 Tab
    │   │       │   ├── Home.vue
    │   │       │   └── detail.vue           巡检任务详情
    │   │       └── me/                我的 Tab
    │   │           ├── Home.vue
    │   │           └── messageCenter.vue    消息中心子页
    │   └── hardware/            硬件业务页面
    │       └── cabinet/Home.vue
    │
    ├── prd/                     PRD markdown 文档（自动由 /gen-prd 维护）
    │   └── tenant-portal/nutrition/
    │       ├── arc-employee.md
    │       └── screenshots/<页面>/<状态>.jpg  截图（≤60KB）
    │
    ├── docs/                    业务文档 + 代码规范（AI 必读）
    │   ├── business-architecture.md     🌟 业务架构
    │   ├── cross-project-mapping.md     🆕 原型 ↔ vue 研发项目对照表
    │   ├── list-page-spec.md            🆕 列表页规范
    │   ├── modal-spec.md                🆕 弹框规范
    │   ├── drawer-spec.md               🆕 抽屉规范
    │   ├── detail-page-spec.md          🆕 详情页规范
    │   ├── tabs-page-spec.md            🆕 Tabs 页规范
    │   ├── utils-table.md               🆕 表格工具文档
    │   └── utils-popup.md               🆕 弹窗工具文档
    │
    └── types/                   全局类型声明（自动生成 + 手写 shims）
        ├── auto-imports.d.ts    unplugin-auto-import 生成
        ├── components.d.ts      unplugin-vue-components 生成
        └── shims-vue.d.ts       .vue 文件类型声明

路径别名

别名	指向	与 vue 研发项目对齐
`@`	`src/`	✅
`@meta`	`src/meta/`	原型特有（菜单数据）
`@layouts`	`src/layouts/`	✅
`@components`	`src/components/`	✅
`@composables`	`src/composables/`	原型特有
`@pages`	`src/pages/`	研发项目用 `@views`
`@router`	`src/router/`	✅
`@utils`	`src/utils/`	✅ 1:1
`@axios`	`src/axios/`	✅ 1:1
`@assets`	`src/assets/`	✅ 1:1
`@directives`	`src/directives/`	✅ 1:1
`@api`	`src/api/`	✅ 1:1

工具路由（带 `__` 前缀，不在 nav 菜单中）

路由	说明
`/gate`	门禁登录页
`/__console`	设计完成度控制台（仅 designer）
`/__prd`	PRD 文档在线查看
`/__overview`	设计总览（小程序 / 硬件）

关键约定

菜单单一来源：所有菜单结构集中在 src/meta/nav.ts
三层菜单结构：每个应用（NavApp） → 一级菜单（NavSection） → 二/三级菜单（NavGroup → NavLeaf） 2.1. 侧边栏手风琴（全局约束）：Sidebar.vue 必须保持"同一时刻最多展开一个二级分组（section.children 这一层）"，展开新的二级分组时自动收起其他二级分组。激活叶子所在的祖先分组链不参与互斥（保证选中项始终可见）。三级及更深嵌套分组随二级收起连带隐藏，不单独互斥。该约束对 admin-portal / tenant-portal 全后台生效，禁止移除 onOpenChange 互斥逻辑。
URL 规范：/<portal>/<app>/<section>/<page>，例：/tenant-portal/nutrition/nutrition-farm/monitor/crop
列表页 UI 规范（重要）：
- 不渲染 PageHeader（菜单 + 顶部历史栏已经表达所在位置）
- TableCard 接 :table 对象（推荐）或拆分 props（兼容）；不显示 title
- FilterBar 用 default slot 写裸 a-form-item（推荐），或 :fields 配置驱动（兼容）
- 顶部 toolbar 按钮（导出/新增/导入/批量删除等）放 TableCard #toolbar 左上方，必须带 antd icon
- 操作列 <a-button type="link"> 一律不加图标（对齐 vue 研发项目）；多个按钮之间用 <a-divider type="vertical" /> 分隔
- 次要操作放在 TableCard #extra 右上方
- 统计卡放在 FilterBar 上方（可选）
- 顶栏高度：固定 64px（对齐 vue 研发项目 <a-layout-header> 默认高度）
- CRUD 不是列表页标配：是否有"新增/编辑/删除/导出"按由业务决定；只读查询页操作列可以只有"查看详情"
图标规范（强制）：
- 所有菜单图标 / 操作按钮图标必须取自 @ant-design/icons-vue 4.x，禁止使用 emoji / 自定义 svg
- NavSection / NavGroup：必填 icon: 'XxxOutlined'
- NavLeaf：可选；layouts 渲染时未指定则二级用 FileOutlined / 三级用 MinusOutlined 兜底
- 操作按钮标准映射：查询=SearchOutlined / 重置=RedoOutlined / 新增=PlusOutlined / 编辑=EditOutlined / 删除=DeleteOutlined / 导入=UploadOutlined / 导出=DownloadOutlined / 查看详情=EyeOutlined / 查看任务=UnorderedListOutlined
- 应用图标（NavApp.icon）允许 emoji（仅在应用网格首页 + 左上角应用切换器显示）
端隔离：4 端不允许互相 import；共享仅通过 @components / @layouts / @meta / @composables
应用隔离：同一 portal 下不同应用之间也不应相互 import（对齐 vue 项目"子应用独立部署"）；共享只能走 nav.ts 的公共抽象
列表页固定 6 文件结构：<页面>.vue + types + api + init/(usePage + useSearch + useTable)，子组件按需追加 component/modal/<名>/ 或 component/drawer/<名>/
Mock 数据：必须写在 src/axios/handlers/<模块>/<页面>.ts，通过 registerMock(s) 注册；禁止写在 useTable.ts；单个 mock dataset 不得超过 10 条（原型展示而非性能压测）
国际化：根组件 App.vue 必须用 <a-config-provider :locale="zhCN"> 包裹，分页等组件显示为"30 条/页"等中文格式
HTTP 调用：业务层走 src/axios 的 postRequest/getRequest/restfulRequest（签名与 vue 研发项目 1:1），不直接 import axios
弹窗静态方法：必须 useAntdStaticMethods() 获取 message/Modal/notification，禁直接 import { message } from 'ant-design-vue'
请求风格：强制 .then().catch().finally() 链式，禁用 async/await
函数声明：全部用箭头函数 const x = () => {}，禁用 function 关键字
表格状态：useTable 必须返回 TableState 统一对象，table.dataSource 存数据，禁单独 dataList ref
搜索状态：useSearch 必须用 reactive + createSearchKey() 工厂函数 + Object.assign(search, createSearchKey()) 重置
子组件 ref：必须在父 usePage.ts 定义（禁在 .vue 定义）；打开方法命名 open + 组件名
子组件 emit：Modal 用 load，Drawer 用 ok
删除二次确认：必须 Modal.confirm + okType: 'danger'；批量按钮 :disabled="!selectedRowKeys.length"
空值展示：统一 {{ x ?? '—' }}（禁空串/null）
时间格式：时间 YYYY-MM-DD HH:mm:ss，日期 YYYY-MM-DD
ID 类型：统一 string | undefined（禁 number）
公共组件优先：StatCard / FilterBar / TableCard / PlaceholderPage
TS 严格：禁止 any
中文注释
可见性：每个 NavLeaf 有 status（draft/review/ready）+ audience（designer/all），dev 角色看不到 draft 或 designer-only 的页面
PRD 截图体积：Web ≤ 60KB、小程序 ≤ 60KB、硬件 ≤ 80KB；优先 puppeteer，失真时降级 chrome-devtools MCP
代码规范文档：详见 src/docs/（list-page-spec / modal-spec / drawer-spec / detail-page-spec / tabs-page-spec / cross-project-mapping / utils-table / utils-popup）

与 vue 研发项目的对齐策略

本项目最高目标：研发接手时改动最小。详见 src/docs/cross-project-mapping.md。

对齐项	原型现状	研发项目
HTTP 签名	假 axios + mockBus + handlers	真 axios + 拦截器
业务代码（api/usePage/useTable/useSearch）	100% 与研发一致	100% 与原型一致
公共组件	TableCard / FilterBar（支持 :table / default slot）	裸 a-table / a-form
Mock 数据	`src/axios/handlers/`	删除即可
路径别名	与研发项目 1:1	同左

迁移步骤（研发接手时）：

替换 src/axios/ 为真实 axios 封装（保留方法签名）
删除 src/axios/handlers/
删除原型独有页面（gate / console / prd / overview）和 composables（useVisibility）
把 <TableCard :table> 拆为 <a-row class="listPageTable"> + <a-table>
把 <FilterBar v-model> 拆为 <a-row class="listPageForm"> + <a-form>
业务逻辑 100% 不改

项目专属 Skills / Agents

触发场景	调用
新增原型页面	`/new-page` skill
生成 PRD（含截图）	`/gen-prd` skill
生成单页字段清单	`/gen-fields` skill
设计总览（小程序/硬件）	`/design-overview` skill
菜单同步检查	`/sync-nav` skill
代码规范检查	`/prototype-lint` skill
PR 综合评审	`prototype-reviewer` agent
模块级跨岗位文档包	`cross-role-doc-builder` agent

详见 .claude/skills/ 与 .claude/agents/ 下的 frontmatter description。

记忆体系（会话启动必读）

每次新会话启动时，必须先读取记忆体系索引（.claude/memory/MEMORY.md），再按需加载关键记忆文件。

必读：decisions.md / feedback.md / project_progress.md 按需：project_overview.md / user_profile.md

禁止事项

文件 / 跨模块

禁止跨页面修改其他模块的代码
禁止跨端引用页面（admin ↛ tenant ↛ miniprogram ↛ hardware）
禁止跨应用引用页面（不同 NavApp 之间不能互相 import，模拟独立部署）
禁止把 Vant 组件用在后台页面（admin/tenant），反之亦然
禁止在 src/api/index.ts 写业务私有接口（仅放跨模块公共接口）

列表页结构

禁止省略 init 三件套（即使只有 1 列表格也要独立 useTable.ts）
禁止把业务逻辑写在模板（所有逻辑通过 usePage 等 hook 暴露）
禁止在列表页渲染 PageHeader（含面包屑/标题/副标题）
禁止给 TableCard 显式传 title（菜单已表达所在位置）
禁止把主操作按钮放在页面顶部独立位置（必须放 TableCard #toolbar）

Mock / 接口

禁止把 mock 数据写在 useTable.ts，必须放 src/axios/handlers/<模块>/<页面>.ts
禁止单个 mock dataset 超过 8 条（原型用于展示而非性能压测）
禁止在业务代码直接 import axios，必须走 src/axios 的 postRequest / getRequest
禁止在 api/index.ts 写业务判断（如 if res.code === '00000'），只做 HTTP 调用

代码风格

禁止使用 async/await，请求统一 .then().catch().finally() 链式
禁止使用 function 关键字，所有函数用箭头函数 const x = () => {}
禁止直接 import { message } from 'ant-design-vue'，必须 useAntdStaticMethods()
禁止使用 any 类型

Hook 拆分

禁止在 useTable.ts 调接口，列表请求只在 usePage.ts 发起
禁止在 usePage.ts 维护独立 dataList ref，数据统一存 table.dataSource
禁止在 usePage.ts 写表格列定义（应在 useTable.ts）或下拉请求（应在 useSearch.ts）
禁止 useSearch 用 Object.keys 遍历清空，必须 Object.assign(search, createSearchKey())
禁止 searchQuery 调 resetTable()（会清空排序），必须 table.pagination.current = 1 后 listRequest()
禁止在父 .vue 中定义子组件 ref，必须在父 usePage.ts 中定义
禁止子组件打开方法命名无意义（如 open / show / visible），必须 open + 组件名

禁止在弹框/抽屉的 .vue 写业务逻辑
禁止 a-modal 不加 :keyboard="false" :mask-closable="false"（防止编辑数据丢失）
禁止省略 finally 中的 pageInfo.spin = false
禁止用 pageInfo.title / type 文本做新增/编辑判断，必须用 params.id
禁止 addRequest 中保留 id 字段（必须 delete params.id）
禁止省略 a-drawer（含列表型）的 destroy-on-close

数据展示

禁止删除/批量操作不经二次确认（必须 Modal.confirm + okType:'danger'）
禁止批量操作按钮在未选中数据时可点击（必须 :disabled="!selectedRowKeys.length"）
禁止空值字段展示为空字符串或 null（统一 ?? '—'）
禁止时间/日期格式不统一（时间 YYYY-MM-DD HH:mm:ss，日期 YYYY-MM-DD）

图标 / UI

禁止使用 emoji / 自定义 svg 作为菜单或按钮图标（必须用 @ant-design/icons-vue）
禁止给操作列的 <a-button type="link"> 加任何图标（对齐 vue 研发项目，操作列纯文字）
禁止 AI 脚手架默认生成"新增/编辑/删除"按钮（CRUD 不是列表页标配，必须由用户明确指定页面功能）
禁止操作列多个按钮之间不加 <a-divider type="vertical" /> 分隔
禁止在列定义的 customRender 中写 JSX，统一用 h() 函数
禁止 a-input-number 不设 style="width: 100%"
禁止顶栏高度偏离 64px（必须与 vue 研发项目 <a-layout-header> 默认高度一致）
禁止 App.vue 漏写 <a-config-provider :locale="zhCN">（否则分页等组件显示英文）

原型独有

禁止把截图存到 PRD 目录之外（如 public/）
禁止生成 > 60KB 的单张 Web/小程序截图
禁止在 Web 后台调用 /design-overview skill（仅支持小程序/硬件）

28 KiB Raw Blame History Unescape Escape