zouyf_dev #353
|
@ -15,9 +15,10 @@ export const isJson = (str) => {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @description processList 格式化试题
|
* @description processList 格式化试题
|
||||||
* @param {*} row
|
* @param {*} row
|
||||||
|
* @param {*} aloneOption 选择题中选项是否为每行一个
|
||||||
*/
|
*/
|
||||||
export const processList = (row) => {
|
export const processList = (row, aloneOption=false) => {
|
||||||
for (var i = 0; i < row.length; i++) {
|
for (var i = 0; i < row.length; i++) {
|
||||||
if (isJson(row[i].workanalysis)) {
|
if (isJson(row[i].workanalysis)) {
|
||||||
//1、先默认格式化 格式化各项内容(待优化, 后续界面显示的为format的值)
|
//1、先默认格式化 格式化各项内容(待优化, 后续界面显示的为format的值)
|
||||||
|
@ -55,19 +56,25 @@ export const processList = (row) => {
|
||||||
const workDescArr = element.split('#&')
|
const workDescArr = element.split('#&')
|
||||||
let tmp = ''
|
let tmp = ''
|
||||||
let j = 0
|
let j = 0
|
||||||
for (; j < workDescArr.length; j++) {
|
for(; j<workDescArr.length; j++){
|
||||||
if (j % 2 == 0) {
|
const char = String.fromCharCode(65+j);
|
||||||
tmp += `<div style='width:80%;display:flex;'>`
|
if (aloneOption) {
|
||||||
|
tmp += `<div style='width:100%;display:flex;padding: 2px 0'>${char}.${workDescArr[j]}</div>`;
|
||||||
}
|
}
|
||||||
const char = String.fromCharCode(65 + j)
|
else {
|
||||||
tmp += `<div style='display:flex;margin-left:2%;width:35%;overflow:hidden;text-overflow:ellipsis;font-size:0.9em;'>${char}.${workDescArr[j]}</div>`
|
if(j%2 == 0){
|
||||||
if (j % 2 == 1) {
|
tmp += `<div style='width:100%;display:flex;'>`;
|
||||||
tmp += '</div>'
|
}
|
||||||
|
|
||||||
|
tmp += `<div style='padding-left:10px;width:50%;overflow:hidden;text-overflow:ellipsis;font-size:0.9em;'>${char}.${workDescArr[j]}</div>`;
|
||||||
|
if(j%2 == 1){
|
||||||
|
tmp += '</div>';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// j此刻已自增1, 故当选项为单数时, 需要补充结束标签
|
// j此刻已自增1, 故当选项为单数时, 需要补充结束标签
|
||||||
if (j % 2 == 1) {
|
if(!aloneOption && j%2 == 1){
|
||||||
tmp += '</div>'
|
tmp += '</div>';
|
||||||
}
|
}
|
||||||
|
|
||||||
// workDescArr为 [''] 表示为 判断题或者填空题,这里不需要选项
|
// workDescArr为 [''] 表示为 判断题或者填空题,这里不需要选项
|
||||||
|
@ -136,31 +143,36 @@ export const processList = (row) => {
|
||||||
* ]
|
* ]
|
||||||
*/
|
*/
|
||||||
let workDescArr = JSON.parse(row[i].workdesc)
|
let workDescArr = JSON.parse(row[i].workdesc)
|
||||||
let workDescHtml = `<div style='width:80%;display:flex;>`
|
let workDescHtml = `<div style='width:100%;display:flex;>`
|
||||||
workDescArr.map((item, index) => {
|
workDescArr.map((item, index) => {
|
||||||
if (item.type == '单选题' || item.type == '多选题') {
|
if (item.type == '单选题' || item.type == '多选题') {
|
||||||
workDescHtml += `<div style='width:80%;display:flex;'>${index + 1}. ${item.title}</div>`
|
workDescHtml += `<div style='width:100%;display:flex;'>${index + 1}. ${item.title}</div>`
|
||||||
let tmp = ''
|
let tmp = ''
|
||||||
let j = 0
|
let j = 0
|
||||||
let optionsArr = item.options
|
let optionsArr = item.options
|
||||||
for (; j < optionsArr.length; j++) {
|
for(; j<optionsArr.length; j++){
|
||||||
if (j % 2 == 0) {
|
const char = String.fromCharCode(65+j);
|
||||||
tmp += `<div style='width:80%;display:flex;'>`
|
if (aloneOption) {
|
||||||
|
tmp += `<div style='width:100%;display:flex;padding: 2px 0'>${char}.${optionsArr[j]}</div>`;
|
||||||
}
|
}
|
||||||
const char = String.fromCharCode(65 + j)
|
else {
|
||||||
tmp += `<div style='display:flex;margin-left: 2%; width: 36%'>${char}.${optionsArr[j]}</div>`
|
if(j%2 == 0){
|
||||||
if (j % 2 == 1) {
|
tmp += `<div style='width:100%;display:flex;'>`;
|
||||||
tmp += '</div>'
|
}
|
||||||
|
|
||||||
|
tmp += `<div style='padding-left: 10px; width: 50%'>${char}.${optionsArr[j]}</div>`;
|
||||||
|
if(j%2 == 1){
|
||||||
|
tmp += '</div>';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// j此刻已自增1, 故当选项为单数时, 需要补充结束标签
|
// j此刻已自增1, 故当选项为单数时, 需要补充结束标签
|
||||||
if (j % 2 == 1) {
|
if(!aloneOption && j%2 == 1){
|
||||||
tmp += '</div>'
|
tmp += '</div>';
|
||||||
}
|
}
|
||||||
|
|
||||||
workDescHtml += tmp
|
workDescHtml += tmp
|
||||||
} else if (item.type == '填空题' || item.type == '判断题' || item.type == '主观题') {
|
} else if (item.type == '填空题' || item.type == '判断题' || item.type == '主观题') {
|
||||||
workDescHtml += `<div style='width:80%;display:flex;'>${index + 1}. ${item.title}</div>`
|
workDescHtml += `<div style='width:100%;display:flex;'>${index + 1}. ${item.title}</div>`
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
workDescHtml += '</div>'
|
workDescHtml += '</div>'
|
||||||
|
@ -265,18 +277,24 @@ export const processList = (row) => {
|
||||||
// 处理[选项显示] - 拼接ABCD首序号
|
// 处理[选项显示] - 拼接ABCD首序号
|
||||||
let tmp = ''
|
let tmp = ''
|
||||||
let j = 0
|
let j = 0
|
||||||
for (; j < workDescArr.length; j++) {
|
for(; j<workDescArr.length; j++){
|
||||||
if (j % 2 == 0) {
|
const char = String.fromCharCode(65+j);
|
||||||
tmp += `<div style='width:80%;display:flex;'>`
|
if (aloneOption) {
|
||||||
|
tmp += `<div style='width:100%;display:flex;padding: 2px 0'>${char}.${workDescArr[j]}</div>`;
|
||||||
}
|
}
|
||||||
const char = String.fromCharCode(65 + j)
|
else {
|
||||||
tmp += `<div style='display:flex;margin-left: 2%; width: 36%'>${char}.${workDescArr[j]}</div>`
|
if(j%2 == 0){
|
||||||
if (j % 2 == 1) {
|
tmp += `<div style='width:100%;display:flex;'>`;
|
||||||
tmp += '</div>'
|
}
|
||||||
|
|
||||||
|
tmp += `<div style='padding-left: 10px; width: 50%'>${char}.${workDescArr[j]}</div>`;
|
||||||
|
if(j%2 == 1){
|
||||||
|
tmp += '</div>';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (j % 2 == 0) {
|
if(!aloneOption && j%2== 0){
|
||||||
tmp += '</div>'
|
tmp += '</div>';
|
||||||
}
|
}
|
||||||
row[i].workdescFormat = tmp
|
row[i].workdescFormat = tmp
|
||||||
|
|
||||||
|
|
|
@ -261,6 +261,7 @@ const openDialog = (data) => {
|
||||||
}
|
}
|
||||||
classWorkAnalysis.quizlist = idres.rows
|
classWorkAnalysis.quizlist = idres.rows
|
||||||
classWorkActiveData.quizlist = idres.rows // zdg: 作业概览组件使用
|
classWorkActiveData.quizlist = idres.rows // zdg: 作业概览组件使用
|
||||||
|
processList(classWorkActiveData.quizlist);
|
||||||
|
|
||||||
// 统计每个题目的正误率
|
// 统计每个题目的正误率
|
||||||
// 这个学习任务所有题目+所有学生的答题数据 , pageSize: 100
|
// 这个学习任务所有题目+所有学生的答题数据 , pageSize: 100
|
||||||
|
|
|
@ -1,9 +1,9 @@
|
||||||
<template>
|
<template>
|
||||||
<el-row class="c-warp" :gutter="10">
|
<el-row class="c-warp" :gutter="10">
|
||||||
<el-col class="left" :span="14">
|
<el-col class="left" :span="10">
|
||||||
<el-collapse class="c-item" v-model="activeTopic">
|
<el-collapse class="c-item" v-model="activeTopic" accordion>
|
||||||
<template v-for="(item, index) in dataList">
|
<template v-for="(item, index) in dataList">
|
||||||
<el-collapse-item class="collapse-item" :name="index+1" :id="'collapse-'+(index+1)">
|
<el-collapse-item class="collapse-item" :name="index+1" :id="'collapse-'+(index+1)" @click="clickItem(index)">
|
||||||
<template #title>
|
<template #title>
|
||||||
<el-popover :width="500" placement="right">
|
<el-popover :width="500" placement="right">
|
||||||
<p>{{item.def?.titletext}}</p>
|
<p>{{item.def?.titletext}}</p>
|
||||||
|
@ -54,13 +54,13 @@
|
||||||
</template>
|
</template>
|
||||||
</el-collapse>
|
</el-collapse>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col class="right" :span="10">
|
<el-col class="right" :span="14">
|
||||||
<div class="c-item">
|
<div class="c-item">
|
||||||
<div class="title">提交情况</div>
|
<!-- <div class="title">提交情况</div>
|
||||||
<div class="respond">
|
<div class="respond">
|
||||||
<el-space wrap>
|
<el-space wrap> -->
|
||||||
<!-- <template v-for="it in 11"> -->
|
<!-- <template v-for="it in 11"> -->
|
||||||
<template v-for="(item, index) in dataList">
|
<!-- <template v-for="(item, index) in dataList">
|
||||||
<el-card shadow="hover" class="card-warp">
|
<el-card shadow="hover" class="card-warp">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<el-progress type="dashboard" :color="colorArr" :width="80" :percentage="ratio_2(item)" />
|
<el-progress type="dashboard" :color="colorArr" :width="80" :percentage="ratio_2(item)" />
|
||||||
|
@ -70,7 +70,41 @@
|
||||||
</el-card>
|
</el-card>
|
||||||
</template>
|
</template>
|
||||||
</el-space>
|
</el-space>
|
||||||
</div>
|
</div> -->
|
||||||
|
|
||||||
|
<div class="title">试题详情</div>
|
||||||
|
<!-- 习题训练 -->
|
||||||
|
<el-card style="max-width: 100%; margin-bottom: 10px; text-align: left;">
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="24" style="padding: 10px">
|
||||||
|
<!-- 题源、题目标题、题目选项 -->
|
||||||
|
<span>{{ activeExam.worktag }}</span>
|
||||||
|
<span style="margin-left: 4px" v-html="activeExam.titleFormat"></span>
|
||||||
|
<div :span="24" style="padding: 6px" v-html="activeExam.workdescFormat"></div>
|
||||||
|
<!-- 折叠: 详情分析解答 -->
|
||||||
|
<div class="demo-collapse">
|
||||||
|
<el-collapse v-model="activeExamFlag">
|
||||||
|
<el-collapse-item title="详情分析解答" name="1">
|
||||||
|
<el-row style=" padding: 6px 10px; border: 2px dotted;">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-col :span="2" style="padding: 6px 0px"><em>【答案】</em></el-col>
|
||||||
|
<el-col :span="21" style="padding: 6px 0px" v-html="activeExam.workanswerFormat"></el-col>
|
||||||
|
<el-col :span="2" style="padding: 6px 0px"><em>【分析】</em></el-col>
|
||||||
|
<el-col :span="21" style="padding: 6px 0px" v-html="activeExam.method"></el-col>
|
||||||
|
<el-col :span="2" style="padding: 6px 0px"><em>【解答】</em></el-col>
|
||||||
|
<el-col :span="21" style="padding: 6px 0px" v-html="activeExam.analyse"></el-col>
|
||||||
|
<el-col :span="2" style="padding: 6px 0px"><em>【点评】</em></el-col>
|
||||||
|
<el-col :span="21" style="padding: 6px 0px" v-html="activeExam.discuss"></el-col>
|
||||||
|
<!-- <el-col :span="21" style="padding: 6px 0px" v-html="dataList[activeTopic-1].def.discuss"></el-col> -->
|
||||||
|
</template>
|
||||||
|
</el-row>
|
||||||
|
</el-collapse-item>
|
||||||
|
</el-collapse>
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
@ -84,7 +118,9 @@ import { ref, defineExpose, onMounted, reactive, computed, watch, nextTick, watc
|
||||||
// import * as elementPlus from 'element-plus' // ElMessage ElMessageBox
|
// import * as elementPlus from 'element-plus' // ElMessage ElMessageBox
|
||||||
let colorArr = [] // 进度颜色值 -- 静态数据
|
let colorArr = [] // 进度颜色值 -- 静态数据
|
||||||
// const attrs = useAttrs() // props中未定义属性
|
// const attrs = useAttrs() // props中未定义属性
|
||||||
const activeTopic = ref(0) // 展开的题
|
const activeTopic = ref(1) // 展开的题
|
||||||
|
const activeExam = ref({}) // 展开的试题
|
||||||
|
const activeExamFlag = ref(['1']) // 展开的试题
|
||||||
let dataList = ref([]) // 左侧数据
|
let dataList = ref([]) // 左侧数据
|
||||||
let studentList = ref([]) // 学生数据
|
let studentList = ref([]) // 学生数据
|
||||||
const props = defineProps({ // 参数 defineProps
|
const props = defineProps({ // 参数 defineProps
|
||||||
|
@ -115,7 +151,10 @@ colorArr = [
|
||||||
|
|
||||||
// === 初始加载完 ===
|
// === 初始加载完 ===
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
activeTopic.value = dataList.value.map((_, index) => index + 1);
|
//activeTopic.value = dataList.value.map((_, index) => index + 1);
|
||||||
|
if (dataList.value[activeTopic.value-1].def != null && dataList.value[activeTopic.value-1].def != undefined) {
|
||||||
|
activeExam.value = dataList.value[activeTopic.value-1].def;
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
// === 方法(methods) ===
|
// === 方法(methods) ===
|
||||||
|
@ -285,6 +324,18 @@ const clickInfo = async ind => {
|
||||||
setTimeout(() => {scrollToElement('collapse-' + ind)}, 300);
|
setTimeout(() => {scrollToElement('collapse-' + ind)}, 300);
|
||||||
// elementPlus.ElMessage.warning('功能未开放!')
|
// elementPlus.ElMessage.warning('功能未开放!')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 点击试题
|
||||||
|
const clickItem = async (index) => {
|
||||||
|
if (index > dataList.length-1 ) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (dataList.value[index].def == null || dataList.value[index].def == undefined) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
activeExam.value = dataList.value[index].def;
|
||||||
|
}
|
||||||
|
|
||||||
// === 通用工具 ===
|
// === 通用工具 ===
|
||||||
// 滚动到指定位置
|
// 滚动到指定位置
|
||||||
const scrollToElement = id => {
|
const scrollToElement = id => {
|
||||||
|
@ -313,8 +364,14 @@ watchEffect(() => { initData() })
|
||||||
background: #F2F3F5;
|
background: #F2F3F5;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
.left{padding-left: 0 !important; height: 100%;}
|
.left{
|
||||||
.right{padding-right: 0 !important;}
|
padding-left: 0 !important;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.right{
|
||||||
|
padding-right: 0 !important;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
.c-item{
|
.c-item{
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
@ -362,7 +419,7 @@ watchEffect(() => { initData() })
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
.respond{
|
.respond{
|
||||||
height: calc(100% - 65px);
|
/* height: calc(100% - 65px);*/
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
.el-space{padding: 5px;}
|
.el-space{padding: 5px;}
|
||||||
.card-warp{
|
.card-warp{
|
||||||
|
|
|
@ -249,6 +249,7 @@ const openDialog = (data) => {
|
||||||
}
|
}
|
||||||
classWorkAnalysis.quizlist = idres.rows
|
classWorkAnalysis.quizlist = idres.rows
|
||||||
classWorkActiveData.quizlist = idres.rows // zdg: 作业概览组件使用
|
classWorkActiveData.quizlist = idres.rows // zdg: 作业概览组件使用
|
||||||
|
processList(classWorkActiveData.quizlist);
|
||||||
|
|
||||||
// 统计每个题目的正误率
|
// 统计每个题目的正误率
|
||||||
// 这个学习任务所有题目+所有学生的答题数据 , pageSize: 100
|
// 这个学习任务所有题目+所有学生的答题数据 , pageSize: 100
|
||||||
|
|
Loading…
Reference in New Issue