cma_search/client/src/views/exam/testPaperUpdate.vue

222 lines
8.4 KiB
Python

<template>
<div class="app-container">
<el-row :gutter="6">
<el-col :span="8">
<el-card header="试卷信息">
<el-form :model="Form" :rules="rules" ref="Form" label-width="100px" status-icon>
<el-form-item label="名称" prop="name">
<el-input v-model="Form.name" style="width:80%"></el-input>
</el-form-item>
<el-form-item label="时间限制" prop="limit">
<el-input-number v-model="Form.limit" :min="0"></el-input-number>分钟
</el-form-item>
<el-form-item label="试卷信息">
<div>
单选题
<span style="color:darkred;font-weight:bold">{{Form.danxuan_count}} </span>
每道
<el-input-number v-model="Form.danxuan_score" :min="0" @change="calScore"></el-input-number>
</div>
<div>
多选题
<span style="color:darkred;font-weight:bold">{{Form.duoxuan_count}} </span>
每道
<el-input-number v-model="Form.duoxuan_score" :min="0" @change="calScore"></el-input-number>
</div>
<div>
判断题
<span style="color:darkred;font-weight:bold">{{Form.panduan_count}} </span>
每道
<el-input-number v-model="Form.panduan_score" :min="0" @change="calScore"></el-input-number>
</div>
<div>
总分
<span style="color:darkred;font-weight:bold">{{Form.total_score}}</span>
</div>
</el-form-item>
<el-form-item label="及格分数" prop="pass_score">
<el-input-number v-model="Form.pass_score" :min="0"></el-input-number>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('Form')" :loading="submitLoding">保存</el-button>
<el-button type="warning" @click="goBack()">返回</el-button>
</el-form-item>
</el-form>
</el-card>
</el-col>
<el-col :span="16">
<el-card header="试题信息">
<el-button type="primary" @click="handleChoose" icon="el-icon-plus">选择试题</el-button>
<draggable v-model="questions">
<el-card style="margin-top: 4px" shadow="never" v-for="(item, index) in questions" v-bind:key="index">
<div slot="header" style="display: flex;">
<span>{{ index+1 }}</span>
<el-link style="margin-left: auto; margin-right: 8px" type="primary" @click="handleEdit(item, index)" icon="el-icon-edit"></el-link>
<el-link style="margin-right: 4px" type="danger" @click="handleDelete(index)" icon="el-icon-delete"></el-link>
</div>
<div style="font-weight: bold;">
<el-tag>{{item.type}}</el-tag>
{{ item.name }}
<span>(正确答案:{{item.right}})</span>
</div>
<div style="font-size: 14px;" v-for="(value, name) in item.options">{{ name }}: {{ value }}</div>
</el-card>
</draggable>
</el-card>
</el-col>
</el-row>
<Questionchoose v-bind:chooseVisible="chooseVisible" @closeDg="closeDg" @choseQ="choseQ"></Questionchoose>
<el-dialog title="编辑题目" :visible.sync="qDialog">
<QuestionUpdate v-if="qDialog" :qid="qid" @updateQuestion="updateQuestion"></QuestionUpdate>
</el-dialog>
</div>
</template>
<script>
import { getQuestioncatList, updatePaper,getPaperDetail } from "@/api/exam";
import { genTree } from "@/utils";
import Questionchoose from "@/views/exam/questionChoose";
import draggable from 'vuedraggable';
import QuestionUpdate from "./questionupdate.vue";
export default {
components: { Questionchoose, draggable, QuestionUpdate },
data() {
return {
qDialog: false,
qid: null,
currentEditIndex: null,
questions: [],
Form: {
name: "",
limit: 60,
total_score: 0,
pass_score: 60,
questions_: [],
danxuan_score: 2,
danxuan_count: 0,
duoxuan_score: 4,
duoxuan_count: 0,
panduan_score: 2,
panduan_count: 0
},
submitLoding: false,
rules: {
name: [
{ required: true, message: "名称不能为空", trigger: "blur" }
// { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
],
limit: [
{ required: true, message: "时间限制不能为空" },
{ type: "number", message: "时间限制必须是数字" }
],
pass_score: [
{ required: true, message: "及格分数不能为空" },
{ type: "number", message: "及格分数必须是数字" }
]
},
workscopeData: [],
chooseVisible: false
};
},
watch: {
questions: "calScore"
},
created() {
this.getQuestioncat();
this.Form.id = this.$route.query.id //接收参数
this.getPaperDetail();
},
methods: {
updateQuestion(data){
this.qDialog = false;
data["question"] = data["id"]
this.questions[this.currentEditIndex] = data;
},
handleEdit(item, index) {
this.qDialog = true;
this.qid = item.question;
this.currentEditIndex = index;
},
getQuestioncat() {
getQuestioncatList().then(response => {
this.workscopeData = genTree(response.data);
});
},
getPaperDetail() {
let that = this;
getPaperDetail(this.Form.id).then(response => {
that.Form = response.data;
that.questions = response.data.questions_;
});
},
submitForm(formName) {
this.$refs[formName].validate(valid => {
if (valid) {
this.submitLoding = true;
updatePaper(this.Form.id,this.Form).then(response => {
this.submitLoding = false;
this.$message({
type: "success",
message: "编辑成功!"
});
this.goBack();
}).catch(res=>{
this.submitLoding = false;
});
} else {
return false;
}
});
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
goBack() {
this.$router.replace("/exam/testpaper/");
},
handleChoose() {
this.chooseVisible = true;
},
closeDg(val) {
this.chooseVisible = val;
},
choseQ(val) {
this.questions = this.questions.concat(val);
},
handleDelete(val) {
this.questions.splice(val, 1);
},
calScore() {
let that = this;
let danxuan_count = 0,
duoxuan_count = 0,
panduan_count = 0,
questions = [];
for (var i = 0, len = that.questions.length; i < len; i++) {
var total_score = 0
switch (that.questions[i].type) {
case "单选":
danxuan_count = danxuan_count + 1;
total_score = that.Form.danxuan_score;
break;
case "多选":
duoxuan_count = duoxuan_count + 1;
total_score = that.Form.duoxuan_score;
break;
case "判断":
panduan_count = panduan_count + 1;
total_score = that.Form.panduan_score;
break;
}
questions.push({id:that.questions[i].id,total_score:total_score, question:that.questions[i].question})
}
that.Form.danxuan_count = danxuan_count;
that.Form.duoxuan_count = duoxuan_count;
that.Form.panduan_count = panduan_count;
let form = that.Form;
let score = form.danxuan_count * form.danxuan_score + form.duoxuan_count * form.duoxuan_score + form.panduan_count * form.panduan_score;
that.Form.total_score = score;
that.Form.questions_ = questions;
}
}
};
</script>