数字推广中心小程序.md 7.6 KB

数字推广中心小程序(Taro)

微信小程序应用 —— 主要使用 react.js + taro + taroui等技术栈
本项目已升级到 taro3,相关组件的具体文档参考Taro 文档

项目 Git

Gogs Git address

生产环境分支:v1.0.0_digital

开发环境分支:v1.0.0_digital,再配合具体需求版本号

一定要先把分支切换到 v1.0.0_digital 后再进行后续开发

项目 Command

node version: v12.14.0 及以上,yarn(包管理工具) install

// 安装依赖
yarn 或者 npm install

// 本地开发快速切换项目
yarn replace:digital // 数字推广中心

// qa环境运行
yarn run dev:weapp-digital  // 数字推广中心

// qa环境打包
yarn run build-qa:weapp-digital  // 数字推广中心

// prod环境打包
yarn run build:weapp-digital  // 数字推广中心

文件目录

以下文件说明,请先参考Taro 文档

// 只备注官方文档没有提及的文件和文件目录
.
├── README.md
├── config      // 各个小程序各种环境配置文件
├── db.json
├── dist        // 太和小程序打包产物目录
├── dist_by     // 白云小程序打包产物目录
├── dist_pay    // 支付小程序打包产物目录
├── dist_yun    // 云平台小程序打包产物目录
├── mock-server.js  // mock服务器启动文件
├── mocks           // mock相关测试数据
├── node_modules
├── nodemon.json    // 动态监控mocks数据变化
├── package.json    // 项目依赖
├── project.config.by.json      // 白云小程序项目配置文件,替换使用
├── project.config.json         // 小程序项目配置文件,默认加载
├── project.config.patient.json // 太和小程序项目配置文件,替换使用
├── project.config.pay.json     // 支付小程序项目配置文件,替换使用
├── project.config.yun.json     // 云平台小程序项目配置文件,替换使用
├── src
│   ├── app.by.js       // 白云入口app.js
│   ├── app.js          // 小程序主入口文件,默认加载
│   ├── app.less        // 全局样式,默认加载
│   ├── app.patient.js  // 太和入口app.js
│   ├── app.pay.js      // 支付入口app.js
│   ├── app.yun.js      // 云平台入口app.js
│   ├── assets          // 资源文件
│   ├── components      // 公共组件库
|   │   ├── ParserRichText  // 解析富文本的组件
|   │   ├── guangsan        // 有关广三业务的组件
|   │   ├── page_componets  // 页面组件,包括检验检查结果
|   │   ├── privacy         // 隐私声明组件
|   │   ├── utils           // 工具组件,如选择地址/公告等
|   │   └── ywt             // 最常用,细化的组件,包括鉴权按钮/icon/checkbox等
│   ├── config              // 项目相关配置文件,与环境配置文件区分使用
│   ├── constants           // 各种常用变量
│   ├── index.html          // h5项目才能使用的
│   ├── pages               // 项目页面
|   │   ├── digital         // 主要开发模块
|   |   │   ├── chooseJob.js      // 工种选择页面
|   |   │   ├── collectDetails.js // 任务详情页面
|   |   │   ├── collectList.js    // 任务列表页面
|   |   │   ├── listContent.js    // 我的收藏页面
|   |   │   ├── myTaskList.js     // 我的任务页面
|   |   │   ├── searchResult.js   // 搜索页面
|   |   │   ├── taskTypeList.js   // 任务类型列表
|   |   │   ├── typeofWork.js     // 工种资料上传
|   |   │   ├── workInformation.js  // 提交验收资料
|   |   │   └── workType.js         // 工种资料信息
|   │   ├── global                  // 全局公告页面,包含支付,登录页面等
|   │   ├── index           // 入口
|   │   ├── notice          // 通知模块
|   │   ├── order           // 订单中心
|   │   ├── pay             // 支付模块
|   │   ├── protocol        // 富文本公告协议页面
|   │   └── users           // 用户中心
│   ├── pages_yun           // 云平台项目页面
│   ├── server              // 接口和服务相关
│   ├── store               // 全局状态管理
│   └── utils               // 工具库
└── yarn.lock

技术/业务要点

  • 项目直接复用患者端小程序的框架进行开发,登录/路由模块/组件等与患者端小程序完全一致
  • 项目中组件库,一般划分成5种类型,页面组件(复用整个页面)原子组件(由较小的元素搭建而成)业务组件(以某个业务划分的)第三方组件(TaroUI)第三方原生组件(使用原生小程序代码编写)
  • 业务组件数据中有不少字段判断,其中的含义可以查看后端接口文档;
  • 患者端小程序,通过环境变量 + 配置文件,生成不同项目的小程序。
    • 环境变量已经在 package.json 中配置好,只需要运行 replace 命令行可自动修改相关的配置文件。
  • 项目入口页面为 ·src/pages/index/index.js'。在此页面加了比较多的逻辑和判断,例如:初始化配置、获取 token、跳转二维码等等; (PS:随着业务越来越多,这里也会增加其他判断,具体请看代码;)
  • 本项目中, 支付分为三类;1,本地小程序支付;2,跳转到支付小程序支付;3,跳转第三方公司以外的支付小程序。主要根据具体业务,收钱到哪个账户来判断。
    • 本地支付:/pages/by/global/pay.js、/pages/pay/index.js;
    • 跳转支付小程序:/pages/page/index.js,因此,此页面既包含本地支付,也包含跳转支付的代码;
    • 支付跳转,一般调用 src/utils/utils.js 中 jumpPay function。具体请查看相关代码备注。
    • 跳转第三方公司以外的支付小程序:一般调用 Taro.navigateToMiniProgram 具体看官方文档,可以参考 /pages/by/patient_dept_pay/detailYb.js
  • 开发版本号以 dv 开头 x.y.z.z1.z2,分别是主版本号、副版本号、次版本号、修改版本号...,(b_vx2.y2.z2&vx1.y1.z1),括号里边是需求版本号,这个当前开分支包含两个需求版本,b_开头是白云需求版本,没有 b_默认代表太和需求版本;
    • 举例: dv2.8.3.4&b_dv0.0.7.9.1&y_dv0.1.2&p_dv1.1.8(v4.0.6&b_v1.2.2)
    • dv2.8.3.4:太和开发版本号(互联网医院),对应括号中 v4.0.6 需求版本号;
    • b_dv0.0.7.9.1: 白云开发版本号,对应括号中 b_v1.2.2 需求版本号;
    • y_dv0.1.2: 云平台开发版本号,对应括号 v4.0.6 或 b_v1.2.2 需求版本号其中之一,具体需要看需求;
    • p_dv1.1.8:支付开发版本号,对应括号 v4.0.6 或 b_v1.2.2 需求版本号其中之一,具体需要看需求。
  • 每一个版本对应线上正式版本,上传之前需要 run 对应版本 build 或 build:qa 压缩文件体积,开发版由于体积过大无法上传。

备注

  • 患者端比较多业务使用支付功能,容易出现错误,请与后端开发一起联调;