payResult.vue 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <template>
  2. <view class="payResult">
  3. <u-icon name="checkmark-circle-fill" color="#04BE02" style="margin-top: 50rpx;" size="180"></u-icon>
  4. <view>支付成功</view>
  5. <u-button shape="circle" :custom-style="customStyle" style="margin-top: 120rpx;" @click="goback">{{orderType == 'VOTE_ORDER' ? '返回投票' : '返回商城'}}</u-button>
  6. </view>
  7. </template>
  8. <script>
  9. let goldPlan = require('@/utils/jgoldplan-1.0.0.js');
  10. import VConsole from 'vconsole';
  11. export default {
  12. data() {
  13. return {
  14. customStyle: {
  15. color: 'white',
  16. background: "#04BE02",
  17. width: '320rpx',
  18. margin: '10rpx',
  19. height:"80rpx",
  20. fontSize:"30rpx"
  21. },
  22. redirect_url: '',
  23. bgColor: '',
  24. orderType: ''
  25. }
  26. },
  27. async onLoad(options) {
  28. // const vConsole = new VConsole();
  29. console.log("商品小票",options)
  30. let params = {
  31. orderId: options.out_trade_no
  32. }
  33. let res = await this.$api.yeepay.getOrderUrlAndColor(params)
  34. if(res.data.success){
  35. this.redirect_url = res.data.data.url;
  36. this.bgColor = res.data.data.color;
  37. this.orderType = res.data.data.type;
  38. }
  39. },
  40. onReady() {
  41. let mchData = {
  42. action: 'onIframeReady',
  43. displayStyle: 'SHOW_CUSTOM_PAGE'
  44. };
  45. let postData = JSON.stringify(mchData);
  46. parent.postMessage(postData, 'https://payapp.weixin.qq.com');
  47. },
  48. methods: {
  49. goback() {
  50. let mchData = {
  51. action: 'jumpOut',
  52. jumpOutUrl: decodeURIComponent(this.redirect_url) //跳转的页面
  53. }
  54. var postData = JSON.stringify(mchData);
  55. parent.postMessage(postData, 'https://payapp.weixin.qq.com')
  56. }
  57. }
  58. }
  59. </script>
  60. <style lang="scss">
  61. .payResult{
  62. display: flex;
  63. flex-direction: column;
  64. align-items: center;
  65. justify-content: center;
  66. background: #FFFFFF;
  67. width: 100vw;
  68. height: 100vh;
  69. }
  70. </style>