<template>
  <view class="mx-30 mt-40">
    <ie-image :is-oss="true" src="/banner/index-banner-3.png" :rounded="10" customClass="w-full h-264"
      mode="widthFix" />
    <view class="mt-32 flex gap-x-30">
      <view class="flex-1 rounded-12 bg-[#F0FFF2] py-40 pl-22 pr-8 flex items-center"
        @click="navigateTo('/pagesStudy/pages/study-plan/study-plan')">
        <!-- /pagesStudy/pages/study-plan-edit/study-plan-edit -->
        <view class="flex-1">
          <view class="text-30 text-fore-title font-bold flex items-center">
            <text class="mr-2">定制学习计划</text>
            <uv-icon name="arrow-right" size="12" color="#808080" />
          </view>
          <view class="mt-4 text-24 text-fore-tip">提升学习效率</view>
        </view>
        <ie-image :is-oss="true" src="/study-bg3.png" customClass="w-92 h-92" />
      </view>
      <view class="flex-1 rounded-12 bg-[#FFF6F0] py-40 pl-22 pr-8 flex items-center">
        <view class="flex-1">
          <view class="text-30 text-fore-title font-bold flex items-center">
            <text class="mr-2">学情报告</text>
            <uv-icon name="arrow-right" size="12" color="#808080" />
          </view>
          <view class="mt-4 text-24 text-fore-tip">可视化学习成果</view>
        </view>
        <ie-image :is-oss="true" src="/study-bg4.png" customClass="w-92 h-92" />
      </view>
    </view>
  </view>
</template>
<script lang="ts" setup>
import { useTransferPage } from '@/hooks/useTransferPage';
const { transferTo } = useTransferPage();
const navigateTo = (pageUrl: string) => {
  transferTo(pageUrl);
}
</script>
<style lang="scss" scoped></style>