payFinish.vue 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. <template>
  2. <view class="page-cont">
  3. <view class="icon-cont">
  4. <u-icon class="icon" name="checkmark" color="#fff" size="80"></u-icon>
  5. <view>支付成功</view>
  6. </view>
  7. <u-button @click="toOrderDetail" type="success">查看订单详情</u-button>
  8. <view class="back-btn">
  9. <u-button @click="toHome">返回首页</u-button>
  10. </view>
  11. </view>
  12. </template>
  13. <script>
  14. export default {
  15. data() {
  16. return {
  17. orderId: '' //订单id
  18. }
  19. },
  20. onLoad(option) {
  21. console.log(option,'option')
  22. this.orderId = option.id
  23. // 开启分享
  24. uni.showShareMenu({
  25. withShareTicket: true,
  26. menus: ['shareAppMessage', 'shareTimeline']
  27. })
  28. },
  29. methods: {
  30. // 查看订单详情
  31. toOrderDetail() {
  32. uni.redirectTo({
  33. url: '/pagesA/order/orderDetail?id=' + this.orderId
  34. })
  35. },
  36. // 返回首页
  37. toHome() {
  38. uni.reLaunch({
  39. url: '/pages/index/index'
  40. })
  41. }
  42. }
  43. }
  44. </script>
  45. <style lang="less">
  46. page{
  47. height: 100%;
  48. }
  49. .page-cont{
  50. width: 100%;
  51. height: 100%;
  52. background-color: #fff;
  53. padding: 0 40upx;
  54. .icon-cont{
  55. width: 100%;
  56. height: 400upx;
  57. display: flex;
  58. flex-direction: column;
  59. align-items: center;
  60. justify-content: center;
  61. >view{
  62. font-size: 30upx;
  63. margin-top: 40upx;
  64. }
  65. }
  66. .icon{
  67. width: 120upx;
  68. height: 120upx;
  69. background-color: #07c160;
  70. display: flex;
  71. justify-content: center;
  72. border-radius: 50%;
  73. }
  74. .back-btn{
  75. margin-top: 40upx;
  76. }
  77. }
  78. </style>