factory_web/src/views/edu/paper_form.vue

425 lines
11 KiB
Vue

<template>
<el-drawer v-model="drawVisible" size="60%" title="创建/编辑试卷">
<el-container>
<el-header style="height: 200px">
<el-form
:model="paperForm"
label-width="100px"
ref="paperFormRef"
>
<el-row>
<el-col :span="24">
<el-form-item label="试卷名" prop="name" required>
<el-input
v-model="paperForm.name"
clearable
></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="总分数"
prop="total_score"
required
>
<el-input-number
v-model="paperForm.total_score"
controls-position="right"
:min="0"
style="width: 100%"
disabled
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="通过分数"
prop="pass_score"
required
>
<el-input-number
v-model="paperForm.pass_score"
controls-position="right"
:min="1"
style="width: 100%"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="限时"
prop="limit"
required
>
<el-input-number
v-model="paperForm.limit"
controls-position="right"
placeholder="分钟"
:min="1"
style="width: 100%"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="单选分数"
prop="danxuan_score"
required
>
<el-input-number
v-model="paperForm.danxuan_score"
controls-position="right"
:min="1"
style="width: 100%"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="多选分数"
prop="duoxuan_score"
required
>
<el-input-number
v-model="paperForm.duoxuan_score"
controls-position="right"
:min="1"
style="width: 100%"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="判断分数"
prop="panduan_score"
required
>
<el-input-number
v-model="paperForm.panduan_score"
controls-position="right"
:min="1"
style="width: 100%"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="单选数量"
prop="danxuan_count"
required
>
<el-input-number
v-model="paperForm.danxuan_count"
controls-position="right"
:min="0"
style="width: 100%"
disabled
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="多选数量"
prop="duoxuan_count"
required
>
<el-input-number
v-model="paperForm.duoxuan_count"
controls-position="right"
:min="0"
style="width: 100%"
disabled
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
label="判断数量"
prop="panduan_count"
required
>
<el-input-number
v-model="paperForm.panduan_count"
controls-position="right"
:min="0"
style="width: 100%"
disabled
></el-input-number>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-header>
<el-main class="nopadding">
<el-container>
<el-header>
<div class="left-panel">
<el-button type="primary" @click="choseQuestion"
>批量选择</el-button
>
<!-- <el-button type="primary" @click="uploadPaper">上传试题</el-button> -->
</div>
</el-header>
<el-main class="nopadding">
<scFormTable
ref="table"
v-model="paperForm.detail"
row-key="id"
hideAdd
dragSort
@update:modelValue = "computeDetail"
>
<el-table-column
label="题型"
>
<template #default="scope"
>{{ qTypeEnum[scope.row.question_type]?.text }}
</template></el-table-column>
<el-table-column
label="题目"
prop="question_name"
min-width="600px"
></el-table-column>
<el-table-column
label="满分"
prop="total_score"
></el-table-column>
<!-- <el-table-column label="操作">
<template #default="scope">
<el-button
link
size="small"
@click="delQuestion(scope.row, scope.$index)"
type="danger"
icon="el-icon-delete"
></el-button>
</template>
</el-table-column> -->
</scFormTable>
</el-main>
</el-container>
</el-main>
<el-footer>
<el-button
type="primary"
:loading="isSaving"
@click="paperSubmit()"
>保 存</el-button
>
</el-footer>
<el-dialog title="选择题目" v-model="questionCVisible" width="90%">
<Question
style="height: 500px"
ref="QuestionChoseRef"
></Question>
<template #footer>
<el-button type="primary" @click="choseConfirm"
>选择</el-button>
</template>
</el-dialog>
<!-- <el-button type="primary" @click="handleChoose1" icon="el-icon-plus" style="margin-right: 10px;">上传试题</el-button> -->
<el-dialog
v-model="impDialogVisible"
title="上传试题"
:left="'200px'"
:close-on-click-modal="false"
:height="'600px'"
>
<el-row>
<el-col :span="12">
<el-select v-model="impForm.question_types" style="margin-right: 10px;" placeholder="题目分类">
<el-option
v-for="item in type_list"
:key="item.id"
:label="item.name"
:value="item.name">
</el-option>
</el-select>
</el-col>
<sc-upload-file
v-model="impForm.doc_path"
:on-success="handleUpSuccess"
:multiple="false"
:limit="10"
tip="最多上传10个文件,单个文件不要超过10M"
>
<el-button type="primary" icon="el-icon-upload"> </el-button>
</sc-upload-file>
</el-row>
<div style="text-align: right">
<el-button type="danger" @click="impDialogVisible=false">取消</el-button>
<el-button type="primary" @click="impDialogVisible=false">确认</el-button>
</div>
</el-dialog>
</el-container>
</el-drawer>
</template>
<script>
import Question from "./question";
import { qTypeEnum, qLevelEnum } from "@/utils/enum";
import { upload } from "@/api/model/edu"
const defaultForm = {
name: "",
danxuan_score: 2,
duoxuan_score: 4,
panduan_score: 2,
danxuan_count: 0,
duoxuan_count: 0,
panduan_count: 0,
total_score: 0,
detail: [],
limit: 10
};
export default {
components: {
Question,
},
data() {
return {
impForm:{
doc_path:'',
question_types:'',
},
qTypeEnum, qLevelEnum,
mode: "add",
isSaving: false,
questionCVisible: false,
impDialogVisible:false,
drawVisible: false,
paperForm: Object.assign({}, defaultForm),
fileList: [],
type_list: []
};
},
mounted() {},
methods: {
open(mode = "add", data) {
if (mode == "add") {
this.paperForm = Object.assign({}, defaultForm);
this.paperForm.detail = [];
this.drawVisible = true;
} else {
this.paperForm = Object.assign({}, data);
this.drawVisible = true;
}
},
handleUpSuccess(res, file, filelist) {
let that =this;
if (res.code == 201){
that.impForm.doc_path = res.data.path;
console.log(that.impForm.doc_path);
} else {
this.$message.error(res.msg);
}
},
handleRemove() {
this.fileList = [];
this.impForm.file = '';
},
choseQuestion() {
this.questionCVisible = true;
this.$nextTick(() => {
this.$refs.QuestionChoseRef.initChose();
});
},
computeDetail() {
let danxuan_count = 0;
let duoxuan_count = 0;
let panduan_count = 0;
this.paperForm.detail.forEach((item) => {
if (item.question_type == 10) {
danxuan_count++;
} else if (item.question_type == 20) {
duoxuan_count++;
} else if (item.question_type == 30) {
panduan_count++;
}
});
this.paperForm.danxuan_count = danxuan_count;
this.paperForm.duoxuan_count = duoxuan_count;
this.paperForm.panduan_count = panduan_count;
this.paperForm.total_score =
this.paperForm.danxuan_score * this.paperForm.danxuan_count +
this.paperForm.duoxuan_score * this.paperForm.duoxuan_count +
this.paperForm.panduan_score * this.paperForm.panduan_count;
},
delQuestion(row, index){
console.log(index)
this.paperForm.detail.splice(index,1);
this.computeDetail();
},
uploadPaper(){
this.impDialogVisible = true;
},
choseConfirm() {
let sdata = this.$refs.QuestionChoseRef.checkList;
if (sdata.length == 0) {
this.$message.error("请选择题目");
return;
}
// 获取sort
let sort = 1;
if (this.paperForm.detail.length > 0) {
sort =
this.paperForm.detail[this.paperForm.detail.length - 1]
.sort;
}
// 获取题目总分
let data = [];
sdata.forEach((item, index) => {
var total_score = 0;
if (item.type == 10) {
total_score = this.paperForm.danxuan_score;
} else if (item.type == 20) {
total_score = this.paperForm.duoxuan_score;
} else if (item.type == 30) {
total_score = this.paperForm.panduan_score;
}
data.push({
question: item.id,
question_name: item.name,
question_type: item.type,
total_score: total_score,
sort: sort + index,
});
});
this.paperForm.detail.push(...data);
this.questionCVisible = false;
this.computeDetail();
},
paperSubmit() {
this.$refs.paperFormRef.validate((valid) => {
if (valid) {
// 变更题目顺序
this.paperForm.detail.forEach((item, index) => {
item.sort = index + 1;
});
this.isSaving = true;
if(this.paperForm.id){
this.$API.edu.paper.update.req(this.paperForm.id, this.paperForm).then((res) => {
this.isSaving = false;
this.$message.success("修改成功");
this.drawVisible = false;
this.$emit("paperSubmit");
}).catch(e=>{this.isSaving = false;})
}else{
this.$API.edu.paper.create.req(this.paperForm).then((res) => {
this.isSaving = false;
this.$message.success("保存成功");
this.drawVisible = false;
this.$emit("paperSubmit");
}).catch(e=>{this.isSaving = false;})
}
}
});
},
},
};
</script>