| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384 |
- 使用中文回答
- @src @openapi.txt
- 版本信息
- react-router: "^7.5.1"
- tanstack query: "@tanstack/[email protected]"
- 完成 API Keys 页面 @page.tsx 要求如下:
- 1. 使用 shadcn 的组件库
- 2. 使用 tanstack query 进行数据请求
- 3. 使用 react-hook-form 和 zod 进行表单验证
- 4. 页面简洁大方，好看
- 5. 按照项目原本的目录结构进行组织
- 6. 代码不出错，可以运行
- api 代码风格 参考 @model.ts
- validation 代码风格参考 @model.ts
- hoook 代码风格参考 @hooks.ts @hooks.ts
- dialog 代码风格参考 @ModelDialog.tsx
- 详细要求如下:
- 1. API Keys 页面的 key 对应后端的数据结构 token，完成 API Keys 页面的 crud 操作
- 2. API Keys 页面的 table 展示字段 name key (API Key) accessed_at (时间戳，最近使用时间，当时间是负值时表明该 key 没被使用) request_count （请求次数） status （1 启用 2 禁用） ，操作有删除 启用 禁用
- 3. table 参考 @ChannelTable.tsx @hooks.ts 给的示例代码 用无限滚动实现
- 4. 页面代码要求现代化，视觉好看，符合 shadcn ui 风格
- 5. 项目的国际化翻译文件 @translation.json @translation.json 项目需要完成国际化
- 重要要求：group 概念对用户隐藏，创建key 时，group 的值和 name 保持一致
- /api/token/${group}?auto_create_group=true
- 描述信息：创建 token
- 方法：post
- 参数：
- path group: 组名
- body
- {
- "name": "token1"
- }
- 且 name 的命名只能是字母数字下划线的组合
- 非常重要的一点
- @context.md 是项目的上下文信息，在设计的时候可以参考这个文件获取目前项目已有的信息，在完成本次变更后，所做的变更需要同步到 context.txt 上下文文件中，方便下次提问
- 项目核心结构如下
- src/
- ├── api/ # API相关文件
- │ ├── index.ts # 基础配置和拦截器
- │ ├── auth.ts # 认证相关API
- │ └── services.ts # 统一导出所有API服务
- ├── feature/ # 功能模块（包含特定功能的组件和hooks）
- │ ├── auth/ # 认证相关功能
- │ │ ├── components/ # 认证相关组件
- │ │ └── hooks.ts # 认证相关自定义hook，例如 tanstack query 数据管理的封装
- │ └── ...
- ├── store/ # 全局状态管理
- │ ├── auth.ts
- │ └── index.ts
- ├── validation/ # 表单验证逻辑
- │ ├── auth.ts
- │ └── ...
- ├── components/ # 通用组件
- │ ├── table/ # 表格组件
- │ ├── layout/ # 布局组件
- │ │ ├── sidebar.tsx # 侧边栏组件
- │ │ └── root-layout.tsx # 根布局组件
- │ ├── ui/ # 通用UI组件
- ├── router/ # 路由配置
- │ ├── config.ts # 路由配置
- │ └── ...
- ├── utils/ # 工具库
- │ ├── env.ts
- │ └── ...
- ├── hooks/ # 自定义hooks
- ├── lib/ # 工具库
- │ ├── utils.ts
- │ └── ...
- ├── types/ # 类型定义
- │ ├── auth.ts
- │ └── ...
- ├── pages/ # 页面组件
- │ ├── auth/ # 认证相关页面
- │ │ ├── login.tsx # 登录页面
- │ └── ...
|
