Browse Source

app调起小程序支付界面

xiaomei 1 year ago
parent
commit
06ee8b3c8a
3 changed files with 145 additions and 2 deletions
  1. 6 0
      src/pages.json
  2. 2 2
      src/pages/my/index.vue
  3. 137 0
      src/pagesC/settledMerchant/appPay.vue

+ 6 - 0
src/pages.json

@@ -524,6 +524,12 @@
 						"navigationStyle": "custom"
 					}
 				},
+				{
+					"path": "settledMerchant/appPay",
+					"style": {
+						"navigationBarTitleText": "支付"
+					}
+				},
 				{
 					"path": "settledMerchant/merchant",
 					"style": {

+ 2 - 2
src/pages/my/index.vue

@@ -15,8 +15,8 @@
                     <view class="user_con flex_c flex_as flex_jc">
                         <view class="user_name flex_r flex_ae ellipsis">
                             <view class="flex_r flex_ac">
-                                <view @click="goto('/pages/my/userinfo')" :style="{'color':localInfo.is_consume==1?'#18bb88' : ''}">{{ userinfo.nickname }}</view>
-                                <image v-if="localInfo.is_consume == 1" class="consume" src="/static/my/consume.png" />
+                                <view @click="goto('/pages/my/userinfo')" :style="{'color':localInfo.is_consume > 0?'#18bb88' : ''}">{{ userinfo.nickname }}</view>
+                                <image  v-for="i in localInfo.is_consume" :key="i" class="consume" src="/static/my/consume.png" />
                                 <image v-if="localInfo.bounty_hunter == 1" class="consume" src="https://teaclub.oss-cn-chengdu.aliyuncs.com/CloudShop/logo/202402/hunter.png" />
                             </view>
                             <text v-if="isAuthentication">({{ userinfo.is_authentication == 0 ? "未实名" : "已实名" }})</text>

+ 137 - 0
src/pagesC/settledMerchant/appPay.vue

@@ -0,0 +1,137 @@
+<template>
+  <view>
+    <view class="text"> 茶付宝订单-{{ payData.order_sn }} </view>
+    <view class="text bold"> ¥{{ payData.pay_amount }} </view>
+    <view class="flex_r flex_ac flex_jb">
+      <view> 收款方 </view>
+      <view> 茶付宝 </view>
+    </view>
+    <button type="primary" v-if="isShow" @click="pay">立即支付</button>
+    <button
+      v-else
+      open-type="launchApp"
+      class="back"
+      :app-parameter="openid"
+      @error="launchAppError"
+    >
+      返回APP
+    </button>
+    <!-- <button
+      open-type="launchApp"
+      class="back"
+      :app-parameter="dataStr"
+      @error="launchAppError"
+    >
+      返回APP
+    </button> -->
+  </view>
+</template>
+
+<script>
+import { post } from "@/request/api.js";
+import { ToPayOpre } from "@/utils/reqTools.js";
+var toPayOpre = new ToPayOpre();
+export default {
+  data() {
+    return {
+      payData: {},
+      isShow: true,
+      dataStr: "",
+    };
+  },
+  onLoad(da) {
+    console.log(da);
+    console.log(wx.getLaunchOptionsSync());
+    if (da) {
+      if (da.token) {
+        uni.setStorageSync("token", da.token);
+      }
+      let transitiveData = da;
+      // App带过来的信息需要将transitiveData作为key,同时可以在data带上开发者自己的数据。
+      this.dataStr = JSON.stringify({
+        data: "MsgBackToApp",
+        transitiveData,
+      });
+      // 获取到传递过来的参数
+      let data = JSON.parse(da.payData);
+      data.prepayid = data.package ? data.package.split("prepay_id=")[1] : "";
+      this.payData = data;
+      console.log(this.payData,"this.payData");
+    }
+  },
+  onShow() {},
+  methods: {
+    launchAppError(e) {
+      console.log("false1", e);
+    },
+    pay() {
+      toPayOpre.toPay(this.payData, (da) => {
+        if (!da) {
+          // 支付成功
+          this.$toast("支付成功");
+          this.isShow = false;
+          // uni.showModal({
+          //   title: "提示",
+          //   content: "支付成功",
+          //   showCancel: false,
+          //   confirmText: "返回APP",
+          //   success: function (res) {
+          //     if (res.confirm) {
+          //       console.log("用户点击确定");
+          //     } else if (res.cancel) {
+          //       console.log("用户点击取消");
+          //     }
+          //   },
+          // });
+        } else {
+          // 支付失败
+          this.$toast("支付已取消");
+          // uni.showModal({
+          //   title: "提示",
+          //   content: "支付成功",
+          //   showCancel: false,
+          //   confirmText: "返回APP",
+          //   success: function (res) {
+          //     if (res.confirm) {
+          //       console.log("用户点击确定");
+          //     } else if (res.cancel) {
+          //       console.log("用户点击取消");
+          //     }
+          //   },
+          // });
+        }
+        // this.$toast('支付成功');
+      });
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.text {
+  font-size: 30rpx;
+  text-align: center;
+  color: #000;
+  padding: 50rpx 40rpx 0;
+}
+.bold {
+  font-size: 60rpx;
+  font-weight: 800;
+  padding: 30rpx 40rpx;
+}
+.flex_r {
+  color: #363636;
+  padding: 40rpx 30rpx;
+  border-top: 1px solid #dbdbdb;
+  border-bottom: 1px solid #dbdbdb;
+  margin: 50rpx 0;
+  background-color: #fff;
+}
+button {
+  margin: 150rpx 30rpx;
+}
+
+.back {
+  color: #fff;
+  background-color: rgb(38, 148, 238);
+}
+</style>