您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

sign-up.vue 5.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204
  1. <template>
  2. <image
  3. style="
  4. margin-top: 20rpx;
  5. width: 100%;
  6. height: 240rpx;
  7. background-color: #eeeeee;
  8. "
  9. :src="`${$imgUrl}applyCard/car-service.png`"
  10. ></image>
  11. <view class="title"> 微信车主服务 </view>
  12. <view class="value">
  13. <view class="content_1">
  14. 微信车主服务是微信支付为车主用户提供的安全便捷的智慧服务
  15. </view>
  16. <view class="content_2">
  17. 本次将为贵州黔通智联科技股份有限公司开启免密支付服务,后续相关的费用将通过微信车主服务从你的微信支付账户扣除
  18. </view>
  19. </view>
  20. <view class="action">
  21. <button type="default" class="button" @click="savaHandle()">
  22. 开通服务
  23. </button>
  24. </view>
  25. </template>
  26. <script setup lang="ts">
  27. import { onLoad, onShow } from "@dcloudio/uni-app";
  28. import { reactive } from "vue";
  29. import { etcQYAction } from "@/utils/network/api.js";
  30. import { request } from "@/utils/network/request.js";
  31. import { stringToJson } from "@/utils/network/encryption";
  32. import { fileURL } from "@/datas/fileURL.js";
  33. import navBar from "../components/nav-bar/nav-bar2.vue";
  34. import navBgCar from "./components/nav-bg-car4";
  35. import { setItem } from "@/utils/storage";
  36. import { msg } from "@/utils/utils";
  37. import {
  38. checkOrderStatus,
  39. orderPay,
  40. wechatAppID,
  41. wechatPayConfigId,
  42. wechatSecret,
  43. } from "@/utils/network/api";
  44. const imgURL = `${fileURL}image/`;
  45. const state = reactive({
  46. openid: "",
  47. orderId: "",
  48. id: "",
  49. clientFee: "",
  50. });
  51. onLoad((option: any) => {
  52. getOpenID();
  53. state.orderId = option.orderId;
  54. state.clientFee = option.clientFee;
  55. state.id = option.id;
  56. });
  57. //获取微信小程序openid
  58. const getOpenID = () => {
  59. uni.login({
  60. provider: "weixin",
  61. success: function (e) {
  62. console.log(e);
  63. uni.request({
  64. url: `https://api.weixin.qq.com/sns/jscode2session?appid=${wechatAppID}&secret=${wechatSecret}&js_code=${e.code}&grant_type=authorization_code`,
  65. success: (res: any) => {
  66. state.openid = res.data.openid;
  67. setItem("QYorder", state);
  68. console.log(res);
  69. },
  70. fail: (err: any) => {
  71. uni.showToast({
  72. title: "网络异常,请重试!" + err.errcode,
  73. icon: "error",
  74. duration: 500,
  75. });
  76. return;
  77. },
  78. });
  79. },
  80. });
  81. };
  82. const savaHandle = () => {
  83. console.log("openid*******", state.openid);
  84. //如果获取openId成功
  85. if (state.openid) {
  86. var data = {
  87. orderId: state.orderId,
  88. subOpenId: state.openid,
  89. };
  90. const options = {
  91. type: 2,
  92. data: data,
  93. method: "POST",
  94. showLoading: true,
  95. };
  96. request(etcQYAction, options).then((res) => {
  97. const data = stringToJson(res.bizContent);
  98. if (data.userState === "UNAUTHORIZED") {
  99. uni.navigateToMiniProgram({
  100. appId: "wxbcad394b3d99dac9",
  101. path: "pages/route/index",
  102. extraData: {
  103. appid: "wxcb1388c809fe25a9",
  104. sub_appid: "wx008c60533388527a",
  105. mch_id: "1500877591",
  106. sub_mch_id: "1622652848",
  107. nonce_str: data.nonceStr,
  108. sign_type: "HMAC-SHA256",
  109. trade_scene: "HIGHWAY",
  110. plate_number: data.plateNumber,
  111. sub_openid: data.subOpenId,
  112. sign: data.sign,
  113. },
  114. success(res) {
  115. console.log(res);
  116. },
  117. complete(res) {
  118. console.log(res);
  119. },
  120. fail(res) {
  121. console.log(res);
  122. // 未成功跳转到车主小程序
  123. },
  124. });
  125. } else if (data.userState === "NORMAL") {
  126. msg("已开通车主服务");
  127. uni.navigateTo({
  128. url: `/subpackage/applyCard/product-detail?orderId=${state.orderId}&&clientFee=${state.clientFee}&&id=${state.id}`,
  129. });
  130. } else if (data.userState === "PAUSED") {
  131. msg("已暂停车主服务");
  132. return;
  133. } else if (data.userState === "OVERDUE") {
  134. msg("用户已开通车主服务,但欠费状态。提示用户还款,请跳转到车主服务");
  135. return;
  136. }
  137. });
  138. } else {
  139. //如果获取openId失败
  140. uni.showToast({
  141. title: "网络异常,请重试!",
  142. icon: "none",
  143. duration: 1000,
  144. });
  145. return;
  146. }
  147. };
  148. </script>
  149. <style lang="scss" scoped>
  150. .action {
  151. margin-top: 40rpx;
  152. padding-left: 20rpx;
  153. padding-right: 20rpx;
  154. padding-bottom: 30rpx;
  155. .button {
  156. height: 80rpx;
  157. background: linear-gradient(-90deg, #43a1e0 0%, #13e7c1 100%);
  158. border-radius: 40rpx;
  159. font-size: 32rpx;
  160. font-weight: 400;
  161. color: #ffffff;
  162. line-height: 80rpx;
  163. }
  164. }
  165. .title {
  166. text-align: center;
  167. margin-top: 15rpx;
  168. font-size: 36rpx;
  169. font-family: Microsoft YaHei;
  170. font-weight: 400;
  171. color: #333333;
  172. line-height: 36rpx;
  173. }
  174. .value {
  175. padding: 0rpx 60rpx;
  176. }
  177. .content_1 {
  178. margin-top: 60rpx;
  179. font-size: 30rpx;
  180. font-family: Microsoft YaHei;
  181. font-weight: 400;
  182. color: #666666;
  183. line-height: 58rpx;
  184. }
  185. .content_2 {
  186. margin-top: 50rpx;
  187. font-size: 30rpx;
  188. font-family: Microsoft YaHei;
  189. font-weight: 400;
  190. color: #666666;
  191. line-height: 58rpx;
  192. }
  193. </style>