【智能排班系统 】web前端/小程序结构介绍+开发环境介绍+项目启动

Web前端

项目结构

├─build
├─dist // 项目打包之后的文件存放的目录
├─mock // 模拟后台接口，返回数据给前端测试
├─node_modules // 依赖安装目录
├─public // 存储一些静态资源
├─src
│  ├─api // 存放向后台发请求的方法
│  │  ├─enterprise
│  │  ├─login
│  │  ├─shiftScheduling
│  │  ├─statistics
│  │  ├─system
│  │  └─thirdParty
│  ├─assets // 存储静态资源
│  │  ├─404_images
│  │  ├─aliIconfont // 阿里巴巴矢量图标库
│  │  ├─login
│  │  │  ├─img
│  │  │  ├─plugins
│  │  │  │  ├─axRate
│  │  │  │  ├─axTree
│  │  │  │  │  └─icons
│  │  │  │  └─ztree
│  │  │  │      └─images
│  │  │  └─xiaoBaiTemplate
│  │  ├─logo
│  │  ├─panel
│  │  └─regist
│  │      └─img
│  ├─components // 存放页面组件
│  │  ├─Breadcrumb
│  │  ├─constant
│  │  ├─DynamicTitle
│  │  ├─Hamburger
│  │  ├─ImageCropper
│  │  │  └─utils
│  │  ├─InstrumentPanel
│  │  ├─Message
│  │  ├─MonthSelect
│  │  ├─Pagination
│  │  ├─PanThumb
│  │  ├─ParentView
│  │  ├─PictureUpload
│  │  ├─SvgIcon
│  │  └─YearMonthSelect
│  ├─icons
│  │  └─svg
│  ├─layout // 网站主布局文件
│  │  ├─components
│  │  │  └─Sidebar // 侧边栏组件
│  │  └─mixin
│  ├─router // 路由
│  ├─store // 缓存已登录用户的一些信息，方便页面直接取用，如token、头像、用户名……
│  │  └─modules
│  ├─styles // 存放样式文件，即css文件
│  │  ├─background
│  │  ├─chart
│  │  ├─weekly
│  │  └─xiaoBaiLogin
│  ├─utils // 存放一些工具方法
│  │  ├─common
│  │  └─shiftScheduling
│  └─views // 存放页面，有的组件也放在里面（不太规范）
│      ├─dashboard
│      │  ├─enterpriseManager
│      │  ├─storeManager
│      │  └─systemManager
│      ├─editor
│      ├─enterprise
│      │  ├─enterprise
│      │  ├─organization
│      │  │  ├─role
│      │  │  └─user
│      │  ├─rule
│      │  └─store
│      │      ├─festival
│      │      ├─message
│      │      ├─position
│      │      ├─store
│      │      └─user
│      ├─login
│      ├─scheduling
│      │  ├─result
│      │  └─task
│      └─system
│          ├─log
│          │  ├─login
│          │  └─operation
│          └─menu
└─tests // 我没用到这个
    └─unit
        ├─components
        └─utils

开发环境介绍

开发环境	版本
node	16.18.1
npm	8.19.2

修改配置文件

安装依赖

npm install

启动

可以使用命令 npm run dev，或者下图的方式

小程序

IDE

小程序基于uniapp开发，需要下载HbuilderX做来作为开发工具，官网链接
使用HbuilderX打开项目，如下图

安装依赖

配置AppID

配置小程序开发工具

改成你的小程序开发工具的路径

打开微信小程序的服务端口

修改请求路径

运行项目