django-vue3-system

一、项目图片

二、系统概述

• 后端采用Python语言的Django框架进行开发，涉及到的模块如下：

  1. django
  2. djangorestframework
  3. django-cors-headers
  4. channels
  5. django-simple-captcha
  6. djangorestframework-simplejwt
  7. celery[redis,eventlet]
  8. psutil

• 前端采用Vue3、ElementPlus进行开发，涉及到的主要模块如下：

  1. vue
  2. vuex
  3. vue-router
  4. element-plus
  5. echarts
  6. axios
  7. js-cookie

三、功能概述

• 采用JWT用户认证系统进行用户认证

• 拥有用户系统

  1. 可通过Web修改个人信息
  2. 后端用户接口内容如下，详细API参照 server/api文档/1.用户API.md
     a.用户注册接口
     b.用户注销接口
     c.用户认证接口
     d.用户信息获取接口
     e.用户信息修改接口

• 采用Websocket进行数据通讯，并支持断线监测与重连功能 可作为工业项目对设备进行程控(参照下位机页面)

• Web针对手机端进行了响应式适配

• 后端采用Celery进行周期任务调度，并结合channels给前端主动推送服务器状态

四、源码地址

gitee地址：https://gitee.com/ResJI/django-vue3-system

五、部署

1. 项目下载

该仓库采用的Git子模块的使用，作为前端和后端项目的汇总仓库，所以在源码下载时与以往略有不同，具体下载方式如下

a. 下载Zip包

1. 下载该仓库Zip包：点击下载

2. 下载服务器仓库Zip包：点击下载

3. 下载前端仓库Zip包：点击下载

4. 分别解压、分别将 server-django-master 和 web-vue3-element-plus-master 文件夹内文件移动至

   django-vue3-system-master 中的 server 和 web 文件夹内

b. Git克隆（推荐）

1. 电脑安装Git

2. 在bash或shell中输入

   git clone --recursive https://gitee.com/ResJI/server-django.git
   

3. bash或shell所在工作目录下的 django-vue3-system 文件夹即为项目源码

2. 项目运行

1. 服务器端运行

   cd server
   pip install -r requirements.txt          # 安装后端所需包
   python manage.py runserver 0.0.0.0:8010  # 启动服务器
   
   # 如需使用Celery周期调度，需安装并启用redis
   celery -A server worker -l info -P eventlet  # 启动Celery
   celery -A server beat -l info                # 启动Celery定时服务
   

2. Web

   cd web
   npm install    # 安装前端所需环境
   npm run serve  # 启动开发服务器
   

3. 页面访问

   浏览器输入 http://localhost:8080/ 进行访问

六、微信

• 微信号：Soobeit