v3-school-widescreen-web

更新日期 2023/07/25

一.开发

# 安装依赖
npm install

# 建议不要直接使用 cnpm 安装依赖，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npm.taobao.org

# 启动服务
npm run dev

浏览器访问 http://localhost:80

二.发布

# 构建测试环境
npm run build:stage

# 构建生产环境
npm run build:prod

三.目录结构&打包配置&懒加载

1.为未来微前端版本铺垫,V3版本从新梳理了各模块关系,从新优化了功能模块配置,各个功能模块的api&asset&views都必须在各自的功能模块文件夹下

src下的目录结构示意如下

├─src
│  ├─api                     (接口文件夹下按模块划分)
│  │  └─basicsModules        (基础核心模块api)
│  │  └─hazardManagement     (危险源模块api)
│  ├─assets
│  │  └─ZDimages             (静态文件夹下按模块划分)
│  │     ├─basicsModules     (基础核心模块静态文件)
│  │     └─hazardManagement  (危险源模块静态文件)
│  └─views                   (页面文件夹下按模块划分)
│     └─basicsModules        (基础核心模块页面文件)
│     └─hazardManagement     (危险源模块页面文件)

2.同时优化了懒加载与打包,但是在加入新增模块时需要同时修改打包配置与加载配置文件

打包配置在 vue.config.js 文件内

├─src
│  └─vue.config.js

配置内容如下自行添加即可

//基础模块
basicsModules: {
  name: 'chunk-basicsModules',
  test: resolve('src/views/basicsModules'),
  priority: 0,
  minSize: 0,
  minChunks: 1,
  enforce:true,
  reuseExistingChunk: true
},

懒加载配置在 permission.js 文件内

├─src
│  └─store
│    └─modules
│      └─permission.js

配置内容如下自行添加即可

if(pathName === 'basicsModules'){
  return (resolve) => require([`@/views/basicsModules${pathUrl}`], resolve)
}else if(pathName === 'hazardManagement'){
  return (resolve) => require([`@/views/hazardManagement${pathUrl}`], resolve)
}

四.二维码相关

1.二维码生成规则

二维码参数由三部分组成

微信小程序二维码标识

需要在微信小程序后台开发配置中配置
同时需要在后台配置开发配置中配置 
两个配置需要完全一致
在用户登录后会存储在local storage中字段为'codeOnlineAdd'

参数 code

用于该功能所需参数

功能标识 type

用于识别二维码所属功能,用于后续跳转对应后续业务页面

示例

http://lab.zjznai.com/labAppTest?code=11&type=1
微信小程序二维码标识?参数&功能标识

2.功能标识表

功能标识	功能名称	业务字段	备注
type:12	化学品终端-扫码双人认证	doorId,subId,macId,code	前端生成 - 用于微信公共扫码-双人认证
type:11	化学品终端-扫码单人登录	code,subId,macId	前端生成 - 用于微信公共扫码-单人登录
type:10	实验室关联危险源设备	code	前端生成 - 小程序专项检查扫码
type:9	化学品	--	安卓生成 - 用于微信公共扫码-查看化学品
type:8	化学品柜	--	安卓生成 - 用于微信公共扫码-查看化学品柜
type:7	培训课程	--	安卓生成 - 用于微信公共扫码-查看培训课程
type:6	专项检查	--	未知生成 - 未知应用方式
type:5	实验室详情	code	前端生成 - 用于微信公共扫码-查看实验室详情,小程序安全检查页面扫码
type:3	危险源列表	code	前端生成 - 用于微信公共扫码-查看详情
type:2	安全制度	code	前端生成 - 用于微信公共扫码-查看详情
type:1	MSDS说明书	code	前端生成 - 用于微信公共扫码-查看详情

五.功能角色相关说明

在遵从数据权限与页面权限的基础上 增加了特定功能角色-在角色页面配置
前端取特定功能角色的权限字符匹配对应页面是否拥有特定的功能权限

1.功能角色与对应功能

功能标识	功能名称	功能页面	备注
performEvacuation	应急疏散操作	应急疏散	应急疏散页面下所有的硬件操作与疏散操作与此角色关联
subHardwareControl	实验室硬件控制	实验室列表	实验室列表页面硬件控制操作与此角色关联
subVideo	实验室监控	实验室列表	实验室列表页面监控视频与此角色关联