<template>
    <!-- 邀请页 -->
    <div class="area-process" v-show-log="state.log_invite_show">
        <div class="area1">
            <v-head :left-data="state.detail.postUserInfo || null" :rightData="state.detail.remainAmountUsdValue">
            </v-head>
            <v-carousel></v-carousel>
        </div>
        <v-boxs style="margin-top: 30px;"></v-boxs>
        <invite-list></invite-list>
    </div>

    <!-- <div class="area-nav">
        <div class="item" :class="{ active: state.tab_index == i }" @click="state.tab_index = i"
            v-for="item, i in state.tabs">
            <img :src="require('@/assets/svg/icon-invite.svg')" alt=""
                :style="{ opacity: state.tab_index == 0 ? '1' : '0.55' }" v-if="i == 0" />
            <img :src="require('@/assets/svg/icon-invite-list.svg')" alt=""
                :style="{ opacity: state.tab_index == 1 ? '1' : '0.55' }" v-if="i == 1" />
            {{ item.txt }}
        </div>
    </div> -->
    <div class="area-info">
        <invite-friends></invite-friends>
        <!-- -->
    </div>
    <v-dialog v-show="state.dialog.show"></v-dialog>
</template>
<script setup>
import { ref, onMounted, watch, inject } from 'vue'

import VHead from '@/view/iframe/treasure-hunt/components/head.vue'
import InviteList from '@/view/iframe/treasure-hunt/components/invite-list.vue'
import HoverTip from '@/view/iframe/treasure-hunt/components/hover-tip.vue'
import InviteFriends from '@/view/iframe/treasure-hunt/components/invite-friends.vue'
import VDialog from '@/view/iframe/treasure-hunt/components/dialog.vue'
import VBoxs from '@/view/iframe/treasure-hunt/components/boxs.vue'
import VCarousel from '@/view/iframe/treasure-hunt/components/carousel.vue'

import Report from "@/log-center/log"


let state = inject('state')

state.log_invite_show = {
    businessType: Report.businessType.pageView,
    pageSource: Report.pageSource.inviteFriendsPage,
    redPacketType: Report.redPacketType.treasure,
    shareLinkId: state.invite_code,
    myShareLinkId: state.detail.inviteCopyUrl,
    currentInvitedNum: state.inviteCount,
    postId: state.postId
}


// ---- tab区域 ----
state.tab_index = 0
state.tabs = [{
    txt: 'Invite Friends'
}, {
    txt: 'Invited'
}]

onMounted(() => {
    setInterval(() => {
        state.refresh = true
        state.refresh = false
    }, 30000)
})



</script>
<style lang="scss"  scoped>
.area-process {
    width: 375px;
    height: 260px;
    background: linear-gradient(179.96deg, #25180D 48.1%, #6A4C1F 62.7%, #24180C 77.69%);
    position: relative;

    .area1 {
        background: rgba(255, 255, 255, 0.1);
    }

    .area2 {}

}

.area-info {
    width: 375px;
}
</style>
