index.vue 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. <template>
  2. <view class="success">
  3. <!-- <view class="bgc"></view> -->
  4. <view class="content">
  5. <view><nav-bar title="none" icon="none" background="transparent" border-color="transparent" ></nav-bar></view>
  6. <view class="sur flex-column aic">
  7. <re-image imgSrc="/retail/mall/img_quancoin.png" width="240" height="240"></re-image>
  8. <view class="texts flex-column">
  9. <text class="suce-text">充值成功</text>
  10. <text>支付金额:</text>
  11. <text>购买游戏币:</text>
  12. </view>
  13. <view class="btns">
  14. <u-button class="order" @click="toOrder">查看订单</u-button>
  15. <u-button class="home" @click="toHome">返回首页</u-button>
  16. </view>
  17. </view>
  18. </view>
  19. </view>
  20. </template>
  21. <script>
  22. export default {
  23. data(){
  24. return{
  25. }
  26. },
  27. methods: {
  28. // 返回订单
  29. toOrder(){
  30. uni.navigateTo({
  31. url: '/pages/mall/mallRecharge/index'
  32. })
  33. },
  34. toHome(){
  35. uni.switchTab({
  36. url: '/pages/gallery/index'
  37. })
  38. }
  39. },
  40. }
  41. </script>
  42. <style lang="scss" scoped>
  43. .success{
  44. width: 100%;
  45. position: relative;
  46. .bgc{
  47. // position: absolute;
  48. }
  49. .content{
  50. // z-index: 9;
  51. width: 100%;
  52. height: 544rpx;
  53. background: linear-gradient( 180deg, #FFF4D6 0%, rgba(255,251,193,0.62) 40%, rgba(255,221,202,0.32) 100%);
  54. padding: 32rpx;
  55. .sur{
  56. width: 100%;
  57. padding: 56rpx 0 64rpx;
  58. background: #FFFFFF;
  59. border-radius: 24rpx;
  60. .texts{
  61. margin-top: 48rpx;
  62. font-weight: 500;
  63. font-size: 28rpx;
  64. color: #2C2B28;
  65. .suce-text{
  66. font-weight: bold;
  67. font-size: 40rpx;
  68. text-align: center;
  69. margin-bottom: 32rpx;
  70. }
  71. }
  72. .btns{
  73. margin-top: 64rpx;
  74. button{
  75. width: 414rpx;
  76. height: 96rpx;
  77. }
  78. .order{
  79. background: linear-gradient( 140deg, #FF8500 0%, #FFA600 100%);
  80. border-radius: 48rpx;
  81. font-weight: bold;
  82. font-size: 40rpx;
  83. color: #FFFFFF;
  84. margin-bottom: 32rpx;
  85. }
  86. .home{
  87. background: #FFFFFF;
  88. border-radius: 48rpx;
  89. border: 2rpx solid #9FA2B2;
  90. font-weight: 500;
  91. font-size: 40rpx;
  92. color: #2C2B28;
  93. }
  94. }
  95. }
  96. }
  97. }
  98. </style>