# TTOS-Backend

**Repository Path**: TTOS179/ttos-backend

## Basic Information

- **Project Name**: TTOS-Backend
- **Description**: 码头拖车后端，Python，Flask
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 2
- **Forks**: 0
- **Created**: 2021-12-10
- **Last Updated**: 2024-07-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 项目简介

## 系统总体介绍

下图表示了本系统的各个功能模块。本系统一共分为三个功能模块：拖车轨迹监控、拖车信息展示和实施消息。拖车轨迹监控模块分3个功能点：拖车轨迹实时显示、拖车地点查询和拖车轨迹回放。拖车信息展示模块分3个功能点：拖车状态显示，当前执行指令显示和其他拖车信息显示。实时消息模块分2个功能点：发送消息和消息反馈。

![image-20230227112819150](readme.assets/image-20230227112819150.png)

下图表示了从系统构成、系统功能和数据流向三个方面描述了本系统。本系统由模拟拖车APP和中控系统构成，中控系统由React前端和Flask后端构成。模拟拖车APP向中控系统传送拖车状态、GPS数据和消息，中控系统负责展示这些信息，也可以与模拟拖车APP进行消息交互。

![image-20230227113304777](readme.assets/image-20230227113304777.png)

## 技术路线

![image-20230227111949657](readme.assets/image-20230227111949657.png)

后端 Python-Flask

前端 React.js  Ant Design UI组件库

数据库：MySQL

Web服务器 Nginx

selenium + unitest 自动化测试

# 重现教程

环境说明

```
python 3.8.0
node 18.14.2
mysql 8.0.31
win 10
```

重现步骤

0. 按照环境说明配置环境

1. 拉取代码
2. 重现ttos-backend
3. 重现ttos-frontend
4. 重现ttos-app

## 拉取代码

拉取代码，以根目录是`E:\workspace`为例

```shell
cd E:\workspace
mkdir TTOS
cd TTOS
git clone https://gitee.com/TTOS179/ttos-backend.git
git clone https://gitee.com/TTOS179/ttos-frontend.git
git clone https://gitee.com/TTOS179/ttos-app.git
```

## 重现ttos-backend

```shell
cd E:\workspace\TTOS\ttos-backend
mysql -uroot -p < ./Trailer_management.sql 
# 回车之后输入本机mysql的root账号的密码
pip install -r requirements.txt
python app.py
```

## 重现ttos-frontend

```shell
cd E:\workspace\TTOS\ttos-frontend
npm install npm@6 -g 	# npm降级
npm install
npm install less less-loader --save
npm start
```

打开浏览器访问网址：http://127.0.0.1:8000/

## 重现ttos-app

```shell
cd E:\workspace\TTOS\ttos-app
pip install -r requirements.txt
python main.py
```

向弹出的窗口中输入`trailer001`，如下所示：

![image-20230227153947715](readme.assets/image-20230227153947715.png)

然后点击`登录`，出现如下界面：

![image-20230227154332764](readme.assets/image-20230227154332764.png)

# 系统演示

## 拖车信息展示

在左侧边栏点击`拖车信息展示`，出现下图界面。

![image-20230227153851410](readme.assets/image-20230227153851410.png)

因为在之前的项目重建过程中登录了`trailer001`，所以看见`trailer001`在线。

在拖车信息展示界面可以`查看拖车信息`如：拖车号、拖车状态、正在进行的指令，（在线的）开始时间和在线时长。

在本界面上，还可以进行`拖车查询`功能，如输入`001`，然后点击查询，如下图所示：

![image-20230227154548646](readme.assets/image-20230227154548646.png)

## 拖车轨迹监控

点击拖车轨迹监控，可以出现如下界面。

![image-20230227154738393](readme.assets/image-20230227154738393.png)

本界面中主要有三个功能：轨迹监控、地点查询和轨迹回放。

- 轨迹监控：实时查看拖车当前的运动轨迹
- 地点查询：查询拖车当前位置
- 轨迹回放：查看拖车以往在线时行驶的轨迹

### 轨迹监控

在左上角的拖车号输入框中输入`trailer001`，然后点击`轨迹监控`，然后界面如下所示：

![](readme.assets/1677484640218.gif)

最后点击`停止监控`。

由于GPS数据是随机生成的，所以轨迹显示出来比较乱。

### 地点查询

在左上角的拖车号输入框中输入`trailer001`，然后点击`地点查询`，然后界面如下所示：

![image-20230227161032166](readme.assets/image-20230227161032166.png)

### 轨迹回放

在左上角的拖车号输入框中输入`trailer001`，然后点击`轨迹回放`，然后界面如下所示：

![image-20230227161106425](readme.assets/image-20230227161106425.png)

然后选择一个轨迹号，如`20211225100725trailer001`，然后点击确定，出现如下界面

![20230227163314](readme.assets/20230227163314.gif)

最后点击`轨迹回放`。

## 实时消息

### 拖车发消息中控收消息

在模拟拖车APP中，点击`中控系统`，代表与中控系统进行通信，如下所示：

![image-20230227165517198](readme.assets/image-20230227165517198.png)

在`中控系统的React前端`中的左侧边栏，点击实时消息，点击`trailer001`打开与`trailer001`的对话框，如下所示：

![image-20230227165704940](readme.assets/image-20230227165704940.png)

### 中控发消息拖车收消息

`拖车APP`向`中控系统React前端`发送消息“我正在执行指令”，拖车APP界面如下所示：

![image-20230227165842296](readme.assets/image-20230227165842296.png)

`中控系统React前端`可以接收到消息，前端界面如下：

![image-20230227165932787](readme.assets/image-20230227165932787.png)

反过来，`中控系统React前端`也可以向`拖车APP`发送消息“收到”，前端界面如下：

![image-20230227170058605](readme.assets/image-20230227170058605.png)

`拖车APP`可以接收到消息，拖车界面如下：

![image-20230227170130960](readme.assets/image-20230227170130960.png)