ieplus-app/src/pagesStudy/pages/knowledge-practice-detail/knowledge-practice-detail.vue

<template>
  <ie-page bg-color="#F6F8FA" :fix-height="true">
    <ie-navbar :title="pageTitle" />
    <view v-if="examineeData" class="relative z-3 pt-30 pb-20 mx-30">
      <view class="bg-white rounded-15 px-20 pb-1">
        <rate-chart :value="rightRate" />
        <view class="h-1 bg-[#E6E6E6] my-20"></view>
        <view>
          <view v-if="prevData.directed" 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">{{ prevData.name || '-' }}</text>
          </view>
          <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="false" @detail="handleQuestionDetail" />
    </view>
    <ie-safe-toolbar :height="84" :shadow="false">
      <view class="h-[84px] px-46 bg-white flex items-center justify-between gap-x-40">
        <view class="text-30 text-primary bg-back flex-1 py-22 rounded-full text-center" @click="handleStartPractice">
          继续刷题
        </view>
        <view class="text-30 text-white bg-primary flex-1 py-22 rounded-full text-center" @click="handleViewAnalysis">
          查看解析
        </view>
      </view>
    </ie-safe-toolbar>
  </ie-page>
</template>
<script lang="ts" setup>
import RateChart from '@/pagesStudy/pages/simulation-analysis/components/rate-chart.vue';
import ExamStat from '@/pagesStudy/pages/simulation-analysis/components/exam-stat.vue';
import { useTransferPage } from '@/hooks/useTransferPage';
import { Study, Transfer } from '@/types';
import { getExamineeResult } from '@/api/modules/study';
import { EnumPaperType } from '@/common/enum';
const { prevData, transferTo } = useTransferPage<Transfer.PracticeResultPageOptions, Transfer.ExamAnalysisPageOptions>();


const rightRate = computed(() => {
  const { totalCount = 0, wrongCount = 0 } = examineeData.value || {};
  const rate = (totalCount - wrongCount) / totalCount * 100;
  return Number(rate.toFixed(1));
});
const paperName = computed(() => {
  return '知识点练习-' + prevData.value.name;
});
const examineeData = ref<Study.Examinee>();
const pageTitle = computed(() => {
  return '练习结果';
});
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 handleQuestionDetail = (item: Study.Question) => {
  console.log(item, examineeData)
  if (!examineeData.value) {
    return;
  }
  transferTo('/pagesStudy/pages/exam-start/exam-start', {
    data: {
      name: paperName.value,
      paperType: prevData.value.paperType || EnumPaperType.PRACTICE,
      readonly: true,
      questionId: item.id,
      practiceInfo: {
        name: prevData.value.name,
        relateId: examineeData.value.knowledgeId,
        directed: prevData.value.directed,
        examineeId: examineeData.value.examineeId
      },
    }
  });
}
const handleStartPractice = () => {
  const { knowledgeId } = examineeData.value || {};
  if (!knowledgeId) {
    console.error('knowledgeId is null');
    return;
  }
  transferTo('/pagesStudy/pages/exam-start/exam-start', {
    data: {
      name: paperName.value,
      paperType: prevData.value.paperType || EnumPaperType.PRACTICE,
      practiceInfo: {
        name: prevData.value.name,
        relateId: knowledgeId,
        directed: prevData.value.directed
      },
    }
  });
}
const handleViewAnalysis = () => {
  if (!examineeData.value) {
    return;
  }
  transferTo('/pagesStudy/pages/exam-start/exam-start', {
    data: {
      name: paperName.value,
      paperType: EnumPaperType.PRACTICE,
      readonly: true,
      practiceInfo: {
        name: prevData.value.name,
        relateId: examineeData.value.knowledgeId,
        directed: prevData.value.directed,
        examineeId: examineeData.value.examineeId
      },
    }
  });
}
const loadData = async () => {
  uni.$ie.showLoading();
  try {
    const res = await getExamineeResult(prevData.value.examineeId);
    examineeData.value = res.data;
  } finally {
    uni.$ie.hideLoading();
  }
}
onLoad(() => {
  loadData();
});
</script>
<style lang="scss" scoped></style>