|
|
@@ -59,7 +59,11 @@
|
|
|
:class="[
|
|
|
'item-con',
|
|
|
active_index_str === 0 + '-' + indexc ? 'active' : '',
|
|
|
- isJudgingRightWrong && !con_preview[0].user_answer[indexc].is_right ? 'error' : '',
|
|
|
+ isJudgingRightWrong &&
|
|
|
+ con_preview[0].user_answer[indexc].is_right !== '' &&
|
|
|
+ !con_preview[0].user_answer[indexc].is_right
|
|
|
+ ? 'error'
|
|
|
+ : '',
|
|
|
data.property.fun_type === 'show' ? 'item-con-in' : '',
|
|
|
]"
|
|
|
@click="
|
|
|
@@ -77,23 +81,12 @@
|
|
|
<span
|
|
|
v-for="(itemi, indexi) in itemc"
|
|
|
:key="indexi"
|
|
|
- :class="[
|
|
|
- 'items-con',
|
|
|
- active_index_str === 0 + '-' + indexc + '-' + indexi ? 'active' : '',
|
|
|
- isJudgingRightWrong &&
|
|
|
- !con_preview[0].user_answer[indexc].is_right &&
|
|
|
- con_preview[0].user_answer[indexc].select_index_submit === indexi
|
|
|
- ? 'error'
|
|
|
- : '',
|
|
|
- isJudgingRightWrong &&
|
|
|
- !con_preview[0].user_answer[indexc].is_right &&
|
|
|
- con_preview[0].user_answer[indexc].right_index === indexi
|
|
|
- ? 'right'
|
|
|
- : '',
|
|
|
- ]"
|
|
|
+ :class="['items-con', active_index_str === 0 + '-' + indexc + '-' + indexi ? 'active' : '']"
|
|
|
@click="handleSelectItemTone(0, indexc, indexi, con_preview[0].item_con_yuan[indexc][indexi])"
|
|
|
>{{ itemi }}</span
|
|
|
>
|
|
|
+ <!-- 拼音之间增加一点间隙 -->
|
|
|
+ <span v-if="indexc !== con_preview[0].item_con.length - 1" style="opacity: 0">a</span>
|
|
|
</span>
|
|
|
</template>
|
|
|
</div>
|
|
|
@@ -155,9 +148,9 @@
|
|
|
data.property.fun_type !== 'show' ||
|
|
|
(data.property.fun_type === 'show' && isEnable(data.property.is_enable_voice_answer))
|
|
|
"
|
|
|
+ :is-show-answer="isShowAnswers"
|
|
|
@showAnswerAnalysis="showAnswerAnalysis"
|
|
|
@retry="retry"
|
|
|
- :isShowAnswer="isShowAnswers"
|
|
|
/>
|
|
|
<AnswerCorrect
|
|
|
:answer-correct="data?.answer_correct"
|
|
|
@@ -170,7 +163,7 @@
|
|
|
:analysis-list="data.analysis_list"
|
|
|
@closeAnswerAnalysis="closeAnswerAnalysis"
|
|
|
>
|
|
|
- <div v-if="data.property.fun_type === 'input'" slot="right-answer" class="right-answer">
|
|
|
+ <div v-if="data.property.fun_type !== 'show'" slot="right-answer" class="right-answer">
|
|
|
<div
|
|
|
class="content-box"
|
|
|
:class="[data.property.arrange_type === 'horizontal' ? 'content-box-flex' : 'content-box-vertical']"
|
|
|
@@ -193,7 +186,7 @@
|
|
|
<!-- 拼音输入 -->
|
|
|
<template v-if="data.property.fun_type === 'input'">
|
|
|
<span
|
|
|
- v-for="(itemc, indexc) in con_preview"
|
|
|
+ v-for="(itemc, indexc) in con_preview_right"
|
|
|
:key="indexc"
|
|
|
:class="['item-con', itemc.type === 'input' ? 'right' : '']"
|
|
|
>
|
|
|
@@ -201,18 +194,95 @@
|
|
|
v-if="itemc.type === 'input'"
|
|
|
v-model="itemc.answer"
|
|
|
:disabled="true"
|
|
|
- :style="[{ width: Math.max(20, itemc.con.length * 10) + 'px' }]"
|
|
|
+ :style="[{ width: Math.max(20, itemc.answer.length * 10) + 'px' }]"
|
|
|
class="item-input"
|
|
|
/>
|
|
|
<span v-else>{{ itemc.con }}</span>
|
|
|
</span>
|
|
|
</template>
|
|
|
+ <template v-else-if="data.property.answer_mode === 'select'">
|
|
|
+ <span
|
|
|
+ v-for="(itemc, indexc) in data.matically_pinyin_str[data.mark].split(' ')"
|
|
|
+ :key="indexc"
|
|
|
+ :class="['item-con', active_index_str_right === 0 + '-' + indexc ? 'active' : '']"
|
|
|
+ @click="
|
|
|
+ if (data.property.fun_type === 'show') return;
|
|
|
+ con_preview_right[0].item_active_index = indexc;
|
|
|
+ active_index_str_right = 0 + '-' + indexc;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ {{ itemc }}
|
|
|
+ </span>
|
|
|
+ <!-- <span
|
|
|
+ v-for="(itemc, indexc) in con_preview_right[0].item_con"
|
|
|
+ :key="indexc"
|
|
|
+ :class="[
|
|
|
+ 'item-con',
|
|
|
+ active_index_str === 0 + '-' + indexc ? 'active' : '',
|
|
|
+ data.property.fun_type === 'show' ? 'item-con-in' : '',
|
|
|
+ ]"
|
|
|
+ @click="
|
|
|
+ if (data.property.fun_type === 'show') return;
|
|
|
+ con_preview_right[0].item_active_index = indexc;
|
|
|
+ active_index_str = 0 + '-' + indexc;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ {{ itemc }}
|
|
|
+ </span> -->
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <span
|
|
|
+ v-for="(itemc, indexc) in data.matically_pinyin_str[data.mark].split(' ')"
|
|
|
+ :key="indexc"
|
|
|
+ class="items-box"
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ v-for="(itemi, indexi) in itemc"
|
|
|
+ :key="indexi"
|
|
|
+ :class="['items-con', active_index_str_right === 0 + '-' + indexc + '-' + indexi ? 'active' : '']"
|
|
|
+ @click="
|
|
|
+ handleSelectItemTone(0, indexc, indexi, con_preview_right[0].item_con_yuan[indexc][indexi])
|
|
|
+ "
|
|
|
+ >{{ itemi }}</span
|
|
|
+ >
|
|
|
+ <!-- 拼音之间增加一点间隙 -->
|
|
|
+ <span
|
|
|
+ v-if="indexc !== data.matically_pinyin_str[data.mark].split(' ').length - 1"
|
|
|
+ style="opacity: 0"
|
|
|
+ >a</span
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
</div>
|
|
|
<AudioPlay
|
|
|
v-if="data.audio_file_id && data.property.audio_position === 'back'"
|
|
|
:file-id="data.audio_file_url"
|
|
|
/>
|
|
|
</div>
|
|
|
+ <div v-if="data.property.fun_type === 'mark'" class="tone-box">
|
|
|
+ <span
|
|
|
+ v-for="({ img, value }, j) in toneList"
|
|
|
+ :key="j"
|
|
|
+ :class="[
|
|
|
+ 'tone',
|
|
|
+ (isJudgingRightWrong &&
|
|
|
+ con_preview_right[0].user_answer[con_preview_right[0].item_active_index].right_answer === value &&
|
|
|
+ con_preview_right[0].user_answer[con_preview_right[0].item_active_index].select_index_submit !==
|
|
|
+ con_preview_right[0].user_answer[con_preview_right[0].item_active_index].right_answer &&
|
|
|
+ data.property.answer_mode === 'select') ||
|
|
|
+ (isJudgingRightWrong &&
|
|
|
+ data.property.answer_mode === 'label' &&
|
|
|
+ con_preview_right[0].user_answer[con_preview_right[0].item_active_index].right_answer === value &&
|
|
|
+ con_preview_right[0].user_answer[con_preview_right[0].item_active_index].right_index ===
|
|
|
+ con_preview_right[0].user_answer[con_preview_right[0].item_active_index].select_index &&
|
|
|
+ select_item_index === 0)
|
|
|
+ ? 'right'
|
|
|
+ : '',
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ <SvgIcon :icon-class="img" />
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</AnswerAnalysis>
|
|
|
@@ -248,6 +318,7 @@ export default {
|
|
|
// { value: '0', label: '轻声', img: 'neutral-tone' },
|
|
|
],
|
|
|
con_preview: [],
|
|
|
+ con_preview_right: [], // 查看答案是显示的
|
|
|
tone_data: [
|
|
|
['ā', 'á', 'ǎ', 'à', 'a'],
|
|
|
['ō', 'ó', 'ǒ', 'ò', 'o'],
|
|
|
@@ -266,6 +337,7 @@ export default {
|
|
|
],
|
|
|
final_con: '',
|
|
|
active_index_str: '', // 高亮索引的字符串
|
|
|
+ active_index_str_right: '', // 查看答案时高亮索引
|
|
|
active_letter: '', // 选中字母的值
|
|
|
active_letter_index: 0, // 选择字母索引
|
|
|
select_item_index: 0, // 小题索引
|
|
|
@@ -294,11 +366,11 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
created() {
|
|
|
- // console.log(this.data);
|
|
|
if (
|
|
|
this.data.property.fun_type !== 'show' ||
|
|
|
- (this.data.property.fun_type === 'show' && this.data.answer_list && this.data.answer_list.length > 0) ||
|
|
|
- (this.data.analysis_list && this.data.analysis_list.length > 0)
|
|
|
+ (this.data.property.fun_type === 'show' &&
|
|
|
+ ((this.data.answer_list && this.data.answer_list.length > 0) ||
|
|
|
+ (this.data.analysis_list && this.data.analysis_list.length > 0)))
|
|
|
) {
|
|
|
this.isShowAnswers = true;
|
|
|
} else {
|
|
|
@@ -558,15 +630,26 @@ export default {
|
|
|
if (this.data.property.fun_type === 'show') {
|
|
|
return;
|
|
|
}
|
|
|
- this.con_preview[0].item_active_index = indexc;
|
|
|
- this.con_preview[0].user_answer[indexc].select_index = indexi;
|
|
|
- this.active_index_str = `${i}-${indexc}-${indexi}`;
|
|
|
- this.active_letter = itemi;
|
|
|
- this.active_letter_index = indexi;
|
|
|
- this.select_item_index = i;
|
|
|
+ if (this.isJudgingRightWrong) {
|
|
|
+ this.con_preview_right[0].item_active_index = indexc;
|
|
|
+ this.con_preview_right[0].user_answer[indexc].select_index = indexi;
|
|
|
+ this.active_index_str_right = `${i}-${indexc}-${indexi}`;
|
|
|
+ } else {
|
|
|
+ this.con_preview[0].item_active_index = indexc;
|
|
|
+ this.con_preview[0].user_answer[indexc].select_index = indexi;
|
|
|
+ this.active_index_str = `${i}-${indexc}-${indexi}`;
|
|
|
+ this.select_item_index = i;
|
|
|
+ this.active_letter = itemi;
|
|
|
+ this.active_letter_index = indexi;
|
|
|
+ }
|
|
|
},
|
|
|
// 判断对错
|
|
|
judgeRight() {
|
|
|
+ let active_index_old = 0;
|
|
|
+ this.active_index_str_right = '';
|
|
|
+ if (this.con_preview.length > 0) {
|
|
|
+ active_index_old = this.con_preview[0].item_active_index;
|
|
|
+ }
|
|
|
this.show_preview = false;
|
|
|
|
|
|
let answer_list_item = this.answer.answer_list.filter((items) => this.data.mark === items.mark);
|
|
|
@@ -582,6 +665,7 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
} else {
|
|
|
+ let old_con_preview = JSON.parse(JSON.stringify(this.con_preview));
|
|
|
this.con_preview = [];
|
|
|
let con_arr = JSON.parse(JSON.stringify(this.data.content_view));
|
|
|
let user_answer = [];
|
|
|
@@ -642,18 +726,20 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
let obj = {
|
|
|
- item_con: user_select,
|
|
|
+ item_con: old_con_preview[0].item_con,
|
|
|
item_con_yuan: JSON.parse(JSON.stringify(con_arr)),
|
|
|
mark: this.data.mark,
|
|
|
user_answer,
|
|
|
- item_active_index: 0,
|
|
|
+ item_active_index: active_index_old,
|
|
|
active_letter: '',
|
|
|
user_res_arr,
|
|
|
all_right:
|
|
|
- JSON.stringify(answer_list_item[0].value) === JSON.stringify(this.data.answer.answer_list[0].value),
|
|
|
+ answer_list_item[0].value.length === this.data.answer.answer_list[0].value.length &&
|
|
|
+ answer_list_item[0].value.every((value, index) => value === this.data.answer.answer_list[0].value[index]),
|
|
|
};
|
|
|
this.con_preview.push(obj);
|
|
|
}
|
|
|
+ this.con_preview_right = JSON.parse(JSON.stringify(this.con_preview));
|
|
|
|
|
|
setTimeout(() => {
|
|
|
this.show_preview = true;
|
dsy