<template>
  <view class="px-28 flex gap-18">
    <volunteer-banner-item :title="mainEntry.title" :desc="mainEntry.desc" desc-bg-color="#A8F496"
      bg-src="/volunteer/index/banner_rate.png" class="flex-1" custom-class="h-342" @click="goRateCalc" />
    <view class="flex-1 flex flex-col justify-between">
      <volunteer-banner-item :title="secondaryEntry.title" :desc="secondaryEntry.desc" desc-bg-color="#F8ECA6"
        bg-src="/volunteer/index/banner_skill.png" custom-class="h-162" @click="goSkillCalc" />
      <volunteer-banner-item title="志愿表" desc="我的报考意向" desc-bg-color="#DDD6FF" bg-src="/volunteer/index/banner_list.png"
        custom-class="h-162" @click="goVoluntaryList" />
    </view>
  </view>
</template>

<script setup lang="ts">
import VolunteerBannerItem from "@/pagesMain/pages/volunteer/components/volunteer-banner-item.vue";
import { useTransferPage } from "@/hooks/useTransferPage";
import { routes } from "@/common/routes";
import { useUserStore } from "@/store/userStore";

const { transferTo } = useTransferPage()
const userStore = useUserStore()

const mainEntry = computed(() => userStore.isVHS ? {
  title: '填志愿',
  desc: '大数据分析+智能算法'
} : {
  title: '测录取概率',
  desc: '院校录取风险评估'
})

const secondaryEntry = computed(() => userStore.isVHS ? {
  title: '查位次',
  desc: '查历年等效分'
} : {
  title: '测技能分',
  desc: '精准定位'
})

const goRateCalc = async () => {
  transferTo(userStore.isVHS ? routes.VHSIndex : routes.voluntaryIndex)
}
const goSkillCalc = async () => {
  if (userStore.isVHS) {
    const isLogin = await userStore.checkLogin();
    if (isLogin) {
      transferTo(routes.pageRanking)
    }
  } else {
    transferTo(routes.skillIndex)
  }
}
const goVoluntaryList = async () => {
  const isLogin = await userStore.checkLogin();
  if (isLogin) {
    transferTo(userStore.isVHS ? routes.VHSList : routes.voluntaryList)
  }
}
</script>

<style scoped></style>