simulation-analysis.vue 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. <template>
  2. <ie-page bg-color="#F6F8FA">
  3. <ie-navbar title="考试分析" transparent bg-color="#FFFFFF" title-color="black" :keep-title-color="true" />
  4. <view class="relative">
  5. <ie-image :is-oss="true" src="/study-bg11.png" custom-class="w-full h-[545rpx] absolute top-0 left-0 z-0" />
  6. <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'}`" />
  7. <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'}`" />
  8. <view v-if="examineeData" :class="`relative z-3 pb-20 mx-30 ${appStore.isH5 ? 'pt-244' : 'pt-314'}`">
  9. <view class="bg-white rounded-15 px-20 pb-1">
  10. <rate-chart :value="rightRate" />
  11. <view class="h-1 bg-[#E6E6E6] my-20"></view>
  12. <view>
  13. <view class="my-20 flex items-center justify-between text-24">
  14. <ie-image src="/pagesStudy/static/image/icon-house.png" custom-class="w-24 h-24" mode="aspectFill" />
  15. <text class="ml-10 text-fore-light flex-1">考试院校</text>
  16. <text class="text-fore-title">{{ examineeData.collegeName }}-{{ examineeData.majorName }}</text>
  17. </view>
  18. <view class="my-20 flex items-center justify-between text-24">
  19. <ie-image src="/pagesStudy/static/image/icon-group.png" custom-class="w-24 h-24" mode="aspectFill" />
  20. <text class="ml-10 text-fore-light flex-1">考试科目</text>
  21. <text class="text-fore-title">{{ examineeData.subjectName }}</text>
  22. </view>
  23. <view class="my-20 flex items-center justify-between text-24">
  24. <ie-image src="/pagesStudy/static/image/icon-clock.png" custom-class="w-24 h-24" mode="aspectFill" />
  25. <text class="ml-10 text-fore-light flex-1">考试时长</text>
  26. <text class="text-fore-title">{{ formatTime(examineeData.duration) }}</text>
  27. </view>
  28. </view>
  29. </view>
  30. <exam-stat :data="examineeData" :show-stats="true" @detail="handleDetail" />
  31. <score-stat :data="examineeData" />
  32. </view>
  33. </view>
  34. </ie-page>
  35. </template>
  36. <script lang="ts" setup>
  37. import RateChart from './components/rate-chart.vue';
  38. import ExamStat from './components/exam-stat.vue';
  39. import ScoreStat from './components/score-stat.vue';
  40. import { getExamineeResult } from '@/api/modules/study';
  41. import { useTransferPage } from '@/hooks/useTransferPage';
  42. import { useAppStore } from '@/store/appStore';
  43. import { Study, Transfer } from '@/types';
  44. import { EnumPaperType, EnumQuestionType } from '@/common/enum';
  45. const appStore = useAppStore();
  46. const { prevData, transferTo } = useTransferPage<Transfer.SimulationAnalysisPageOptions, Transfer.ExamAnalysisPageOptions>();
  47. const examineeData = ref<Study.Examinee>();
  48. const titleMap = {
  49. [EnumPaperType.PRACTICE]: '知识点练习',
  50. [EnumPaperType.SIMULATED]: '模拟考试',
  51. [EnumPaperType.TEST]: '组卷作业',
  52. }
  53. const readonlyTitleMap = {
  54. [EnumPaperType.PRACTICE]: '练习解析',
  55. [EnumPaperType.SIMULATED]: '考试解析',
  56. [EnumPaperType.TEST]: '作业解析',
  57. }
  58. const paperName = computed(() => {
  59. return titleMap[prevData.value.paperType as keyof typeof titleMap] + '-' + examineeData.value?.subjectName;
  60. });
  61. const rightRate = computed(() => {
  62. const { totalCount = 0, wrongCount = 0 } = examineeData.value || {};
  63. return Math.max(Math.round((totalCount - wrongCount) / totalCount * 100), 1);
  64. });
  65. const formatTime = (time: number) => {
  66. if (!time) {
  67. return '';
  68. }
  69. const hours = Math.floor(time / 3600);
  70. const minutes = Math.floor((time % 3600) / 60);
  71. const seconds = time % 60;
  72. if (hours >= 1) {
  73. return `${hours}时${minutes}分${seconds}秒`;
  74. } else {
  75. return `${minutes}分${seconds}秒`;
  76. }
  77. };
  78. const handleDetail = (item: Study.Question) => {
  79. if (!examineeData.value) {
  80. return;
  81. }
  82. transferTo('/pagesStudy/pages/exam-start/exam-start', {
  83. data: {
  84. name: paperName.value,
  85. readonly: true,
  86. questionId: item.id,
  87. paperType: prevData.value.paperType,
  88. simulationInfo: {
  89. examineeId: examineeData.value.examineeId
  90. }
  91. }
  92. });
  93. };
  94. const loadData = async () => {
  95. uni.$ie.showLoading();
  96. const res = await getExamineeResult(prevData.value.examineeId);
  97. examineeData.value = res.data;
  98. uni.$ie.hideLoading();
  99. };
  100. onLoad(() => {
  101. loadData();
  102. });
  103. onPageScroll(() => { })
  104. </script>
  105. <style lang="scss" scoped></style>