successfully.vue 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
  1. <template>
  2. <view>
  3. <uni-nav-bar status-bar=true fixed=true left-icon="arrowthinleft" background-color="#03b6b3" color="#ffffff"
  4. @clickRight="goHome" @clickLeft="navigateBack">
  5. <text slot="default" style="text-align: center; flex: 1; font-size: 18px; font-weight: bold;">报名成功</text>
  6. <button slot="right" size="mini" hover-class="button-hover" type="home" class="back-to-home">
  7. <uni-icons type="home-filled" size="22" color="#ffffff"></uni-icons>
  8. </button>
  9. </uni-nav-bar>
  10. <view class="msg-container">
  11. <uni-icons type="checkbox-filled" size="60" color="#03b6b3"></uni-icons>
  12. <text class="msg-success">报名成功</text>
  13. <text class="msg-other">报名成功,审核结果会尽快通知您.</text>
  14. </view>
  15. <view class="btn-container">
  16. <button class="btn-back" type="back" plain="true" hover-class="button-hover" @click="toIndex">返回首页</button>
  17. </view>
  18. </view>
  19. </template>
  20. <script>
  21. import uniNavBar from "@/components/uni-nav-bar/uni-nav-bar.vue";
  22. export default {
  23. components: {
  24. uniNavBar,
  25. },
  26. data() {
  27. return {
  28. }
  29. },
  30. methods: {
  31. goHome() {
  32. this.$mRouter.reLaunch({
  33. route: '/pages/index/index'
  34. });
  35. },
  36. navigateBack() {
  37. uni.navigateBack()
  38. },
  39. toIndex() {
  40. uni.navigateTo({
  41. url: '/pages/conference/meetingIndexCh/meetingIndex'
  42. })
  43. }
  44. }
  45. }
  46. </script>
  47. <style scoped>
  48. uni-button:after {
  49. border: none;
  50. }
  51. .uni-icons {
  52. line-height: 30px;
  53. }
  54. .msg-container {
  55. background-color: #FFFFFF;
  56. text-align: center;
  57. padding: 200rpx 40rpx 100rpx 40rpx;
  58. }
  59. .msg-container text {
  60. display: block;
  61. }
  62. .msg-container .msg-success {
  63. font-size: 20px;
  64. padding: 20px 0 10px 0;
  65. }
  66. .msg-container .msg-other {
  67. color: #999;
  68. }
  69. .btn-container {
  70. padding: 20px;
  71. }
  72. .btn-container .btn-back {
  73. border-color: #03b6b3;
  74. color: #03b6b3;
  75. font-weight: bold;
  76. }
  77. .button-hover[type=back] {
  78. opacity: .75;
  79. transform: scale(0.95, 0.95);
  80. }
  81. .back-to-home {
  82. height: 30px;
  83. border-radius: 15px;
  84. background-color: #1e9694;
  85. }
  86. .button-hover[type=home] {
  87. opacity: .75;
  88. transform: scale(0.95, 0.95);
  89. }
  90. </style>