invite.vue 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <template>
  2. <!-- 邀请页 -->
  3. <div class="area-process" v-show-log="state.log_invite_show">
  4. <div class="area1">
  5. <v-head :left-data="state.detail.postUserInfo || null" :rightData="state.detail.remainAmountUsdValue">
  6. </v-head>
  7. <v-carousel></v-carousel>
  8. </div>
  9. <v-boxs style="margin-top: 30px;"></v-boxs>
  10. <invite-list></invite-list>
  11. </div>
  12. <!-- <div class="area-nav">
  13. <div class="item" :class="{ active: state.tab_index == i }" @click="state.tab_index = i"
  14. v-for="item, i in state.tabs">
  15. <img :src="require('@/assets/svg/icon-invite.svg')" alt=""
  16. :style="{ opacity: state.tab_index == 0 ? '1' : '0.55' }" v-if="i == 0" />
  17. <img :src="require('@/assets/svg/icon-invite-list.svg')" alt=""
  18. :style="{ opacity: state.tab_index == 1 ? '1' : '0.55' }" v-if="i == 1" />
  19. {{ item.txt }}
  20. </div>
  21. </div> -->
  22. <div class="area-info">
  23. <invite-friends></invite-friends>
  24. <!-- -->
  25. </div>
  26. <v-dialog v-show="state.dialog.show"></v-dialog>
  27. </template>
  28. <script setup>
  29. import { ref, onMounted, watch, inject } from 'vue'
  30. import VHead from '@/view/iframe/treasure-hunt/components/head.vue'
  31. import InviteList from '@/view/iframe/treasure-hunt/components/invite-list.vue'
  32. import HoverTip from '@/view/iframe/treasure-hunt/components/hover-tip.vue'
  33. import InviteFriends from '@/view/iframe/treasure-hunt/components/invite-friends.vue'
  34. import VDialog from '@/view/iframe/treasure-hunt/components/dialog.vue'
  35. import VBoxs from '@/view/iframe/treasure-hunt/components/boxs.vue'
  36. import VCarousel from '@/view/iframe/treasure-hunt/components/carousel.vue'
  37. import Report from "@/log-center/log"
  38. let state = inject('state')
  39. state.log_invite_show = {
  40. businessType: Report.businessType.pageView,
  41. pageSource: Report.pageSource.inviteFriendsPage,
  42. redPacketType: Report.redPacketType.treasure,
  43. shareLinkId: state.invite_code,
  44. myShareLinkId: state.detail.inviteCopyUrl,
  45. currentInvitedNum: state.inviteCount,
  46. postId: state.postId
  47. }
  48. // ---- tab区域 ----
  49. state.tab_index = 0
  50. state.tabs = [{
  51. txt: 'Invite Friends'
  52. }, {
  53. txt: 'Invited'
  54. }]
  55. onMounted(() => {
  56. setInterval(() => {
  57. state.refresh = true
  58. state.refresh = false
  59. }, 30000)
  60. })
  61. </script>
  62. <style lang="scss" scoped>
  63. .area-process {
  64. width: 375px;
  65. height: 260px;
  66. background: linear-gradient(179.96deg, #25180D 48.1%, #6A4C1F 62.7%, #24180C 77.69%);
  67. position: relative;
  68. .area1 {
  69. background: rgba(255, 255, 255, 0.1);
  70. }
  71. .area2 {}
  72. }
  73. .area-info {
  74. width: 375px;
  75. }
  76. </style>