From b4698317fb97d89e389f131e8fd9dcf8d7108c77 Mon Sep 17 00:00:00 2001
From: zhouwx <1175765986@qq.com>
Date: Mon, 29 Jul 2024 17:17:21 +0800
Subject: [PATCH] 修改
---
src/views/onlineEducation/questionBankManagement/questionManage/components/questionDialog.vue | 251 +++++++++++++++++---------------------------------
1 files changed, 86 insertions(+), 165 deletions(-)
diff --git a/src/views/onlineEducation/questionBankManagement/questionManage/components/questionDialog.vue b/src/views/onlineEducation/questionBankManagement/questionManage/components/questionDialog.vue
index b92fe7d..96c48aa 100644
--- a/src/views/onlineEducation/questionBankManagement/questionManage/components/questionDialog.vue
+++ b/src/views/onlineEducation/questionBankManagement/questionManage/components/questionDialog.vue
@@ -5,10 +5,12 @@
:title="title"
width="50%"
:before-close="handleClose"
+ :close-on-press-escape="false"
+ :close-on-click-modal="false"
>
<el-form :model="state.form" size="default" ref="busRef" :rules="state.formRules" label-width="150px" >
<el-form-item label="题目类型:" prop="questionType">
- <el-select v-model="state.form.questionType" placeholder="请选择题型" style="width: 100%">
+ <el-select v-model="state.form.questionType" placeholder="请选择题型" style="width: 100%" @change="changeType">
<el-option
v-for="item in state.questionTypeList"
:key="item.id"
@@ -40,60 +42,31 @@
<el-input v-model.trim="state.form.title" type="textarea" placeholder="请输入题目内容"></el-input>
</el-form-item>
<el-form-item label="选项:" prop="content">
- <div v-if="state.form.questionType === 1" style="width: 100%">
- <div v-for="(item,index) in 4" :key="index" >
- <div style="display: flex;">
- <span>{{item ===1 ? 'A':item ===2 ? 'B' : item ===3 ? 'C' : 'D'}}</span>
- <el-input type="textarea" v-model="state.singleQuestion.items[index].content" placeholder="请输入选项内容" style="width: 100%;margin-left: 20px;margin-bottom: 10px"></el-input>
+ <div style="display: flex;flex-direction: column;width: 100%">
+ <el-button :disabled="state.form.questionType ===3" type="primary" @click="addOption" size="default" style="width: 65px;margin-bottom: 15px">添加</el-button>
+ <div v-for="(item,index) in state.optionItem.items" :key="index" style="width: 100%">
+ <div style="display: flex;align-items: center">
+ <span>{{String.fromCharCode(index + 65)}}</span>
+ <el-input :disabled="state.form.questionType ===3" type="textarea" v-model="state.optionItem.items[index].content" placeholder="请输入选项内容" style="width: 100%;margin-left: 20px;margin-bottom: 10px"></el-input>
+ <Delete v-if="state.form.questionType !==3" style="width: 15px; height: 15px; margin-left: 8px;color: #ed5565" @click="delOption(index)" />
</div>
- </div>
- <div style="display: flex">
- <span style="width: 50px">解析:</span>
- <el-input type="textarea" v-model="state.singleQuestion.analyze" placeholder="请输入题目解析" style="width: 100%;margin-bottom: 10px"></el-input>
- </div>
- </div>
- <div v-else-if="state.form.questionType === 2" style="width: 100%">
- <div v-for="(item,index) in 4" :key="index" >
- <div style="display: flex;">
- <span>{{item ===1 ? 'A':item ===2 ? 'B' : item ===3 ? 'C' : 'D'}}</span>
- <el-input type="textarea" v-model="state.multiQuestion.items[index].content" placeholder="请输入选项内容" style="width: 100%;margin-left: 20px;margin-bottom: 10px"></el-input>
- </div>
- </div>
- <div style="display: flex">
- <span style="width: 50px">解析:</span>
- <el-input type="textarea" v-model="state.multiQuestion.analyze" placeholder="请输入题目解析" style="width: 100%;margin-bottom: 10px"></el-input>
- </div>
- </div>
- <div v-else style="width: 100%">
- <div v-for="(item,index) in 2" :key="index" >
- <div style="display: flex;">
- <span>{{item ===1 ? 'A': 'B'}}</span>
- <el-input v-model="state.judgeQuestion.items[index].content" style="width: 100%;margin-left: 20px;margin-bottom: 10px" disabled></el-input>
- </div>
- </div>
- <div style="display: flex">
- <span style="width: 50px">解析:</span>
- <el-input type="textarea" v-model="state.judgeQuestion.analyze" placeholder="请输入题目解析" style="width: 100%;margin-bottom: 10px"></el-input>
</div>
</div>
</el-form-item>
+ <el-form-item label="解析:" >
+ <el-input type="textarea" v-model="state.optionItem.analyze" placeholder="请输入题目解析" style="width: 100%;margin-bottom: 10px"></el-input>
+ </el-form-item>
<el-form-item label="正确答案:" prop="answer">
- <el-radio-group v-model="state.form.answer" v-if="state.form.questionType === 1">
- <el-radio :label="'A'">A</el-radio>
- <el-radio :label="'B'">B</el-radio>
- <el-radio :label="'C'">C</el-radio>
- <el-radio :label="'D'">D</el-radio>
+ <el-radio-group v-model="state.form.answer" v-if="state.form.questionType === 1 || state.form.questionType === 3">
+ <div v-for="(item,index) in state.optionItem.items">
+ <el-radio :label="String.fromCharCode(index + 65)" style="margin-left: 20px">{{String.fromCharCode(index + 65)}}</el-radio>
+ </div>
</el-radio-group>
- <el-checkbox-group v-model="state.checkList" v-if="state.form.questionType === 2" @change="changeCheckBox">
- <el-checkbox label="A"></el-checkbox>
- <el-checkbox label="B"></el-checkbox>
- <el-checkbox label="C"></el-checkbox>
- <el-checkbox label="D"></el-checkbox>
+ <el-checkbox-group v-model="state.checkList" v-if="state.form.questionType === 2" style="display: flex" >
+ <div v-for="(item,index) in state.optionItem.items">
+ <el-checkbox :label="String.fromCharCode(index + 65)" style="margin-left: 20px;">{{String.fromCharCode(index + 65)}}</el-checkbox>
+ </div>
</el-checkbox-group>
- <el-radio-group v-model="state.form.answer" v-if="state.form.questionType === 3">
- <el-radio :label="'A'">A</el-radio>
- <el-radio :label="'B'">B</el-radio>
- </el-radio-group>
</el-form-item>
</el-form>
<template #footer>
@@ -108,6 +81,7 @@
<script setup>
import {reactive, ref, toRefs} from 'vue'
import {ElMessage} from "element-plus";
+import {Delete} from "@element-plus/icons-vue";
import {
getClassification
@@ -135,7 +109,7 @@
form: {
id: '',
title: '',
- questionType: 1,
+ questionType: null,
bankName: '',
bankId: null,
answer: ''
@@ -145,7 +119,7 @@
questionType: [{required: true, trigger: "blur", message: '请选择题目类型'}],
bankName: [{required: true, trigger: "blur", message: '请选择归属题库'}],
title: [{required: true, trigger: "blur", message: '请输入题目内容'}],
- // answer: [{required: true, trigger: "blur", message: '请选择正确答案'}],
+ answer: [{required: true, trigger: "blur", message: '请选择正确答案'}],
},
classifyList: [],
isAdmin: false,
@@ -166,60 +140,9 @@
name: '判断题'
}
],
- singleQuestion: {
+ optionItem: {
analyze: '',
- items: [
- {
- prefix:"A",
- content: ''
- },
- {
- prefix:"B",
- content: ''
- },
- {
- prefix:"C",
- content: ''
- },
- {
- prefix:"D",
- content: ''
- },
- ]
- },
- judgeQuestion: {
- analyze: '',
- items: [
- {
- prefix:"A",
- content: '是'
- },
- {
- prefix:"B",
- content: '否'
- },
- ]
- },
- multiQuestion: {
- analyze: '',
- items: [
- {
- prefix:"A",
- content: ''
- },
- {
- prefix:"B",
- content: ''
- },
- {
- prefix:"C",
- content: ''
- },
- {
- prefix:"D",
- content: ''
- },
- ]
+ items: []
},
checkList: [],
bankList: [],
@@ -239,6 +162,20 @@
})
}
+const addOption = () => {
+
+ const obj = {
+ prefix:"",
+ content: ''
+ }
+ state.optionItem.items.push(obj)
+
+}
+const delOption = (val) => {
+ state.optionItem.items.splice(val,1)
+ state.form.answer = ''
+ console.log(" state.optionItem.items.", state.optionItem.items)
+}
const openDialog = async (type, value) => {
await loadMoreBankData();
const userInfo = JSON.parse(Cookies.get('userInfo'))
@@ -257,12 +194,8 @@
const res = await getQuestionById(value.id)
if(res.code === 200){
state.form = res.data
- if(res.data.questionType === 1){
- state.singleQuestion = JSON.parse(res.data.content)
- }else if(res.data.questionType === 3) {
- state.judgeQuestion = JSON.parse(res.data.content)
- }else {
- state.multiQuestion = JSON.parse(res.data.content)
+ state.optionItem = JSON.parse(res.data.content)
+ if(res.data.questionType === 2){
state.checkList = res.data.answer.split(',')
}
}else{
@@ -300,7 +233,19 @@
if(title.value === '新增'){
const {id,bankName, ...data} = JSON.parse(JSON.stringify(state.form))
data.answer = data.questionType === 1 || data.questionType === 3 ? data.answer : state.checkList.join(',')
- data.content = data.questionType === 1 ? JSON.stringify(state.singleQuestion) : data.questionType === 2 ? JSON.stringify(state.multiQuestion) : JSON.stringify(state.judgeQuestion)
+ // data.content = data.questionType === 1 ? JSON.stringify(state.singleQuestion) : data.questionType === 2 ? JSON.stringify(state.multiQuestion) : JSON.stringify(state.judgeQuestion)
+ const options = state.optionItem.items.map((op,index) => {
+ return {
+ prefix: String.fromCharCode(index + 65),
+ content: op.content,
+ }
+ })
+ data.content = JSON.stringify(
+ {
+ analyze: state.optionItem.analyze,
+ items: options
+ }
+ )
console.log('state.form',data)
const res = await addQuestion(data)
if(res.code === 200){
@@ -318,7 +263,19 @@
}else if(title.value === '编辑'){
const {bankName,...data} = JSON.parse(JSON.stringify(state.form))
data.answer = data.questionType === 1 || data.questionType === 3 ? data.answer : state.checkList.join(',')
- data.content = data.questionType === 1 ? JSON.stringify(state.singleQuestion) : data.questionType === 2 ? JSON.stringify(state.multiQuestion) : JSON.stringify(state.judgeQuestion)
+ // data.content = data.questionType === 1 ? JSON.stringify(state.singleQuestion) : data.questionType === 2 ? JSON.stringify(state.multiQuestion) : JSON.stringify(state.judgeQuestion)
+ const options = state.optionItem.items.map((op,index) => {
+ return {
+ prefix: String.fromCharCode(index + 65),
+ content: op.content,
+ }
+ })
+ data.content = JSON.stringify(
+ {
+ analyze: state.optionItem.analyze,
+ items: options
+ }
+ )
const res = await editQuestion(data)
if(res.code === 200){
ElMessage({
@@ -335,7 +292,22 @@
}
}
}
+const changeType = () => {
+ if(state.form.questionType === 3) {
+ state.optionItem.items = [
+ {
+ prefix: 'A',
+ content: '是'
+ },
+ {
+ prefix: 'B',
+ content: '否'
+ }
+ ]
+ }
+
+}
const handleClose = () => {
busRef.value.clearValidate();
reset();
@@ -347,66 +319,15 @@
state.form = {
id: '',
title: '',
- questionType: 1,
+ questionType: null,
bankName: '',
bankId: null,
answer: ''
}
- state.singleQuestion= {
+ state.optionItem = {
analyze: '',
- items: [
- {
- prefix:"A",
- content: ''
- },
- {
- prefix:"B",
- content: ''
- },
- {
- prefix:"C",
- content: ''
- },
- {
- prefix:"D",
- content: ''
- },
- ]
+ items: []
}
- state.judgeQuestion= {
- analyze: '',
- items: [
- {
- prefix:"A",
- content: '是'
- },
- {
- prefix:"B",
- content: '否'
- },
- ]
- }
- state. multiQuestion= {
- analyze: '',
- items: [
- {
- prefix:"A",
- content: ''
- },
- {
- prefix:"B",
- content: ''
- },
- {
- prefix:"C",
- content: ''
- },
- {
- prefix:"D",
- content: ''
- },
- ]
- },
state.bankPageNum = 1;
state.bankPageSize = 10;
state.bankList = []
--
Gitblit v1.9.2