paySuccess.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. <template>
  2. <view class="content">
  3. <view class="box">
  4. <image class="img" src="../../../static/image/success.png" mode="widthFix"></image>
  5. <text class="tit">支付成功</text>
  6. <view class="tip" >
  7. <text v-if="type==0">
  8. 请前往母婴界严选加盟商一领取
  9. </text>
  10. </view>
  11. <view class="btn-group flex">
  12. <navigator v-if="type==0" :url="'/pages/order/orderDetail?id='+orderId" open-type="redirect"
  13. class="mix-btn hollow">查看订单</navigator>
  14. <view v-if="type==1" class="mix-btn hollow" @click="navBack">返回</view>
  15. <navigator url="/pages/index/index" open-type="switchTab" class="mix-btn ">返回首页</navigator>
  16. </view>
  17. </view>
  18. </view>
  19. </template>
  20. <script>
  21. export default {
  22. data() {
  23. return {
  24. orderId: '',
  25. type: 0 //0为订单1为充值
  26. }
  27. },
  28. onLoad(opt) {
  29. // 保存订单号
  30. if (opt.orderid) {
  31. this.orderId = opt.orderid;
  32. }
  33. // 分类
  34. if (opt.type) {
  35. this.type = opt.type;
  36. }
  37. },
  38. methods: {
  39. // 返回上一页
  40. navBack() {
  41. uni.navigateBack()
  42. }
  43. }
  44. }
  45. </script>
  46. <style lang='scss'>
  47. .content {
  48. padding-top: 30rpx;
  49. }
  50. .box {
  51. margin: 0 $page-row-spacing;
  52. display: flex;
  53. flex-direction: column;
  54. justify-content: center;
  55. align-items: center;
  56. background-color: #FFFFFF;
  57. border-radius: 20rpx;
  58. padding: 50rpx;
  59. padding-top: 80rpx;
  60. }
  61. .tip {
  62. color: $font-color-disabled;
  63. font-size: 24rpx;
  64. margin-top: 30rpx;
  65. padding-bottom: 30rpx;
  66. }
  67. .img {
  68. width: 200rpx;
  69. }
  70. .tit {
  71. font-size: 38rpx;
  72. font-weight: bold;
  73. color: #303133;
  74. margin-top: 30rpx;
  75. }
  76. .btn-group {
  77. padding-top: 100rpx;
  78. width: 100%;
  79. justify-content: space-around;
  80. padding: 0 10rpx;
  81. }
  82. .mix-btn {
  83. margin-top: 30upx;
  84. display: flex;
  85. align-items: center;
  86. font-size: $font-lg;
  87. color: #fff;
  88. background-color: $base-color;
  89. padding: 20rpx 50rpx;
  90. border-radius: 100rpx;
  91. line-height: 1;
  92. &.hollow {
  93. background: #fff;
  94. color: #303133;
  95. border: 1px solid #ccc;
  96. }
  97. }
  98. </style>