paySuccess.vue 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. <template>
  2. <view class="content">
  3. <text class="success-icon iconfont iconroundcheck"></text>
  4. <text class="tit">{{ type == 1? '抢购成功' : '支付成功'}}</text>
  5. <view class="btn-group">
  6. <navigator v-if="type == '1' " :url="'/pages/order/order'" open-type="redirect" class="mix-btn">查看订单</navigator>
  7. <navigator v-else :url="'/pages/order/orderDetail?id='+orderId" open-type="redirect" class="mix-btn">查看订单</navigator>
  8. <navigator v-if="type == '1' " :url="'/pages/order/order'" open-type="redirect" class="mix-btn">返回抢画列表</navigator>
  9. <navigator v-else url="/pages/index/index" open-type="switchTab" class="mix-btn hollow">返回首页</navigator>
  10. </view>
  11. </view>
  12. </template>
  13. <script>
  14. export default {
  15. data() {
  16. return {
  17. orderId:'',
  18. type:''
  19. }
  20. },
  21. onLoad(opt) {
  22. if(opt.type) {
  23. this.type = opt.type
  24. }
  25. // 保存订单号
  26. this.orderId = opt.orderid;
  27. },
  28. methods: {
  29. }
  30. }
  31. </script>
  32. <style lang='scss'>
  33. .content{
  34. display: flex;
  35. flex-direction: column;
  36. justify-content: center;
  37. align-items: center;
  38. }
  39. .success-icon{
  40. font-size: 160upx;
  41. color: #d13737;
  42. margin-top: 100upx;
  43. }
  44. .tit{
  45. font-size: 38upx;
  46. color: #303133;
  47. }
  48. .btn-group{
  49. padding-top: 100upx;
  50. }
  51. .mix-btn {
  52. margin-top: 30upx;
  53. display: flex;
  54. align-items: center;
  55. justify-content: center;
  56. width: 600upx;
  57. height: 80upx;
  58. font-size: $font-lg;
  59. color: #fff;
  60. background-color: $base-color;
  61. border-radius: 10upx;
  62. &.hollow{
  63. background: #fff;
  64. color: #303133;
  65. border: 1px solid #ccc;
  66. }
  67. }
  68. </style>