Files
ticket-workbench/frontend/README.md
绝尘 c5c2a64a48 优化: 前后端字段对齐、AI分析JSON解析修复、AutoMigrate
- 修复登录参数 username→account
- 修复前后端字段名不匹配 (ticketno/contactname/createtime等)
- 修复AI分析GLM返回markdown包裹和priority类型问题
- 添加AutoMigrate自动建表
- 统一API路由为 /api/auth/ 前缀
- 添加config.example.yaml,.gitignore排除config.yaml
2026-05-13 18:53:53 +08:00

3.0 KiB
Raw Blame History

AI 工单处理工作台 - 前端

基于 Vue 3 + Arco Design + Vite + TypeScript + Pinia 的工单管理系统前端。

技术栈

  • 框架: Vue 3 (Composition API)
  • UI 组件: Arco Design Vue 2.58
  • 构建工具: Vite 8
  • 状态管理: Pinia 3
  • 路由: Vue Router 5
  • HTTP 客户端: Axios 1
  • 语言: TypeScript 6

项目结构

src/
├── api/                    # API 接口
│   ├── interceptor.ts      # Axios 拦截器
│   ├── user.ts             # 用户 API
│   └── ticket.ts           # 工单 API
├── assets/                 # 静态资源
├── components/             # 组件
├── router/                 # 路由配置
│   └── index.ts
├── store/                  # 状态管理
│   └── user.ts             # 用户状态
├── types/                  # TypeScript 类型定义
│   └── index.ts
├── views/                  # 页面组件
│   ├── login/              # 登录页
│   ├── ticket/             # 工单相关页面
│   │   ├── list.vue        # 工单列表
│   │   ├── detail.vue      # 工单详情 + AI分析
│   │   └── create.vue      # 创建工单
│   └── layout/             # 主布局
│       └── index.vue
├── App.vue                 # 根组件
└── main.ts                 # 入口文件

开发

安装依赖

npm install

启动开发服务器

npm run dev

访问 http://localhost:5173

构建生产版本

npm run build

构建产物位于 dist/ 目录。

预览生产构建

npm run preview

功能模块

1. 登录认证

  • 默认账号: admin / admin123
  • Token 存储在 localStorage
  • 自动登录状态检查

2. 工单列表

  • 多条件筛选:状态、分类、优先级、关键词搜索
  • 分页展示
  • 彩色标签显示优先级和状态

3. 工单详情

  • 工单基本信息展示
  • AI 智能分析(可触发、可编辑确认)
  • 状态流转操作
  • 处理人分配
  • 操作日志与备注

4. 创建工单

  • 工单基本信息录入
  • 来源选择

API 代理配置

开发环境下,/api 前缀的请求会代理到 http://localhost:8090

配置文件:vite.config.ts

数据映射

优先级

  • P0 紧急 (红色)
  • P1 高 (橙红)
  • P2 中 (蓝色)
  • P3 低 (灰色)

状态

  • 待处理 (灰色)
  • 分析中 (蓝色)
  • 已确认 (绿色)
  • 处理中 (橙色)
  • 已关闭 (灰色)

分类

  • 退款申请
  • 登录异常
  • 发票问题
  • 物流投诉
  • 账户问题
  • 产品咨询
  • 其他

建议角色

  • 退款组
  • 技术支持
  • 财务组
  • 物流组
  • 客服组

环境变量

暂无环境变量配置API 地址通过 Vite 代理配置。

后端对接

确保后端服务运行在 http://localhost:8090

后端 API 响应格式:

{
  success: boolean,
  retcode: number,
  retinfo: string,
  result: T
}

Token 通过 Authorizationjsessionid 请求头传递。