<template>
|
<div class="app-container">
|
<el-form :model="form" ref="form" label-width="200px" v-loading="formLoading" :rules="rules">
|
<el-form-item label="考生:" prop="userIds" required>
|
<el-select v-model="form.userIds" :collapse-tags="true" multiple placeholder="请选择" @focus="selectStudent"
|
popper-class="examinee-popper">
|
<el-option v-for="item in form.examineeList" :value="item.id" :label="item.realName"
|
:key="item.id"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="部门:" prop="deptId" required>
|
<!-- <el-select v-model="form.deptId" collapse-tags @change="getSubject" placeholder="部门">
|
<el-option v-for="item in depts" :key="item.id" :value="item.id" :label="item.name"></el-option>
|
</el-select> -->
|
<el-cascader
|
clearable
|
@change="getSubject"
|
v-model="form.deptId"
|
:options="depts"
|
:props="{ emitPath: false, value: 'id', label: 'name', checkStrictly: true }"
|
></el-cascader>
|
</el-form-item>
|
<el-form-item label="课目:" prop="subjectId" required>
|
<el-select ref="subjectIdRef" v-model="form.subjectId" :disabled="! form.deptId" placeholder="课目" multiple collapse-tags
|
@visible-change="subjectIdEvent">
|
<el-option v-for="item in subjectFilter" :key="item.id" :value="item.id" :label="item.name + ' '"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="试卷类型:" prop="paperType" required>
|
<el-select v-model="form.paperType" placeholder="试卷类型" @visible-change="subjectIdEvent" disabled>
|
<el-option v-for="item in paperTypeEnum" :key="item.key" :value="item.key" :label="item.value"></el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="时间限制:" prop="limitDateTime">
|
<el-date-picker v-model="form.limitDateTime" value-format="yyyy-MM-dd HH:mm:ss" type="datetimerange"
|
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="试卷名称:" prop="name" required>
|
<el-row :gutter="20">
|
<el-col :span="9">
|
<el-input v-model="form.name" />
|
</el-col>
|
<el-col :span="2" v-if="form.paperType == 7">
|
<span>总数分:</span>
|
</el-col>
|
<el-col :span="9" v-if="form.paperType == 7">
|
<el-input disabled v-model="form.aggregateSource" />
|
</el-col>
|
</el-row>
|
</el-form-item>
|
<!-- <el-form-item :key="item.subjectId" :label="item.label" required v-for="(item, key) in form.questionTypeVMS"
|
v-if="form.paperType == 7">
|
<el-row>
|
<el-col :span="3">
|
<span>多选题: </span>
|
|
</el-col>
|
<el-col :span="3">
|
<el-input v-model="form.questionTypeVMS[key].multipleChoice" style="width: 80%" />
|
</el-col>
|
<el-col :span="3">
|
<span>单选题:</span>
|
</el-col>
|
<el-col :span="3">
|
<el-input v-model="form.questionTypeVMS[key].singleChoice" style="width: 80%" />
|
</el-col>
|
<el-col :span="3">
|
<span>判断题:</span>
|
</el-col>
|
<el-col :span="3">
|
<el-input v-model="form.questionTypeVMS[key].trueFalse" style="width: 80%" />
|
</el-col>
|
</el-row>
|
</el-form-item> -->
|
<!-- <el-form-item label="总数分:" v-if="form.paperType==7" prop="name" required>-->
|
<!-- <el-input v-model="form.name"/>-->
|
<!-- </el-form-item>-->
|
<el-form-item :key="index" :label="'标题' + (index + 1) + ':'" required
|
v-for="(titleItem, index) in form.titleItems">
|
<el-input v-model="titleItem.name" style="width: 80%" />
|
<el-button v-if="form.paperType != 7" type="text" class="link-left" style="margin-left: 20px" size="mini"
|
@click="addQuestion(titleItem)">
|
添加题目
|
</el-button>
|
<el-button type="text" class="link-left" size="mini" @click="form.titleItems.splice(index, 1)">删除</el-button>
|
<el-card class="exampaper-item-box"
|
v-if="titleItem.questionItems && titleItem.questionItems.length !== 0 && subjectIdList.length < 2">
|
<el-form-item :key="questionIndex" :label="'题目' + (questionIndex + 1) + ':'"
|
v-for="(questionItem, questionIndex) in titleItem.questionItems" style="margin-bottom: 15px">
|
<el-row>
|
<el-col :span="23">
|
<QuestionShow :qType="questionItem.questionType" :question="questionItem" />
|
</el-col>
|
<el-col :span="1">
|
<el-button type="text" size="mini" @click="titleItem.questionItems.splice(questionIndex, 1)">删除
|
</el-button>
|
</el-col>
|
</el-row>
|
</el-form-item>
|
</el-card>
|
</el-form-item>
|
<el-form-item label="建议时长:" prop="suggestTime" required>
|
<el-input v-model="form.suggestTime" placeholder="分钟" />
|
</el-form-item>
|
|
<el-form-item>
|
<el-button type="primary" @click="submitForm">提交</el-button>
|
<el-button @click="resetForm">重置</el-button>
|
<el-button type="success" @click="addTitle">添加标题</el-button>
|
</el-form-item>
|
</el-form>
|
<el-dialog :visible.sync="questionPage.showDialog" width="70%">
|
<el-form :model="questionPage.queryParam" ref="queryForm" :inline="true">
|
<el-form-item label="ID:">
|
<el-input v-model="questionPage.queryParam.id" clearable></el-input>
|
</el-form-item>
|
<el-form-item label="题型:">
|
<el-select v-model="questionPage.queryParam.questionType" clearable>
|
<el-option v-for="item in questionTypeEnum" :key="item.key" :value="item.key"
|
:label="item.value"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" @click="queryForm">查询</el-button>
|
</el-form-item>
|
</el-form>
|
<el-table v-loading="questionPage.listLoading" :data="questionPage.tableData"
|
@selection-change="handleSelectionChange" border fit highlight-current-row style="width: 100%">
|
<el-table-column type="selection" width="35"></el-table-column>
|
<el-table-column prop="questionType" label="题型" :formatter="questionTypeFormatter" width="70px" />
|
<el-table-column prop="shortTitle" label="题干" show-overflow-tooltip />
|
</el-table>
|
<pagination v-show="questionPage.total > 0" :total="questionPage.total"
|
:page.sync="questionPage.queryParam.pageIndex" :limit.sync="questionPage.queryParam.pageSize"
|
@pagination="search" />
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="questionPage.showDialog = false">取 消</el-button>
|
<el-button type="primary" @click="confirmQuestionSelect">确定</el-button>
|
</span>
|
</el-dialog>
|
|
<el-dialog :visible.sync="studentDialog" width="70%">
|
<el-form :model="student" ref="queryForm" :inline="true">
|
<el-form-item>
|
<el-select v-model="student.tagIds" clearable multiple placeholder="标签">
|
<el-option v-for="item in tags" :key="item.id" :value="item.id" :label="item.name"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-select v-model="student.excludeTagIds" clearable multiple placeholder="排除标签">
|
<el-option v-for="item in tags" :key="item.id" :value="item.id" :label="item.name"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<!-- <el-select v-model="student.deptIds" clearable multiple>
|
<el-option v-for="item in depts" :key="item.id" :value="item.id" :label="item.name"></el-option>
|
</el-select> -->
|
<el-cascader
|
filterable
|
placeholder="请选择部门"
|
clearable
|
collapse-tags
|
v-model="student.deptIds"
|
:options="depts"
|
:props="{ multiple: true, emitPath: false, value: 'id', label: 'name', checkStrictly: true }"
|
></el-cascader>
|
</el-form-item>
|
<el-form-item>
|
<el-input v-model="student.realName" clearable placeholder="请输入姓名"></el-input>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" @click="selectStudent">查询</el-button>
|
</el-form-item>
|
</el-form>
|
<el-button type="danger" @click="selectAllBoolean ? selectAll() : unselectAll()" size="small" style="margin-bottom: 3px">{{ selectAllBoolean ? '全选' : '取消全选' }}</el-button>
|
<el-table ref="multipleTable" v-loading="student.listLoading" :data="tableData" border fit highlight-current-row
|
style="width: 100%" @selection-change="handleSelection" row-key="id">
|
<el-table-column type="selection" :reserve-selection="true"></el-table-column>
|
<el-table-column prop="realName" label="学员" />
|
</el-table>
|
<pagination v-show="total > 0" :total="total" :page.sync="student.pageIndex" :limit.sync="student.pageSize"
|
@pagination="selectStudent" />
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="studentDialog = false">取 消</el-button>
|
<el-button type="primary" @click="confirmStudentSelect">确定</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
|
import { mapGetters, mapState, mapActions } from 'vuex';
|
import Pagination from '@/components/Pagination';
|
import QuestionShow from '../question/components/Show';
|
import examPaperApi from '@/api/examPaper';
|
import subjectApi from '@/api/subject';
|
import userApi from '@/api/user';
|
import questionApi from '@/api/question';
|
import departmentApi from '@/api/department';
|
import allCascader from '@/components/Cascader';
|
export default {
|
components: { Pagination, QuestionShow, allCascader },
|
|
data() {
|
return {
|
selectAllBoolean: true,
|
tags: [],
|
studentDialog: false,
|
student: {
|
deptIds: [],
|
pageIndex: 1,
|
pageSize: 5,
|
listLoading: true,
|
multipleSelection: [],
|
excludeTagIds: []
|
},
|
isFirstShow: true,
|
|
tableData: [],
|
total: 0,
|
props: {
|
multiple: true
|
// lazy: true,
|
// lazyLoad (node, resolve) {
|
// console.log(node,"node");
|
// var that = this;
|
// departmentApi.selectUser(node.value).then(re=>{
|
// console.log(re,"re");
|
// const nodes = re.response.map(xxx=>{
|
// return {value: xxx.id,label: xxx.realName,leaf: node.level >= 1}
|
// });
|
// resolve(nodes);
|
// })
|
// }
|
},
|
depts: [],
|
options: [],
|
optionsData: [],
|
departCascaderProps: {
|
multiple: true
|
},
|
subjectIdList: [],
|
form: {
|
deptId: '',
|
aggregateSource: '100',
|
id: null,
|
departmentIds: [],
|
menuIds: [],
|
subjectId: [],
|
paperType: 7,
|
limitDateTime: [],
|
name: '',
|
suggestTime: null,
|
titleItems: [{
|
name: '',
|
questionItems: []
|
}],
|
subjectSource: {},
|
questionTypeVMS: [],
|
examineeList: [],
|
userIds: []
|
},
|
subjectFilter: null,
|
formLoading: false,
|
rules: {
|
userIds: [
|
{ required: true, message: '请选择考生', trigger: 'change' }
|
],
|
subjectId: [
|
{ required: true, message: '请选择课目', trigger: 'change' }
|
],
|
deptId: [
|
{ required: true, message: '请选择部门', trigger: 'change' }
|
],
|
paperType: [
|
{ required: true, message: '请选择试卷类型', trigger: 'change' }
|
],
|
name: [
|
{ required: true, message: '请输入试卷名称', trigger: 'blur' }
|
],
|
limitDateTime: [
|
{ required: true, message: '请选择时间限制', trigger: 'blur' }
|
],
|
suggestTime: [
|
{ required: true, message: '请输入建议时长', trigger: 'blur' }
|
]
|
},
|
questionPage: {
|
multipleSelection: [],
|
showDialog: false,
|
queryParam: {
|
id: null,
|
questionType: null,
|
subjectId: 1,
|
pageIndex: 1,
|
pageSize: 500000000
|
},
|
listLoading: true,
|
tableData: [],
|
total: 0
|
},
|
currentTitleItem: null
|
};
|
},
|
created() {
|
examPaperApi.selflist().then(res => {
|
console.log(res);
|
this.subjectFilter = res.response;
|
});
|
departmentApi.list().then(res => {
|
this.depts = res.response;
|
});
|
},
|
async mounted() {
|
departmentApi.getCurrentDeptId().then(res => {
|
if (res.response && res.response[0]) {
|
this.form.deptId = res.response[0];
|
}
|
});
|
|
let id = this.$route.query.id;
|
let _this = this;
|
|
this.initSubject(function () {
|
_this.subjectFilter = _this.subjects;
|
});
|
if (id && parseInt(id) !== 0) {
|
this.selectAllBoolean = false;
|
_this.formLoading = true;
|
await examPaperApi.selfselect(id).then(re => {
|
const { userIds, userNames } = re.response;
|
_this.form = re.response;
|
if (userIds && userIds.length) {
|
_this.form.examineeList = userIds.map((item, index) => {
|
return {
|
id: item,
|
realName: userNames && userNames[index] ? userNames[index] : ''
|
};
|
});
|
} else {
|
_this.form.examineeList = [];
|
}
|
|
_this.formLoading = false;
|
});
|
}
|
departmentApi.selectDepartmentUser().then(res => {
|
console.log("res", res);
|
|
_this.options = res.response.map(x => {
|
return {
|
value: x.department.id, label: x.department.name, children: x.userList.map(xx => {
|
return { value: xx.id, label: xx.realName };
|
})
|
};
|
});
|
});
|
},
|
methods: {
|
getSubject(deptId) {
|
// 获取对应部门的课目
|
subjectApi.selectByDeptId(deptId).then(res => {
|
this.form.subjectId = null
|
this.subjectFilter = res.response
|
})
|
},
|
handleSelection(val) {
|
this.student.multipleSelection = val;
|
},
|
selectAll () {
|
this.preSelectAll();
|
let param = { ...this.student };
|
param.pageSize = 999999;
|
examPaperApi.selectStudent(param).then(res => {
|
this.handleSelection(res.response.list);
|
res.response.list.forEach(item => {
|
this.$refs.multipleTable.toggleRowSelection(item, true);
|
this.selectAllBoolean = false;
|
})
|
this.getStudent();
|
});
|
},
|
unselectAll () {
|
this.$refs.multipleTable.clearSelection();
|
this.selectAllBoolean = true;
|
},
|
confirmStudentSelect() {
|
this.form.userIds = this.student.multipleSelection.map((item) => item.id);
|
this.form.examineeList = this.student.multipleSelection.map((item) => {
|
return {
|
id: item.id,
|
realName: item.realName
|
};
|
});
|
this.student.multipleSelection = [];
|
this.studentDialog = false;
|
},
|
preSelectAll() {
|
this.selectAllBoolean = true;
|
this.$refs.multipleTable.clearSelection();
|
this.form.userIds = this.student.multipleSelection.map((item) => item.id);
|
this.form.examineeList = this.student.multipleSelection.map((item) => {
|
return {
|
id: item.id,
|
realName: item.realName
|
};
|
});
|
this.student.multipleSelection = [];
|
},
|
getTags() {
|
userApi.tagList(null).then(data => {
|
this.tags = data.response;
|
});
|
},
|
selectStudent() {
|
this.getTags();
|
this.studentDialog = true;
|
this.student.listLoading = true;
|
this.getStudent();
|
},
|
getStudent() {
|
this.student.listLoading = true;
|
examPaperApi.selectStudent(this.student).then(res => {
|
this.tableData = res.response.list;
|
this.total = res.response.total;
|
this.student.listLoading = false;
|
if (this.studentDialog && this.isFirstShow) {
|
this.isFirstShow = false;
|
this.form.examineeList.forEach(item => {
|
this.$refs.multipleTable.toggleRowSelection(item, true);
|
});
|
}
|
});
|
},
|
cascaderChangeFun(event) {
|
console.log(event);
|
this.form.menuIds = event;
|
},
|
titlejs(val) {
|
console.log(val);
|
let str = '';
|
this.subjectFilter.forEach(item => {
|
if (item.id == val) {
|
str = item.name;
|
}
|
});
|
return str;
|
},
|
subjectIdEvent(e) {
|
console.log(e, this.$refs.subjectIdRef.selected);
|
let arr = [];
|
if (e) {
|
|
} else {
|
this.$refs.subjectIdRef.selected.forEach(item => {
|
arr.push({
|
label: item.label,
|
subjectId: item.value,
|
singleChoice: '',
|
multipleChoice: '',
|
trueFalse: ''
|
});
|
});
|
console.log(arr);
|
this.form.questionTypeVMS = arr;
|
}
|
|
if (this.form.paperType == 7) {
|
//說明是隨機
|
this.subjectIdList = arr;
|
let obj1 = {};
|
let arr1 = [];
|
arr.forEach((item, index) => {
|
// obj1[item.id]=''
|
arr1.push({
|
subjectId: item.id,
|
singleChoice: '',
|
multipleChoice: '',
|
trueFalse: ''
|
});
|
// let obj={
|
// item
|
// }
|
|
// for (let i in obj) {
|
// i=item.id
|
// obj[i]= ''
|
// obj1[i] = ''
|
// console.log('键名:', i);
|
// console.log('键值:', obj[i]);
|
// }
|
});
|
this.form.subjectSource = obj1;
|
|
console.log(this.form.subjectSource);
|
console.log(this.form.questionTypeVMS);
|
// this.form.paperType = 7
|
this.form.titleItems = [{
|
name: '',
|
questionItems: []
|
}];
|
} else {
|
this.form.subjectSource = {};
|
this.subjectIdList = [];
|
// this.form.paperType = 1
|
}
|
},
|
submitForm() {
|
let _this = this;
|
this.$refs.form.validate((valid) => {
|
if (valid) {
|
const tempForm = JSON.parse(JSON.stringify(this.form));
|
this.formLoading = true;
|
if (this.subjectIdList.length == 1) {
|
tempForm.subjectId = tempForm.subjectId;
|
};
|
|
// let lastHasAll = tempForm.menuIds.find(arr => {
|
// return arr[0] === 'all';
|
// });
|
// if (lastHasAll) {
|
// tempForm.menuIds = tempForm.menuIds.slice(1);
|
// }
|
|
tempForm.menuIds = tempForm.userIds.join(',');
|
|
if (tempForm.questionTypeVMS == null) {
|
tempForm.questionTypeVMS = [];
|
}
|
tempForm.status = 0;
|
examPaperApi.selfedit(tempForm).then(re => {
|
if (re.code === 1) {
|
_this.$message.success(re.message);
|
_this.delCurrentView(_this).then(() => {
|
_this.$router.push('/exam/personalRandomTemplate/list');
|
});
|
} else {
|
_this.$message.error(re.message);
|
this.formLoading = false;
|
}
|
}).catch(e => {
|
this.formLoading = false;
|
});
|
} else {
|
return false;
|
}
|
});
|
},
|
addTitle() {
|
this.form.titleItems.push({
|
name: '',
|
questionItems: []
|
});
|
},
|
addQuestion(titleItem) {
|
this.currentTitleItem = titleItem;
|
this.questionPage.showDialog = true;
|
this.search();
|
},
|
removeTitleItem(titleItem) {
|
this.form.titleItems.remove(titleItem);
|
},
|
removeQuestion(titleItem, questionItem) {
|
titleItem.questionItems.remove(questionItem);
|
},
|
queryForm() {
|
this.questionPage.queryParam.pageIndex = 1;
|
this.search();
|
},
|
confirmQuestionSelect() {
|
let _this = this;
|
this.questionPage.multipleSelection.forEach(q => {
|
questionApi.select(q.id).then(re => {
|
_this.currentTitleItem.questionItems.push(re.response);
|
});
|
});
|
this.questionPage.showDialog = false;
|
},
|
levelChange() {
|
// this.form.subjectId = null
|
// this.subjectFilter = this.subjects.filter(data =>{
|
// return this.form.departmentIds.forEach(item=>{data.level == item})
|
// })
|
//
|
// this.subjectFilter = []
|
// this.form.departmentIds.forEach(item=>{
|
// this.subjects.forEach(jectitem=>{
|
// if (item==jectitem.level){
|
// this.subjectFilter.push(jectitem)
|
// }
|
// })
|
// })
|
console.log(this.subjects, this.form.departmentIds);
|
// this.subjectFilter = this.subjects
|
},
|
search() {
|
if (this.subjectIdList.length = 1) {
|
this.questionPage.queryParam.subjectId = this.form.subjectId;
|
}
|
|
this.questionPage.listLoading = true;
|
questionApi.pageList(this.questionPage.queryParam).then(data => {
|
const re = data.response;
|
this.questionPage.tableData = re.list;
|
this.questionPage.total = re.total;
|
this.questionPage.queryParam.pageIndex = re.pageNum;
|
this.questionPage.listLoading = false;
|
});
|
},
|
handleSelectionChange(val) {
|
this.questionPage.multipleSelection = val;
|
},
|
questionTypeFormatter(row, column, cellValue, index) {
|
return this.enumFormat(this.questionTypeEnum, cellValue);
|
},
|
subjectFormatter(row, column, cellValue, index) {
|
return this.subjectEnumFormat(cellValue);
|
},
|
resetForm() {
|
let lastId = this.form.id;
|
this.$refs['form'].resetFields();
|
this.form = {
|
aggregateSource: 100,
|
id: null,
|
departmentIds: [],
|
subjectId: [],
|
paperType: 1,
|
limitDateTime: [],
|
name: '',
|
suggestTime: null,
|
titleItems: [],
|
subjectSource: null,
|
questionTypeVMS: []
|
};
|
this.form.id = lastId;
|
},
|
...mapActions('exam', { initSubject: 'initSubject' }),
|
...mapActions('tagsView', { delCurrentView: 'delCurrentView' }),
|
},
|
computed: {
|
|
...mapGetters('enumItem', ['enumFormat']),
|
...mapState('enumItem', {
|
questionTypeEnum: state => state.exam.question.typeEnum,
|
paperTypeEnum: state => state.exam.examPaper.paperTypeEnum,
|
levelEnum: state => state.user.levelEnum
|
}),
|
...mapState('exam', { subjects: state => state.subjects })
|
}
|
};
|
</script>
|
|
<style lang="scss">
|
.exampaper-item-box {
|
.q-title {
|
margin: 0px 5px 0px 5px;
|
}
|
|
.q-item-content {}
|
}
|
|
.examinee-popper {
|
display: none !important;
|
}
|
</style>
|