success.vue 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. <template>
  2. <view class="content">
  3. <view class="inner">
  4. <view class="top">
  5. <text class="title">支付成功</text>
  6. <image class="icon" src="../../static/images/success.png" ></image>
  7. <view class="btn-box">
  8. <view class="btn cancel" @click="goBack()"> 返回</view>
  9. </view>
  10. </view>
  11. </view>
  12. <view class="ad">
  13. <ad unit-id="adunit-1f2b34a04431a6f4" ad-type="video" ad-theme="white"></ad>
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. export default {
  19. data() {
  20. return {
  21. }
  22. },
  23. onLoad(option) {
  24. },
  25. methods: {
  26. goBack(){
  27. uni.navigateBack({
  28. delta:1
  29. })
  30. }
  31. }
  32. }
  33. </script>
  34. <style lang="scss">
  35. page{
  36. height: 100%;
  37. }
  38. .content{
  39. height: 100%;
  40. display: flex;
  41. flex-direction: column;
  42. justify-content: space-between;
  43. .inner{
  44. padding: 20upx;
  45. .top{
  46. box-sizing: border-box;
  47. background: #FFFFFF;
  48. border-radius: 16upx;
  49. display: flex;
  50. flex-direction: column;
  51. align-items: center;
  52. padding: 50upx 0upx;
  53. .title{
  54. font-size: 40upx;
  55. font-family: PingFang SC;
  56. font-weight: 500;
  57. color: #222222;
  58. line-height: 1;
  59. text-align: center;
  60. }
  61. .icon{
  62. margin: 60upx 0upx;
  63. width: 100upx;
  64. height: 100upx;
  65. }
  66. }
  67. .order-info{
  68. margin-top: 20upx;
  69. background: #FFFFFF;
  70. border-radius: 16upx;
  71. padding: 40upx 30upx;
  72. .title{
  73. font-size: 30upx;
  74. font-family: PingFang SC;
  75. font-weight: bold;
  76. color: #222222;
  77. line-height: 1;
  78. }
  79. .item{
  80. margin-top: 40upx;
  81. display: flex;
  82. align-items: center;
  83. justify-content: space-between;
  84. .label{
  85. font-size: 26upx;
  86. font-family: PingFang SC;
  87. font-weight: 500;
  88. color: #666666;
  89. line-height: 1;
  90. }
  91. .text{
  92. font-size: 26upx;
  93. font-family: PingFang SC;
  94. font-weight: 500;
  95. color: #222222;
  96. line-height: 32upx;
  97. }
  98. .cont-text{
  99. font-size: 26upx;
  100. font-family: PingFang SC;
  101. font-weight: 500;
  102. color: #666666;
  103. .bold{
  104. color: #111111;
  105. }
  106. }
  107. .sn-box{
  108. display: flex;
  109. align-items: center;
  110. .copy-btn{
  111. width: 58upx;
  112. height: 32upx;
  113. line-height: 32upx;
  114. text-align: center;
  115. font-size: 22upx;
  116. font-family: PingFang SC;
  117. font-weight: 500;
  118. color: #222222;
  119. background: #F5F5F5;
  120. border-radius: 4upx;
  121. margin-left: 24upx;
  122. }
  123. }
  124. }
  125. .line{
  126. width: 100%;
  127. height: 1px;
  128. background: #F0F0F0;
  129. margin-top: 30upx;
  130. }
  131. }
  132. }
  133. .btn-box{
  134. margin-top: 20upx;
  135. box-sizing: border-box;
  136. display: flex;
  137. align-items: center;
  138. .btn{
  139. width: 155upx;
  140. height: 64upx;
  141. line-height: 64upx;
  142. font-size: 26upx;
  143. font-family: PingFang SC;
  144. font-weight: 500;
  145. text-align: center;
  146. border-radius: 32upx;
  147. &.cancel{
  148. border: 1px solid #DDDDDD;
  149. color: #666666;
  150. }
  151. }
  152. }
  153. }
  154. </style>