paymentStatus.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. <template>
  2. <view class="content">
  3. <kevy-result-page v-if="type" :type="type" :title="title" :primarColor="primarColor" :details="details"
  4. :primaryBtnText="primaryBtnText" secondaryBtnText="返回" @primaryBtnClick="primaryBtnClick"
  5. @secondaryBtnClick="secondaryBtnClick" :codeUrlFailureTime="orderData.codeUrlFailureTime" @finish="finish">
  6. </kevy-result-page>
  7. </view>
  8. </template>
  9. <script>
  10. import {
  11. getOrderDetail,
  12. getWxPay
  13. } from '@/request/api/workark.js'
  14. export default {
  15. data() {
  16. return {
  17. type: '',
  18. title: '',
  19. details: [],
  20. primarColor: '',
  21. primaryBtnText: '',
  22. orderId: '',
  23. orderData: {},
  24. codeUrlFailureTime: ''
  25. }
  26. },
  27. onLoad(body) {
  28. this.orderId = body.orderId;
  29. if (this.orderId) this.init(body.status);
  30. },
  31. methods: {
  32. async init(status) {
  33. let orderData = await getOrderDetail(this.orderId);
  34. if (!orderData.state) return;
  35. this.orderData = orderData.data;
  36. if (status) this.orderData.orderStatus = status;
  37. this.details = [{
  38. label: '订单编号',
  39. value: orderData.data.orderNo
  40. }, {
  41. label: '订单金额',
  42. value: orderData.data.totalFee
  43. }, {
  44. label: '支付状态',
  45. value: orderData.data.orderStatus
  46. }];
  47. this.initStatus();
  48. },
  49. initStatus() {
  50. if (this.orderData.orderStatus === '支付成功') {
  51. this.type = 'success';
  52. this.title = '支付成功';
  53. this.primarColor = '#4fc08d';
  54. this.primaryBtnText = '查看订单';
  55. } else if (this.orderData.orderStatus === '未支付') {
  56. this.type = 'warning';
  57. this.title = '暂未支付';
  58. this.primarColor = '#f9b04d';
  59. this.primaryBtnText = '立即支付';
  60. } else if (this.orderData.orderStatus === '超时已关闭') {
  61. this.type = 'error';
  62. this.title = '订单已失效';
  63. this.primarColor = '#ff3927';
  64. this.primaryBtnText = '查看订单';
  65. }
  66. },
  67. async primaryBtnClick() {
  68. if (this.type === 'success') {
  69. this.$navigateTo('/subPages/indexPage/orderDetail/orderDetail?orderId=' + this.orderData.id)
  70. } else if (this.type === 'warning') {
  71. uni.showLoading({
  72. title: '订单支付中...'
  73. })
  74. let wxConfig = await getWxPay(this.orderData.orderNo, uni.getStorageSync('openId'));
  75. uni.requestPayment({
  76. provider: 'wxpay',
  77. timeStamp: wxConfig.data.timeStamp,
  78. nonceStr: wxConfig.data.nonceStr,
  79. package: wxConfig.data.prepayId,
  80. signType: wxConfig.data.signType,
  81. paySign: wxConfig.data.paySign,
  82. success: res => {
  83. this.init();
  84. uni.hideLoading();
  85. },
  86. fail: err => {
  87. uni.hideLoading();
  88. }
  89. });
  90. }
  91. },
  92. secondaryBtnClick() {
  93. uni.navigateBack();
  94. },
  95. finish() {
  96. this.init();
  97. }
  98. }
  99. }
  100. </script>
  101. <style lang="scss" scoped>
  102. ::v-deep .uv-count-down {
  103. .uv-count-down__text {
  104. color: #fff;
  105. }
  106. }
  107. .content {
  108. box-sizing: border-box;
  109. }
  110. </style>