front/README.md
2026-09-07 10:33:19 +08:00

131 lines
3.3 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# Interface Management System
Vue.js 接口管理系统前端项目
## 项目简介
这是一个基于 Vue.js 3 + TypeScript + Arco Design 的接口管理系统前端项目,提供完整的接口管理、服务商管理、应用管理等功能
## 技术栈
- **框架**: Vue.js 3
- **语言**: TypeScript
- **UI 组件库**: Arco Design Vue
- **构建工具**: Vite
- **状态管理**: Pinia
- **路由**: Vue Router
- **样式**: Less
- **表格组件**: Handsontable
## 功能特性
### 系统管理
- 接口管理:接口配置、参数映射、服务商管理
- 应用管理:应用列表、接口绑定、状态管理
- 用户管理:用户权限、角色管理
- 日志管理:调用日志、统计报表
### 订单管理
- 价格查询:运费计算、价格对比
- 订单下单:批量导入、订单管理
- 订单跟踪:轨迹查询、状态更新
### 渠道管理
- 销售产品:产品配置、价格管理
- 服务渠道:渠道配置、买价管理
- 区域管理:黑名单区域、偏远区域
- 计重规则:计重规则、计重进位
### 轨迹中心
- 轨迹查询:订单轨迹、状态跟踪
- 预警管理:KPI 区域、预警配置
- 自动触发:触发规则、通知管理
## 项目结构
```
src/
├── api/ # API 接口
├── assets/ # 静态资源
├── components/ # 公共组件
├── composables/ # 组合式函数
├── hooks/ # 自定义钩子
├── layout/ # 布局组件
├── locale/ # 国际化
├── router/ # 路由配置
├── store/ # 状态管理
├── utils/ # 工具函数
├── views/ # 页面组件
│ ├── channel/ # 渠道管理
│ ├── order/ # 订单管理
│ ├── system/ # 系统管理
│ └── trajectoryCenter/ # 轨迹中心
└── main.ts # 入口文件
```
## 开发指南
### 环境要求
- Node.js >= 16.0.0
- npm >= 8.0.0
### 安装依赖
```bash
npm install
```
### 开发模式
```bash
npm run dev
```
### 构建生产版本
```bash
npm run build
```
### 代码检查
```bash
npm run lint
```
## 部署说明
1. 安装依赖 `pnpm i`
2. 构建 `pnpm build`(生成 `dist/`)
3. **宿主机 nginx(推荐)**:将 `dist/` 放到 `/usr/share/nginx/html`,使用 `nginx-default.conf`(含 SSL,证书在 `/etc/nginx/ssl/`)
4. **Docker 方式(7962 端口)**:使用 `nginx-docker.conf`(仅 HTTP,不含 SSL)
```bash
docker build -t web1 .
docker rm -f web
docker run -d -p 7962:80 --name web web1
docker ps | grep web # 确认 Up 状态
```
> 勿把 `nginx-default.conf`(含 SSL)直接打进 Docker,容器内没有 `/etc/nginx/ssl/` 会导致启动失败。
## 贡献指南
1. Fork 本仓库
2. 创建特性分支 (`git checkout -b feature/AmazingFeature`)
3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)
4. 推送到分支 (`git push origin feature/AmazingFeature`)
5. 创建 Pull Request
## 许可证
本项目采用 MIT 许可证 - 查看 [LICENSE](LICENSE) 文件了解详情
## 联系方式
如有问题或建议,请通过以下方式联系:
- 邮箱: your-email@example.com
- 项目地址: https://github.com/xiaoliutral/itfx-front