ieplus-app/src/pagesStudy/pages/simulation-entry/simulation-entry.vue

<template>
  <ie-page bg-color="#F6F8FA">
    <ie-navbar title="" bg-color="transparent" :placeholder="false" />
    <view class="relative">
      <ie-image :is-oss="true" src="/study-bg7.png" customClass="w-full h-[544rpx] absolute top-0 left-0 z-0" />
      <ie-image :is-oss="true" src="/study-bg8.png" customClass="w-360 h-310 absolute top-49 right-33 z-1" />
      <view class="relative z-2">
        <view class="pt-126 ml-90">
          <ie-image :is-oss="true" src="/study-title3.png" customClass="w-264 h-60" />
        </view>
        <view class="mx-30 mt-64">
          <view class="p-32 bg-white rounded-15">
            <view class="text-32 text-fore-title font-bold">考试院校</view>
            <view class="mt-20 text-28 text-fore-subtitle flex items-center">
              <text>{{ prevData.universityName }}</text>
              <uv-icon name="arrow-right" size="14px" color="#1A1A1A" custom-class="mx-10"></uv-icon>
              <text>{{ prevData.majorName }}</text>
            </view>
          </view>
          <view v-for="item in subjects" :key="item.subjectId"
            class="flex items-center justify-between mt-20 p-32 bg-white rounded-15">
            <ie-image :src="item.icon" custom-class="w-86 h-72" mode="aspectFill" />
            <view class="ml-30 flex-1 min-w-1">
              <view class="text-320 text-fore-title font-bold">{{ item.subject }}</view>
              <view class="mt-6 text-24 text-fore-light">剩余模考次数<text class="ml-20 text-fore-title font-bold">{{ item.examTime }}</text></view>
            </view>
            <view class="text-24 text-white bg-primary px-20 py-14 rounded-full" @click="handleAIOutPaper(item)">智能出卷</view>
          </view>
        </view>
      </view>
    </view>
  </ie-page>
</template>

<script lang="ts" setup>
import { useTransferPage } from '@/hooks/useTransferPage';
import { getSimulationExamSubjects } from '@/api/modules/study';
import iconChinese from '@/pagesStudy/static/image/icon-chinese.png';
import iconMath from '@/pagesStudy/static/image/icon-math.png';
import iconForeign from '@/pagesStudy/static/image/icon-foreign.png';
import iconSkill from '@/pagesStudy/static/image/icon-skill.png';
import iconPhysics from '@/pagesStudy/static/image/icon-physics.png';
import iconPolitics from '@/pagesStudy/static/image/icon-politics.png';
import { Study } from '@/types';
const { transferTo, prevData } = useTransferPage();
const subjects = ref<Study.SimulationExamSubject[]>([]);

const handleAIOutPaper = (item: Study.SimulationExamSubject) => {
  if (item.examTime < 1) {
    uni.$ie.showToast('剩余模考次数不足');
    return;
  }
  transferTo('/pagesStudy/pages/simulation-start/simulation-start', {
    data: {
      subjectInfo: item,
      universityInfo: prevData.value
    }
  });
}
const getIcon = (subjectName: string) => {
  if (subjectName === '语文') {
    return iconChinese;
  } else if (subjectName === '数学') {
    return iconMath;
  } else if (subjectName === '外语' || /.语/.test(subjectName)) {
    return iconForeign;
  } else if (subjectName === '物理') {
    return iconPhysics;
  } else if (subjectName === '政治') {
    return iconPolitics;
  } else {
    return iconSkill;
  }
}
const loadData = async () => {
  const { data } = await getSimulationExamSubjects();
  subjects.value = data.map(item => {
    return {
      ...item,
      icon: getIcon(item.subject)
    }
  });
  console.log(subjects.value);
}
onShow(() => {
  loadData();
});
</script>

<style lang="scss" scoped></style>