220 lines
4.9 KiB
Markdown
220 lines
4.9 KiB
Markdown
|
# 牛只运输管理系统 (PC Cattle Transportation)
|
|||
|
|
|
|||
|
|
## 项目简介
|
|||
|
|
|
|||
|
|
牛只运输管理系统是一个基于 Vue 3 + TypeScript 开发的现代化前端项目，旨在提供完整的牛只运输管理解决方案。系统集成了运输管理、检疫隔离、设备监控、预警系统等多个功能模块，为牛只运输过程提供全方位的管理和监控支持。
|
|||
|
|
|
|||
|
|
## 文档索引
|
|||
|
|
|
|||
|
|
- [需求文档](REQUIREMENTS.md)
|
|||
|
|
- [系统架构文档](ARCHITECTURE.md)
|
|||
|
|
- [开发计划文档](DEVELOPMENT_PLAN.md)
|
|||
|
|
- [短期目标任务清单](SHORT_TERM_GOALS.md)
|
|||
|
|
- [数据结构说明](DATA_STRUCTURE.md)
|
|||
|
|
|
|||
|
|
## 技术栈
|
|||
|
|
|
|||
|
|
- **核心框架：** Vue 3 + TypeScript
|
|||
|
|
- **构建工具：** Vite
|
|||
|
|
- **状态管理：** Pinia
|
|||
|
|
- **路由管理：** Vue Router
|
|||
|
|
- **UI 组件库：** Element Plus
|
|||
|
|
- **HTTP 客户端：** Axios
|
|||
|
|
- **地图集成：** 百度地图（vue-baidu-map-3x）
|
|||
|
|
- **图表库：** ECharts
|
|||
|
|
- **富文本编辑器：** WangEditor
|
|||
|
|
- **其他工具：**
|
|||
|
|
- 视频播放：@liveqing/liveplayer-v3
|
|||
|
|
- 文件处理：file-saver
|
|||
|
|
- 二维码生成：qrcode
|
|||
|
|
- 打印功能：vue3-print-nb
|
|||
|
|
|
|||
|
|
## 项目结构
|
|||
|
|
|
|||
|
|
```
|
|||
|
|
src/
|
|||
|
|
├── api/ # API 接口定义
|
|||
|
|
│ ├── common/ # 通用 API
|
|||
|
|
│ ├── abroad.js # 出境管理
|
|||
|
|
│ ├── device.js # 设备管理
|
|||
|
|
│ ├── hardware.js # 硬件相关
|
|||
|
|
│ ├── isolationQuarantine.js # 隔离检疫
|
|||
|
|
│ ├── killRecord.js # 屠宰记录
|
|||
|
|
│ ├── quarantine.js # 检疫管理
|
|||
|
|
│ ├── shipping.js # 运输管理
|
|||
|
|
│ ├── sys.js # 系统管理
|
|||
|
|
│ └── userManage.js # 用户管理
|
|||
|
|
├── assets/ # 静态资源
|
|||
|
|
├── components/ # 公共组件
|
|||
|
|
├── directive/ # 自定义指令
|
|||
|
|
├── plugins/ # 插件配置
|
|||
|
|
├── router/ # 路由配置
|
|||
|
|
├── store/ # Pinia 状态管理
|
|||
|
|
├── styles/ # 全局样式
|
|||
|
|
├── utils/ # 工具函数
|
|||
|
|
└── views/ # 页面组件
|
|||
|
|
├── earlywarning/ # 预警系统
|
|||
|
|
├── entry/ # 数据录入
|
|||
|
|
├── hardware/ # 硬件管理
|
|||
|
|
├── shipping/ # 运输管理
|
|||
|
|
├── system/ # 系统设置
|
|||
|
|
└── userManage/ # 用户管理
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 主要功能模块
|
|||
|
|
|
|||
|
|
### 1. 用户管理
|
|||
|
|
- 用户登录/注册
|
|||
|
|
- 权限管理
|
|||
|
|
- 用户信息管理
|
|||
|
|
- 系统用户管理
|
|||
|
|
- 司机管理
|
|||
|
|
|
|||
|
|
### 2. 运输管理
|
|||
|
|
- 运输计划制定
|
|||
|
|
- 运输路线规划
|
|||
|
|
- 运输状态监控
|
|||
|
|
- 运输数据统计
|
|||
|
|
- 装车管理
|
|||
|
|
- 运单管理
|
|||
|
|
|
|||
|
|
### 3. 检疫和隔离管理
|
|||
|
|
- 检疫记录管理
|
|||
|
|
- 隔离状态监控
|
|||
|
|
- 检疫证书管理
|
|||
|
|
- 入境检疫管理
|
|||
|
|
|
|||
|
|
### 4. 硬件设备管理
|
|||
|
|
- 设备状态监控
|
|||
|
|
- 设备数据采集
|
|||
|
|
- 设备维护管理
|
|||
|
|
- 项圈设备管理
|
|||
|
|
- 耳标设备管理
|
|||
|
|
- 主机设备管理
|
|||
|
|
|
|||
|
|
### 5. 预警系统
|
|||
|
|
- 实时监控预警
|
|||
|
|
- 异常情况报警
|
|||
|
|
- 预警规则配置
|
|||
|
|
- 预警处理跟踪
|
|||
|
|
|
|||
|
|
### 6. 系统管理
|
|||
|
|
- 系统配置
|
|||
|
|
- 日志管理
|
|||
|
|
- 数据备份
|
|||
|
|
- 岗位管理
|
|||
|
|
- 员工管理
|
|||
|
|
- 租户管理
|
|||
|
|
|
|||
|
|
## 安装和运行
|
|||
|
|
|
|||
|
|
### 环境要求
|
|||
|
|
- Node.js >= 16.0.0
|
|||
|
|
- Yarn >= 1.22.0 或 pnpm >= 7.0.0
|
|||
|
|
|
|||
|
|
### 安装依赖
|
|||
|
|
```bash
|
|||
|
|
# 使用 yarn
|
|||
|
|
yarn install
|
|||
|
|
|
|||
|
|
# 或使用 pnpm
|
|||
|
|
pnpm install
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 开发环境运行
|
|||
|
|
```bash
|
|||
|
|
# 使用 yarn
|
|||
|
|
yarn dev
|
|||
|
|
|
|||
|
|
# 或使用 pnpm
|
|||
|
|
pnpm dev
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 生产环境构建
|
|||
|
|
```bash
|
|||
|
|
# 使用 yarn
|
|||
|
|
yarn build
|
|||
|
|
|
|||
|
|
# 或使用 pnpm
|
|||
|
|
pnpm build
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
### 代码检查
|
|||
|
|
```bash
|
|||
|
|
# 使用 ESLint 检查代码
|
|||
|
|
yarn eslint
|
|||
|
|
|
|||
|
|
# 使用 Prettier 格式化代码
|
|||
|
|
yarn prettier
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
## 环境配置
|
|||
|
|
|
|||
|
|
项目包含三个环境配置文件：
|
|||
|
|
- `.env` - 基础配置
|
|||
|
|
- `.env.development` - 开发环境配置
|
|||
|
|
- `.env.production` - 生产环境配置
|
|||
|
|
|
|||
|
|
请根据实际需求修改相应的环境变量。
|
|||
|
|
|
|||
|
|
## 开发指南
|
|||
|
|
|
|||
|
|
### 1. 代码规范
|
|||
|
|
- 使用 ESLint 进行代码检查
|
|||
|
|
- 使用 Prettier 进行代码格式化
|
|||
|
|
- 遵循 TypeScript 类型规范
|
|||
|
|
- 行宽: 150字符
|
|||
|
|
- 缩进: 4个空格
|
|||
|
|
- 使用单引号
|
|||
|
|
- 语句末尾使用分号
|
|||
|
|
|
|||
|
|
### 2. 组件开发
|
|||
|
|
- 遵循 Vue 3 组合式 API 规范
|
|||
|
|
- 使用 TypeScript 编写组件
|
|||
|
|
- 保持组件的单一职责
|
|||
|
|
- 组件文件使用 .vue 扩展名
|
|||
|
|
|
|||
|
|
### 3. API 调用
|
|||
|
|
- 统一使用 [src/api](src/api) 目录下的接口函数
|
|||
|
|
- 使用 TypeScript 类型注解
|
|||
|
|
- 处理请求错误和异常情况
|
|||
|
|
|
|||
|
|
### 4. 状态管理
|
|||
|
|
- 使用 Pinia 进行状态管理
|
|||
|
|
- 按模块组织 store
|
|||
|
|
- 遵循状态管理最佳实践
|
|||
|
|
|
|||
|
|
### 5. 路由配置
|
|||
|
|
- 使用 Vue Router 进行路由管理
|
|||
|
|
- 路由采用懒加载方式
|
|||
|
|
- 路由配置在 [src/router](src/router) 目录下
|
|||
|
|
|
|||
|
|
## 部署说明
|
|||
|
|
|
|||
|
|
1. 构建生产环境代码：
|
|||
|
|
```bash
|
|||
|
|
yarn build
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
2. 将 `dist` 目录下的文件部署到 Web 服务器
|
|||
|
|
|
|||
|
|
3. 配置服务器环境变量和反向代理
|
|||
|
|
|
|||
|
|
## 注意事项
|
|||
|
|
|
|||
|
|
1. 确保开发环境和生产环境的配置正确
|
|||
|
|
2. 注意 API 接口的跨域配置
|
|||
|
|
3. 遵循代码提交规范
|
|||
|
|
4. 及时更新依赖包版本
|
|||
|
|
5. 做好代码备份和版本控制
|
|||
|
|
|
|||
|
|
## 贡献指南
|
|||
|
|
|
|||
|
|
1. Fork 本仓库
|
|||
|
|
2. 创建特性分支
|
|||
|
|
3. 提交代码
|
|||
|
|
4. 创建 Pull Request
|
|||
|
|
|
|||
|
|
## 许可证
|
|||
|
|
|
|||
|
|
[MIT License](LICENSE)
|