update

src/modules/teacher/data/exam/components/TopicDataChart.vue

@@ -15,7 +15,7 @@
 import * as echarts from 'echarts'
 export default {
   props: {
-    dataInfo: { type: Object, default: () => ({}) }
+    data: { type: Object, default: () => ({}) }
   },
   data() {
     return {
@@ -43,10 +43,7 @@ export default {
             labelLine: {
               show: false
             },
-            data: [
-              { value: 0, name: '及格人数', itemStyle: { color: '#6C83CE' } },
-              { value: 0, name: '不及格人数', itemStyle: { color: '#D96685' } }
-            ]
+            data: []
           }
         ]
       }
@@ -57,11 +54,16 @@ export default {
   },
   methods: {
     initEchart() {
-      const data = [
-        { value: '10', name: '及格人数', itemStyle: { color: '#6C83CE' } },
-        { value: '10', name: '不及格人数', itemStyle: { color: '#D96685' } }
-      ]
-      this.option.series[0].data = data
+      console.log(this.data, '=123data', this.data.answers)
+      const changeData = this.data.answers.reduce((a, b) => {
+        const findId = this.data.options.find(item => item.id === b.option_id)
+        a.push({
+          value: b.num,
+          name: findId ? findId.abc : ''
+        })
+        return a
+      }, [])
+      this.option.series[0].data = changeData
       const myChart = echarts.init(document.getElementById('main'))
       myChart.setOption(this.option)
     }

src/modules/teacher/data/exam/components/TopicDataInfo.vue

@@ -3,26 +3,16 @@
     <img class="bg" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/x-learning/data/bgc1.png" alt="" />
     <div slot="header" style="display: flex; align-items: center">
       <h1 style="font-size: 16px">概述信息</h1>
-      <!-- <img class="logo" src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/x-learning/data/exam.png" alt="" /> -->
     </div>
     <div class="location">
       <el-row :gutter="20" class="row-bg" justify="space-around">
-        <el-col :span="8">
-          <div class="title">本题分数</div>
+        <el-col :span="8" v-for="(item, index) in data" :key="index">
+          <div class="title">{{ item.title }}</div>
           <div>
-            <span class="num">111</span>
+            <span class="num">{{ item.value }}</span>
+            <span class="fen" v-if="index == 2">%</span>
           </div>
         </el-col>
-        <el-col :span="8">
-          <div class="title">平均得分</div>
-          <div>
-            <span class="num">111</span>
-          </div>
-        </el-col>
-        <el-col :span="8">
-          <div class="title">正确率</div>
-          <div><span class="num">111</span><span class="fen">%</span></div>
-        </el-col>
       </el-row>
     </div>
   </el-card>
@@ -31,7 +21,7 @@
 <script>
 export default {
   props: {
-    dataInfo: { type: Object, default: () => ({}) }
+    data: { type: Array, default: () => [] }
   }
 }
 </script>

src/modules/teacher/data/exam/components/detail/QuestionDetails.vue

@@ -8,9 +8,9 @@
       <!-- 单选 -->
       <template v-if="[1, 6].includes(questionType)">
         <el-radio-group v-model="data.answer[0]" :disabled="disabled" @change="handleChange">
-          <div class="question-option-item" v-for="item in data.options" :key="item.id">
+          <div class="question-option-item" v-for="item in currentOptions" :key="item.id">
             <el-radio :label="item.id">
-              <div class="question-option-item__text" v-html="item.option"></div>
+              <div class="question-option-item__text" v-html="item.abc+'.'+item.option"></div>
             </el-radio>
           </div>
         </el-radio-group>
@@ -18,9 +18,9 @@
       <!-- 多选 -->
       <template v-if="questionType === 2">
         <el-checkbox-group v-model="data.answer" :disabled="disabled" @change="handleChange">
-          <div class="question-option-item" v-for="item in data.options" :key="item.id">
+          <div class="question-option-item" v-for="item in currentOptions" :key="item.id">
             <el-checkbox :label="item.id">
-              <div class="question-option-item__text" v-html="item.option"></div>
+              <div class="question-option-item__text" v-html="item.abc+'.'+item.option"></div>
             </el-checkbox>
           </div>
         </el-checkbox-group>
@@ -77,16 +77,7 @@ export default {
     questionType() {
       // (1:单选题,2:多选题,3:问答题,5:案例题,6:判断题,7:实操题,8:情景题)
       const questionType = parseInt(this.data.type)
-      console.log(questionType, '=tyoe')
-      const { answer_count: answerCount = 0 } = this.data
-      if ([5, 7, 8].includes(questionType)) {
-        if (answerCount >= 2) {
-          return 2
-        }
-        return answerCount || 3
-      } else {
-        return questionType
-      }
+      return questionType
     },
     // 26个英文字母
     A_Z() {
@@ -98,48 +89,20 @@ export default {
     },
     // 处理后的options数据
     currentOptions() {
-      if (!this.data.question_options) {
+      if (!this.data.options) {
         return []
       }
       return this.data.options.map((item, index) => {
         // 英文字母 + 名称
         item.abc = this.A_Z[index]
-        item.abc_option = `${this.A_Z[index]}. ${item.option}`
-        // 提交时的选中状态
-        item.checked = this.data.userAnswerData.answer.includes(item.id)
-        // 处理正确的选中状态
-        const hasChecked = Object.prototype.hasOwnProperty.call(item, 'isRight')
-        const rightAnswer = this.data.question_answer || []
-        if (!hasChecked && rightAnswer) {
-          item.isRight = Array.isArray(rightAnswer) ? rightAnswer.includes(item.id) : rightAnswer === item.id
-        }
         return item
       })
-    },
-    // 正确答案显示的英文字母
-    correctAnswerText() {
-      const result = this.currentOptions.reduce((result, item) => {
-        item.isRight && result.push(item.abc)
-        return result
-      }, [])
-      return result.join('、')
-    },
-    // // 提交答案显示的英文字母
-    submitAnswerText() {
-      const result = this.currentOptions.reduce((result, item) => {
-        item.checked && result.push(item.abc)
-        return result
-      }, [])
-      return result.join('、')
     }
   },
   methods: {
     handleChange() {
       this.$emit('change', this.data)
     }
-  },
-  mounted() {
-    console.log(this.data, '===123')
   }
 }
 </script>

src/modules/teacher/data/exam/views/TopicData.vue

 <template>
-  <div>
-    <question-details class="exam" :data="examData" v-if="Object.keys(examData).length"></question-details>
+  <div v-if="Object.keys(examData).length">
+    <question-details class="exam" :data="examData"></question-details>
     <div class="flex-box">
-      <topic-data-info class="flex"></topic-data-info>
-      <topic-data-chart class="flex"></topic-data-chart>
+      <topic-data-info :data="topicInfo" class="flex"></topic-data-info>
+      <topic-data-chart :data="examData" class="flex"></topic-data-chart>
     </div>
     <el-card>
       <div slot="header" style="display: flex; align-items: center">
@@ -24,50 +24,36 @@ export default {
   data() {
     return {
       examData: {},
-      topicInfo: {}
+      topicInfo: []
     }
   },
   computed: {
+    A_Z() {
+      const result = []
+      for (let i = 0; i < 26; i++) {
+        result.push(String.fromCharCode(65 + i))
+      }
+      return result
+    },
     // 列表配置
     tableOptions() {
       return {
         remote: {
-          httpRequest: api.getExamList,
+          // httpRequest: api.getExamList,
           params: {
             type: 'examination',
             course_id: '',
             examination_id: ''
           }
         },
-        filters: [
-          // {
-          //   type: 'select',
-          //   prop: 'examination_id',
-          //   placeholder: '考试名称',
-          //   label: '考试名称',
-          //   options: this.conditionList.examination_list,
-          //   labelKey: 'paper_title',
-          //   valueKey: 'id',
-          //   filterable: true
-          // },
-          // {
-          //   type: 'select',
-          //   prop: 'course_id',
-          //   placeholder: '所属课程',
-          //   label: '所属课程',
-          //   options: this.conditionList.course_list,
-          //   labelKey: 'course_name',
-          //   valueKey: 'id',
-          //   filterable: true
-          // }
-        ],
         columns: [
-          { label: '学生ID', prop: 'examination_name', align: 'center' },
-          { label: '学生姓名', prop: 'course_name', align: 'center' },
-          { label: '所在班级', prop: 'join_num', align: 'center' },
-          { label: '选择答案', prop: 'join_rate', align: 'center' },
-          { label: '本题得分', prop: 'average', align: 'center' }
-        ]
+          { label: '学生ID', prop: 'student_id', align: 'center' },
+          { label: '学生姓名', prop: 'personal_name', align: 'center' },
+          { label: '所在班级', prop: 'class_name', align: 'center' },
+          { label: '选择答案', prop: 'answer', align: 'center' },
+          { label: '本题得分', prop: 'score', align: 'center' }
+        ],
+        data: []
       }
     }
   },
@@ -79,15 +65,28 @@ export default {
       const query = this.$route.query
       const params = { type: 'examination', course_id: query.course_id, examination_id: query.examination_id, chapter_id: query.chapter_id, question_id: query.question_id }
       api.getQuestionsDetails(params).then(response => {
-        console.log(response)
         const data = response.data
+        data.options.map((item, index) => {
+          item.option = `${this.A_Z[index]}.${item.option}`
+          return item
+        })
         this.examData = data
         this.topicInfo = [
-          { title: '本题分数', value: data }
+          { title: '本题分数', value: data.total_score },
+          { title: '平均得分', value: data.average },
+          { title: '正确率', value: data.rate }
         ]
-        console.log(this.examData, '=2333')
-        // this.data = JSON.parse(response.data).sheet
-        // this.setExamData()
+        this.tableOptions.data = data.user_list.reduce((a, b) => {
+          const answer = []
+          const opt = data.options
+          b.answer.forEach(item => {
+            const findOpt = opt.find(d => d.id === item)
+            findOpt && answer.push(findOpt.option)
+          })
+          b.answer = answer.join(',')
+          a.push(b)
+          return a
+        }, [])
       })
     },
     setExamData() {