# loser-agent-web

**Repository Path**: yimeng812/loser-agent-web

## Basic Information

- **Project Name**: loser-agent-web
- **Description**: Loser Agent 后端的 Vue 3 前端工程，提供 Agent 管理、模型市场、技能市场、MCP 市场、灰度配置、子 Agent 管理、SSE 流式对话等完整管理界面。
- **Primary Language**: Unknown
- **License**: AGPL-3.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-08-17
- **Last Updated**: 2026-09-06

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Loser Agent Web

[![License: AGPL-3.0](https://img.shields.io/badge/License-AGPL%20v3-blue.svg)](../LICENSE)

Loser Agent 后端的 Vue 3 前端工程，提供 Agent 管理、模型市场、技能市场、MCP 市场、灰度配置、子 Agent 管理、SSE 流式对话等完整管理界面。

## 技术栈

| 类别 | 选型 |
|------|------|
| 框架 | Vue 3.5 + Composition API + `<script setup>` |
| 语言 | TypeScript 5 (strict) |
| 构建 | Vite 6 |
| UI 库 | Element Plus 2.9（按需引入） |
| 状态管理 | Pinia 2.2 |
| 路由 | Vue Router 4.4 |
| HTTP | Axios 1.7 |
| SSE | @microsoft/fetch-event-source 2.0.1 |
| Markdown | markdown-it 14.1 |
| 自动导入 | unplugin-auto-import + unplugin-vue-components |

## 页面与路由

### 用户侧
| 路径 | 页面 | 说明 |
|------|------|------|
| `/login` | Login | 登录页（Stub SSO，任意工号+Token） |
| `/` | Workspace | 工作台首页 |
| `/chat` | Chat | SSE 流式对话 |

### 管理侧 (`/admin/*`)
| 路径 | 页面 | 说明 |
|------|------|------|
| `/admin/dashboard` | Dashboard | 管理面板首页 |
| `/admin/agents` | AgentList | Agent 列表 |
| `/admin/agents/new` | AgentForm | 新建 Agent |
| `/admin/agents/:code` | AgentDetail | Agent 详情 + 编辑 |
| `/admin/publish` | PublishList | 发布记录 + 回滚操作 |
| `/admin/llm-market` | ModelMarket | 模型市场（模型实体 + Agent 绑定） |
| `/admin/skill-market` | SkillMarket | 技能市场（上传 + Agent 绑定） |
| `/admin/mcp-market` | McpMarket | MCP 市场（MCP Server + Agent 绑定） |
| `/admin/subagents` | SubagentList | 子 Agent 列表 |
| `/admin/subagents/new` | SubagentForm | 新建子 Agent |
| `/admin/subagents/:agentId` | SubagentDetail | 子 Agent 详情 |

## API 服务

| 文件 | 说明 |
|------|------|
| `agent.ts` | Agent 配置 CRUD |
| `chat.ts` | SSE 流式对话 |
| `llm.ts` | LLM 配置管理 |
| `model.ts` | 模型实体 + 绑定 |
| `gray.ts` | 灰度发布配置 |
| `skill.ts` | 技能管理 + 绑定 |
| `mcp.ts` | MCP Server + 绑定 |
| `subagent.ts` | 子 Agent CRUD |
| `publish.ts` | 发布 / 回滚 |
| `request.ts` | Axios 实例 + 鉴权头注入 |

## Store 模块

| Store | 说明 |
|-------|------|
| `user` | 登录态、工号、SSO Token |
| `llm` | LLM 配置状态 |
| `chat` | 对话消息、SSE 连接状态 |

## 鉴权

后端期望 3 个请求头（前端 `request.ts` 自动注入）：

- `X-Emp-Id`：工号
- `X-SSO-Token`：SSO Token（后端不校验，仅透传）
- `X-Thread-Id`：会话 ID（仅 SSE 对话接口）

## 开发

```bash
# 安装依赖
pnpm install

# 启动 dev server（端口 5173，自动代理 /api → http://localhost:8080）
pnpm dev

# 类型检查
pnpm type-check

# 生产构建
pnpm build
```

## 启动顺序

1. 启动后端：`cd F:\workspace\loser-agent && mvn -pl loser-modules/loser-agent-app spring-boot:run`
2. 启动前端：`cd loser-agent-web && pnpm dev`
3. 浏览器打开 `http://localhost:5173`，自动跳转 `/login`
4. 输入任意工号 + 任意 SSO Token → 登录

## 已知局限

- SSE 事件 schema 后端尚未稳定，前端仅做文本拼接，不分类
- 不含 HITL 确认交互
- 不含 Thinking 折叠 / ToolCall 渲染 / Markdown 高亮
- 不含角色权限矩阵
- 不含 BUC SSO 真实登录
- 不含移动端适配

## 许可证

本项目基于 [GNU Affero General Public License v3.0](../LICENSE) 开源。