|
@@ -1,13 +1,11 @@
|
|
|
import {
|
|
|
ActionSheet,
|
|
|
Button,
|
|
|
- Cell,
|
|
|
- Grid,
|
|
|
- GridItem,
|
|
|
Image,
|
|
|
Popup,
|
|
|
Swipe,
|
|
|
- SwipeItem
|
|
|
+ SwipeItem,
|
|
|
+ showLoadingToast
|
|
|
} from 'vant';
|
|
|
import {
|
|
|
computed,
|
|
@@ -21,7 +19,6 @@ import {
|
|
|
import { useRoute, useRouter } from 'vue-router';
|
|
|
import styles from './index.module.less';
|
|
|
import iconButtonList from '../images/icon-button-list.png';
|
|
|
-import { state as baseState } from '@/state';
|
|
|
import MSticky from '@/components/m-sticky';
|
|
|
import ChoiceQuestion from '../model/choice-question';
|
|
|
import AnswerList from '../model/answer-list';
|
|
@@ -34,7 +31,7 @@ import ResultFinish from '../model/result-finish';
|
|
|
import { eventUnit, QuestionType } from '../unit';
|
|
|
import request from '@/helpers/request';
|
|
|
import { useRect } from '@vant/use';
|
|
|
-import OHeader from '@/components/m-header';
|
|
|
+import MHeader from '@/components/m-header';
|
|
|
import { useEventListener, useInterval, useWindowScroll } from '@vueuse/core';
|
|
|
|
|
|
export default defineComponent({
|
|
@@ -49,14 +46,21 @@ export default defineComponent({
|
|
|
color: '#fff',
|
|
|
visiableError: false,
|
|
|
visiableAnswer: false,
|
|
|
- visiableResult: false,
|
|
|
+ visiableResult: true,
|
|
|
id: route.query.id,
|
|
|
currentIndex: 0,
|
|
|
questionList: [],
|
|
|
visiableSure: false,
|
|
|
- resultInfo: {} as any,
|
|
|
- resultStatusType: 'SUCCESS', // 'SUCCESS' | 'FAIL'
|
|
|
- visiableExam: false, // 考试已结束
|
|
|
+ visiableInfo: {
|
|
|
+ show: false,
|
|
|
+ operationType: 'RESULT' as 'RESULT' | 'BACK' | 'CONTINUE',
|
|
|
+ type: 'DEFAULT' as 'DEFAULT' | 'FAIL' | 'PASS' | 'GOOD' | 'COUNTDOWN',
|
|
|
+ content: '',
|
|
|
+ showCancelButton: false,
|
|
|
+ confirmButtonText: '',
|
|
|
+ cancelButtonText: '',
|
|
|
+ title: ''
|
|
|
+ },
|
|
|
nextStatus: false,
|
|
|
swipeHeight: 'auto' as any,
|
|
|
answerAnalysis: '',
|
|
@@ -67,9 +71,7 @@ export default defineComponent({
|
|
|
errorLength: 0, // 错题数
|
|
|
rate: 0 // 正确率
|
|
|
},
|
|
|
- quitStatus: false,
|
|
|
- dialogMessage: '',
|
|
|
- dialogStatus: false
|
|
|
+ quitStatus: false
|
|
|
});
|
|
|
|
|
|
// 计时
|
|
@@ -90,14 +92,12 @@ export default defineComponent({
|
|
|
item.showAnalysis = false; // 默认不显示解析
|
|
|
item.analysis = {
|
|
|
message: item.answerAnalysis,
|
|
|
- topic: true, // 是否显示结果
|
|
|
+ topic: false, // 是否显示结果
|
|
|
userResult: false // 用户答题对错
|
|
|
};
|
|
|
item.userAnswer = []; // 用户答题
|
|
|
});
|
|
|
state.questionList = temp.examinationQuestionAdds || [];
|
|
|
-
|
|
|
- console.log(state.questionList);
|
|
|
} catch {
|
|
|
//
|
|
|
}
|
|
@@ -142,7 +142,15 @@ export default defineComponent({
|
|
|
// 判断是否是最后一题
|
|
|
if (state.questionList.length === state.currentIndex + 1) {
|
|
|
eventUnit.emit('unitAudioStop');
|
|
|
- state.visiableSure = true;
|
|
|
+ // state.visiableSure = true;
|
|
|
+ state.visiableInfo.show = true;
|
|
|
+ state.visiableInfo.title = '练习完成';
|
|
|
+ state.visiableInfo.showCancelButton = true;
|
|
|
+ state.visiableInfo.operationType = 'CONTINUE';
|
|
|
+ state.visiableInfo.cancelButtonText = '再等等';
|
|
|
+ state.visiableInfo.confirmButtonText = '确认完成';
|
|
|
+ state.visiableInfo.content = `确认本次练习的题目都完成了吗?`;
|
|
|
+
|
|
|
return;
|
|
|
}
|
|
|
|
|
@@ -221,6 +229,41 @@ export default defineComponent({
|
|
|
};
|
|
|
|
|
|
const onConfirmExam = () => {
|
|
|
+ if (state.visiableInfo.operationType === 'RESULT') {
|
|
|
+ onResultPopup();
|
|
|
+ } else if (state.visiableInfo.operationType === 'BACK') {
|
|
|
+ } else if (state.visiableInfo.operationType === 'CONTINUE') {
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ const onCloseResult = async () => {
|
|
|
+ // state.questionList = [];
|
|
|
+ // await getExamDetails();
|
|
|
+ // setTimeout(async () => {
|
|
|
+ // swipeRef.value?.swipeTo(0, {
|
|
|
+ // immediate: true
|
|
|
+ // });
|
|
|
+ // state.swipeHeight = 'auto';
|
|
|
+ // state.answerAnalysis = '';
|
|
|
+ // state.overResult = {
|
|
|
+ // time: '00:00', // 时长
|
|
|
+ // questionLength: 0, // 答题数
|
|
|
+ // errorLength: 0, // 错题数
|
|
|
+ // rate: 0 // 正确率
|
|
|
+ // };
|
|
|
+ // state.visiableResult = false;
|
|
|
+ // // 恢复计时
|
|
|
+ // resume();
|
|
|
+ // resizeSwipeItemHeight();
|
|
|
+ // }, 100);
|
|
|
+ if (state.visiableInfo.operationType === 'RESULT') {
|
|
|
+ } else if (state.visiableInfo.operationType === 'BACK') {
|
|
|
+ } else if (state.visiableInfo.operationType === 'CONTINUE') {
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ /** 结果页面弹窗 */
|
|
|
+ const onResultPopup = () => {
|
|
|
const answerResult = getAnswerResult.value;
|
|
|
let rate = 0;
|
|
|
|
|
@@ -243,30 +286,19 @@ export default defineComponent({
|
|
|
// 重置计时
|
|
|
pause();
|
|
|
counter.value = 0;
|
|
|
- state.visiableResult = true;
|
|
|
- };
|
|
|
|
|
|
- // 重新练习
|
|
|
- const onCloseResult = async () => {
|
|
|
- state.questionList = [];
|
|
|
- await getExamDetails();
|
|
|
- setTimeout(async () => {
|
|
|
- swipeRef.value?.swipeTo(0, {
|
|
|
- immediate: true
|
|
|
- });
|
|
|
- state.swipeHeight = 'auto';
|
|
|
- state.answerAnalysis = '';
|
|
|
- state.overResult = {
|
|
|
- time: '00:00', // 时长
|
|
|
- questionLength: 0, // 答题数
|
|
|
- errorLength: 0, // 错题数
|
|
|
- rate: 0 // 正确率
|
|
|
- };
|
|
|
- state.visiableResult = false;
|
|
|
- // 恢复计时
|
|
|
- resume();
|
|
|
- resizeSwipeItemHeight();
|
|
|
- }, 100);
|
|
|
+ // 60 及格
|
|
|
+ // 85 及以上优秀
|
|
|
+ state.visiableInfo.show = true;
|
|
|
+ state.visiableInfo.title = '已完成';
|
|
|
+ state.visiableInfo.showCancelButton = false;
|
|
|
+ state.visiableInfo.operationType = 'RESULT';
|
|
|
+ state.visiableInfo.confirmButtonText = '确认';
|
|
|
+ state.visiableInfo.content = `<div>您已完成本次测试,答对<span class='${
|
|
|
+ styles.right
|
|
|
+ }'>${answerResult.passCount}</span>,答错<span class='${styles.error}'>${
|
|
|
+ answerResult.count - answerResult.passCount
|
|
|
+ }</span>,正确率${rate}%~</div>`;
|
|
|
};
|
|
|
|
|
|
// 下一个考点
|
|
@@ -320,13 +352,6 @@ export default defineComponent({
|
|
|
|
|
|
resizeSwipeItemHeight();
|
|
|
|
|
|
- if (!baseState.user.data.vipMember) {
|
|
|
- pause();
|
|
|
- state.dialogStatus = true;
|
|
|
- state.dialogMessage = '您暂未开通团练宝,请开通后使用';
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
// window.history.pushState(null, '', document.URL);
|
|
|
// window.addEventListener('popstate', onBack, false);
|
|
|
});
|
|
@@ -338,7 +363,7 @@ export default defineComponent({
|
|
|
return () => (
|
|
|
<div class={styles.unitDetail}>
|
|
|
<MSticky position="top">
|
|
|
- <OHeader
|
|
|
+ <MHeader
|
|
|
border={false}
|
|
|
background={state.background}
|
|
|
color={state.color}
|
|
@@ -528,7 +553,7 @@ export default defineComponent({
|
|
|
safeAreaInsetBottom>
|
|
|
<AnswerList
|
|
|
value={state.questionList}
|
|
|
- lookType={'PRACTICE'}
|
|
|
+ lookType={'ANSWER'}
|
|
|
onSelect={(item: any) => {
|
|
|
// 跳转,并且跳过动画
|
|
|
swipeRef.value?.swipeTo(item, {
|
|
@@ -556,56 +581,24 @@ export default defineComponent({
|
|
|
</Popup>
|
|
|
|
|
|
<Popup
|
|
|
- v-model:show={state.visiableResult}
|
|
|
+ v-model:show={state.visiableInfo.show}
|
|
|
closeOnClickOverlay={false}
|
|
|
- style={{ background: 'transparent', width: '96%' }}>
|
|
|
+ style={{
|
|
|
+ background: 'transparent',
|
|
|
+ width: '100%',
|
|
|
+ maxWidth: '100%',
|
|
|
+ transform: 'translateY(-55%)'
|
|
|
+ }}>
|
|
|
<ResultFinish
|
|
|
- status="PRACTICE"
|
|
|
- confirmButtonText="下一个考点"
|
|
|
- cancelButtonText="继续练习本考点"
|
|
|
- onClose={onCloseResult}
|
|
|
+ title={state.visiableInfo.title}
|
|
|
+ showCancelButton={state.visiableInfo.showCancelButton}
|
|
|
+ cancelButtonText={state.visiableInfo.cancelButtonText}
|
|
|
+ confirmButtonText={state.visiableInfo.confirmButtonText}
|
|
|
+ status={state.visiableInfo.type}
|
|
|
+ content={state.visiableInfo.content}
|
|
|
+ contentHtml
|
|
|
onConform={onConfirmResult}
|
|
|
- v-slots={{
|
|
|
- content: () => (
|
|
|
- <div class={styles.practiceResult}>
|
|
|
- <div class={styles.practiceTitle}>本次练习正确率</div>
|
|
|
- <div class={styles.practiceRate}>
|
|
|
- {state.overResult.rate}%
|
|
|
- </div>
|
|
|
- <Grid border={false} columnNum={3}>
|
|
|
- <GridItem>
|
|
|
- <p class={styles.title}>{state.overResult.time}</p>
|
|
|
- <p class={styles.name}>练习时长</p>
|
|
|
- </GridItem>
|
|
|
- <GridItem>
|
|
|
- <p class={[styles.title]}>
|
|
|
- {state.overResult.questionLength | 0}
|
|
|
- </p>
|
|
|
- <p class={styles.name}>答题数</p>
|
|
|
- </GridItem>
|
|
|
- <GridItem>
|
|
|
- <p class={styles.title}>
|
|
|
- {state.overResult.errorLength | 0}
|
|
|
- </p>
|
|
|
- <p class={styles.name}>错题数</p>
|
|
|
- </GridItem>
|
|
|
- </Grid>
|
|
|
- {state.overResult.rate >= 100 ? (
|
|
|
- <div class={styles.practiceTips}>
|
|
|
- 你真棒!
|
|
|
- <br />
|
|
|
- 本知识点你已经完全掌握啦!
|
|
|
- </div>
|
|
|
- ) : (
|
|
|
- <div class={styles.practiceTips}>
|
|
|
- 继续努力!
|
|
|
- <br />
|
|
|
- 争取在测验中获得高分!
|
|
|
- </div>
|
|
|
- )}
|
|
|
- </div>
|
|
|
- )
|
|
|
- }}
|
|
|
+ onClose={onCloseResult}
|
|
|
/>
|
|
|
</Popup>
|
|
|
|
|
@@ -633,20 +626,6 @@ export default defineComponent({
|
|
|
confirmButtonText="确认退出"
|
|
|
onConfirm={onAfter}
|
|
|
/>
|
|
|
-
|
|
|
- <ODialog
|
|
|
- message={state.dialogMessage}
|
|
|
- v-model:show={state.dialogStatus}
|
|
|
- showCancelButton
|
|
|
- cancelButtonText="返回"
|
|
|
- onCancel={() => {
|
|
|
- router.back();
|
|
|
- }}
|
|
|
- confirmButtonText="立即开通"
|
|
|
- onConfirm={() => {
|
|
|
- router.push('/memberCenter');
|
|
|
- }}
|
|
|
- />
|
|
|
</div>
|
|
|
);
|
|
|
}
|