优化新实例

src/components/GeneralRenderer.vue

@@ -21,7 +21,10 @@ const formattedLatex = ref('');
 
 // 监听外部内容的变化，并同步更新内部内容
 watch(() => props.contentInput, (newValue) => {
-  localInput.value = newValue;
+  localInput.value = newValue.replaceAll('<code>', '$')
+      .replaceAll('</code>', '$')
+      .replaceAll('/lt', '<')
+      .replaceAll('/gt', '>');
 });
 
 // 监听 localInput 的变化，实时更新渲染内容

src/pages/demoPages/podExercise/QuestionText.vue

@@ -1,9 +1,11 @@
 <template>
-  <div v-html="processedText" class="question-text"></div>
+  <general-renderer :content-input="processedText" class="question-text"></general-renderer>
+<!--  <div v-html="" class="question-text"></div>-->
 </template>
 
 <script setup>
 import { computed } from 'vue';
+import GeneralRenderer from "../../../components/GeneralRenderer.vue";
 
 const props = defineProps({
   text: {

src/pages/demoPages/podExercise/Quiz.vue

@@ -17,7 +17,7 @@
                 :name="'question'"
                 :disabled="submitted"
             />
-            <span v-html="processMedia(answer, data.medias)"></span>
+            <general-renderer :content-input="processMedia(answer, data.medias)"></general-renderer>
           </label>
         </div>
       </div>
@@ -30,10 +30,10 @@
       <div v-if="submitted" class="result">
         <p v-if="isCorrect" class="correct-text">答对了！</p>
         <p v-else class="incorrect-text">答错了。</p>
-        <p>正确答案是：<span v-html="processMedia(correctAnswerText, data.medias)"></span></p>
+        <p>正确答案是：<general-renderer :content-input="processMedia(correctAnswerText, data.medias)"></general-renderer></p>
         <div v-if="currentQuestion.explanation" class="explanation">
           <h3>解题思路</h3>
-          <div v-html="processMedia(currentQuestion.explanation, data.medias)"></div>
+          <general-renderer :content-input="processMedia(currentQuestion.explanation, data.medias)"></general-renderer>
         </div>
 
         <!-- 类似题目对比 -->
@@ -42,7 +42,7 @@
           <div v-for="(similar, index) in similarQuestions" :key="index" class="similar-question">
             <h4>题目 {{ index + 1 }}</h4>
             <QuestionText :text="similar.text" :medias="data.medias" />
-            <p>正确答案：<span v-html="processMedia(similar.correctAnswer, data.medias)"></span></p>
+            <p>正确答案：<general-renderer :content-input="processMedia(similar.correctAnswer, data.medias)"></general-renderer></p>
           </div>
         </div>
       </div>
@@ -67,6 +67,7 @@
 import { reactive, ref, onMounted, computed } from 'vue';
 import axios from 'axios';
 import QuestionText from './QuestionText.vue';
+import GeneralRenderer from "../../../components/GeneralRenderer.vue";
 
 // 响应式数据存储 JSON
 const data = reactive({
@@ -87,17 +88,19 @@ const isCorrect = ref(false);
 const correctAnswerText = ref('');
 const correctIndex = ref(null);
 const isLoading = ref(true);
-const questionCount = ref(1);
+const questionCount = ref(1); // 当前题目序号
-const similarQuestions = ref([]); // 类似题目数组
+const similarQuestions = ref([]);
-
-// 最近20题的答题记录
 const recentResults = ref([]);
+const examQuestions = ref([]); // 当前试卷的题目列表
+const totalQuestions = ref(0);
+// 最近40题的答题记录
 
 // 进度条百分比
+
 const progressPercentage = computed(() => {
   if (recentResults.value.length === 0) return 0;
   const correctCount = recentResults.value.filter(result => result).length;
-  return (correctCount / Math.min(recentResults.value.length, 20)) * 100;
+  return (correctCount / Math.min(recentResults.value.length, totalQuestions.value)) * 100;
 });
 
 // 加载数据
@@ -106,9 +109,7 @@ onMounted(async () => {
     const response = await axios.get('https://mva-cyber.club/data/file/phy250226.json');
     const jsonData = response.data;
     Object.assign(data, jsonData);
-
+    generateNewExam(); // 初始生成一份试卷
-    // 随机选择第一道题
-    selectRandomQuestion();
   } catch (error) {
     console.error('加载数据失败:', error);
     alert('数据加载失败，请稍后重试。');
@@ -201,6 +202,31 @@ function calculateStringSimilarity(str1, str2) {
   // 返回保留两位小数的百分比
   return Number(similarity.toFixed(2));
 }
+// 生成新试卷
+function generateNewExam() {
+  if (data.texts.length <= 1) return;
+
+  // 创建所有题目的索引数组并打乱顺序
+  const indices = Array.from({ length: data.texts.length - 1 }, (_, i) => i + 1);
+  for (let i = indices.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1));
+    [indices[i], indices[j]] = [indices[j], indices[i]];
+  }
+
+  // 生成试卷题目列表
+  examQuestions.value = indices.map(index => ({
+    text: data.texts[index],
+    answers: data.answers[index],
+    answerkeys: data.answerkeys[index],
+    explanation: data.explanations[index],
+    type: data.itemtypes[index]
+  }));
+
+  totalQuestions.value = examQuestions.value.length;
+  questionCount.value = 1;
+  recentResults.value = [];
+  selectCurrentQuestion();
+}
 // 查找类似题目
 function findSimilarQuestions() {
   const currentText = currentQuestion.value.text;
@@ -208,7 +234,7 @@ function findSimilarQuestions() {
   for (let i = 1; i < data.itemtypes.length; i++) {
     console.log(calculateStringSimilarity(data.texts[i], currentText), {1: data.texts[i]})
     if (
-        calculateStringSimilarity(data.texts[i], currentText) > 80 && // 相似度
+        calculateStringSimilarity(data.texts[i], currentText) > 50 && // 相似度
         data.texts[i] !== currentQuestion.value.text// 不是当前题目
         // similar.length < 2 // 最多选 2 道
     ) {
@@ -221,7 +247,14 @@ function findSimilarQuestions() {
   }
   similarQuestions.value = similar;
 }
-
+function selectCurrentQuestion() {
+  if (questionCount.value <= totalQuestions.value) {
+    currentQuestion.value = examQuestions.value[questionCount.value - 1];
+    userAnswer.value = null;
+    submitted.value = false;
+    similarQuestions.value = [];
+  }
+}
 // 提交答案
 function submitAnswer() {
   if (userAnswer.value === null) {
@@ -233,9 +266,9 @@ function submitAnswer() {
   correctAnswerText.value = currentQuestion.value.answers[correctIndex.value + 1];
   submitted.value = true;
 
-  // 更新最近20题记录
+  // 更新最近40题记录
   recentResults.value.push(isCorrect.value);
-  if (recentResults.value.length > 20) {
+  if (recentResults.value.length > 40) {
     recentResults.value.shift();
   }
 
@@ -245,8 +278,13 @@ function submitAnswer() {
 
 // 下一题
 function nextQuestion() {
+  if (questionCount.value < totalQuestions.value) {
     questionCount.value++;
-  selectRandomQuestion();
+    selectCurrentQuestion();
+  } else {
+    alert('试卷已完成！将生成新试卷。');
+    generateNewExam(); // 完成当前试卷后生成新试卷
+  }
 }
 </script>