修复错题重做多选题无法显示的问题

src/components/m-icon/index.vue

@@ -2,24 +2,20 @@
   <svg
     class="icon"
     aria-hidden="true"
-    v-if="isSvg"
+    v-if="!isSvg"
     :style="`font-size:${size}`"
   >
-    <use fill="#333" :xlink:href="`#icon-${type}`"></use>
+    <use :xlink:href="`#icon-${type}`"></use>
   </svg>
   <!-- <span v-if="!isSvg" class="iconfont" :class="`icon-${type}`" style="fill:#ffffff"></span> -->
-  <i :class="`icon-${type}`"  class="icon iconfont" :style="`font-size:${size};color:${color}`" v-else />
+  <img :src="`/svg/${type}.svg`" v-else />
 </template>
 
 <script lang="ts" setup>
 import "./iconfont";
 const props = defineProps({
-  color:String,
   type: String,
-  isSvg: {
-    type:String,
-    default:true
-  },
+  isSvg: Boolean,
   size: String,
 });
 </script>
@@ -33,4 +29,4 @@ const props = defineProps({
   fill: currentColor;
   overflow: hidden;
 }
-</style>
+</style>

src/components/m-wrong-preview/index.vue

@@ -1,237 +1,237 @@
-<template>
-	<!-- 导航栏 -->
-	<van-nav-bar :title="exerciseTitle" left-arrow @click-left="back" fixed placeholder>
-		<!-- <template #right>
-			<m-icon type="shezhi" @click="setShow = true" />
-		</template> -->
-	</van-nav-bar>
-	<!-- 导航栏end -->
-	<!-- 答题模式选择 -->
-	<!-- <div class="answerType">
-		<span v-for="(answerType, index) in answerTypeList" :key="index" :class="{ selected: currentType == index }" @click="currentType = index">{{ answerType.name }}</span>
-		<span v-if="isVip" :class="{ selected: aotuPlayFlag }" @click="aotuPlaySet">自动读题</span>
-		 不是vip隐藏自动读题 
-		<span v-else class="visibility-hidden" :class="{ selected: aotuPlayFlag }">自动读题</span>
-	</div> -->
-	<!-- 答题模式选择end -->
-	<!-- 分割线 -->
-	<div class="divider" />
-	<!-- 题目模块 -->
-	<!-- 题目预加载 -->
-	<m-empty v-if="!currentSubject" />
-	<!-- 题目预加载end -->
-	<div class="problem-box" v-else>
-		<!-- 题目内容 -->
-		<subjectContext :currentSubject="currentSubject" :currentSubjectIndex="currentSubjectIndex" />
-		<!-- 背题模式展示 -->
-		<div v-if="typeParams.answerShow">
-			<reciteMode :currentSubject="currentSubject" />
-		</div>
-		<!-- 背题模式展示end -->
-		<!-- 选择内容 -->
-		<div v-else-if="currentSubject.isTrue === null">
-			<!-- 单选 -->
-			<van-radio-group v-model="currentSubject.userAnswer" v-if="currentSubject.questionType !== 3" @change="userAnswerChange" icon-size="35px">
-				<van-radio v-for="(item, index) in currentSubject.opts" :key="Number(index)" :name="item" class="answer"
-					>{{ item }}
-					<template #icon="props">
-						<div class="choose-icon" :class="{ selected: props.checked }">
-							{{ String.fromCharCode(65 + Number(index)) }}
-						</div>
-					</template>
-				</van-radio>
-			</van-radio-group>
-			<!-- 多选 -->
-			<div v-else>
-				<van-checkbox-group v-model="currentSubject.userAnswer" icon-size="35px">
-					<van-checkbox v-for="(item, index) in currentSubject.opts" :key="Number(index)" :name="item" class="answer"
-						>{{ item }}
-						<template #icon="props">
-							<div class="choose-icon" :class="{ selected: props.checked }">
-								{{ String.fromCharCode(65 + Number(index)) }}
-							</div>
-						</template>
-					</van-checkbox>
-				</van-checkbox-group>
-				<van-button round type="primary" class="checkbox-btn" :disabled="currentSubject.userAnswer&&currentSubject.userAnswer.length == 0" @click="userAnswerChange">确定</van-button>
-			</div>
-		</div>
-		<!-- 展示答题后选择内容 -->
-		<div v-else>
-			<div>
-				<div v-for="(item, index) in currentSubject.optsBack" :key="Number(index)" class="answer-box">
-					<div class="choose-icon" :class="{ iconTrue: item.status % 2 !== 0 }" v-if="item.status < 2">
-						{{ String.fromCharCode(65 + Number(index)) }}
-					</div>
-					<m-icon v-else-if="item.status == 3" type="dui" size="30px" style="margin-left: 5px" />
-					<m-icon v-else-if="item.status == 2" size="30px" type="cuo" style="margin-left: 5px" />
-					<span class="answer-text" :class="{ true: item.status % 2 !== 0, false: item.status == 2 }">
-						{{ item.opt }}
-					</span>
-				</div>
-			</div>
-			<div class="checkbox-answer">答案: {{ currentSubject.answer.toString() }}</div>
-		</div>
-		<!-- 展示答题后选择内容end -->
-	</div>
-	<!-- 选择内容End -->
-	<!-- 分割线 -->
-	<!-- <van-divider /> -->
-	<!-- 功能选择列表 -->
-	<!-- <functionList :currentSubject="currentSubject" @subjectAudioPlay="subjectAudioPlay" @addCurrentQuestion="addCurrentQuestion" v-model:skillsShow="skillsShow" /> -->
-	<!-- 技巧讲解 -->
-	<!-- <explainJq :currentSubject="currentSubject" v-model:skillsShow="skillsShow" @subjectAudioPlay="subjectAudioPlay" /> -->
-	<!-- 官方解释 -->
-	<!-- <explainJs :currentSubject="currentSubject" v-model:officialShow="officialShow" @subjectAudioPlay="subjectAudioPlay" /> -->
-	<!-- 设置操作栏 -->
-	<!-- <van-popup v-model:show="setShow" position="bottom">
-		<van-cell center title="答对跳转下一题">
-			<template #right-icon>
-				<van-switch v-model="isJumpNext" size="24" />
-			</template>
-		</van-cell>
-		<van-cell center title="答题音效提示">
-			<template #right-icon>
-				<van-switch v-model="isSoundEffect" size="24" />
-			</template>
-		</van-cell>
-	</van-popup> -->
-	<!-- 设置操作栏end -->
-	<!-- 底部弹出题目选择栏 -->
-	<van-popup v-model:show="showSubjectChangePopup" position="bottom">
-		<subjectChangePopup :trueNum="trueNum" :falseNum="falseNum" v-model:currentSubjectIndex="currentSubjectIndex" :subjectList="subjectList" />
-	</van-popup>
-	<!-- 底部操作栏 -->
-	<bottomBar :listType="listType"  :currentSubjectIndex="currentSubjectIndex" :subjectList="subjectList" :subjectTotal="subjectTotal" :trueNum="trueNum" :falseNum="falseNum" v-model:showSubjectChangePopup="showSubjectChangePopup" v-model:officialShow="officialShow" @lastSubject="lastSubject" @nextSubject="nextSubject" />
-</template>
-
-<script lang="ts" setup>
-import { ref, defineProps,computed } from "vue";
-import subjectChangePopup from "./components/subjectChangePopup.vue";
-import { useTopicMode, useAudioSet, useSubjectShowLogic } from "@/hooks/exercise";
-import { RouterBus } from "@/hooks";
-import {exerciseTitle} from "@/hooks/text/title"
-import subjectContext from "./components/subjectContext.vue";
-import functionList from "./components/functionList.vue";
-import explainJq from "./components/explainJq.vue";
-import explainJs from "./components/explainJs.vue";
-import reciteMode from "./components/reciteMode.vue";
-import bottomBar from "./components/bottomBar.vue";
-import store from "@/store";
-const {
-	router: { back },
-	route: { query },
-} = new RouterBus();
-
-const props = defineProps<{
-	listType: ExerciseType.ListType;
-}>();
-
-const isVip = store.getters.getIsVip;
-
-//答题模式选择逻辑
-const { answerTypeList, currentType, typeParams } = useTopicMode();
-
-//设置操作栏
-/**显示设置栏 */
-const setShow = ref(false);
-/**答题音效 */
-const isSoundEffect = ref(true);
-// 显示题目选择栏
-const showSubjectChangePopup = ref(false);
-
-
-//题目展示逻辑
-const { subjectList, currentSubject, currentSubjectIndex, subjectTotal, nextSubject, lastSubject, trueNum, falseNum, isJumpNext, userAnswerChange, addCurrentQuestion, skillsShow, officialShow } = useSubjectShowLogic(props.listType);
-//本地的数据
-console.log(currentSubject,'currentSubject')
-//音频模块
-const { aotuPlayFlag, subjectAudioPlay, aotuPlaySet } = useAudioSet(currentSubject);
-</script>
-
-<style lang="scss" scoped>
-.visibility-hidden{
-	visibility: hidden;
-
-}
-.parsing-img {
-	width: 100%;
-	margin-top: 10px;
-}
-.answerType {
-	width: 100%;
-	font-size: 13px;
-	display: flex;
-	justify-content: space-around;
-	padding: 15px;
-	box-sizing: border-box;
-	span {
-		border-radius: 20px;
-		padding: 3px 10px;
-		background-color: #b8c0cc;
-		color: #ffffff;
-	}
-	.selected {
-		background-color: #498ef5;
-	}
-}
-.divider {
-	width: 100%;
-	height: 10px;
-	background-color: #f2f3f5;
-}
-.problem-box {
-	font-size: 17px;
-	padding: 15px;
-	.answer {
-		margin-top: 25px;
-	}
-	.answer-box {
-		display: flex;
-		margin-top: 25px;
-		align-items: center;
-		.iconTrue {
-			background-color: #01c18d;
-		}
-		.answer-text {
-			margin-left: 10px;
-		}
-		.true {
-			color: #01c18d;
-		}
-		.false {
-			color: #ff4d53;
-		}
-	}
-
-	.choose-icon {
-		width: 30px;
-		height: 30px;
-		border-radius: 50%;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		font-size: 17px;
-		box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
-		box-sizing: border-box;
-		margin-left: 5px;
-		margin-top: 1px;
-	}
-	.selected {
-		background-color: #498ef5;
-	}
-	.checkbox-btn {
-		width: 266px;
-		height: 40px;
-		margin: auto;
-		margin-top: 25px;
-		left: 50%;
-		transform: translateX(-50%);
-	}
-	.checkbox-answer {
-		padding: 8px 10px;
-		background-color: #f2f3f5;
-		margin-top: 25px;
-	}
-}
-</style>
+<template>
+	<!-- 导航栏 -->
+	<van-nav-bar :title="exerciseTitle" left-arrow @click-left="back" fixed placeholder>
+		<!-- <template #right>
+			<m-icon type="shezhi" @click="setShow = true" />
+		</template> -->
+	</van-nav-bar>
+	<!-- 导航栏end -->
+	<!-- 答题模式选择 -->
+	<!-- <div class="answerType">
+		<span v-for="(answerType, index) in answerTypeList" :key="index" :class="{ selected: currentType == index }" @click="currentType = index">{{ answerType.name }}</span>
+		<span v-if="isVip" :class="{ selected: aotuPlayFlag }" @click="aotuPlaySet">自动读题</span>
+		 不是vip隐藏自动读题 
+		<span v-else class="visibility-hidden" :class="{ selected: aotuPlayFlag }">自动读题</span>
+	</div> -->
+	<!-- 答题模式选择end -->
+	<!-- 分割线 -->
+	<div class="divider" />
+	<!-- 题目模块 -->
+	<!-- 题目预加载 -->
+	<m-empty v-if="!currentSubject" />
+	<!-- 题目预加载end -->
+	<div class="problem-box" v-else>
+		<!-- 题目内容 -->
+		<subjectContext :currentSubject="currentSubject" :currentSubjectIndex="currentSubjectIndex" />
+		<!-- 背题模式展示 -->
+		<div v-if="typeParams.answerShow">
+			<reciteMode :currentSubject="currentSubject" />
+		</div>
+		<!-- 背题模式展示end -->
+		<!-- 选择内容 -->
+		<div v-else-if="currentSubject.isTrue === null">
+			<!-- 单选 -->
+			<van-radio-group v-model="currentSubject.userAnswer" v-if="currentSubject.questionType !== 3" @change="userAnswerChange" icon-size="35px">
+				<van-radio v-for="(item, index) in currentSubject.opts" :key="Number(index)" :name="item" class="answer"
+					>{{ item }}
+					<template #icon="props">
+						<div class="choose-icon" :class="{ selected: props.checked }">
+							{{ String.fromCharCode(65 + Number(index)) }}
+						</div>
+					</template>
+				</van-radio>
+			</van-radio-group>
+			<!-- 多选 -->
+			<div v-else>
+				<!-- <van-checkbox-group v-model="currentSubject.userAnswer" icon-size="35px">
+					<van-checkbox v-for="(item, index) in currentSubject.opts" :key="Number(index)" :name="item" class="answer"
+						>{{ item }}
+						<template #icon="props">
+							<div class="choose-icon" :class="{ selected: props.checked }">
+								{{ String.fromCharCode(65 + Number(index)) }}
+							</div>
+						</template>
+					</van-checkbox>
+				</van-checkbox-group> -->
+				<van-button round type="primary" class="checkbox-btn" :disabled="currentSubject.userAnswer&&currentSubject.userAnswer.length == 0" @click="userAnswerChange">确定</van-button>
+			</div>
+		</div>
+		<!-- 展示答题后选择内容 -->
+		<div v-else>
+			<div>
+				<div v-for="(item, index) in currentSubject.optsBack" :key="Number(index)" class="answer-box">
+					<div class="choose-icon" :class="{ iconTrue: item.status % 2 !== 0 }" v-if="item.status < 2">
+						{{ String.fromCharCode(65 + Number(index)) }}
+					</div>
+					<m-icon v-else-if="item.status == 3" type="dui" size="30px" style="margin-left: 5px" />
+					<m-icon v-else-if="item.status == 2" size="30px" type="cuo" style="margin-left: 5px" />
+					<span class="answer-text" :class="{ true: item.status % 2 !== 0, false: item.status == 2 }">
+						{{ item.opt }}
+					</span>
+				</div>
+			</div>
+			<div class="checkbox-answer">答案: {{ currentSubject.answer.toString() }}</div>
+		</div>
+		<!-- 展示答题后选择内容end -->
+	</div>
+	<!-- 选择内容End -->
+	<!-- 分割线 -->
+	<!-- <van-divider /> -->
+	<!-- 功能选择列表 -->
+	<!-- <functionList :currentSubject="currentSubject" @subjectAudioPlay="subjectAudioPlay" @addCurrentQuestion="addCurrentQuestion" v-model:skillsShow="skillsShow" /> -->
+	<!-- 技巧讲解 -->
+	<!-- <explainJq :currentSubject="currentSubject" v-model:skillsShow="skillsShow" @subjectAudioPlay="subjectAudioPlay" /> -->
+	<!-- 官方解释 -->
+	<!-- <explainJs :currentSubject="currentSubject" v-model:officialShow="officialShow" @subjectAudioPlay="subjectAudioPlay" /> -->
+	<!-- 设置操作栏 -->
+	<!-- <van-popup v-model:show="setShow" position="bottom">
+		<van-cell center title="答对跳转下一题">
+			<template #right-icon>
+				<van-switch v-model="isJumpNext" size="24" />
+			</template>
+		</van-cell>
+		<van-cell center title="答题音效提示">
+			<template #right-icon>
+				<van-switch v-model="isSoundEffect" size="24" />
+			</template>
+		</van-cell>
+	</van-popup> -->
+	<!-- 设置操作栏end -->
+	<!-- 底部弹出题目选择栏 -->
+	<van-popup v-model:show="showSubjectChangePopup" position="bottom">
+		<subjectChangePopup :trueNum="trueNum" :falseNum="falseNum" v-model:currentSubjectIndex="currentSubjectIndex" :subjectList="subjectList" />
+	</van-popup>
+	<!-- 底部操作栏 -->
+	<bottomBar :listType="listType"  :currentSubjectIndex="currentSubjectIndex" :subjectList="subjectList" :subjectTotal="subjectTotal" :trueNum="trueNum" :falseNum="falseNum" v-model:showSubjectChangePopup="showSubjectChangePopup" v-model:officialShow="officialShow" @lastSubject="lastSubject" @nextSubject="nextSubject" />
+</template>
+
+<script lang="ts" setup>
+import { ref, defineProps,computed } from "vue";
+import subjectChangePopup from "./components/subjectChangePopup.vue";
+import { useTopicMode, useAudioSet, useSubjectShowLogic } from "@/hooks/exercise";
+import { RouterBus } from "@/hooks";
+import {exerciseTitle} from "@/hooks/text/title"
+import subjectContext from "./components/subjectContext.vue";
+import functionList from "./components/functionList.vue";
+import explainJq from "./components/explainJq.vue";
+import explainJs from "./components/explainJs.vue";
+import reciteMode from "./components/reciteMode.vue";
+import bottomBar from "./components/bottomBar.vue";
+import store from "@/store";
+const {
+	router: { back },
+	route: { query },
+} = new RouterBus();
+
+const props = defineProps<{
+	listType: ExerciseType.ListType;
+}>();
+
+const isVip = store.getters.getIsVip;
+
+//答题模式选择逻辑
+const { answerTypeList, currentType, typeParams } = useTopicMode();
+
+//设置操作栏
+/**显示设置栏 */
+const setShow = ref(false);
+/**答题音效 */
+const isSoundEffect = ref(true);
+// 显示题目选择栏
+const showSubjectChangePopup = ref(false);
+
+
+//题目展示逻辑
+const { subjectList, currentSubject, currentSubjectIndex, subjectTotal, nextSubject, lastSubject, trueNum, falseNum, isJumpNext, userAnswerChange, addCurrentQuestion, skillsShow, officialShow } = useSubjectShowLogic(props.listType);
+//本地的数据
+console.log(currentSubject,'currentSubject')
+//音频模块
+const { aotuPlayFlag, subjectAudioPlay, aotuPlaySet } = useAudioSet(currentSubject);
+</script>
+
+<style lang="scss" scoped>
+.visibility-hidden{
+	visibility: hidden;
+
+}
+.parsing-img {
+	width: 100%;
+	margin-top: 10px;
+}
+.answerType {
+	width: 100%;
+	font-size: 13px;
+	display: flex;
+	justify-content: space-around;
+	padding: 15px;
+	box-sizing: border-box;
+	span {
+		border-radius: 20px;
+		padding: 3px 10px;
+		background-color: #b8c0cc;
+		color: #ffffff;
+	}
+	.selected {
+		background-color: #498ef5;
+	}
+}
+.divider {
+	width: 100%;
+	height: 10px;
+	background-color: #f2f3f5;
+}
+.problem-box {
+	font-size: 17px;
+	padding: 15px;
+	.answer {
+		margin-top: 25px;
+	}
+	.answer-box {
+		display: flex;
+		margin-top: 25px;
+		align-items: center;
+		.iconTrue {
+			background-color: #01c18d;
+		}
+		.answer-text {
+			margin-left: 10px;
+		}
+		.true {
+			color: #01c18d;
+		}
+		.false {
+			color: #ff4d53;
+		}
+	}
+
+	.choose-icon {
+		width: 30px;
+		height: 30px;
+		border-radius: 50%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		font-size: 17px;
+		box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.16);
+		box-sizing: border-box;
+		margin-left: 5px;
+		margin-top: 1px;
+	}
+	.selected {
+		background-color: #498ef5;
+	}
+	.checkbox-btn {
+		width: 266px;
+		height: 40px;
+		margin: auto;
+		margin-top: 25px;
+		left: 50%;
+		transform: translateX(-50%);
+	}
+	.checkbox-answer {
+		padding: 8px 10px;
+		background-color: #f2f3f5;
+		margin-top: 25px;
+	}
+}
+</style>