|
@@ -1,10 +1,16 @@
|
|
|
# 支付宝小程序
|
|
|
|
|
|
> 支付宝小程序应用 —— 主要使用支付宝小程序原生技术栈 + 小程序原生组件 + AntBuilder sass 模版开发<br/>
|
|
|
-> 具体文档参考[AntBuilder sass 文档](https://docs.taro.zone/docs/)<br/>
|
|
|
+> 具体文档参考[AntBuilder sass 文档](https://www.yuque.com/randa/antbuilder/ad9dml)<br/>
|
|
|
> 为了追求更高开发效率,根据业务需求的差异,在此仓库中集成**2**个独立小程序,分别是**太和患者端**、**白云患者端**<br />
|
|
|
> 可以根据切换分支来转换不同医院的配置
|
|
|
|
|
|
+## 参考文档
|
|
|
+
|
|
|
+[支付宝小程序官方文档](https://opendocs.alipay.com/mini/developer?pathHash=d3c1799e)
|
|
|
+
|
|
|
+[Antbuiler sass 文档](https://www.yuque.com/randa/antbuilder)
|
|
|
+
|
|
|
## 项目 Git
|
|
|
|
|
|
#### [Gogs Git address](https://gogs.ywtinfo.com/chenjunkun/th_net_hospital_ali_mp)
|
|
@@ -15,7 +21,7 @@
|
|
|
|
|
|
太和:`main-taihe`
|
|
|
|
|
|
-#### 开发分支:dev
|
|
|
+#### 开发分支:根据需求版本号进行调整,命名规则为 对应终端 + 需求版本号
|
|
|
|
|
|
---
|
|
|
|
|
@@ -41,7 +47,7 @@
|
|
|
|
|
|
## 开发注意事项
|
|
|
|
|
|
-- 测试 QA 环境的接口时,需要在开发者工具右上角编译模式中,添加全局参数 proxyEnv=test
|
|
|
+- 测试 QA 环境的接口时,需要在开发者工具右上角编译模式中,添加全局参数 `proxyEnv=test`
|
|
|
|
|
|
- 需要快速在本地开发目录中定位页面时,可以通过开发者工具右下角,复制页面参数,找到 pageType 所对应的值,然后全局搜索相对应的文件夹名称即可
|
|
|
|
|
@@ -82,6 +88,97 @@
|
|
|
|
|
|
---
|
|
|
|
|
|
+## 以医保 2.0 为例熟悉开发流程
|
|
|
+
|
|
|
+### 新建功能模块
|
|
|
+
|
|
|
+1.新建页面
|
|
|
+
|
|
|
+`/antbuilder/industry/hospitalV2/components` 下新建文件夹 `hospital-payment-detail-yibao`
|
|
|
+
|
|
|
+其中文件目录
|
|
|
+
|
|
|
+```js
|
|
|
+index.js; // 业务逻辑
|
|
|
+index.axml; // 页面渲染
|
|
|
+index.acss; // 页面样式
|
|
|
+index.json; // 页面配置(如有)
|
|
|
+service.js; // 接口/工具函数
|
|
|
+```
|
|
|
+
|
|
|
+1.1 页面业务逻辑结构,以 `/antbuilder/industry/hospitalV2/components/hospital-payment-detail-yibao/index.js` 为例:
|
|
|
+
|
|
|
+```js
|
|
|
+import { createSubscribe } from "applet-page-component";
|
|
|
+
|
|
|
+Component(
|
|
|
+ createSubscribe({
|
|
|
+ onShow() {
|
|
|
+ // 生命周期,页面显示时,注意,自定义组件中使用 onShow 生命周期时需要引入 createSubscribe
|
|
|
+ },
|
|
|
+ })({
|
|
|
+ props: {}, // 父组件传值
|
|
|
+ data: {
|
|
|
+ // 自定义变量,相当于 state
|
|
|
+ },
|
|
|
+
|
|
|
+ didMount() {
|
|
|
+ // 生命周期,页面节点挂载时
|
|
|
+ },
|
|
|
+
|
|
|
+ didUnmount() {
|
|
|
+ // 生命周期,页面退出销毁时
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ // 发起支付
|
|
|
+ async onPay(e) {},
|
|
|
+ },
|
|
|
+ })
|
|
|
+);
|
|
|
+```
|
|
|
+
|
|
|
+2.写入路由配置
|
|
|
+
|
|
|
+`/antbuilder/industry/hospitalV2/pages/page-no-pull/index.axml` 文件中,按照如下固定方式添加配置:
|
|
|
+
|
|
|
+```js
|
|
|
+<hospital-payment-detail-yibao
|
|
|
+ componentData="{{ componentData }}"
|
|
|
+ a:elif="{{ pageType === 'hospital-payment-detail-yibao' }}"
|
|
|
+/>
|
|
|
+```
|
|
|
+
|
|
|
+`/antbuilder/industry/hospitalV2/pages/page-no-pull/index.json` 文件中,按照如下固定方式添加配置:
|
|
|
+
|
|
|
+```js
|
|
|
+"usingComponents":{
|
|
|
+ // ...
|
|
|
+ "hospital-payment-detail-yibao": "../../components/hospital-payment-detail-yibao/index"
|
|
|
+}
|
|
|
+```
|
|
|
+
|
|
|
+3.页面跳转方法
|
|
|
+
|
|
|
+如在页面 `/antbuilder/industry/hospitalV2/components/hospital-payment-detail/index.js` 中,使用 `history` 进行跳转:
|
|
|
+
|
|
|
+```js
|
|
|
+import history from "../../utils/history";
|
|
|
+history.push({
|
|
|
+ title: "确认支付", // 页面标题
|
|
|
+ query: { authCode: authCode }, // 路由参数
|
|
|
+ pageType: "hospital-payment-detail-yibao", // 页面路径
|
|
|
+});
|
|
|
+```
|
|
|
+
|
|
|
+### 快速定位问题页面
|
|
|
+
|
|
|
+- 搜索页面关键字
|
|
|
+
|
|
|
+- 需要快速在本地开发目录中定位页面时,可以通过开发者工具右下角,复制页面参数,找到 pageType 所对应的值,然后全局搜索相对应的文件夹名称即可,如门诊缴费列表页面,路由参数为 `pageType=hospital-payment`,文件夹 `hospital-payment` 即是门诊缴费列表页的开发目录
|
|
|
+
|
|
|
+---
|
|
|
+
|
|
|
## 快速检索路径,初次审核时需要
|
|
|
|
|
|
qa 环境:
|