<template>
  <view>
    <view v-if="!isVHS" class="mx-30 mt-20 flex items-center bg-[#E3F4FA] rounded-8 py-16 px-16 gap-x-40">
      <view class="text-24 text-[#34B0D7] flex-1">
        <text v-if="!hasDirectedSchool">你还未开启定向学习，快来设置吧！</text>
        <view v-else class="flex items-center">
          <text class="flex-shrink-0">定向：</text>
          <text class="min-w-1 ellipsis-1">{{ firstDirectedSchool.universityName }}</text>
          <uv-icon name="arrow-right" size="14" color="#0DACF5"></uv-icon>
          <text class="flex-shrink-0">{{ firstDirectedSchool.majorName }}</text>
        </view>
      </view>
      <view class="text-24 text-white bg-gradient-to-r from-[#26C5F7] to-[#0DACF5] rounded-full px-18 py-6"
        @click="handleSetting">{{ hasDirectedSchool ? '已开启' : '去开启' }}</view>
    </view>
    <view class="mx-30 mt-20">
      <view class="grid grid-cols-2 items-center gap-x-28">
        <template v-if="isVHS">
          <view class="bg-gradient-to-r from-[#0088FE] to-[#31A0FC] flex-1 rounded-15 relative overflow-hidden">
            <view class="mt-30 p-30 z-1 relative">
              <view class="text-30 text-white font-bold">知识点练习</view>
              <view class="mt-8 text-24 text-white">考点专攻，精准提分</view>
              <view class="mt-32 w-200 h-56 flex items-center justify-center rounded-full text-26 text-primary bg-white"
                @click="handlePracticeKnowledge">
                开始练习
              </view>
            </view>
            <ie-image :is-oss="true" src="/study-bg13.png" custom-class="absolute bottom-0 left-0 w-full h-full z-0"
              mode="aspectFill" />
          </view>
          <!-- <view class="bg-gradient-to-r from-[#32B5FD] to-[#79DCFD] flex-1 rounded-15 relative overflow-hidden">
            <view class="mt-30 p-30 z-1 relative">
              <view class="text-30 text-white font-bold">必刷题</view>
              <view class="mt-8 text-24 text-white">高频考题，一网打尽</view>
              <view class="mt-32 w-200 h-56 flex items-center justify-center rounded-full text-26 text-primary bg-white"
                @click="handlePracticeMustDo">
                开始练习
              </view>
            </view>
            <ie-image :is-oss="true" src="/study-bg13.png" custom-class="absolute bottom-0 left-0 w-full h-full z-0"
              mode="aspectFill" />
          </view> -->
        </template>
        <template v-else>
          <view class="bg-gradient-to-r from-[#0088FE] to-[#31A0FC] flex-1 rounded-15 relative overflow-hidden">
            <view class="mt-30 p-30 z-1 relative">
              <view class="text-30 text-white font-bold">全量刷题</view>
              <view class="mt-8 text-24 text-white">全面刷题，高效备考</view>
              <view class="mt-32 w-200 h-56 flex items-center justify-center rounded-full text-26 text-primary bg-white"
                @click="handlePracticeAll">
                开始练习
              </view>
            </view>
            <ie-image :is-oss="true" src="/study-bg13.png" custom-class="absolute bottom-0 left-0 w-full h-full z-0"
              mode="aspectFill" />
          </view>
          <view class="bg-gradient-to-r from-[#32B5FD] to-[#79DCFD] flex-1 rounded-15 relative overflow-hidden">
            <view class="mt-30 p-30 z-1 relative">
              <view class="text-30 text-white font-bold">定向刷题</view>
              <view class="mt-8 text-24 text-white">紧扣考纲，精准练习</view>
              <view class="mt-32 w-200 h-56 flex items-center justify-center rounded-full text-26 text-primary bg-white"
                @click="handlePracticeDirected">
                开始练习
              </view>
            </view>
            <ie-image :is-oss="true" src="/study-bg13.png" custom-class="absolute bottom-0 left-0 w-full h-full z-0"
              mode="aspectFill" />
          </view>
        </template>
      </view>
    </view>
  </view>
</template>
<script lang="ts" setup>
import { useTransferPage } from '@/hooks/useTransferPage';
import { useUserStore } from '@/store/userStore';
const { transferTo } = useTransferPage();
const userStore = useUserStore();

const { hasDirectedSchool, directedSchoolList, getExamType, isVHS } = storeToRefs(userStore);
const firstDirectedSchool = computed(() => directedSchoolList.value[0] || {});

const handlePracticeDirected = async () => {
  if (!hasDirectedSchool.value) {
    addTarget();
    return;
  }
  const notice = firstDirectedSchool.value.notice;
  if (notice) {
    await uni.$ie.showModal({
      title: '提示',
      content: notice,
      showCancel: false,
      confirmText: '知道了'
    });
  } else {
    transferTo('/pagesStudy/pages/knowledge-practice/knowledge-practice', {
      data: {
        isVHS: false,
        directed: true
      }
    });
  }
}

const handlePracticeAll = () => {
  transferTo('/pagesStudy/pages/knowledge-practice/knowledge-practice', {
    data: {
      isVHS: false,
      directed: false
    }
  });
}

const handlePracticeKnowledge = () => {
  transferTo('/pagesStudy/pages/knowledge-practice/knowledge-practice', {
    data: {
      isVHS: true,
      directed: false,
      questionType: 0
    }
  });
}

const handlePracticeMustDo = () => {
  transferTo('/pagesStudy/pages/knowledge-practice/knowledge-practice', {
    data: {
      isVHS: true,
      directed: false,
      questionType: 2
    }
  });
}

const handleSetting = async () => {
  if (hasDirectedSchool.value) {
    transferTo('/pagesStudy/pages/targeted-setting/targeted-setting');
  } else {
    addTarget();
  }
}
const addTarget = () => {
  transferTo('/pagesStudy/pages/targeted-add/targeted-add');
}
</script>
<style lang="scss" scoped></style>