feat: 初始化DevOps平台前端
This commit is contained in:
@@ -0,0 +1,66 @@
|
||||
# DevOps 运维平台前端
|
||||
|
||||
Vue 3 + Vite + TypeScript 实现的 DevOps 运维控制台第一阶段,用于管理本地项目和 DevOps 平台自身的发布状态、Jenkins/Gitea/通知平台/LLM 接入状态、BPMN 流程展示和 Agent 辅助能力。
|
||||
|
||||
## 当前范围
|
||||
|
||||
- 登录、总览、项目配置、发布中心、运行记录、系统配置,以及全局右侧 Agent 抽屉。
|
||||
- 优先调用 `devops-platform-api`,后端不可用时降级到 mock 数据展示 `access-manage`、`role-admin`、`role-user`、`my-resume`、`devops-platform-api`、`devops-platform-web`。
|
||||
- 发布中心包含项目、环境、ref/tag、备注、生产二次确认、触发、取消、重试和 Jenkins 状态同步入口。
|
||||
- 运行记录展示 Jenkins queue/build、Build URL、开始/结束时间、执行提示、失败摘要和日志摘要。
|
||||
- BPMN Viewer 使用 `bpmn-js` 渲染后端流程 XML,并按 queued/running/success/failed/skipped/canceled 状态高亮节点。
|
||||
- Agent 作为全局工具从顶部打开,只包含发布风险摘要、失败诊断、Runbook 问答、发布说明草稿,并通过后端 Agent API 创建调用记录。
|
||||
|
||||
## 技术栈
|
||||
|
||||
- Vue 3
|
||||
- Vite
|
||||
- TypeScript
|
||||
- Element Plus
|
||||
- Pinia
|
||||
- Vue Router
|
||||
- Axios
|
||||
- bpmn-js
|
||||
|
||||
## 本地启动
|
||||
|
||||
```bash
|
||||
pnpm install
|
||||
pnpm dev
|
||||
```
|
||||
|
||||
The local web app listens on `http://localhost:4301` by default. Use `VITE_API_BASE_URL=http://localhost:4300` when switching from mock services to the local API.
|
||||
|
||||
## 构建检查
|
||||
|
||||
```bash
|
||||
pnpm build
|
||||
```
|
||||
|
||||
## API 契约来源
|
||||
|
||||
接口入口为 `src/services/devopsApi.ts`,默认优先调用后端统一 envelope 响应;后端不可用或 `VITE_DEVOPS_USE_MOCK=true` 时降级到 `src/mocks/devops.ts`。后续以 `/Users/mac033/Desktop/my-project/devops-platform-docs/devops-platform-implementation-tracker.md` 中的产品约束和后端 OpenAPI 为准继续收敛字段。
|
||||
|
||||
浏览器端不得保存或直连以下密钥和服务:
|
||||
|
||||
- Jenkins token
|
||||
- Gitea token
|
||||
- 通知 webhook
|
||||
- LLM API key/baseURL/model
|
||||
|
||||
## BPMN 边界
|
||||
|
||||
- 前端只负责 BPMN XML 展示和节点状态高亮。
|
||||
- `run.steps[].bpmnNodeId` 必须与 BPMN XML 节点 id 一致。
|
||||
- 流程推进、失败停留、审计日志和状态机由后端负责。
|
||||
|
||||
## Agent 边界
|
||||
|
||||
前端不提供泛聊天入口。Agent 入口仅围绕 DevOps 运维场景:
|
||||
|
||||
- 发布风险摘要
|
||||
- 失败诊断
|
||||
- Runbook 问答
|
||||
- 发布说明草稿
|
||||
|
||||
模型调用、脱敏、审计、白名单知识库和密钥管理由后端代理实现。
|
||||
Reference in New Issue
Block a user