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

<template>
  <ie-page bg-color="#F6F8FA">
    <ie-navbar title="考试分析" transparent bg-color="#FFFFFF" title-color="black" :keep-title-color="true" />
    <view class="relative">
      <ie-image :is-oss="true" src="/study-bg11.png" custom-class="w-full h-[545rpx] absolute top-0 left-0 z-0" />
      <ie-image :is-oss="true" src="/study-bg12.png" :custom-class="`w-308 h-302 absolute right-14 z-1 ${appStore.isH5 ? 'top-57' : 'top-127'}`" />
      <ie-image :is-oss="true" src="/study-title4.png" :custom-class="`w-282 h-64 absolute left-72 z-2 ${appStore.isH5 ? 'top-126' : 'top-196'}`" />
      <view v-if="examineeData" :class="`relative z-3 pb-20 mx-30 ${appStore.isH5 ? 'pt-244' : 'pt-314'}`">
        <view class="bg-white rounded-15 px-20 pb-1">
          <rate-chart :value="rightRate" />
          <view class="h-1 bg-[#E6E6E6] my-20"></view>
          <view>
            <template v-if="!userStore.isVHS">
              <view class="my-20 flex items-center justify-between text-24">
                <ie-image src="/pagesStudy/static/image/icon-house.png" custom-class="w-24 h-24" mode="aspectFill" />
                <text class="ml-10 text-fore-light flex-1">考试院校</text>
                <text class="text-fore-title">{{ examineeData.collegeName }}-{{ examineeData.majorName }}</text>
              </view>
              <view class="my-20 flex items-center justify-between text-24">
                <ie-image src="/pagesStudy/static/image/icon-group.png" custom-class="w-24 h-24" mode="aspectFill" />
                <text class="ml-10 text-fore-light flex-1">考试科目</text>
                <text class="text-fore-title">{{ examineeData.subjectName }}</text>
              </view>
            </template>
            <view class="my-20 flex items-center justify-between text-24">
              <ie-image src="/pagesStudy/static/image/icon-clock.png" custom-class="w-24 h-24" mode="aspectFill" />
              <text class="ml-10 text-fore-light flex-1">考试时长</text>
              <text class="text-fore-title">{{ formatTime(examineeData.duration) }}</text>
            </view>
          </view>
        </view>
        <exam-stat :data="examineeData" :show-stats="true" @detail="handleDetail" />
        <score-stat :data="examineeData" />
      </view>
    </view>
  </ie-page>
</template>

<script lang="ts" setup>
import RateChart from './components/rate-chart.vue';
import ExamStat from './components/exam-stat.vue';
import ScoreStat from './components/score-stat.vue';
import { getExamineeResult } from '@/api/modules/study';
import { useTransferPage } from '@/hooks/useTransferPage';
import { useUserStore } from '@/store/userStore';
import { useAppStore } from '@/store/appStore';
import { Study, Transfer } from '@/types';
import { EnumPaperType, EnumQuestionType } from '@/common/enum';

const appStore = useAppStore();
const { prevData, transferTo } = useTransferPage<Transfer.SimulationAnalysisPageOptions, Transfer.ExamAnalysisPageOptions>();
const examineeData = ref<Study.Examinee>();
const userStore = useUserStore();

const paperName = computed(() => {
  if (userStore.isVHS) {
    return examineeData.value?.name || examineeData.value?.subjectName || '';
  } else {
    return examineeData.value?.name || examineeData.value?.subjectName || '';
  }
});
const rightRate = computed(() => {
  const { totalCount = 0, wrongCount = 0 } = examineeData.value || {};
  return Math.max(Math.round((totalCount - wrongCount) / totalCount * 100), 1);
});

const formatTime = (time: number) => {
  if (!time) {
    return '';
  }
  const hours = Math.floor(time / 3600);
  const minutes = Math.floor((time % 3600) / 60);
  const seconds = time % 60;

  if (hours >= 1) {
    return `${hours}时${minutes}分${seconds}秒`;
  } else {
    return `${minutes}分${seconds}秒`;
  }
};
const handleDetail = (item: Study.Question) => {
  if (!examineeData.value) {
    return;
  }
  const pageOptions: Transfer.ExamAnalysisPageOptions = {
    readonly: true,
    questionId: item.id,
    paperType: prevData.value.paperType,
    simulationInfo: {
      name: paperName.value,
      examineeId: examineeData.value.examineeId
    }
  }
  transferTo('/pagesStudy/pages/exam-start/exam-start', {
    data: pageOptions,
  });
};
const loadData = async () => {
  uni.$ie.showLoading();
  const res = await getExamineeResult(prevData.value.examineeId);
  examineeData.value = res.data;
  uni.$ie.hideLoading();
};
onLoad(() => {
  loadData();
});
onPageScroll(() => { })
</script>

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