<script setup>
import { useRoute } from 'vue-router';
import { ref,onMounted } from "vue";
import VuePdfEmbed from "vue-pdf-embed";
import {Toast,Dialog} from 'vant';
import {apiUserInfo} from '@/api/hzyb/user'
const route = useRoute();
localStorage.setItem('hzyb-token',route.query.token)
document.title='PDF报告'
const pdfSrc = ref('')
let LOADING = null
let showHint = ref(false)
let hasRight = ref(true)
let userInfo = ref({})
let hintText = ref('')


const loadingFailed = ()=>{
    LOADING.clear()
    Toast("加载PDF失败!")
    showHint.value = true
}
const loadedPDF = ()=>{
    LOADING.clear()
    showHint.value = false
    hintText.value = ''
}

const checkRight = async()=>{
    const res = await apiUserInfo({Authorization: localStorage.getItem('hzyb-token')})
    if(res.code!==200) return 
    userInfo.value = res.data
    if(['试用','正式','永续'].includes(res.data.status)){
        hasRight.value = true
        LOADING = Toast.loading({
            message: "正在加载PDF",
            duration: 0,
            forbidClick: true,
        });
        pdfSrc.value = route.query.pdfSrc ||''
        if(!pdfSrc.value.length){
            hintText.value = '获取PDF失败'
        }
    }else{
        LOADING&&LOADING.clear()
        hasRight.value = false
    }
}

const handleGoApply = ()=>{
    if(userInfo.value.is_bind===0){
        Dialog.confirm({
            title:'温馨提示',
            message:'为了优化您的用户体验，\n 请登录后查看更多信息！',
            confirmButtonText:'去登录',
            confirmButtonColor:'#E6B77D',
            cancelButtonColor:'#666'
        }).then(res=>{
            wx.miniProgram.reLaunch({url:'/pages/login'})
        })
        return
    }
    wx.miniProgram.redirectTo({
        url:"/pages-applyPermission/applyPermission?source=4&from_page=PDF报告"
    })
}

onMounted(()=>{
    checkRight()
})
</script>

<template>
    <div class="preview-pdf-wrap">
        <!-- 无权限 -->
        <div class="no-auth-box" v-if="!hasRight">
            <img class="img" src="https://hzstatic.hzinsights.com/static/icon/hzyb/activity_no_auth.png" mode="widthFix" />
            <div class="apply-box">
                <div>您暂无权限查看报告，若想查看请申请开通</div>
                <div class="btn" @click="handleGoApply">立即申请</div>
            </div>
        </div>
        <template v-else-if="pdfSrc.length">
            <vue-pdf-embed :source="pdfSrc" @loading-failed="loadingFailed" @loaded="loadedPDF"/>
            <p v-if="showHint" class="hint">加载pdf失败</p>
        </template>
        <template v-else>
            <p class="hint">{{hintText}}</p>
        </template>
    </div>
</template>

<style lang="scss" scoped>
.preview-pdf-wrap{
    .hint{
        margin-top:100px;
        text-align:center;
        color:#999;
    }
    .no-auth-box{
        text-align: center;
        font-size: 32px;
        color: #E3B377;
        img{
            width: 100%;
            margin-bottom: 50px;
        }
        .btn{
            width: 90%;
            margin-left: auto;
            margin-right: auto;
            line-height: 80px;
            background-color: #E6B77D;
            border-radius: 4px;
            color: #fff;
            margin-top: 100px;
            display: block;
        }
    }
}
</style>