feat: integrate platform backend and application interfaces
This commit is contained in:
@@ -21,8 +21,8 @@
|
||||
|
||||
## 前端规范
|
||||
|
||||
- 前端使用 Vite、React、React Router、TypeScript、Ant Design、Tailwind、Zustand。
|
||||
- 编写 Ant Design 相关代码时,参考 https://ant.design/llms-full.txt 理解组件 API、示例和设计规范,并优先结合项目当前 antd 版本与既有写法。
|
||||
- 前端使用 Vite、React、React Router、TypeScript、TDesign、Tailwind、Zustand。
|
||||
- 编写 TDesign 相关代码时,优先结合项目当前锁定版本、共享 `packages/ui` Provider 和既有适配层写法;不要重新引入 Ant Design 或其他普通控件库。
|
||||
- 外部服务请求统一放在 `web/src/services/api/`,由浏览器前端直连,不假设存在项目后端。
|
||||
- 全局或跨页面状态优先放在 `web/src/stores/`。
|
||||
- 已经放在全局 store 或全局 hook 中的状态/动作,组件需要时直接使用对应 store/hook,不要为了“纯组件”层层透传 props;避免一个组件传递过多参数。
|
||||
@@ -34,11 +34,24 @@
|
||||
- 不要新增只做简单转发的组件,例如只 `return <X>{children}</X>` 或只换个名字透传 props;直接在使用处使用真实组件或把逻辑写进当前文件。
|
||||
- 页面私有 hook 放在对应页面目录下,例如 `admin/assets/use-admin-assets.ts`;只有多个页面真实复用的 hook 才放到外层 `hooks/`。
|
||||
- 管理后台页面私有组件放到各自页面目录的 `components/` 下,例如 `admin/assets/components/`、`admin/prompts/components/`;不要为了单页面使用放到 `admin/components/` 共享目录。
|
||||
- 管理后台主题、背景、卡片阴影、表格配色等统一在 `web/src/lib/app-theme.ts`、`AppProviders` 或必要的全局 CSS 作用域中配置;页面私有组件不要自己写 `dark ? ...` 主题分支。
|
||||
- Ant Design 的 Dropdown、Menu、Select、Cascader、TreeSelect 等弹层背景、悬停态和选中态颜色统一通过 `web/src/lib/app-theme.ts` 的全局 Alias Token 与组件 Token 配置;不要在业务组件内为单个弹层覆盖颜色。
|
||||
- 前后台主题、背景、卡片阴影、表格配色等统一在 `web/src/lib/tdesign-theme.ts`、`AppProviders` 或必要的全局 CSS 作用域中配置;页面私有组件不要自己写 `dark ? ...` 主题分支。
|
||||
- TDesign 的 Dropdown、Menu、Select、Cascader、TreeSelect 等弹层背景、悬停态和选中态颜色统一通过 `web/src/lib/tdesign-theme.ts` 的主题变量与组件 Token 配置;不要在业务组件内为单个弹层覆盖颜色。
|
||||
- 组件优先使用函数组件和现有 hooks,不新增大型状态管理方案。
|
||||
- UI 图标优先使用 `lucide-react` 或项目已经使用的 Ant Design 图标。
|
||||
- 前后台通用 UI 图标统一使用项目内本地化的 Lineicons 子集;只收录实际使用的图标,禁止引入 CDN、WebFont、完整图标目录或其他业务图标库。品牌标识、模型标识、媒体内容和画布连线等具有独立语义的视觉资产不按通用 UI 图标替换。
|
||||
- 用户端业务下拉不得使用浏览器原生 `<select>`;统一使用项目自有的主题化 GUI 下拉组件,必须保留键盘选择、当前选中态、禁用/空状态、点击外部关闭、Escape 关闭和移动端可用性。需要搜索或多选的复杂场景也必须使用带主题的 GUI 组件。
|
||||
- 用户端主导航、用户菜单和侧栏账户操作必须显式设置 `justify-content: flex-start` 与 `text-align: left`;仅设置文字对齐不能覆盖通用按钮的居中布局。
|
||||
- 管理后台的菜单、页头、登录和业务操作图标统一使用 `admin/src/components/LineIcons.jsx` 中本地化的 Lineicons 子集;禁止重新引入 CDN、WebFont、全量图标目录或 `tdesign-icons-react` 业务引用。菜单、页头和主要业务操作图标默认 24px,并同步保留至少 40px 的稳定点击区域。
|
||||
- 管理台全屏登录路由必须直接挂载登录主体,不得继承后台 `Layout/Content` 壳层或新增移动端卡片容器;手机端沿用桌面左侧内容轨道,仅按视口缩放,不另起一套布局。
|
||||
- 页面文案保持中文。
|
||||
- 管理后台的业务字段必须经过中文映射后再展示;对象、数组和余额等结构化数据使用字段化组件呈现,禁止直接把原始 JSON 输出到页面。用户列表的 `id` 在表头为 `ID` 时按当前列表顺序显示为从 1 开始的纯数字;模型、套餐、渠道等其他资源标识保留其真实语义,不得擅自改成连续编号。
|
||||
- 渠道模型映射必须明确区分平台显示模型 ID 与供应商请求模型 ID;显示 ID 用于匹配公开模型产品,请求 ID 只用于发送给上游,不能在管理台或服务端把两者合并成一个字段。
|
||||
- 渠道请求地址表单必须给出完整 URL 示例(如 `https://example.com`、`https://example.com/v1`);API Key 只校验去除首尾空白后非空,不得设置固定最小长度,编辑留空表示沿用原凭证。
|
||||
- 渠道模型列表只能由用户点击按钮主动拉取,新增或编辑保存不得隐式发起上游请求;动态模型映射行必须使用创建时稳定的 React key,不得使用正在编辑的输入值作为 key,避免输入过程中组件重建而丢失焦点。
|
||||
- 渠道模型列表与模型映射必须独立:拉取结果只能作为候选模型供用户勾选并添加到渠道模型列表,禁止自动创建映射;模型映射是可选的,仅用于平台显示模型 ID 与供应商请求模型 ID 不同时的转换。
|
||||
- 管理后台使用受控字段时,不得用无 `name` 的 TDesign `FormItem` 直接包裹控件,避免其内部状态覆盖外部 `value`;要么完整使用 `Form` 作为唯一数据源,要么使用普通布局容器保持单一状态源。
|
||||
- 管理后台所有新增、编辑、确认和提示弹窗都必须支持取消、右上角关闭、遮罩关闭和 ESC 关闭;异步操作成功后自动关闭,失败时保留表单并显示中文错误,不得依赖刷新页面清除弹窗。
|
||||
- 用户金币调整必须提供独立的增加、扣减图标入口;弹窗只让管理员填写正整数数量和原因,并显示当前可用金币与审批后预计余额,禁止要求管理员用正负号表达方向。
|
||||
- 管理后台对外部供应商的探活或模型拉取必须显示独立加载状态、实际请求路径和请求是否已发起;失败原因要用中文区分地址解析、网络连接、HTTP 权限/状态和返回内容问题,不得只显示笼统的“探测未通过”。
|
||||
- 不要在组件里堆太多无关逻辑;复杂逻辑优先抽成同目录工具函数或小组件。
|
||||
- 样式优先由组件自己管理;组件私有样式优先使用 Tailwind className 或少量内联 style,不要为单个组件新增大量全局 CSS。
|
||||
- 全局 CSS 只放基础变量、全局重置、跨页面通用样式和少量第三方组件必要覆盖;不要在 `globals.css` 堆页面私有样式。
|
||||
@@ -48,7 +61,7 @@
|
||||
## 画布 UI 规范
|
||||
|
||||
- 做 canvas 前端 UI 时必须遵循当前画布主题。
|
||||
- 优先使用 `canvasThemes`、`useThemeStore` 或 Ant Design `ConfigProvider` token。
|
||||
- 优先使用 `canvasThemes`、`useThemeStore`、共享 `TDesignProvider` 或 TDesign 主题变量。
|
||||
- 不要硬编码黑白、stone、slate 等颜色导致浅色/深色主题不一致。
|
||||
- 新增画布按钮、弹窗、浮层时,尽量复用已有工具栏、节点面板、Modal 的视觉风格。
|
||||
- 画布顶部工具栏和状态信息优先采用极简扁平风格:无边框、无阴影、无胶囊背景,融入整体背景,弱化按钮感,仅保留轻微 hover 反馈,保持简洁现代、低视觉重量。
|
||||
@@ -86,3 +99,4 @@
|
||||
- Agent 对话消息必须同时按 `threadId`、`turnId` 和 `itemId` 归属;实时事件只用于补充未物化的 turn,历史快照成为权威后不得重复合并同一条消息。
|
||||
- Agent 通信协议版本与消息存储版本必须独立管理;消息存储格式升级时必须先备份再迁移,遇到未知版本、损坏清单或冲突备份时拒绝覆盖原文件,不得按记录数量或文件大小静默裁剪历史元数据。
|
||||
- 本地启动或浏览器验收时不要关闭用户已经打开的浏览器窗口或标签页;需要自动化验证时使用独立测试页面,避免打断用户当前页面和对话状态。
|
||||
- 开发环境不得自动创建展示用 mock 渠道;需要渠道数据时由用户显式新增,自动化测试专用 fixture 不受此限制。
|
||||
|
||||
Reference in New Issue
Block a user