完成充值改造

pages/rechargeWay/index.js

@@ -0,0 +1,140 @@
+// pages/rechargeWay/index.js
+import { requestRecharge } from "../../service/recharge";
+import { alertInfo } from "../../utils/index";
+import request from '../../utils/request';
+const { OK } = request;
+
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    money: 0,
+    address: "",
+    rechargeWay: 0,
+    id: "",
+    tenement: "",
+    park: "",
+    rechargeLoading: false,
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+    const { money, address, id, tenement, park } = options
+    this.setData({ money: Number(money), address, id, tenement, park })
+  },
+  onChangeRechargeWay(e) {
+    this.setData({ rechargeWay: e.detail })
+  },
+  onClickCell(e) {
+    const { name } = e.currentTarget.dataset;
+    this.setData({ rechargeWay: name })
+  },
+  async recharge() {
+    const { rechargeWay } = this.data;
+    await this.setLoading(true)
+    try {
+      switch(rechargeWay) {
+        case 1:
+          alertInfo("开发中")
+          break;
+        default:
+          await this.wxRecharge();
+          break;
+      }
+    } catch(err) {
+
+    } finally {
+      await this.setLoading(false)
+    }    
+  },
+  async wxRecharge() {
+    const { money, id, tenement, park } = this.data;
+    const { code, message, data } = await requestRecharge({ money: Number(money), id, tenement, park })
+    if (code !== OK) {
+      alertInfo(message)
+      return;
+    }
+    wx.requestPayment({
+      timeStamp: data?.time,
+      nonceStr: data?.nonceStr,
+      package: "prepay_id=" + data?.prepay_id,
+      paySign: data?.paySign,
+      signType: 'RSA',
+      success: (res) => {
+        alertSuccess("充值成功")
+        that.setData({
+          money: null
+        })
+      },
+      fail: (res) => {
+        console.log('fail', res)
+        alertInfo("请稍后重试")
+      },
+      complete: (res) => {
+        console.log('complete')
+        that.handleGetMeterDetail(meter.id)
+      }
+    })
+  },
+  async setLoading(flag) {
+    return new Promise((res) => {
+      this.setData({
+        rechargeLoading: flag,
+      }, () => {
+        res()
+      })
+    })
+  },
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/rechargeWay/index.json

@@ -0,0 +1,11 @@
+{
+  "usingComponents": {
+    "navigator": "/components/navigator/index",
+    "van-radio": "@vant/weapp/radio/index",
+    "van-radio-group": "@vant/weapp/radio-group/index",
+    "van-cell": "@vant/weapp/cell/index",
+    "van-cell-group": "@vant/weapp/cell-group/index",
+    "van-button": "@vant/weapp/button/index"
+  },
+  "navigationStyle": "custom"
+}

pages/rechargeWay/index.wxml

@@ -0,0 +1,25 @@
+<!--pages/rechargeWay/index.wxml-->
+<navigator title="支付订单" canBack="{{true}}" bind:back="back" />
+
+<view class="rechargeInfoWrapper">
+  <view>
+    <text> ￥ </text>
+    <text class="money"> {{ money }} </text>
+  </view>
+  <view class="address"> 地址：{{address}} </view>
+</view>
+
+<van-radio-group value="{{ rechargeWay }}" bind:change="onChangeRechargeWay">
+  <van-cell-group>
+    <van-cell title="微信支付" clickable data-name="{{0}}" bind:click="onClickCell">
+      <van-radio slot="right-icon" name="{{0}}" />
+    </van-cell>
+    <van-cell title="对公转账" clickable data-name="{{1}}" bind:click="onClickCell">
+      <van-radio slot="right-icon" name="{{1}}" />
+    </van-cell>
+  </van-cell-group>
+</van-radio-group>
+
+<view class="rechargeBtn">
+  <van-button type="info" block bind:click="recharge" loading="{{rechargeLoading}}">支付</van-button>
+</view>

pages/rechargeWay/index.wxss

@@ -0,0 +1,23 @@
+/* pages/rechargeWay/index.wxss */
+.rechargeInfoWrapper {
+  margin-top: 10vw;
+  margin-bottom: 10vw;
+  text-align: center;
+}
+
+.money {
+  font-weight: 700;
+  font-size: 60rpx;
+  margin-left: 10rpx;
+}
+
+.address {
+  font-size: 28rpx;
+  margin-top: 20rpx;
+}
+
+.rechargeBtn {
+  margin-top: 10vh;
+  margin-left: 32rpx;
+  margin-right: 32rpx;
+}