receiving.vue 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. <template>
  2. <view :style="colorStyle">
  3. <view class="px-20">
  4. <template v-if="!showBack">
  5. <view class="w-full h-120 rd-24rpx bg--w111-fff px-32 mt-40 flex-between-center fs-28">
  6. <text>收款方式</text>
  7. <view class="flex-y-center">
  8. <image src="../static/weixin.png" class="w-42 h-42"></image>
  9. <text class="pl-16">收款至微信</text>
  10. </view>
  11. </view>
  12. <view class="w-full rd-24rpx bg--w111-fff px-32 mt-20 fs-28">
  13. <view class="fs-28 lh-40rpx pt-40">收款金额</view>
  14. <view class="mt-36 pb-40">
  15. <baseMoney :money="infoData.true_extract_price" symbolSize="48" integerSize="72" decimalSize="72" color="#333333" weight></baseMoney>
  16. </view>
  17. <!-- <view class="pt-20 pb-24 fs-26 text--w111-999">提现手续费{{withdraw_fee}}%</view> -->
  18. </view>
  19. </template>
  20. <view class="w-full rd-24rpx bg--w111-fff mt-40 py-82 flex-col flex-between-center fs-28" v-if="showBack">
  21. <view class="flex-y-center">
  22. <image src="../static/receiving_success.png" class="w-60 h-60"></image>
  23. <text class="pl-16 fs-32 fw-500">收款成功</text>
  24. </view>
  25. <view class="mt-40 pb-32">
  26. <baseMoney :money="infoData.true_extract_price" symbolSize="48" integerSize="72" decimalSize="72" color="#333333" weight></baseMoney>
  27. </view>
  28. <view class="fs-26 text--w111-999">可在“微信支付-服务-钱包-账单”查看明细</view>
  29. <view class="w-504 h-80 rd-40rpx flex-center bg-color fs-28 text--w111-fff mt-52" @tap="backList">返回列表</view>
  30. </view>
  31. <view class="fixed-lb w-full pb-safe" v-if="!showBack">
  32. <view class="w-full h-128 px-20 flex-center">
  33. <view class="w-full h-80 rd-40rpx flex-center bg-color fs-28 text--w111-fff" @tap="confrimTap">立即收款</view>
  34. </view>
  35. </view>
  36. </view>
  37. </view>
  38. </template>
  39. <script>
  40. import colors from '@/mixins/color.js';
  41. import { toLogin } from '@/libs/login.js';
  42. import { transferInfoApi } from '@/api/user';
  43. import { mapGetters } from 'vuex';
  44. export default {
  45. mixins: [colors],
  46. data() {
  47. return {
  48. id: 0,
  49. type: 1,
  50. infoData: {
  51. true_extract_price: '',
  52. package_info: '',
  53. mchid: '',
  54. wechat_appid: ''
  55. },
  56. withdraw_fee: '',
  57. showBack: false
  58. };
  59. },
  60. computed: mapGetters(['isLogin']),
  61. onLoad(options) {
  62. if (options.id) {
  63. this.id = options.id;
  64. this.type = options.type;
  65. this.getInfo();
  66. }
  67. },
  68. methods: {
  69. getInfo() {
  70. transferInfoApi({
  71. order_id: this.id,
  72. type: this.type
  73. })
  74. .then((res) => {
  75. this.infoData = res.data;
  76. })
  77. .catch((err) => {
  78. return this.$util.Tips(
  79. {
  80. title: err
  81. },
  82. {
  83. tab: 3
  84. }
  85. );
  86. });
  87. },
  88. confrimTap() {
  89. if (this.infoData.state === 'FAIL')
  90. return wx.showToast({
  91. title: '转账已失效,请从重新发起'
  92. });
  93. let that = this;
  94. // #ifdef MP-WEIXIN
  95. if (wx.canIUse('requestMerchantTransfer')) {
  96. wx.requestMerchantTransfer({
  97. mchId: that.infoData.mchid,
  98. appId: wx.getAccountInfoSync().miniProgram.appId,
  99. package: that.infoData.package_info,
  100. success: (res) => {
  101. that.showBack = true;
  102. // res.err_msg将在页面展示成功后返回应用时返回ok,并不代表付款成功
  103. console.log('success:', res);
  104. },
  105. fail: (res) => {
  106. console.log('fail:', res);
  107. }
  108. });
  109. } else {
  110. wx.showToast({
  111. title: '你的微信版本过低,请更新至最新版本。'
  112. });
  113. }
  114. // #endif
  115. // #ifdef H5
  116. if (that.$wechat.isWeixin()) {
  117. let configAppMessage = {
  118. mchId: that.infoData.mchid,
  119. appId: that.infoData.wechat_appid,
  120. package: that.infoData.package_info
  121. };
  122. if (WeixinJSBridge) {
  123. WeixinJSBridge.invoke('requestMerchantTransfer', configAppMessage, function (res) {
  124. if (res.err_msg === 'requestMerchantTransfer:ok') {
  125. // res.err_msg将在页面展示成功后返回应用时返回success,并不代表付款成功
  126. that.showBack = true;
  127. }
  128. });
  129. } else {
  130. uni.showToast({
  131. title: '你的微信版本过低,请更新至最新版本。'
  132. });
  133. }
  134. }
  135. // #endif
  136. },
  137. backList() {
  138. let backUrl;
  139. if (this.type == 1) {
  140. backUrl = '/pages/users/user_spread_money/index?type=1';
  141. } else {
  142. backUrl = '/pages/goods/lottery/grids/record';
  143. }
  144. uni.reLaunch({
  145. url: backUrl
  146. });
  147. }
  148. }
  149. };
  150. </script>
  151. <style lang="scss">
  152. .bb-e {
  153. border-bottom: 1px solid #eee;
  154. }
  155. .py-82 {
  156. padding: 82rpx 0;
  157. }
  158. </style>