|
@@ -36,34 +36,8 @@
|
|
|
}}
|
|
|
</span>
|
|
|
|
|
|
- <div v-if="item.type === 'text' || item.type === 'input'" class="text-wrapper">
|
|
|
- <div class="text">
|
|
|
- <template v-for="(li, j) in item.content_list">
|
|
|
- <span v-if="li.type === 'text'" :key="j">{{ li.content }}</span>
|
|
|
- <template v-else-if="li.type === 'input'">
|
|
|
- <el-input
|
|
|
- :key="j"
|
|
|
- v-model="li.content"
|
|
|
- :disabled="disabled"
|
|
|
- :class="[...computedAnswerClass(item.mark, li.mark, li.content)]"
|
|
|
- :style="[{ width: Math.max(80, li.content.length * 16) + 'px' }]"
|
|
|
- />
|
|
|
- <span
|
|
|
- v-show="computedAnswerText(item.mark, li.mark, li.content).length > 0"
|
|
|
- :key="`answer-${j}`"
|
|
|
- class="right-answer"
|
|
|
- >
|
|
|
- {{ computedAnswerText(item.mark, li.mark, li.content) }}
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- <SoundRecordPreview
|
|
|
- v-if="isEnable(data.property.is_enable_voice_answer) && item.type === 'input'"
|
|
|
- :wav-blob.sync="item.file_id"
|
|
|
- :disabled="disabled"
|
|
|
- type="small"
|
|
|
- />
|
|
|
+ <div v-if="item.type === 'text'" class="text-wrapper">
|
|
|
+ <div class="text">{{ item.text }}</div>
|
|
|
</div>
|
|
|
|
|
|
<div v-else-if="item.type === 'image'" class="image">
|
|
@@ -136,7 +110,7 @@ export default {
|
|
|
optionList: {
|
|
|
handler(val) {
|
|
|
this.answer.answer_list = [];
|
|
|
- val.forEach(({ type, content_list, mark, file_id }) => {
|
|
|
+ val.forEach(({ type, mark, file_id }) => {
|
|
|
if (type === 'input_student') {
|
|
|
if (file_id.length <= 0) return;
|
|
|
this.answer.answer_list.push({
|
|
@@ -145,22 +119,6 @@ export default {
|
|
|
});
|
|
|
return;
|
|
|
}
|
|
|
- if (type !== 'input') return;
|
|
|
- let list = content_list
|
|
|
- .map(({ type, mark, content }) => {
|
|
|
- if (type !== 'input') return;
|
|
|
- return {
|
|
|
- mark,
|
|
|
- value: content,
|
|
|
- };
|
|
|
- })
|
|
|
- .filter((item) => item);
|
|
|
- if (list.length <= 0) return;
|
|
|
- this.answer.answer_list.push({
|
|
|
- content_list: list,
|
|
|
- audio_file_id: file_id,
|
|
|
- mark,
|
|
|
- });
|
|
|
});
|
|
|
},
|
|
|
deep: true,
|
|
@@ -168,60 +126,13 @@ export default {
|
|
|
},
|
|
|
isJudgingRightWrong(val) {
|
|
|
if (!val) return;
|
|
|
- this.answer.answer_list.forEach(({ mark, audio_file_id, content_list }) => {
|
|
|
+ this.answer.answer_list.forEach(({ mark, audio_file_id }) => {
|
|
|
let findOption = this.optionList.find((item) => item.mark === mark);
|
|
|
findOption.file_id = audio_file_id;
|
|
|
- findOption?.content_list.forEach((item) => {
|
|
|
- if (item.type === 'text') return;
|
|
|
- let find = content_list.find((li) => li.mark === item.mark);
|
|
|
- item.content = find.value;
|
|
|
- });
|
|
|
});
|
|
|
},
|
|
|
},
|
|
|
- methods: {
|
|
|
- /**
|
|
|
- * 计算答题对错选项字体颜色
|
|
|
- * @param {string} optionMark 选项标识
|
|
|
- * @param {string} mark 选项标识
|
|
|
- * @param {string} content 选项内容
|
|
|
- */
|
|
|
- computedAnswerClass(optionMark, mark, content) {
|
|
|
- if (!this.isJudgingRightWrong && !this.isShowRightAnswer) {
|
|
|
- return '';
|
|
|
- }
|
|
|
- let rightValue = this.data.answer.answer_list
|
|
|
- .find((item) => item.mark === optionMark)
|
|
|
- .content_list.find((item) => item.mark === mark).value;
|
|
|
- let classList = [];
|
|
|
- let isRight = rightValue.split('/').includes(content);
|
|
|
-
|
|
|
- if (this.isJudgingRightWrong) {
|
|
|
- isRight ? classList.push('right') : classList.push('wrong');
|
|
|
- }
|
|
|
-
|
|
|
- if (this.isShowRightAnswer && !isRight) {
|
|
|
- classList.push('show-right-answer');
|
|
|
- }
|
|
|
- return classList;
|
|
|
- },
|
|
|
- /**
|
|
|
- * 计算答题对错选项内容
|
|
|
- * @param {string} optionMark 选项标识
|
|
|
- * @param {string} mark 选项标识
|
|
|
- * @param {string} content 选项内容
|
|
|
- */
|
|
|
- computedAnswerText(optionMark, mark, content) {
|
|
|
- if (!this.isShowRightAnswer) return '';
|
|
|
- if (content.length === 0) return '';
|
|
|
- let find = this.data.answer.answer_list
|
|
|
- .find((item) => item.mark === optionMark)
|
|
|
- .content_list.find((item) => item.mark === mark);
|
|
|
- if (find.value.split('/').includes(content)) return '';
|
|
|
- if (!find) return '';
|
|
|
- return `(${find.value})`;
|
|
|
- },
|
|
|
- },
|
|
|
+ methods: {},
|
|
|
};
|
|
|
</script>
|
|
|
|