f

src/pages/toolbox/query.vue

@@ -253,6 +253,14 @@ async function handleQuery() {
         if (toolKey.value === 'idiom-quiz' || toolKey.value === 'poem-fill') {
           prepareGameOptions()
         }
+        // 百科题库：准备选项
+        if (toolKey.value === 'baiketiku') {
+          prepareBaiKeOptions()
+        }
+        // 垃圾分类问答：准备选项
+        if (toolKey.value === 'anslajifenlei') {
+          prepareGarbageOptions()
+        }
         // 成语接龙：记录系统返回的成语
         if (toolKey.value === 'chengyujielong') {
           if (result.value?.word) {
@@ -354,6 +362,59 @@ const prepareGameOptions = () => {
   answered.value = false
 }
 
+// 百科题库：准备选项（A/B/C/D 四个选项，标记正确答案）
+const prepareBaiKeOptions = () => {
+  if (!result.value)
+    return
+
+  // answer 可能是选项字母标识（如 "A"），也可能是选项文本内容
+  const correctAnswer = String(result.value.answer || '').trim()
+  const optionKeys = ['answerA', 'answerB', 'answerC', 'answerD'] as const
+  const optionLabels = ['A', 'B', 'C', 'D'] as const
+  const options = optionKeys
+    .map((key, i) => {
+      const val = String(result.value[key] || '').trim()
+      if (!val) return null
+      // answer 可能是字母标识 "A"/"B"/...，也可能是选项文本本身
+      const isCorrect = correctAnswer === optionLabels[i] || correctAnswer === val
+      return { label: `${optionLabels[i]}. ${val}`, value: val, isCorrect }
+    })
+    .filter(Boolean) as Array<{ label: string; value: string; isCorrect: boolean }>
+
+  gameOptions.value = options
+  selectedOption.value = null
+  answered.value = false
+}
+
+// 垃圾分类问答：准备选项（四个分类，标记正确答案）
+const prepareGarbageOptions = () => {
+  if (!result.value)
+    return
+
+  const correctType = result.value.type
+  const typeNames: Record<number, string> = {
+    0: '可回收物',
+    1: '有害垃圾',
+    2: '厨余垃圾',
+    3: '其他垃圾',
+  }
+  const options = Object.entries(typeNames).map(([typeKey, typeName]) => ({
+    label: typeName,
+    value: typeName,
+    isCorrect: Number(typeKey) === Number(correctType),
+  }))
+
+  // 打乱顺序
+  for (let i = options.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1))
+    ;[options[i], options[j]] = [options[j], options[i]]
+  }
+
+  gameOptions.value = options
+  selectedOption.value = null
+  answered.value = false
+}
+
 // 点击选项
 function handleOptionClick(option: { label: string; value: string; isCorrect: boolean }) {
   if (answered.value)
@@ -538,11 +599,15 @@ function handleRestart() {
 
               <!-- 题目 -->
               <view class="game-question">
-                <text class="game-question-text">{{ result.question }}</text>
+                <text v-if="toolKey === 'anslajifenlei'" class="game-question-text game-question-garbage">
+                  <text class="garbage-name">{{ result.name }}</text>
+                  <text class="garbage-prompt">属于什么垃圾？</text>
+                </text>
+                <text v-else class="game-question-text">{{ result.title || result.question }}</text>
               </view>
 
               <!-- 选项按钮 -->
-              <view class="game-options">
+              <view class="game-options" :class="{ 'game-options-col': toolKey === 'anslajifenlei' }">
                 <view
                   v-for="(option, index) in gameOptions"
                   :key="index"
@@ -551,6 +616,10 @@ function handleRestart() {
                     'game-option-selected': selectedOption === option.value,
                     'game-option-correct': answered && option.isCorrect,
                     'game-option-wrong': answered && selectedOption === option.value && !option.isCorrect,
+                    'game-option-recyclable': toolKey === 'anslajifenlei' && option.value === '可回收物',
+                    'game-option-hazardous': toolKey === 'anslajifenlei' && option.value === '有害垃圾',
+                    'game-option-kitchen': toolKey === 'anslajifenlei' && option.value === '厨余垃圾',
+                    'game-option-other': toolKey === 'anslajifenlei' && option.value === '其他垃圾',
                   }"
                   @tap="handleOptionClick(option)"
                 >
@@ -610,6 +679,30 @@ function handleRestart() {
                     <text class="game-explan-value">{{ result.note }}</text>
                   </view>
                 </template>
+
+                <!-- 百科题库：显示正确答案和解析 -->
+                <template v-else-if="toolKey === 'baiketiku'">
+                  <view class="game-answer">
+                    <text class="game-answer-label">正确答案：</text>
+                    <text class="game-answer-value">{{ result.answer }}</text>
+                  </view>
+                  <view v-if="result.analytic" class="game-explan">
+                    <text class="game-explan-label">解析：</text>
+                    <text class="game-explan-value">{{ result.analytic }}</text>
+                  </view>
+                </template>
+
+                <!-- 垃圾分类问答：显示正确分类 -->
+                <template v-else-if="toolKey === 'anslajifenlei'">
+                  <view class="game-answer">
+                    <text class="game-answer-label">正确分类：</text>
+                    <text class="game-answer-value garbage-answer-type">{{ result.type_name }}</text>
+                  </view>
+                  <view v-if="result.explain" class="game-explan">
+                    <text class="game-explan-label">说明：</text>
+                    <text class="game-explan-value">{{ result.explain }}</text>
+                  </view>
+                </template>
               </view>
             </template>
 
@@ -1473,4 +1566,50 @@ function handleRestart() {
 .chain-empty-text {
   font-size: 24rpx;
 }
+
+/* 垃圾分类游戏样式 */
+.game-question-garbage {
+  display: flex;
+  flex-direction: column;
+  gap: 16rpx;
+  align-items: center;
+}
+
+.garbage-name {
+  font-size: 56rpx;
+  font-weight: 700;
+  color: #1d2129;
+}
+
+.garbage-prompt {
+  font-size: 30rpx;
+  color: #86909c;
+  font-weight: 400;
+}
+
+.garbage-answer-type {
+  color: #00b42a;
+}
+
+/* 垃圾分类选项布局 - 单列 */
+.game-options-col {
+  grid-template-columns: 1fr;
+}
+
+/* 垃圾分类四个类别的默认色 */
+.game-option-recyclable {
+  border-left: 6rpx solid #1768ff;
+}
+
+.game-option-hazardous {
+  border-left: 6rpx solid #f53f3f;
+}
+
+.game-option-kitchen {
+  border-left: 6rpx solid #00b42a;
+}
+
+.game-option-other {
+  border-left: 6rpx solid #86909c;
+}
 </style>