success.vue 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125
  1. <template>
  2. <view class="bagStorageSuccess">
  3. <view class="top">
  4. <navigation-bar-view ref="nav" :maxTimer="60"></navigation-bar-view>
  5. <view class="icon-box">
  6. <image class="icon" :src="require('../../static/images/icon-success.png')"></image>
  7. <view class="label">下单成功</view>
  8. </view>
  9. <view class="hint">{{options.remind}}</view>
  10. </view>
  11. <!-- <view class="bottom">
  12. <view class="label-box">常见问题:</view>
  13. <scroll-view scroll-y style="height: 39.9vh;">
  14. <block v-for="(item, i) in faq" :key="i">
  15. <view class="item">
  16. <view class="label">{{i + 1}}、{{item.title}}</view>
  17. <view class="message">{{item.content}}</view>
  18. </view>
  19. </block>
  20. <view style="height: 5vw;"></view>
  21. </scroll-view>
  22. </view> -->
  23. </view>
  24. </template>
  25. <script>
  26. import navigationBarView from '../../components/navigationBarView.vue';
  27. export default {
  28. components: {
  29. navigationBarView,
  30. },
  31. data() {
  32. return {
  33. faq: [],
  34. options: {}
  35. }
  36. },
  37. onLoad(options) {
  38. this.options = options
  39. this.getFaq();
  40. },
  41. onHide() {
  42. const $this = this;
  43. $this.$nextTick(function(){
  44. $this.$refs.nav.clearTimer();
  45. })
  46. },
  47. methods: {
  48. getFaq() {
  49. this.$api.commonHelpList({
  50. // type: 1
  51. }).then(res => {
  52. this.faq = res.data;
  53. })
  54. }
  55. }
  56. }
  57. </script>
  58. <style lang="scss">
  59. .bagStorageSuccess {
  60. min-height: 100vh;
  61. background-color: #F8F8F8;
  62. .top {
  63. padding-bottom: 10.4vw;
  64. background-color: #FFFFFF;
  65. .icon-box {
  66. display: flex;
  67. align-items: center;
  68. flex-direction: column;
  69. margin-top: 12.1vw;
  70. .icon {
  71. width: 18.8vw;
  72. height: 18.8vw;
  73. }
  74. .label {
  75. margin-top: 4.6vw;
  76. font-size: 4.5vw;
  77. line-height: 4.5vw;
  78. }
  79. }
  80. .hint {
  81. display: flex;
  82. align-items: center;
  83. justify-content: center;
  84. height: 12.1vw;
  85. border-radius: 12.1vw;
  86. background: linear-gradient(to right, #FEE704, #FDD001);
  87. margin: 9vw 7.3vw 0;
  88. font-size: 4.2vw;
  89. }
  90. }
  91. .bottom {
  92. .label-box {
  93. margin: 8.3vw 7.5vw 3vw;
  94. font-weight: bold;
  95. font-size: 4.3vw;
  96. line-height: 4.3vw;
  97. }
  98. .item {
  99. padding: 0 7.3vw 7.3vw;
  100. .label {
  101. font-size: 3.5vw;
  102. }
  103. .message {
  104. margin: 3vw 7.3vw 0;
  105. color: #888888;
  106. font-size: 3.2vw;
  107. }
  108. }
  109. }
  110. }
  111. </style>