popup-hint.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. <template>
  2. <uni-popup ref="popupRef" :isMaskClick="false">
  3. <!-- @change="popupChange" -->
  4. <view class="hint-box">
  5. <view class="hint-title">赠金交易</view>
  6. <view class="hint-content">
  7. <view class="">
  8. 赠金交易是BiKing交易所的赠品交易系统,交易盈利部分可实时划转至合约钱包。
  9. </view>
  10. <view class="">
  11. 赠金获取方式:
  12. </view>
  13. <view class="content-list">
  14. <text>1. 完成任务中心的各项任务</text>
  15. <text>2. 参与平台活动</text>
  16. <text>3. 不定期新老用户赠金空投</text>
  17. </view>
  18. <view class="">
  19. 更多内容请点击<text class="explain">《赠金交易》</text>
  20. </view>
  21. <view class="hite-box">
  22. <text class="box">
  23. <text class="iconfont">&#xe6c5;</text>
  24. </text>
  25. <text>不在提示</text>
  26. </view>
  27. <view class="confirm-btn" @click.stop="confirmBtn">
  28. 确定
  29. </view>
  30. </view>
  31. </view>
  32. </uni-popup>
  33. </template>
  34. <script>
  35. export default {
  36. data() {
  37. return {
  38. };
  39. },
  40. watch: {
  41. },
  42. mounted() {
  43. this.open();
  44. },
  45. methods: {
  46. open() {
  47. this.$nextTick(() => {
  48. this.$refs.popupRef.open()
  49. })
  50. },
  51. confirmBtn(){
  52. this.$refs.popupRef.close()
  53. }
  54. }
  55. }
  56. </script>
  57. <style lang="scss" scoped>
  58. .hint-box {
  59. width: 650rpx;
  60. background-color: #fff;
  61. .hint-title {
  62. width: 100%;
  63. height: 80rpx;
  64. line-height: 80rpx;
  65. text-align: center;
  66. border-bottom: 1rpx solid $border-color;
  67. }
  68. .hint-content {
  69. width: 100%;
  70. padding: 80rpx 60rpx;
  71. font-size: 28rpx;
  72. .content-list {
  73. text {
  74. display: block;
  75. }
  76. }
  77. .explain {
  78. color: $Theme-Color;
  79. }
  80. // <view class="hite-box">
  81. // <text class="box"></text>
  82. // <text>不在提示</text>
  83. // </view>
  84. .hite-box {
  85. display: flex;
  86. align-items: center;
  87. padding-top: 20rpx;
  88. .box {
  89. border: 1rpx solid #ccc;
  90. width: 30rpx;
  91. height: 30rpx;
  92. margin-right: 10rpx;
  93. display: flex;
  94. justify-content: center;
  95. align-items: center;
  96. .iconfont{
  97. font-size: 32rpx;
  98. color: $Theme-Color;
  99. }
  100. }
  101. }
  102. .confirm-btn{
  103. width: 100%;
  104. height: 80rpx;
  105. text-align: center;
  106. line-height: 80rpx;
  107. background-color: $Theme-Color;
  108. margin-top: 50rpx;
  109. color: #fff;
  110. font-size: 28rpx;
  111. }
  112. }
  113. }
  114. </style>