217 lines
7.2 KiB
Python
217 lines
7.2 KiB
Python
<template>
|
|
<div class="app-container">
|
|
<el-card style=" min-height: calc(100vh - 65px);">
|
|
<el-form :model="Form" :rules="rules" ref="Form" label-width="100px" status-icon>
|
|
<el-form-item label="题型" prop="type">
|
|
<el-select v-model="Form.type" style="width: 400px">
|
|
<el-option v-for="item in typeOptions" :key="item.key" :label="item.label" :value="item.value" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="分类" prop="type">
|
|
<el-select v-model="Form.questioncat" placeholder="分类" clearable style="width: 200px" class="filter-item">
|
|
<el-option v-for="item in catOptions" :key="item.id" :label="item.name" :value="item.id" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="题干" prop="name">
|
|
<el-input v-model="Form.name" height="100" width="800px" />
|
|
</el-form-item>
|
|
<el-form-item label="题干图片" prop="img">
|
|
<el-upload
|
|
class="avatar-uploader"
|
|
:headers="upHeaders"
|
|
:action="upUrl"
|
|
accept="image/jpeg, image/gif, image/png, image/bmp"
|
|
:show-file-list="false"
|
|
:on-success="handleImgSuccess"
|
|
:before-upload="beforeImgUpload">
|
|
<img v-if="Form.img" :src="Form.img" style="width: 200px;height: 100px;display: block;" />
|
|
|
|
<el-button size="small" type="primary" v-else>点击上传</el-button>
|
|
</el-upload>
|
|
<el-button type="text" @click="delImg()" v-if="Form.img">删除</el-button>
|
|
</el-form-item>
|
|
<el-form-item label="选项A" prop="optionA">
|
|
<el-input v-model="Form.options.A" height="30" width="800px" :disabled="inputDisable" />
|
|
</el-form-item>
|
|
<el-form-item label="选项B" prop="optionB">
|
|
<el-input v-model="Form.options.B" height="30" width="800px" :disabled="inputDisable" />
|
|
</el-form-item>
|
|
<el-form-item label="选项C" v-show="Form.type != '判断'">
|
|
<el-input v-model="Form.options.C" height="30" width="800px" />
|
|
</el-form-item>
|
|
<el-form-item label="选项D" v-show="Form.type != '判断'">
|
|
<el-input v-model="Form.options.D" height="30" width="800px" />
|
|
</el-form-item>
|
|
<el-form-item label="选项E" v-show="Form.type != '判断'">
|
|
<el-input v-model="Form.options.E" height="30" width="800px" />
|
|
</el-form-item>
|
|
<el-form-item label="选项F" v-show="Form.type != '判断'">
|
|
<el-input v-model="Form.options.F" height="30" width="800px" />
|
|
</el-form-item>
|
|
<el-form-item label="正确答案" v-if="Form.type == '多选'">
|
|
<el-checkbox-group v-model="Form.right">
|
|
<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 label="E"></el-checkbox>
|
|
<el-checkbox label="F"></el-checkbox>
|
|
</el-checkbox-group>
|
|
</el-form-item>
|
|
<el-form-item label="正确答案" v-else-if="Form.type == '单选'">
|
|
<el-radio-group v-model="Form.right">
|
|
<el-radio label="A"></el-radio>
|
|
<el-radio label="B"></el-radio>
|
|
<el-radio label="C"></el-radio>
|
|
<el-radio label="D"></el-radio>
|
|
<el-radio label="E"></el-radio>
|
|
<el-radio label="F"></el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item label="正确答案" v-else>
|
|
<el-radio-group v-model="Form.right">
|
|
<el-radio label="A"></el-radio>
|
|
<el-radio label="B"></el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item label="解析">
|
|
<el-input v-model="Form.resolution" style="width:600px" type="textarea" :rows=3></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="真题年份" prop="year">
|
|
<el-input v-model="Form.year"></el-input>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" @click="submitForm('Form')" :loading="submitLoding">立即创建</el-button>
|
|
<el-button @click="resetForm('Form')">重置</el-button>
|
|
<el-button type="warning" @click="goBack()">返回</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { createQuestion,getQuestioncatList } from "@/api/exam";
|
|
import { upUrl } from "@/api/file";
|
|
import { getToken } from "@/utils/auth";
|
|
export default {
|
|
components: {},
|
|
data() {
|
|
return {
|
|
upHeaders: { Authorization: "JWT " + getToken() },
|
|
upUrl: upUrl(),
|
|
Form: {
|
|
name: "",
|
|
type: "",
|
|
img: null,
|
|
questioncat: null,
|
|
year: null,
|
|
right: '',
|
|
options: {
|
|
A: '',
|
|
B: ''
|
|
}
|
|
},
|
|
catOptions: [],
|
|
inputDisable: false,
|
|
submitLoding: false,
|
|
rules: {
|
|
type: [
|
|
{ required: true, message: "请选择", trigger: "blur" }
|
|
],
|
|
name: [
|
|
{ required: true, message: "请输入", trigger: "blur" }
|
|
],
|
|
},
|
|
typeOptions: [
|
|
{ key: 1, label: "单选", value: "单选" },
|
|
{ key: 2, label: "多选", value: "多选" },
|
|
{ key: 3, label: "判断", value: "判断" }
|
|
],
|
|
};
|
|
},
|
|
watch: {
|
|
'Form.type': 'setOptions'
|
|
},
|
|
created() {
|
|
this.getQuestioncatAll()
|
|
},
|
|
methods: {
|
|
handleImgSuccess(res, file) {
|
|
this.Form.img = res.data.path
|
|
},
|
|
beforeImgUpload(file) {
|
|
const isLt2M = file.size / 1024 / 1024 < 0.6;
|
|
if (!isLt2M) {
|
|
this.$message.error("上传图片大小不能超过 600KB!");
|
|
}
|
|
return isLt2M;
|
|
},
|
|
submitForm(formName) {
|
|
let that =this;
|
|
that.$refs[formName].validate(valid => {
|
|
if (valid) {
|
|
that.submitLoding = true
|
|
for (let key in that.Form.options) {
|
|
if (!that.Form.options[key]) {
|
|
delete that.Form.options[key]
|
|
}
|
|
}
|
|
debugger;
|
|
console.log(that.Form)
|
|
createQuestion(that.Form).then(response => {
|
|
that.submitLoding = false
|
|
if (response.code >= 200) {
|
|
that.$message({
|
|
type: "success",
|
|
message: "新建成功!"
|
|
});
|
|
that.goBack()
|
|
}
|
|
});
|
|
} else {
|
|
return false;
|
|
}
|
|
});
|
|
},
|
|
resetForm(formName) {
|
|
this.$refs[formName].resetFields();
|
|
},
|
|
goBack() {
|
|
this.$router.go(-1)
|
|
},
|
|
getQuestioncatAll() {
|
|
getQuestioncatList().then(response => {
|
|
this.catOptions = response.data.results;
|
|
});
|
|
},
|
|
delImg() {
|
|
this.Form.img = null
|
|
},
|
|
setOptions() {
|
|
if (this.Form.type == '判断') {
|
|
this.Form.options = {
|
|
A: '对',
|
|
B: '错'
|
|
}
|
|
this.inputDisable = true
|
|
} else {
|
|
this.Form.options = {
|
|
A: '',
|
|
B: ''
|
|
}
|
|
this.inputDisable = false
|
|
}
|
|
if (this.Form.type == '多选') {
|
|
this.Form.right = []
|
|
} else {
|
|
this.Form.right = ''
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style scoped>
|
|
.app-container {
|
|
height: 100%;
|
|
}
|
|
</style> |