管理平台前端技术文档

管理平台源码位于 /Users/xing/workspace/muotai/muotai-frontend，产品定位是面向企业管理员、审计人员、专家、运营人员和内部配置人员的综合管理界面。它同时承载文档空间、AI Agent 编排、知识库、文档起草、合规审查、工作流和平台运营能力。

1. 工程和应用壳

text

src/
├── api/                 # 认证、AI、文档、市场、工作流和运营 API
├── assets/              # 图标、字体、主题、登录、文件和工作流资源
├── components/          # 通用组件、文件预览、上传、WebOffice、图表和布局
├── module/
│   ├── audit/           # 审计管理模块及其路由、API、页面
│   ├── accounting/      # 财务数据中台模块
│   └── specialProject/  # 专项项目和客户池模块
├── router/              # 静态/异步路由、守卫、菜单转路由
├── store/               # 用户、菜单、设置、标签页、SSE、起草和工作流状态
├── types/、enums/       # API、页面、路由、组件和全局类型
├── utils/、composables/ # HTTP、SSE、存储、主题、导航和业务工具
└── views/               # 页面和页面专属组件

src/main.ts创建 Vue 应用并注册 Router、Pinia、Element Plus 和全局插件；src/App.vue提供 Element Plus locale 与顶层 RouterView。页面布局由 views/index/index.vue及其布局组件承载，页面切换、标签页和菜单由 Router/Store 协同维护。

2. 登录、租户和权限

2.1 登录流程

管理端登录页面位于 views/auth/login，包含账号登录、验证码、租户选择、社交登录和回调处理。注册和找回密码分别位于 views/auth/register、views/auth/forget-password。登录成功后至少需要完成：

保存 accessToken/refreshToken 和 tenantId。
拉取用户信息及所属组织、角色和菜单。
注册异步路由并生成侧边栏菜单。
打开默认首页或恢复上次可访问页面。

2.2 路由权限

staticRoutes.ts定义无需后端菜单即可识别的入口；asyncRoutes.ts包含业务菜单和隐藏详情页。beforeEach.ts负责登录检查、白名单、动态路由注册和路由重置；afterEach.ts负责页面标题、进度和标签页收尾。

权限判断必须分为三层：

层次	负责内容	失败表现
路由可见性	菜单、角色、模块和隐藏页	菜单不展示或跳 403
页面操作	新增、编辑、删除、发布、导出等按钮	禁用、隐藏或提示无权限
服务端资源授权	租户、房间、文档、Agent、工单、审计项目	API 返回授权失败

前端菜单和按钮状态不能替代服务端校验。跨租户访问、猜测资源 ID、直接调用隐藏路由都必须由后端拒绝。

3. 路由和页面地图

3.1 文档空间

路由	主要页面	技术关注点
`/my-doc/:id?`	我的文档	文档列表、最近访问和可选文档 ID
`/rooms`	房间列表/详情	房间成员、权限、目录和操作菜单
`/rooms/view/:roomId/:parentId/files`	房间文件	通过 roomId/parentId 加载文件树和列表
`/archives`	归档房间	归档/恢复状态和只读行为
`/recycle-bin`	回收站	恢复、彻底删除和批量操作
`/filePreview/:type?/:id`	文件预览	文件类型、版本、下载地址和权限
`/web-office`	WPS/WebOffice	编辑凭证、保存和版本同步

核心源码是 views/rooms、views/archivedRoom、views/recycleBin、components/FilePreview、components/WebOffice，API 主要来自 api/roomApi.ts、docSpace.ts、recycleApi.ts 和 upload.ts。

3.2 AI 工作室和 Agent 编排

text

/ai-studio
└── /agent/:id?
    ├── Agent 信息与发布
    ├── Canvas/Toolbar/MiniMap/Zoom
    ├── NodeItem/NodeContextMenu
    ├── Node Panel 与配置 Panel
    ├── Chat/Execution/Trace/Log
    └── Channel/DocSpace/Flow/KB/RoomKB/Rule/Skill/Tool/SubAgent

节点类型在 views/aiAgentDetail/childPage/nodes 和 nodeTypes.ts中维护，当前需要单独记录：Start、End、Text、LLM、RAG、MCP、DB、Code、HTTP、Notice、Question、Switch。每种节点文档应说明输入/输出数据、配置项、校验规则、运行失败表现和对应后端能力。

Agent 详情页还包含：

Prompt、变量、模型参数、开场白和环境变量配置。
知识库、房间文档、Skill、Tool、MCP、Channel 和子 Agent 绑定。
执行面板、节点日志、Trace 抽屉、JSON 预览和调试聊天。
未发布遮罩、版本/发布状态以及生产调用入口。

API 主要来自 aiAgentApi.ts、aiChatbot.ts、aiLlmModelApi.ts、aiDataset.ts、aiSkill.ts、aiToolApi.ts、aiMcpConfig.ts、aiWechatChannel.ts 和 aiQqChannel.ts，后端对应 muotai-ai 的 Agent、LLM、RAG、Skill、Tool 和 Channel 领域。

3.3 AI 文档起草和模板

AI 起草页面包括 /doc-draft/setup、/doc-draft/templates、/doc-draft/editor、/doc-template/manage以及 views/aiDocDraft 下的多步组件：

text

基础信息/动态元数据
  -> 大纲树编辑
  -> 目录和章节生成
  -> Umo/文档编辑
  -> 保存草稿、预览、导出

store/modules/aiDoc.ts维护文档信息和生成任务，并以并发池执行章节生成。每个任务有 pending/running/success/error 状态，生成过程把 Markdown/HTML 转换为编辑器 JSON，再通过 updateOutline 保存。文档应明确：

动态元数据 JSON 的字段定义和校验规则。
单文档最大并发数、任务失败后的重试方式和重复提交保护。
章节流式内容如何增量渲染，编辑器内容如何保存。
模板文件、缩略图、下载地址和后端文件记录的关系。

3.4 知识库和文档处理

views/knowledgeBase与 api/knowledgeBaseApi.ts覆盖数据集、文档、分段和图谱配置。典型链路为：

text

创建 Dataset
  -> 上传/同步房间文档
  -> 文档解析与分段
  -> 查看/编辑/删除 Chunk
  -> 启动向量化
  -> 配置图谱 Schema
  -> Agent/RAG 检索

前端需要展示文档处理状态、批量启动、单文档重试、删除确认和向量化失败；不能把“上传完成”误认为“可检索”。后端服务涉及 muotai-ai、muotai-doc-space、Embedding/向量库和可选 SPG。

3.5 合规、合同和招投标审查

管理端同时存在通用合规检查、合同审查、审查规则和招投标审查入口：

/documentCompliance：上传文档、分析、待办内容、风险项、PDF 展示。
/contract-reviewer/:type?：合同上传、审查配置、审查进度、风险报告、整改、导出和历史记录。
/review/rule：规则分类、规则详情、启停和配置。
/biddingReviewer：配置、需求项、加载态和审查结果。

文档应把“任务状态”和“风险项状态”分开说明，记录 API、轮询/SSE、报告生成、批注定位、整改确认和导出行为。后端通常由 muotai-audit、muotai-doc-compliance、muotai-expert 和 AI 文档审查能力共同提供。

3.6 工作流和动态表单

工作流页面使用 views/workflow，覆盖模型、表单、设计、工作台和打印：

text

模型管理
  -> 表单设计（FormDesigner/FormRender）
  -> BPMN 设计（ProcessDesigner/ProcessRender）
  -> 发布模型
  -> 发起流程
  -> 待办/已办/我发起/抄送
  -> 轨迹、审批、通知和归档

表单控件包括文本、数字、日期、人员/部门选择、文件/图片上传、富文本、表格、签名、评分、地址和布局控件。流程节点包括开始、审批、任务、抄送、网关、等待、子流程、触发器和路由。每个配置项必须对应后端 Flowable 模型字段，不能只记录视觉效果。

3.7 审计、财务和专项模块

审计模块

src/module/audit独立维护路由、API、资源和视图，页面包括数据统计、审计首页、检测资料、业务部门、文档库、合规监测、风险整改、法规库、控点清单、制度检测、业务域、标准库、标准同步、自检报告和系统配置。

编纂时应按“项目/业务域 → 资料 → 标准/控点 → 检测任务 → 风险 → 整改 → 报告”的业务链路组织，而不是仅按目录罗列页面。

财务数据中台

src/module/accounting提供 /data_middle_platform/index和凭证数据详情页，API 位于 module/accounting/api。需记录数据查询条件、凭证字段、分页、导出和与财务后端服务的访问边界。

专项项目

src/module/specialProject包含准备、实施、报告三个阶段，以及客户池和资源管理。阶段切换、项目状态、客户资源权限和报告产物是后续专题的重点。

3.8 专家、工单和运营

管理端专家和运营页面包括专家工作台、工单管理、我的工单、结算、佣金、字典、权益、云集市、轻应用、增长、反馈和使用统计。工单文档应覆盖创建、派单、接单、拒单、风险编辑、结论润色、提交审核、完成和结算，且为每个动作标出操作者和状态前置条件。

4. 管理端 Store 和通用基础设施

4.1 SSE Store

store/modules/sse.ts以 sessionId 为键维护连接：

connecting：连接建立中，10 秒内未就绪则标记错误。
connected：服务端接受连接。
padding：已发送消息，等待输出。
computed：本轮输出完成。
error：连接或业务失败。

sseAbortMap保存每个 session 的 abort 函数；关闭、错误和主动取消后必须删除 Map 和消息项，避免页面重复连接或泄漏。

4.2 文件和预览组件

通用文件组件包括 FilePreview、FileUpload、UploadFile、UploadImage、MdRenderer、WebOffice、Pagination、Table和QueryTree。文件页面应统一处理下载权限、文件类型、版本、预览失败、上传进度和删除确认，避免各业务页面各自实现一套错误模型。

4.3 多语言、主题和资源

菜单标题可能是 i18n key，也可能是硬编码字符串；新增菜单时需要确认 locales 是否有对应翻译。主题配置来自 Store 和后端 frontThemeConfig，图标可能来自 Element Plus、Iconify、FontAwesome 或项目字体图标，新增图标应保持现有资源加载方式。

5. 管理端 API 分组

分组	API 文件	主要后端边界
认证/平台	`usersApi`、`systemApi`、`tenant`、`menuApi`、`message`、`notice`	Auth、UPMS、Gateway
Agent/AI	`aiAgentApi`、`aiChatbot`、`aiLlmModelApi`、`aiToolApi`、`aiSkill`、`aiDataset`	AI、Doc Space
文档空间	`roomApi`、`docSpace`、`recycleApi`、`upload`	Doc Space、AI 文件服务
起草/模板	`aiDaftRecord`、`aiDocTemplate`、`doc-template`	HMC、Doc Space、AI
审查/合规	`documentCompliance`、`reviewRuleApi`、`bidReview`	Audit、Expert、AI
工作流	`api/workflow/*`	WFlow、UPMS
市场/轻应用	`lightApp`、`marketplaceApi`、`marketTagApi`、`privileges`	AI、Billing、Growth
专家运营	`expert`、`workorder`、`settlementManage`、`commission`	Expert、Billing
业务模块	`module/audit/api/`、`module/accounting/api/`、`module/specialProject/api/*`	Audit、Accounting、专项服务

新增或修改 API 时，必须同时更新类型、页面错误处理、权限前置条件和后端接口索引。

6. 管理端构建和桌面端

package.json提供 dev、dev:muotai、多个内网环境脚本、build、fast-build、test-build、tauri:dev、tauri:build、pack:chat、lint和样式检查。管理端依赖包含 Element Plus、Tiptap/Umo、BPMN/Vue Flow、PDF、Office、Monaco、Mermaid、图表和 Tauri 插件，构建时应重点观察内存、异步 chunk 和编辑器依赖是否被错误打入首屏。

Tauri 构建还要核对 src-tauri/tauri.conf.json、文件/对话框权限、API Base URL 和桌面端下载路径。Web 发布则要配置 history fallback、静态资源缓存和 /api 反向代理。

管理平台前端技术文档 ​

1. 工程和应用壳 ​

2. 登录、租户和权限 ​

2.1 登录流程 ​

2.2 路由权限 ​

3. 路由和页面地图 ​

3.1 文档空间 ​

3.2 AI 工作室和 Agent 编排 ​

3.3 AI 文档起草和模板 ​

3.4 知识库和文档处理 ​

3.5 合规、合同和招投标审查 ​

3.6 工作流和动态表单 ​

3.7 审计、财务和专项模块 ​

审计模块 ​

财务数据中台 ​

专项项目 ​

3.8 专家、工单和运营 ​

4. 管理端 Store 和通用基础设施 ​

4.1 SSE Store ​

4.2 文件和预览组件 ​

4.3 多语言、主题和资源 ​

5. 管理端 API 分组 ​

6. 管理端构建和桌面端 ​

管理平台前端技术文档

1. 工程和应用壳

2. 登录、租户和权限

2.1 登录流程

2.2 路由权限

3. 路由和页面地图

3.1 文档空间

3.2 AI 工作室和 Agent 编排

3.3 AI 文档起草和模板

3.4 知识库和文档处理

3.5 合规、合同和招投标审查

3.6 工作流和动态表单

3.7 审计、财务和专项模块

审计模块

财务数据中台

专项项目

3.8 专家、工单和运营

4. 管理端 Store 和通用基础设施

4.1 SSE Store

4.2 文件和预览组件

4.3 多语言、主题和资源

5. 管理端 API 分组

6. 管理端构建和桌面端