修改通用答题组件2

This commit is contained in:
田岩
2025-08-21 11:07:42 +08:00
parent 3705d43508
commit b83fb241c4
2 changed files with 63 additions and 14 deletions
+63 -13
View File
@@ -1,13 +1,12 @@
<template>
<view class="item">
<view class="top">
<view class="type">
{{ subject_type_text }}
</view>
<view class="score" v-if="mode !== 'study'">5分</view>
<view class="fl1" v-if="mode !== 'study'"></view>
<view class="right" v-if="mode !== 'study'">
<view class="mark_and_feedback_div">
<view class="type">{{ subject_type_text }}</view>
<view class="score" v-if="[''].includes(props.mode)">{{ item.tgtGrade }}</view>
<view class="fl1"></view>
<view class="right">
<!-- 反馈中心 -->
<view class="mark_and_feedback_div" v-if="['examination'].includes(props.mode)">
<image
:src="markIcon(props.item.mark ? '#0066FF' : '#ABABAB')"
class="img"
@@ -15,8 +14,10 @@
></image>
<image :src="feedbackIcon()" class="img" @click="feedback_click()"></image>
</view>
<!-- <view class="right_text">展开</view>
<uv-icon class="arrow-icon" name="arrow-right"></uv-icon> -->
<template v-if="[''].includes(props.mode)">
<view class="right_text">展开</view>
<uv-icon class="arrow-icon" name="arrow-right"></uv-icon>
</template>
</view>
</view>
<view class="question_text">
@@ -38,7 +39,7 @@
</view>
<view
class="option_div_button"
v-if="subject_data.qnsTyp === 'MU' && ['practice', 'study'].includes(props.mode) && !props.isPreview"
v-if="qnsTyp === 'MU' && ['practice', 'study'].includes(props.mode) && !props.isPreview"
>
<uv-button
type="primary"
@@ -51,6 +52,19 @@
确定
</uv-button>
</view>
<view class="analysis_div" v-if="!clearResult && ['study', 'mistake'].includes(props.mode)">
<view class="analysis_title">
<view class="success_answer">正确答案{{ correctResultLabel.join('') }}</view>
<view class="your_answer">
你的答案
<text class="red_color">{{ myResultLabel.join('') }}</text>
</view>
</view>
<view class="analysis_note">
题目解析{{subject_data?.analyContent}}
</view>
</view>
</view>
</template>
<script setup>
@@ -107,18 +121,27 @@
};
// 单选 SN, 多选 MU,判断题 JD,简答 ES
const qnsTyp = computed(() => props.item.qnsTyp);
// 正确答案选项
const correctResultLabel = computed(() =>
subject_data.itemVos.filter((res) => res.correctFlag === 'R').map((res) => res.itemNo)
);
// 我的答案选项
const myResultLabel = computed(() => {
const anserResultArray = props.item.anserResult.split(',');
return subject_data.itemVos.filter((res) => anserResultArray.includes(res.itemId)).map((res) => res.itemNo);
});
const subject_data = reactive({
qnsId: props.item.qnsId,
qnsContent: props.item.qnsContent,
qnsTyp: props.item.qnsTyp,
itemVos: props.item.itemVos.map((res) => ({
itemVos: (props.item.itemVos??[]).map((res) => ({
...res,
correctFlag: props.clearResult ? '' : res.correctFlag
}))
});
// 题类型
const subject_type_text = computed(() => SUBJECT_TYPE.find((res) => subject_data.qnsTyp === res.value)?.label || '');
const subject_type_text = computed(() => SUBJECT_TYPE.find((res) => qnsTyp.value === res.value)?.label || '');
// 点击答题
const click_option = (analysisVo) => {
if (props.isPreview) return;
@@ -182,7 +205,34 @@
flex-direction: column;
align-items: center;
}
.analysis_div {
.analysis_title {
display: flex;
justify-content: space-between;
align-items: center;
margin: 32rpx 0 28rpx 0;
.success_answer {
}
.your_answer {
}
.red_color {
color: #f5212d;
}
}
.analysis_note {
font-family: PingFangSC;
font-weight: 500;
font-size: 30rpx;
color: #666666;
line-height: 48rpx;
text-align: left;
font-style: normal;
}
}
.item {
// height: 170rpx;
overflow: hidden;
@@ -67,7 +67,6 @@
});
// 试题类型
const qnsTyp = computed(() => props.item.qnsTyp);
const item = computed(() => props.item);
// 正确答案选项
const correctResultLabel = computed(() =>
props.item.itemVos.filter((res) => res.correctFlag === 'R').map((res) => res.itemNo)