# 智能文档归类后台
**Repository Path**: zmd1992/agent-document-categorization-ui
## Basic Information
- **Project Name**: 智能文档归类后台
- **Description**: 智能文档归类后台
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-10-10
- **Last Updated**: 2026-10-11
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
# 智能文档归类前端
基于 **Vue 3 + TypeScript** 的中后台管理系统前端，配套后端项目 `agent-document-categorization-api` 使用。除标准的用户/角色/菜单/监控等管理功能外，内置「**智能文档归类**」三个页面，对接后端 `single-category` 模块的本地大模型归类能力。
## 其他地址
- 后端地址 ： https://gitee.com/zmd1992/agent-document-categorization-api
- 本地客户端地址：https://gitee.com/zmd1992/local-client
## 技术栈
| 类别 | 技术 |
|---|---|
| 框架 | Vue 3.5、TypeScript 5.9、Vite 8 |
| UI 组件 | Element Plus 2.13、Tailwind CSS 4 |
| 状态管理 | Pinia 3（含持久化插件） |
| 路由 | Vue Router 4（Hash 模式 + 后端动态菜单） |
| 请求 | Axios（拦截器统一携带 Token / 错误处理） |
| 图表 | ECharts 6、vue-echarts |
| 其他 | vue-quill 富文本、spark-md5 分片上传、vite-plugin-svg-icons |
## 功能模块
- **认证与动态路由**：登录后从后端 `/api/menu/tree` 加载菜单，动态注册路由（`src/router/dynamic.ts` 自动扫描 `views/**/*.vue`），支持刷新页面路由恢复；
- **系统管理**：用户 / 角色 / 菜单 / 字典 / 通知 / 文件 / 操作日志 / 在线用户等页面；
- **监控**：服务器状态（CPU/内存/磁盘，ECharts 图表）、Redis 监控、接口监控；
- **工具**：代码生成配置页；
- **智能文档归类**（核心业务）：
- `scanTask` 扫描任务：创建任务、配置源目录/目标目录、异步启动扫描、Ollama 连接状态检测；
- `fileRecord` 归类记录：按任务/状态/分类筛选，查看 Agent 归类结果与内容预览，人工确认 / 驳回 / 重新归类；
- `categoryRule` 分类规则：自定义分类、扩展名与关键词（注入 Agent 提示词）。
## 界面预览
> 以下截图来自本地运行环境（http://localhost:3000），图片存放于 `img/` 目录。
### 扫描任务
创建任务、配置扫描源目录与目标根目录、异步启动扫描，页面顶部实时显示 Ollama 连接状态。
### 归类记录
查看 Agent 归类结果（分类 / 置信度 / 理由），置信度不足的文件可人工「确认 / 驳回」，也可「重新归类」。
### 分类规则
自定义分类、扩展名与关键词，规则会注入 Agent 提示词辅助判断，Agent 仍结合文件内容综合决策。
## 目录结构
```
src
├── api/ # 接口封装（user / menu / task / file / category 等）
│ ├── category.ts # 智能归类：scanTaskApi / fileRecordApi / categoryRuleApi
│ └── config.ts # 接口配置
├── components/ # 通用组件（HeaderBar / SideMenu / TagsView / SvgIcon / ChuckUpload 分片上传等）
├── directives/ # 自定义指令（v-permission 按钮权限）
├── router/
│ ├── index.ts # 路由实例 + 登录守卫
│ └── dynamic.ts # 后端菜单 → 动态路由构建
├── stores/
│ ├── userStore.ts # 用户信息 / Token
│ └── menuStore.ts # 菜单树 / 主题配置
├── types/ # TS 类型定义
├── utils/
│ ├── request.ts # Axios 封装（baseURL /api，自动携带 Bearer Token）
│ ├── download.ts # 文件下载
│ └── date.ts # 日期工具
└── views/
├── Login.vue / Index.vue / Home.vue # 登录与主布局
├── system/ # 系统管理页面
├── monitor/ # 监控页面
├── tool/ # 工具页面
└── category/ # ★ 智能文档归类（scanTask / fileRecord / categoryRule）
```
## 环境要求
- Node.js **20+**（推荐 22 LTS，Vite 8 要求 Node ≥ 20.19）
- npm 10+
- 后端服务已启动（依赖 MySQL / Redis，智能归类还需本地 Ollama）
## 快速开始
### 1. 准备后端（详见后端 README.md）
```bash
# 初始化数据库（后端 api 目录下）
# 执行 sql.sql 与 sql/category.sql，安装 Ollama 并拉取模型
ollama pull qwen3:8b
# 启动后端
cd ../agent-document-categorization-api
mvn spring-boot:run -pl single-admin # 或 IDE 运行 com.single.App，端口 8081
```
### 2. 安装依赖并启动
```bash
cd agent-document-categorization-ui
npm install
npm run dev
```
启动后浏览器自动打开 **http://localhost:3000**，使用后端初始化脚本中的账号登录。
## 代理与联调
`vite.config.ts` 已配置开发代理：
```
/api → http://localhost:8081 （去掉 /api 前缀，因后端 context-path 为 /api）
```
前端请求统一走 `/api` 前缀（`utils/request.ts` 的 baseURL），开发时无需处理跨域；生产部署时由 Nginx 将 `/api` 反向代理到后端。
## 构建
```bash
npm run build # vue-tsc 类型检查 + vite 打包，产物输出到 dist/
```
> 说明：脚手架部分既有页面（如 `system/notice`、`system/task`、`system/user`、`monitor/redis` 等）存在遗留的类型不严谨写法，`vue-tsc` 严格模式下可能报错，属**脚手架原有问题**、与本次新增的 `category` 页面无关；日常开发使用 `npm run dev` 不受影响，如需发布请先修复对应页面的类型声明。
## 常见问题
| 问题 | 处理 |
|---|---|
| 登录后菜单不显示「智能归类」 | 确认已执行后端 `sql/category.sql`（含菜单及超级管理员绑定），重新登录刷新 |
| 接口返回 401 跳转登录 | Token 过期或未携带，重新登录即可 |
| 页面报 403 | 当前角色无该菜单/按钮权限，到「角色管理」分配 |
| 归类记录全为「失败」 | 多为后端 Ollama 未启动或模型名配置不一致，检查后端日志 |
| 分片上传失败 | 确认后端 `chunk` 存储目录与 MinIO 配置正确 |
## 参与贡献
1. Fork 本仓库
2. 新建 Feat_xxx 分支
3. 提交代码
4. 新建 Pull Request
## License
请在遵守相关开源协议的前提下使用。