23 lines
824 B
Markdown
23 lines
824 B
Markdown
# ApiKey.vue
|
||
|
||
**路径**：`src/views/ApiKey.vue`
|
||
**路由**：`/api-key`，name: `api-key`
|
||
|
||
## 功能用途
|
||
|
||
API Key 管理页面，按 Pencil 设计稿 `WFa0K` 节点 1:1 还原。页面包含标题区（`API Key 管理` + `创建 Key` 按钮）和 API Key 卡片列表（Key 名称、Key 值、复制/删除按钮）。
|
||
|
||
## 使用方式
|
||
|
||
- 访问路由 `/api-key`
|
||
- 页面展示 3 条示例 Key 数据，卡片结构如下：
|
||
- 顶部：`Key #n`
|
||
- 中部：完整 Key 字符串
|
||
- 底部：右对齐操作按钮 `复制`、`删除`
|
||
|
||
## 扩展方式
|
||
|
||
1. **接入真实列表**：将本地 `apiKeys` 常量替换为后端 API 数据。
|
||
2. **接入操作事件**：为 `创建 Key`、`复制`、`删除` 按钮绑定真实业务逻辑。
|
||
3. **安全策略**：可增加 Key 脱敏展示与二次确认删除弹窗。
|