|
|
@@ -0,0 +1,1242 @@
|
|
|
+<template>
|
|
|
+ <div class="choseWorksDetailDialog">
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="show"
|
|
|
+ width="100%"
|
|
|
+ height="100%"
|
|
|
+ fullscreen
|
|
|
+ :modal="true"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :show-close="false"
|
|
|
+ >
|
|
|
+ <div class="s_box">
|
|
|
+ <div class="s_b_main">
|
|
|
+ <div class="s_b_m_top">
|
|
|
+ <div class="s_b_m_t_left">
|
|
|
+ <span
|
|
|
+ v-for="item in dialogTypeList"
|
|
|
+ :key="item.value"
|
|
|
+ :class="{ s_b_m_t_l_active: showType === item.value }"
|
|
|
+ @click="changeShowType(item.value)"
|
|
|
+ >{{ item.label }}</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="s_b_m_t_right">
|
|
|
+ <span @click="close">关闭</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="s_b_m_bottom">
|
|
|
+ <div class="s_b_m_b_item" v-if="showType === 0">
|
|
|
+ <div class="s_b_m_b_i_main">
|
|
|
+ <div class="s_b_m_b_i_m_title" v-if="testData">
|
|
|
+ <div>
|
|
|
+ <svg
|
|
|
+ t="1731461684123"
|
|
|
+ class="icon"
|
|
|
+ viewBox="0 0 1024 1024"
|
|
|
+ version="1.1"
|
|
|
+ xmlns="http://www.w3.org/2000/svg"
|
|
|
+ p-id="4452"
|
|
|
+ width="200"
|
|
|
+ height="200"
|
|
|
+ >
|
|
|
+ <path
|
|
|
+ d="M361.425 318.506h389.4v427.6h-389.4z"
|
|
|
+ fill="#CFD5F8"
|
|
|
+ p-id="4453"
|
|
|
+ ></path>
|
|
|
+ <path
|
|
|
+ d="M773.825 514.306h-293.3v-48.1h293.3v48.1z m0-216.4h-293.3v48.1h293.3v-48.1z m0 336.7h-293.3v48.1h293.3v-48.1z m-415.5-168.4c-13.3 0.2-23.9 11.2-23.7 24.4 0.2 13.3 11.2 23.9 24.4 23.7 13.1-0.2 23.7-10.9 23.7-24 0-13.3-10.8-24.1-24-24.1h-0.4m0-48.1c39.8 0.6 71.6 33.5 71 73.3s-33.5 71.6-73.3 71c-39.4-0.6-71-32.7-71-72.2 0-39.9 32.3-72.2 72.2-72.2 0.3 0.1 0.7 0.1 1.1 0.1z m0-120.2c-13.3 0.2-23.9 11.2-23.7 24.4 0.2 13.3 11.2 23.9 24.4 23.7 13.1-0.2 23.7-10.9 23.7-24 0-13.3-10.8-24.1-24.1-24.1h-0.3m0-48.1c39.8 0.6 71.6 33.5 71 73.3s-33.5 71.6-73.3 71c-39.4-0.6-71-32.8-71-72.2 0-39.9 32.3-72.2 72.1-72.2 0.4 0 0.8 0 1.2 0.1z m0 384.8c-13.3 0.2-23.9 11.2-23.7 24.4 0.2 13.3 11.2 23.9 24.4 23.7 13.1-0.2 23.7-10.9 23.7-24 0-13.3-10.8-24.1-24-24.1h-0.4m0-48.2c39.8 0.6 71.6 33.5 71 73.3-0.6 39.8-33.5 71.6-73.3 71-39.4-0.6-71-32.7-71-72.2 0-39.9 32.3-72.2 72.2-72.2 0.3 0.1 0.7 0.1 1.1 0.1z"
|
|
|
+ fill="#486EFF"
|
|
|
+ p-id="4454"
|
|
|
+ ></path>
|
|
|
+ </svg>
|
|
|
+ <span>选择题</span>
|
|
|
+ </div>
|
|
|
+ <span v-if="testData.toolDetail">{{ testData.toolDetail }}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <span>题目内容</span>
|
|
|
+
|
|
|
+ <div
|
|
|
+ class="s_b_m_b_i_m_choseList"
|
|
|
+ v-for="(item, index) in testJson"
|
|
|
+ >
|
|
|
+ <div class="s_b_m_b_i_m_c_title">
|
|
|
+ <span>{{ index + 1 }}</span>
|
|
|
+ <svg
|
|
|
+ width="16"
|
|
|
+ height="16"
|
|
|
+ viewBox="0 0 16 16"
|
|
|
+ fill="none"
|
|
|
+ xmlns="http://www.w3.org/2000/svg"
|
|
|
+ >
|
|
|
+ <path
|
|
|
+ d="M15.3536 8.35355C15.5488 8.15829 15.5488 7.84171 15.3536 7.64645L12.1716 4.46447C11.9763 4.2692 11.6597 4.2692 11.4645 4.46447C11.2692 4.65973 11.2692 4.97631 11.4645 5.17157L14.2929 8L11.4645 10.8284C11.2692 11.0237 11.2692 11.3403 11.4645 11.5355C11.6597 11.7308 11.9763 11.7308 12.1716 11.5355L15.3536 8.35355ZM1 8.5H15V7.5H1V8.5Z"
|
|
|
+ fill="#3681FC"
|
|
|
+ />
|
|
|
+ </svg>
|
|
|
+
|
|
|
+ <span
|
|
|
+ >{{
|
|
|
+ typeof item.answer === "number"
|
|
|
+ ? "单选题："
|
|
|
+ : "多选题："
|
|
|
+ }}{{ item.teststitle }}</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div
|
|
|
+ class="s_b_m_b_i_m_c_options"
|
|
|
+ v-for="(item2, index2) in item.checkList"
|
|
|
+ :class="{
|
|
|
+ s_b_m_b_i_m_c_o_right:
|
|
|
+ typeof item.answer === 'number'
|
|
|
+ ? item.answer === index2
|
|
|
+ : item.answer.includes(index2)
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <div class="s_b_m_b_i_m_c_o_btn">
|
|
|
+ <span
|
|
|
+ class="s_b_m_b_i_m_c_o_btn1"
|
|
|
+ v-if="typeof item.answer === 'number'"
|
|
|
+ >
|
|
|
+ <span v-if="item.answer === index2"></span>
|
|
|
+ </span>
|
|
|
+ <span class="s_b_m_b_i_m_c_o_btn2" v-else>
|
|
|
+ <span v-if="item.answer.includes(index2)">
|
|
|
+ <svg
|
|
|
+ width="8"
|
|
|
+ height="6"
|
|
|
+ viewBox="0 0 8 6"
|
|
|
+ fill="none"
|
|
|
+ xmlns="http://www.w3.org/2000/svg"
|
|
|
+ >
|
|
|
+ <path
|
|
|
+ fill-rule="evenodd"
|
|
|
+ clip-rule="evenodd"
|
|
|
+ d="M7.44194 0.558058C7.68602 0.802136 7.68602 1.19786 7.44194 1.44194L3.44194 5.44194C3.19786 5.68602 2.80214 5.68602 2.55806 5.44194L0.558058 3.44194C0.313981 3.19786 0.313981 2.80214 0.558058 2.55806C0.802136 2.31398 1.19786 2.31398 1.44194 2.55806L3 4.11612L6.55806 0.558058C6.80214 0.313981 7.19786 0.313981 7.44194 0.558058Z"
|
|
|
+ fill="white"
|
|
|
+ />
|
|
|
+ </svg>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <span>
|
|
|
+ <img
|
|
|
+ v-if="item2.imgType && item2.imgType === 1"
|
|
|
+ :src="item2.src"
|
|
|
+ alt=""
|
|
|
+ @click="$hevueImgPreview(item2.src)"
|
|
|
+ />
|
|
|
+ <span v-else>{{ item2 }}</span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="s_b_m_b_item" v-if="showType === 1">
|
|
|
+
|
|
|
+ <div class="s_b_m_b_i_eChartsArea">
|
|
|
+ <div class="s_b_m_b_i_e_title">
|
|
|
+ <span v-for="item in statisticsTypeList" :key="item.value" :class="{'s_b_m_b_i_e_t_active':showStatisticsType===item.value}" @click="changeShowStatisticsType(item.value)">{{item.label}}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="s_b_m_b_i_e_charts">
|
|
|
+ <eChartsView1 v-if="showStatisticsType===0 && accuracyRateData" :data="accuracyRateData"/>
|
|
|
+ <eChartsView2 v-if="showStatisticsType===1 && optionSummaryData" :data="optionSummaryData"/>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="s_b_m_b_i_e_charts_bottom">
|
|
|
+ <span v-if="accuracyRateData" v-for="(item,index) in accuracyRateData.series[0].data">第{{ index+1 }}题 {{ item }}%</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="s_b_m_b_i_table">
|
|
|
+ <div
|
|
|
+ class="s_b_m_b_i_m_choseList"
|
|
|
+ v-for="(item, index) in tableData"
|
|
|
+ >
|
|
|
+ <div class="s_b_m_b_i_m_c_title">
|
|
|
+ <span>{{ index + 1 }}</span>
|
|
|
+ <svg
|
|
|
+ width="16"
|
|
|
+ height="16"
|
|
|
+ viewBox="0 0 16 16"
|
|
|
+ fill="none"
|
|
|
+ xmlns="http://www.w3.org/2000/svg"
|
|
|
+ >
|
|
|
+ <path
|
|
|
+ d="M15.3536 8.35355C15.5488 8.15829 15.5488 7.84171 15.3536 7.64645L12.1716 4.46447C11.9763 4.2692 11.6597 4.2692 11.4645 4.46447C11.2692 4.65973 11.2692 4.97631 11.4645 5.17157L14.2929 8L11.4645 10.8284C11.2692 11.0237 11.2692 11.3403 11.4645 11.5355C11.6597 11.7308 11.9763 11.7308 12.1716 11.5355L15.3536 8.35355ZM1 8.5H15V7.5H1V8.5Z"
|
|
|
+ fill="#3681FC"
|
|
|
+ />
|
|
|
+ </svg>
|
|
|
+
|
|
|
+ <span
|
|
|
+ >{{
|
|
|
+ typeof item.answer === "number"
|
|
|
+ ? "单选题："
|
|
|
+ : "多选题："
|
|
|
+ }}{{ item.title }}</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="s_b_m_b_i_m_c_accuracyRate">
|
|
|
+ <span>准确率：{{ item.accuracyRate }}%</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="s_b_m_b_i_m_c_table">
|
|
|
+ <el-table :data="item.optionsList" style="width: 800px">
|
|
|
+ <el-table-column prop="label" label="选项">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <img @click.stop="$hevueImgPreview(scope.row.label.src)" class="tableImage" v-if="scope.row.label.imgType && scope.row.label.imgType === 1" :src="scope.row.label.src"></img>
|
|
|
+ <span v-else>{{ scope.row.label }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="count" align="center" label="小计" width="60">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="scale" label="比例" width="300">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div class="tableProgress">
|
|
|
+ <el-progress :percentage="scope.row.scale"></el-progress>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="s_b_m_b_item s_b_m_b_worksSubmit" v-if="showType === 2">
|
|
|
+ <div class="s_b_b_i_noSubmit">
|
|
|
+ <div class="s_b_b_i_ws_top">
|
|
|
+ <div class="s_b_b_i_ws_t_left">
|
|
|
+ <div @click="foldList.noSubmit = !foldList.noSubmit">
|
|
|
+ <span>未提交</span>
|
|
|
+ <span> ({{ noWorksStudent.length }}) </span>
|
|
|
+ <svg
|
|
|
+ :style="{
|
|
|
+ transform: foldList.noSubmit
|
|
|
+ ? 'rotate(-180deg)'
|
|
|
+ : 'rotate(0deg)'
|
|
|
+ }"
|
|
|
+ width="16"
|
|
|
+ height="16"
|
|
|
+ viewBox="0 0 16 16"
|
|
|
+ xmlns="http://www.w3.org/2000/svg"
|
|
|
+ >
|
|
|
+ <path
|
|
|
+ d="M3.54028 6.45964L4.45952 5.54041L7.9999 9.08079L11.5403 5.54041L12.4595 6.45964L7.9999 10.9193L3.54028 6.45964Z"
|
|
|
+ />
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="s_b_b_i_ws_t_right"></div>
|
|
|
+ </div>
|
|
|
+ <div class="s_b_b_i_ws_bottom" v-show="!foldList.noSubmit">
|
|
|
+ <div
|
|
|
+ class="s_b_b_i_ws_b_noSubmitItem"
|
|
|
+ v-if="noWorksStudent.length > 0"
|
|
|
+ v-for="item in noWorksStudent"
|
|
|
+ :key="item.userid"
|
|
|
+ >
|
|
|
+ {{ item.student }}
|
|
|
+ </div>
|
|
|
+ <span v-if="noWorksStudent.length === 0"
|
|
|
+ >无未提交学生...</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="s_b_b_i_worksPreview">
|
|
|
+ <div class="s_b_b_i_ws_top">
|
|
|
+ <div class="s_b_b_i_ws_t_left">
|
|
|
+ <div
|
|
|
+ @click="foldList.worksPreview = !foldList.worksPreview"
|
|
|
+ >
|
|
|
+ <span>作业预览</span>
|
|
|
+ <span> ({{ worksStudent.length }}) </span>
|
|
|
+ <svg
|
|
|
+ :style="{
|
|
|
+ transform: foldList.worksPreview
|
|
|
+ ? 'rotate(-180deg)'
|
|
|
+ : 'rotate(0deg)'
|
|
|
+ }"
|
|
|
+ width="16"
|
|
|
+ height="16"
|
|
|
+ viewBox="0 0 16 16"
|
|
|
+ xmlns="http://www.w3.org/2000/svg"
|
|
|
+ >
|
|
|
+ <path
|
|
|
+ d="M3.54028 6.45964L4.45952 5.54041L7.9999 9.08079L11.5403 5.54041L12.4595 6.45964L7.9999 10.9193L3.54028 6.45964Z"
|
|
|
+ />
|
|
|
+ </svg>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="s_b_b_i_ws_t_right"></div>
|
|
|
+ </div>
|
|
|
+ <div class="s_b_b_i_ws_bottom" v-show="!foldList.worksPreview">
|
|
|
+ <div
|
|
|
+ class="s_b_b_i_ws_b_isSubmitItem"
|
|
|
+ v-if="worksStudent.length > 0"
|
|
|
+ v-for="item in worksStudent"
|
|
|
+ :key="item.userid"
|
|
|
+ >
|
|
|
+ <div class="s_b_b_i_ws_b_i_s_i_t_top" @click="openTools(item)">
|
|
|
+ <div
|
|
|
+ class="s_b_b_i_ws_b_i_s_i_t_t_delIcon"
|
|
|
+ @click.stop="deleteWorks(item.wid)"
|
|
|
+ >
|
|
|
+ <img src="../../assets/deleteworks.png" alt="" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="s_b_b_i_ws_b_i_s_i_t_t_answer">
|
|
|
+
|
|
|
+ <span v-for="(answer,answerIndex) in worksCheckAnswer(item)" :key="item.userid+'-'+answerIndex+'-'+answer.index">
|
|
|
+ <span v-if="answer.type===1" v-for="item2 in answer.label" :key="answer.index+'-'+item.userid+'-1'">
|
|
|
+ <span :class="`${item2.right?'answerRight':'answerWrong'}`">{{ item2.label }}</span>
|
|
|
+ </span>
|
|
|
+ <span v-if="answer.type===2" class="answer2" :class="`${answer.isRight?'answerRightLine':'answerWrongLine'}`" v-for="item3 in answer.label" :key="answer.index+'-'+item.userid+'-2'">
|
|
|
+ <span :class="`${item3.right?'answerRight':'answerWrong'}`">{{ item3.label }}</span>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+
|
|
|
+ <!-- <span>{{ worksCheckAnswer(item) }}</span> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="s_b_b_i_ws_b_i_s_i_t_bottom">
|
|
|
+ <el-tooltip
|
|
|
+ class="item"
|
|
|
+ effect="dark"
|
|
|
+ :content="item.sName"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <span>{{ item.sName }}</span>
|
|
|
+ </el-tooltip>
|
|
|
+
|
|
|
+ <span>{{ item.time }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <span v-if="worksStudent.length === 0">暂无提交学生...</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import eChartsView from './eChartsView.vue'
|
|
|
+export default {
|
|
|
+ components:{
|
|
|
+ eChartsView1:eChartsView,
|
|
|
+ eChartsView2:eChartsView
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ worksStudentData: {
|
|
|
+ type: Array,
|
|
|
+ default: () => []
|
|
|
+ },
|
|
|
+ noWorksSData: {
|
|
|
+ type: Array,
|
|
|
+ default: () => []
|
|
|
+ },
|
|
|
+ chapInfoListData: {
|
|
|
+ type: Array,
|
|
|
+ default: () => []
|
|
|
+ },
|
|
|
+ courseType: {
|
|
|
+ type: String,
|
|
|
+ default: ""
|
|
|
+ },
|
|
|
+ taskCount: {
|
|
|
+ type: Number,
|
|
|
+ default: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ show: false,
|
|
|
+ showType: 0,
|
|
|
+ showStatisticsType:0,
|
|
|
+ data: null,
|
|
|
+ testJson: null,
|
|
|
+ testData: null,
|
|
|
+ toolIndex: null,
|
|
|
+ worksStudent: [],
|
|
|
+ noWorksStudent: [],
|
|
|
+ foldList: {
|
|
|
+ noSubmit: false,
|
|
|
+ worksPreview: false
|
|
|
+ },
|
|
|
+ dialogTypeList: [
|
|
|
+ { label: "作业详细", value: 0, loading: false },
|
|
|
+ { label: "题目统计", value: 1, loading: false },
|
|
|
+ { label: "学生统计", value: 2, loading: false }
|
|
|
+ ],
|
|
|
+ statisticsTypeList:[
|
|
|
+ {label:"准确率",value:0},
|
|
|
+ {label:"选项汇总",value:1}
|
|
|
+ ],
|
|
|
+ optionTypeList:['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z']
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ tableData() {
|
|
|
+ let _result = [];
|
|
|
+ if (this.show && this.toolIndex !== null) {
|
|
|
+ let worksJson = [];
|
|
|
+ if (this.testJson) {
|
|
|
+ worksJson = JSON.parse(JSON.stringify(this.testJson));
|
|
|
+ } else if (this.worksStudent.length > 0) {
|
|
|
+ worksJson = JSON.parse(this.worksStudent[0].works)[0].testJson
|
|
|
+ .testJson;
|
|
|
+ }
|
|
|
+
|
|
|
+ let isWorksData = [];
|
|
|
+ let pushData = [];
|
|
|
+
|
|
|
+ isWorksData = this.worksStudent.map(i => JSON.parse(i.works)[0].anwer);
|
|
|
+
|
|
|
+ pushData = worksJson.map((item, index) => {
|
|
|
+ return {
|
|
|
+ title: item.teststitle,
|
|
|
+ answer: item.answer,
|
|
|
+ accuracyRate: 0,
|
|
|
+ accuracyCount: 0,
|
|
|
+ choseCount: 0,
|
|
|
+ optionsList: item.checkList.map((item2, index2) => {
|
|
|
+ return { label: item2, count: 0, scale: 0 };
|
|
|
+ })
|
|
|
+ };
|
|
|
+ });
|
|
|
+ isWorksData.forEach(i => {
|
|
|
+ i.forEach((item, index) => {
|
|
|
+ pushData[index].choseCount++; //做了这道题的人数+1
|
|
|
+ if (typeof item === "number") {
|
|
|
+ //单选题
|
|
|
+ pushData[index].optionsList[item].count += 1; //选了这选项的次数+1
|
|
|
+ if (pushData[index].answer === item) {
|
|
|
+ pushData[index].accuracyCount += 1; //选对了的人数+1
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ //多选题
|
|
|
+ item.forEach(i2 => {
|
|
|
+ pushData[index].optionsList[i2].count += 1; //选了这选项的次数+1
|
|
|
+ });
|
|
|
+ if (JSON.stringify(item.sort()) === JSON.stringify(pushData[index].answer.sort())) {
|
|
|
+ pushData[index].accuracyCount += 1; //选对了的人数+1
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ pushData.forEach(i => {
|
|
|
+ i.accuracyRate = parseFloat(((i.accuracyCount / i.choseCount) * 100).toFixed(2));
|
|
|
+ i.optionsList.forEach(i2 => {
|
|
|
+ i2.scale = parseFloat(((i2.count / i.choseCount) * 100).toFixed(2));
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ _result = pushData;
|
|
|
+ }
|
|
|
+ return _result;
|
|
|
+ },
|
|
|
+ accuracyRateData(){
|
|
|
+ let _result = null;
|
|
|
+ if(this.tableData.length>0){
|
|
|
+ let eChartsData = {
|
|
|
+ xAxis: {
|
|
|
+ type: 'category',
|
|
|
+ data: []
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ type: 'value' // y 轴的值类型
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: '准确率',
|
|
|
+ type: 'bar',
|
|
|
+ data: [],
|
|
|
+ itemStyle: {
|
|
|
+ color: '#5c87ef' // 设置条形图的颜色
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ // 设置条形图的间隔
|
|
|
+ barCategoryGap: '50%',
|
|
|
+ }
|
|
|
+
|
|
|
+ this.tableData.forEach((item,index)=>{
|
|
|
+ eChartsData.xAxis.data.push(`第${index+1}题`);
|
|
|
+ eChartsData.series[0].data.push(item.accuracyRate);
|
|
|
+ })
|
|
|
+
|
|
|
+ _result = eChartsData;
|
|
|
+ // eChartsData.xAxis.data = this.tableData.
|
|
|
+ }
|
|
|
+
|
|
|
+ return _result;
|
|
|
+ },
|
|
|
+ optionSummaryData(){
|
|
|
+ let _result = null;
|
|
|
+
|
|
|
+ if(this.tableData.length>0){
|
|
|
+ let eChartsData = {
|
|
|
+ legend: {},
|
|
|
+ tooltip: {},
|
|
|
+ dataset: {
|
|
|
+ source: [
|
|
|
+ ['选项'],
|
|
|
+ // ['Matcha Latte', 43.3,0, 93.7,90],
|
|
|
+ // ['Milk Tea', 83.1, 73.4, 55.1],
|
|
|
+ // ['Cheese Cocoa', 86.4, 65.2, 82.5],
|
|
|
+ // ['Walnut Brownie', 72.4, 53.9, 39.1]
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ xAxis: { type: 'category' },
|
|
|
+ yAxis: {},
|
|
|
+ // Declare several bar series, each will be mapped
|
|
|
+ // to a column of dataset.source by default.
|
|
|
+ series: [
|
|
|
+ // { type: 'bar' },
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ let maxChoseLength = this.tableData.reduce((max,item)=>{
|
|
|
+ return Math.max(max,item.optionsList.length)
|
|
|
+ },0)
|
|
|
+
|
|
|
+ for(let i=0;i<maxChoseLength;i++){
|
|
|
+ eChartsData.dataset.source[0].push(`选项${i+1}`)
|
|
|
+ eChartsData.series.push({type:'bar'})//,label: { show: true, position: 'top' }
|
|
|
+ }
|
|
|
+
|
|
|
+ this.tableData.forEach((item,index)=>{
|
|
|
+ eChartsData.dataset.source.push([`第${index+1}题`])
|
|
|
+ item.optionsList.forEach((item2,index2)=>{
|
|
|
+ eChartsData.dataset.source[index+1].push(item2.count)
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+ _result = eChartsData;
|
|
|
+ }
|
|
|
+ return _result;
|
|
|
+ },
|
|
|
+ worksCheckAnswer(){
|
|
|
+ return data=>{
|
|
|
+ let _result = [];
|
|
|
+ let works = JSON.parse(data.works);
|
|
|
+ let testJson = works[0].testJson.testJson;
|
|
|
+ let worksAnswer = works[0].anwer;
|
|
|
+
|
|
|
+ let answerList = [];
|
|
|
+
|
|
|
+
|
|
|
+ worksAnswer.forEach((item,index)=>{
|
|
|
+ let _workAnswer = testJson[index].answer;
|
|
|
+ if(typeof item === "number"){//单选题
|
|
|
+ if(item===_workAnswer){
|
|
|
+ answerList.push({type:1,index:index,label:[{right:true,label:this.optionTypeList[item]}]})
|
|
|
+ }else{
|
|
|
+ answerList.push({type:1,index:index,label:[{right:false,label:this.optionTypeList[item]}],})
|
|
|
+ }
|
|
|
+ }else{//多选题
|
|
|
+ let _item = item.sort();
|
|
|
+ let _workAnswer2 = _workAnswer.sort();
|
|
|
+ let _obj = {type:2,isRight:JSON.stringify(_item)===JSON.stringify(_workAnswer2),index:index,label:[]};
|
|
|
+ _item.forEach((item2,index2)=>{
|
|
|
+ if(_workAnswer2.includes(item2)){
|
|
|
+ _obj.label.push({right:true,label:this.optionTypeList[item2]})
|
|
|
+ }else{
|
|
|
+ _obj.label.push({right:false,label:this.optionTypeList[item2]})
|
|
|
+ }
|
|
|
+ })
|
|
|
+ answerList.push(_obj);
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ _result = answerList;
|
|
|
+ // _result = works[0].anwer;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ return _result;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ worksStudentData: {
|
|
|
+ handler(newValue) {
|
|
|
+ if (
|
|
|
+ this.show &&
|
|
|
+ this.toolIndex !== null &&
|
|
|
+ JSON.stringify(this.worksStudent) !==
|
|
|
+ JSON.stringify(newValue[this.toolIndex])
|
|
|
+ ) {
|
|
|
+ this.worksStudent = JSON.parse(
|
|
|
+ JSON.stringify(newValue[this.toolIndex])
|
|
|
+ );
|
|
|
+ this.dialogTypeList[2].loading = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
+ },
|
|
|
+ noWorksSData: {
|
|
|
+ handler(newValue) {
|
|
|
+ if (
|
|
|
+ this.show &&
|
|
|
+ this.toolIndex !== null &&
|
|
|
+ JSON.stringify(this.noWorksStudent) !==
|
|
|
+ JSON.stringify(newValue[this.toolIndex])
|
|
|
+ ) {
|
|
|
+ this.noWorksStudent = JSON.parse(
|
|
|
+ JSON.stringify(newValue[this.toolIndex])
|
|
|
+ );
|
|
|
+ this.dialogTypeList[2].loading = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ open(data) {
|
|
|
+ if (this.show) return;
|
|
|
+ this.show = true;
|
|
|
+ this.data = data;
|
|
|
+ this.toolIndex = data.toolIndex;
|
|
|
+ this.setData();
|
|
|
+ },
|
|
|
+ setData() {
|
|
|
+ if (this.show && this.toolIndex !== null) {
|
|
|
+ this.worksStudent = JSON.parse(
|
|
|
+ JSON.stringify(this.worksStudentData[this.toolIndex])
|
|
|
+ );
|
|
|
+ this.noWorksStudent = JSON.parse(
|
|
|
+ JSON.stringify(this.noWorksSData[this.toolIndex])
|
|
|
+ );
|
|
|
+ let _tempData = this.chapInfoListData[this.courseType].chapterInfo[0]
|
|
|
+ .taskJson[this.taskCount].toolChoose[this.toolIndex];
|
|
|
+ this.testData = _tempData ? _tempData : null;
|
|
|
+ this.testJson = this.testData.testJson
|
|
|
+ ? this.testData.testJson.testJson
|
|
|
+ : null;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ this.show = false;
|
|
|
+ this.init();
|
|
|
+ this.$emit("changeSplitScreenBehavior",{code:99})
|
|
|
+ },
|
|
|
+ init() {
|
|
|
+ this.data = null;
|
|
|
+ this.showType = 0;
|
|
|
+ this.showStatisticsType = 0;
|
|
|
+ this.testJson = null;
|
|
|
+ this.worksStudent = [];
|
|
|
+ this.noWorksStudent = [];
|
|
|
+ this.toolIndex = null;
|
|
|
+ this.testData = null;
|
|
|
+ this.foldList = {
|
|
|
+ noSubmit: false,
|
|
|
+ worksPreview: false
|
|
|
+ };
|
|
|
+ },
|
|
|
+ changeShowType(type) {
|
|
|
+ this.showType = type;
|
|
|
+ this.$emit("changeSplitScreenBehavior",{code: 1,
|
|
|
+ form: {
|
|
|
+ toolIndex: this.toolIndex,
|
|
|
+ courseType: this.courseType,
|
|
|
+ taskCount: this.taskCount,
|
|
|
+ type: this.showType,
|
|
|
+ showStatisticsType:this.showStatisticsType
|
|
|
+ }})
|
|
|
+ },
|
|
|
+ deleteWorks(wid) {
|
|
|
+ this.$emit("deleteWorks", wid);
|
|
|
+ this.dialogTypeList[2].loading = true;
|
|
|
+ },
|
|
|
+ openTools(data){
|
|
|
+ this.$emit("openTools",45,this.toolIndex,this.taskCount,data.works,data.sName)
|
|
|
+ },
|
|
|
+ changeShowStatisticsType(type){
|
|
|
+ this.showStatisticsType = type;
|
|
|
+ this.$emit("changeSplitScreenBehavior",{code: 1,
|
|
|
+ form: {
|
|
|
+ toolIndex: this.toolIndex,
|
|
|
+ courseType: this.courseType,
|
|
|
+ taskCount: this.taskCount,
|
|
|
+ type: this.showType,
|
|
|
+ showStatisticsType:this.showStatisticsType
|
|
|
+ }})
|
|
|
+ },
|
|
|
+ splitScreenFn(data){
|
|
|
+ console.log("splitScreenFn",data)
|
|
|
+ if(data.type!==undefined){
|
|
|
+ this.showType = data.type;
|
|
|
+ }
|
|
|
+ if(data.showStatisticsType!==undefined){
|
|
|
+ this.showStatisticsType = data.showStatisticsType;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.choseWorksDetailDialog {
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+}
|
|
|
+
|
|
|
+.choseWorksDetailDialog >>> .el-dialog__header,
|
|
|
+.choseWorksDetailDialog >>> .el-dialog__footer {
|
|
|
+ display: none; /* 隐藏头部和底部 */
|
|
|
+}
|
|
|
+
|
|
|
+.choseWorksDetailDialog >>> .el-dialog__body {
|
|
|
+ padding: 0;
|
|
|
+ margin: 0;
|
|
|
+ height: 100vh;
|
|
|
+ width: 100vw;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.s_box {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 25px;
|
|
|
+ background-color: #f3f7fd;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_main {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_top {
|
|
|
+ width: 100%;
|
|
|
+ height: 70px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_t_left {
|
|
|
+ width: auto;
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 30px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ overflow: auto;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_t_left > span {
|
|
|
+ font-size: 20px;
|
|
|
+ /* font-weight: bold; */
|
|
|
+ cursor: pointer;
|
|
|
+ margin-right: 40px;
|
|
|
+ position: relative;
|
|
|
+ transition: 0.3s;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_t_left > span.s_b_m_t_l_active {
|
|
|
+ color: #3681fc;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_t_l_active::after {
|
|
|
+ content: "";
|
|
|
+ display: inline-block;
|
|
|
+ width: 100%;
|
|
|
+ height: 4px;
|
|
|
+ background-color: #3681fc;
|
|
|
+ position: absolute;
|
|
|
+ bottom: -15px;
|
|
|
+ left: 0;
|
|
|
+ border-radius: 2px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_t_right {
|
|
|
+ width: 100px;
|
|
|
+ margin-right: 30px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_t_right > span {
|
|
|
+ font-size: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_bottom {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100% - 70px);
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_item {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_main {
|
|
|
+ width: 70%;
|
|
|
+ margin: 0 auto;
|
|
|
+ min-width: 1000px;
|
|
|
+ padding: 10px 0 30px 0;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_main > span {
|
|
|
+ font-size: 26px;
|
|
|
+ font-weight: bold;
|
|
|
+ display: block;
|
|
|
+ margin: 30px 0 40px 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_title {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_title > div {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_title > div > svg {
|
|
|
+ width: 60px;
|
|
|
+ height: 60px;
|
|
|
+ margin-right: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_title > div > span {
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_title > span {
|
|
|
+ width: calc(100% - 50px);
|
|
|
+ padding: 20px;
|
|
|
+ display: block;
|
|
|
+ margin: 0 10px;
|
|
|
+ background-color: #f3f7fd;
|
|
|
+ border-radius: 5px;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_choseList {
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 0 0 20px;
|
|
|
+ margin-bottom: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_title {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_title > span:nth-of-type(1) {
|
|
|
+ font-size: 30px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #3681fc;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_title > svg {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ margin: 0 20px 0 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_title > span:nth-of-type(2) {
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_options {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ padding: 15px 15px 15px 15px;
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ background-color: #f3f7fd;
|
|
|
+ border-radius: 30px;
|
|
|
+ margin: 10px 0 10px 0px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_o_right {
|
|
|
+ border: solid 1px #3681fc;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_o_btn {
|
|
|
+ width: 20px;
|
|
|
+ height: 100%;
|
|
|
+ min-height: 20px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_o_btn > span {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+ display: block;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border: solid 1px #3681fc;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_o_btn > span > span {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #3681fc;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_o_btn1 {
|
|
|
+ border-radius: 50%;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_o_btn1 > span::after {
|
|
|
+ content: "";
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ position: absolute;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 50%;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_o_btn2 {
|
|
|
+ border-radius: 2px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_o_btn2 > span > svg {
|
|
|
+ width: 12px;
|
|
|
+ height: 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_options > span > img {
|
|
|
+ max-height: 150px;
|
|
|
+ border-radius: 2px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_options > span {
|
|
|
+ font-size: 16px;
|
|
|
+ display: block;
|
|
|
+ width: calc(100% - 30px);
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_worksSubmit > div {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 20px 20px 20px 30px;
|
|
|
+ margin-bottom: 0px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_top {
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_t_left {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_t_left > div {
|
|
|
+ width: auto;
|
|
|
+ height: auto;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_t_left > div > span {
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-right: 10px;
|
|
|
+ color: #000;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_t_left > div > svg {
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ transition: 0.3s;
|
|
|
+ fill: #000;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_bottom {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_bottom > span {
|
|
|
+ margin-top: 10px;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_noSubmitItem {
|
|
|
+ padding: 10px 15px 10px 15px;
|
|
|
+ border-radius: 4px;
|
|
|
+ background-color: #f3f7fd;
|
|
|
+ margin-left: 10px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ color: #00000099;
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_isSubmitItem {
|
|
|
+ width: 250px;
|
|
|
+ height: 180px;
|
|
|
+ border-radius: 8px;
|
|
|
+ background-color: #f3f7fd;
|
|
|
+ margin-left: 10px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ border: solid 1px #e7e7e7;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_i_s_i_t_top {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100% - 50px);
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ padding: 10px;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ background-image: linear-gradient(
|
|
|
+ 45deg,
|
|
|
+ #e3eeff 0%,
|
|
|
+ #dbe9fd 99%,
|
|
|
+ #e3eeff 100%
|
|
|
+ );
|
|
|
+ position: relative;
|
|
|
+ cursor: pointer;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_i_s_i_t_t_delIcon {
|
|
|
+ width: 25px;
|
|
|
+ height: 25px;
|
|
|
+ position: absolute;
|
|
|
+ right: 10px;
|
|
|
+ top: 10px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_i_s_i_t_t_delIcon > img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_i_s_i_t_bottom {
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 10px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #000;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_i_s_i_t_bottom > span:nth-of-type(1) {
|
|
|
+ /* 溢出显示省略 */
|
|
|
+ width: 80px;
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_i_s_i_t_bottom > span:nth-of-type(2) {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #00000099;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_table {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 30px;
|
|
|
+ margin-bottom: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_accuracyRate{
|
|
|
+ margin-top: 20px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ font-size: 18px;
|
|
|
+ color: #00000099;
|
|
|
+}
|
|
|
+
|
|
|
+.tableImage{
|
|
|
+ width: auto;
|
|
|
+ max-height: 150px;
|
|
|
+ border-radius: 2px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.tableProgress>>>.el-progress-bar>.el-progress-bar__outer{
|
|
|
+ height: 10px !important;
|
|
|
+}
|
|
|
+
|
|
|
+.tableProgress>>>.el-progress__text{
|
|
|
+ font-size: 16px;
|
|
|
+ color: #3681FC;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_table>>>.el-table{
|
|
|
+ border: solid 1px #EBEEF5;
|
|
|
+ border-bottom: none
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_m_c_table>>>.el-table>.el-table__header-wrapper th{
|
|
|
+ background-color: #F9FAFB;
|
|
|
+ color: #000;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_i_s_i_t_t_answer>span{
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ margin: 2px 4px;
|
|
|
+ display: block;
|
|
|
+ float: left;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_ws_b_i_s_i_t_t_answer>span>span{
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+.answer2>span{
|
|
|
+ margin:0 1px;
|
|
|
+}
|
|
|
+
|
|
|
+.answerWrongLine::after{
|
|
|
+ content: '';
|
|
|
+ width: 100%;
|
|
|
+ height: 2px;
|
|
|
+ background-color: #EE3E3E;
|
|
|
+ position: absolute;
|
|
|
+ bottom: -2px;
|
|
|
+ left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.answerRightLine::after{
|
|
|
+ content: '';
|
|
|
+ width: 100%;
|
|
|
+ height: 2px;
|
|
|
+ background-color: #5E9AFC;
|
|
|
+ position: absolute;
|
|
|
+ bottom: -2px;
|
|
|
+ left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.answerRight{
|
|
|
+ color: #5E9AFC !important;
|
|
|
+}
|
|
|
+
|
|
|
+.answerWrong{
|
|
|
+ color: #EE3E3E !important;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+.s_b_m_b_i_eChartsArea{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 30px;
|
|
|
+ margin-bottom: 100px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_e_title{
|
|
|
+ width: 100%;
|
|
|
+ height: 30px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_e_title>span{
|
|
|
+ font-size: 18px;
|
|
|
+ margin-right: 20px;
|
|
|
+ color: #000;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_e_t_active{
|
|
|
+ color: #3681FC !important;
|
|
|
+ text-decoration: underline !important;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_e_charts{
|
|
|
+ width: auto;
|
|
|
+ height: 600px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_e_charts_bottom{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_m_b_i_e_charts_bottom>span{
|
|
|
+ padding: 10px 15px;
|
|
|
+ background-color: #F3F7FD;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-right: 10px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ font-size: 18px;
|
|
|
+ border-radius: 4px;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+/* F9FAFB */
|
|
|
+
|
|
|
+/* .s_b_b_i_noSubmit {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 20px;
|
|
|
+ background-color: red;
|
|
|
+}
|
|
|
+
|
|
|
+.s_b_b_i_worksPreview {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 20px;
|
|
|
+ background-color: blue;
|
|
|
+} */
|
|
|
+</style>
|
SanHQin