feat(student): add show answer switch for question detail

1. 新增多语言词条ssShowAnswer对应展示答案功能
2. 在选择题详情弹窗中添加答案展示开关组件
3. 关联开关状态到图表坐标轴颜色和数据项样式
4. 同步开关值到父组件的resultArray数据中

src/views/Student/components/choiceQuestionDetailDialog.vue

@@ -21,6 +21,10 @@
                 <Switch :value="canValue" @update:value="handleCanChange" />
                 <span>{{ lang.ssShowResult }}</span>
               </div>
+              <div class="switch">
+                <Switch :value="answerValue" @update:value="handleAnswerChange" />
+                <span>{{ lang.ssShowAnswer }}</span>
+              </div>
             </div>
           </div>
           <div class="c_t45_msg" v-if="props.roleType == 1">
@@ -689,6 +693,13 @@ watch(() => props.resultArray?.anonymous, (newVal) => {
   anonymousValue.value = newVal
 })
 
+const answerValue = ref(props.resultArray?.answer ?? false)
+
+watch(() => props.resultArray?.answer, (newVal) => {
+  answerValue.value = newVal
+  setEchartsArea1()
+})
+
 
 
 const handleCanChange = (value: boolean) => {
@@ -712,6 +723,12 @@ const handleAnonymousChange = (value: boolean) => {
   emit('setIsResultArray', value, 'anonymous')
 }
 
+const handleAnswerChange = (value: boolean) => {
+  console.log(value)
+  console.log(props.resultArray)
+  emit('setIsResultArray', value, 'answer')
+}
+
 
 import _ from 'lodash'
 import type { workerData } from 'worker_threads'
@@ -1012,7 +1029,15 @@ const setEchartsArea1 = () => {
       xAxis: {
         data: [],
         axisLabel: {
-          color: 'rgba(0, 0, 0, 0.9)',
+          color: function(option: string, idx: number) {
+            console.log(option)
+            console.log('answerValue.value', answerValue.value)
+            const item = _work.choiceUser[idx]
+            if (item && item.isAnswer && answerValue.value) {
+              return '#21ee21'
+            }
+            return 'rgba(0, 0, 0, 0.9)'
+          },
           fontWeight: 600,
           fontSize: 17,
           lineHeight: 20,
@@ -1128,7 +1153,21 @@ const setEchartsArea1 = () => {
       else {
         (option.xAxis.data as any[]).push('')
       }
-      (option.series[0].data as any[]).push(i.user.length)
+      const isCorrect = i.isAnswer && answerValue.value
+      ;(option.series[0].data as any[]).push({
+        value: i.user.length,
+        itemStyle: {
+          color: isCorrect ? '#21ee21' : 'rgba(252, 207, 0, 1)',
+        },
+        label: {
+          show: true,
+          position: 'top',
+          color: isCorrect ? '#21ee21' : 'rgba(116, 139, 115, 1)',
+          fontSize: 22,
+          fontWeight: 500,
+          lineHeight: 24,
+        },
+      })
     })
 
     // console.log(option)

src/views/Student/index.vue

@@ -2864,6 +2864,7 @@ const getCourseDetail = async () => {
                 can: false,
                 like: false,
                 anonymous: false,
+                answer: false,
               }
               if (toolType === 78) {
                 json.anonymous = true

src/views/lang/cn.json

@@ -1050,5 +1050,6 @@
   "ssBatchInteractiveWebConfirm": "是否需要为课件批量生成工具？（预计3-5分钟完成）",
   "ssBatchInteractiveWebConfirmDesc": "是，立即添加",
   "ssBatchInteractiveWebConfirmDesc2": "暂不需要",
-  "ssPendingCount": "待处理"
+  "ssPendingCount": "待处理",
+  "ssShowAnswer": "展示答案"
 }

src/views/lang/en.json

@@ -1050,5 +1050,6 @@
   "ssBatchInteractiveWebConfirm": "Need to generate tools for the course ? (estimated 3-5 minutes)",
   "ssBatchInteractiveWebConfirmDesc": "Yes, add now",
   "ssBatchInteractiveWebConfirmDesc2": "No",
-  "ssPendingCount": "Pending Count"
+  "ssPendingCount": "Pending Count",
+  "ssShowAnswer": "Show Answer"
 }

src/views/lang/hk.json

@@ -1050,5 +1050,6 @@
   "ssBatchInteractiveWebConfirm": "是否需要為課件批量生成工具？（預計3-5分鐘完成）",
   "ssBatchInteractiveWebConfirmDesc": "是，立即添加",
   "ssBatchInteractiveWebConfirmDesc2": "暫不需要添加",
-  "ssPendingCount": "待處理"
+  "ssPendingCount": "待處理",
+  "ssShowAnswer": "展示答案"
 }