index-banner.vue 1.6 KB

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