开发考试系统页面
This commit is contained in:
Vce
parent
bd610da879
commit
88fe6cfb9e
@ -0,0 +1,512 @@
|
||||
<template>
|
||||
<!-- 分部分项工程 -->
|
||||
<div class="fullHeight">
|
||||
<div>
|
||||
<div class="searchBox whiteBlock">
|
||||
<el-form :inline="true" size="medium" class="demo-form-inline">
|
||||
<el-form-item label="科目" prop="subjectName">
|
||||
<el-select v-model="subjectName" placeholder="请选择">
|
||||
<el-option v-for="item in subjectNameList" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="试题名称">
|
||||
<el-input placeholder="请输入" v-model="questionName" suffix-icon="el-icon-search"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button class="expintBtn" size="medium" type="primary" @click="addExam">
|
||||
新增考试
|
||||
</el-button>
|
||||
<el-button class="expintBtn" suffix-icon="el-icon-search" size="medium" type="primary" @click="getRecordList">
|
||||
查询
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div class="table_wrap whiteBlock">
|
||||
<el-table class="tables" :data="listData" >
|
||||
<el-table-column width="200" align="center" prop="subjectName" label="科目"></el-table-column>
|
||||
<el-table-column align="center" prop="examName" label="试题名称"></el-table-column>
|
||||
<el-table-column align="center" prop="examCycle" label="考试周期"></el-table-column>
|
||||
<el-table-column align="center" prop="examPersonCount" label="考试人数"></el-table-column>
|
||||
<el-table-column align="center" prop="examSingle" label="单选题"></el-table-column>
|
||||
<el-table-column align="center" prop="examMultiple" label="多选题"></el-table-column>
|
||||
<el-table-column align="center" prop="examJudge" label="判断题"></el-table-column>
|
||||
<el-table-column align="center" prop="uploadPerson" label="上传人"></el-table-column>
|
||||
<el-table-column align="center" prop="uploadTime" label="上传时间"></el-table-column>
|
||||
<el-table-column width="260" label="操作" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="display:flex">
|
||||
<div @click="detail(scope.row)" style="margin-left:10px;" class="operationText">
|
||||
<img src="@/assets/images/icon-edit.png" width="15px" height="15px" />
|
||||
<span style="white-space: nowrap;display:flex;align-items:center">编辑</span>
|
||||
</div>
|
||||
<div @click="detail(scope.row)" style="margin-left:10px;" class="operationText">
|
||||
<img src="@/assets/images/icon-detail.png" width="15px" height="15px" />
|
||||
<span style="white-space: nowrap;display:flex;align-items:center">考试详情</span>
|
||||
</div>
|
||||
<div @click="detail(scope.row)" style="margin-left:10px;" class="operationText">
|
||||
<img src="@/assets/images/icon-product.png" width="15px" height="15px" />
|
||||
<span style="white-space: nowrap;display:flex;align-items:center">考试管理</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination class="pagerBox" @size-change="sizeChange" @current-change="currentChange" :current-page="pagInfo.pageNo" :page-sizes="$store.state.PAGESIZRS" :page-size="pagInfo.pageSize" layout="total, sizes, prev, pager, next" :total="Number(pagInfo.total)" background></el-pagination>
|
||||
</div>
|
||||
<el-dialog :modal-append-to-body="false" :title="'新增考试'" :visible.sync="dialogVisible" width="1000px">
|
||||
<div class="dialogContainer">
|
||||
<div class="dialogLeft">
|
||||
<el-form :model="examForm" ref="examForm" label-width="100px" class="demo-ruleForm">
|
||||
<el-form-item label="考试科目" prop="">
|
||||
<el-select v-model="examForm.subjectType" placeholder="请选择">
|
||||
<el-option label="区域一" value="shanghai"></el-option>
|
||||
<el-option label="区域二" value="beijing"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="科目名称" prop="subjectName">
|
||||
<el-input v-model="examForm.subjectName"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="考试时间" prop="examTime">
|
||||
<el-input style="width: 190px" v-model="examForm.examTime"></el-input>
|
||||
<span style="margin-left: 10px;color:#a6a7b2;">分钟</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="及格分数线" prop="examPass">
|
||||
<el-input style="width: 190px" v-model="examForm.passScore"></el-input>
|
||||
<span style="margin-left: 10px;color:#a6a7b2;">分</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="学习周期" prop="studyCycle">
|
||||
<el-date-picker v-model="examForm.studyCycle" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="desc">
|
||||
<el-input type="textarea" maxlength="500" rows="3" show-word-limit="true" v-model="examForm.desc"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="抽题模式" prop="examMode">
|
||||
<el-radio-group v-model="examForm.examMode" @input="handleDialog">
|
||||
<el-radio label="1">手动抽题</el-radio>
|
||||
<el-radio label="0">随机抽题</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<!-- @click="submitForm('examForm')" -->
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="dialogRight">
|
||||
<p style="text-align: start; margin: 0 0 20px">考试工种/人员</p>
|
||||
<div style="text-align: center">
|
||||
<el-transfer style="text-align: left; display: inline-block" v-model="value"
|
||||
filterable :left-default-checked="[2, 3]" :right-default-checked="[1]"
|
||||
:render-content="renderFunc" :titles="[' ', ' ']"
|
||||
:format="{
|
||||
noChecked: '${total}',
|
||||
hasChecked: '${checked}/${total}'
|
||||
}"
|
||||
@change="handleChange"
|
||||
:data="data">
|
||||
</el-transfer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dialogFooter">
|
||||
<el-button @click="dialogVisible = false"><i class="el-icon-circle-close"></i> 取 消</el-button>
|
||||
<el-button type="primary" @click="submitBtn('examForm')"><i class="el-icon-circle-check"></i> 确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog :modal-append-to-body="false" :title="'手动抽题'" :visible.sync="dialogVisible2" width="1200px">
|
||||
<div class="dialogContainer2">
|
||||
<div class="d2Left">
|
||||
|
||||
</div>
|
||||
<div class="d2Right">
|
||||
<el-table class="tables" :data="questionList" style="min-height:425px">
|
||||
<el-table-column type="selection" align="center" width="55"></el-table-column>
|
||||
<el-table-column align="center" prop="questionInfo" label="题干内容">
|
||||
<template slot-scope="scope">
|
||||
<el-tooltip class="item" effect="dark" :content="scope.row.questionInfo" placement="left">
|
||||
<span style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">{{ scope.row.questionInfo }}</span>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" prop="questionType" label="题目类型"></el-table-column>
|
||||
<el-table-column align="center" prop="diffcuty" label="难易程度"></el-table-column>
|
||||
<el-table-column align="center" prop="answer" label="试题答案"></el-table-column>
|
||||
<el-table-column align="center" prop="createTime" label="创建时间"></el-table-column>
|
||||
<el-table-column align="center" prop="questionStatus" label="状态">
|
||||
<template slot-scope="scope">
|
||||
<span style="color: green" v-if="scope.row.questionStatus === '1'">已启用</span>
|
||||
<span style="color: red" v-if="scope.row.questionStatus === '0'">已禁用</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination class="pagerBox" @size-change="sizeChange" @current-change="currentChange" :current-page="pagInfo.pageNo" :page-sizes="$store.state.PAGESIZRS" :page-size="pagInfo.pageSize" layout="total, sizes, prev, pager, next" :total="Number(pagInfo.total)" background></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dialogFooter">
|
||||
<el-button @click="dialogVisible2 = false"><i class="el-icon-circle-close"></i> 取 消</el-button>
|
||||
<el-button type="primary" @click="submitBtn2('1')"><i class="el-icon-circle-check"></i> 确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-dialog :modal-append-to-body="false" :title="'随机抽题'" :visible.sync="dialogVisible3" width="1200px">
|
||||
|
||||
<div class="dialogFooter">
|
||||
<el-button @click="dialogVisible3 = false"><i class="el-icon-circle-close"></i> 取 消</el-button>
|
||||
<el-button type="primary" @click="submitBtn3('0')"><i class="el-icon-circle-check"></i> 确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
getSubdivisionProjectApi, //所有分部分项工程， 以父子节点形式呈现
|
||||
addSubdivisionProjectApi, //新增
|
||||
upSubdivisionProjectApi, //修改
|
||||
delSubdivisionProjectApi, //
|
||||
} from '@/assets/js/api/quality'
|
||||
|
||||
export default {
|
||||
mounted() {},
|
||||
data() {
|
||||
const generateData = _ => {
|
||||
const data = [];
|
||||
for (let i = 1; i <= 15; i++) {
|
||||
data.push({
|
||||
key: i,
|
||||
label: `备选项 ${ i }`,
|
||||
// disabled: i % 4 === 0
|
||||
});
|
||||
}
|
||||
return data;
|
||||
};
|
||||
return {
|
||||
questionList: [
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionInfo: 'sldkjalskfj;lsdjfsl;dkfj;sldfkslkdfjslkdfjsldkfjslkdfjsl', questionStatus: '1' },
|
||||
{ questionStatus: '0' }
|
||||
],
|
||||
subjectName: '',
|
||||
questionName: '',
|
||||
data: generateData(),
|
||||
value: [1],
|
||||
renderFunc(h, option) {
|
||||
return <span>{ option.key } - { option.label }</span>;
|
||||
},
|
||||
examForm: {},
|
||||
subjectNameList: [{
|
||||
value: '选项1',
|
||||
label: '黄金糕'
|
||||
}, {
|
||||
value: '选项2',
|
||||
label: '双皮奶'
|
||||
}, {
|
||||
value: '选项3',
|
||||
label: '蚵仔煎'
|
||||
}, {
|
||||
value: '选项4',
|
||||
label: '龙须面'
|
||||
}, {
|
||||
value: '选项5',
|
||||
label: '北京烤鸭'
|
||||
}],
|
||||
// value: '',
|
||||
pagInfo: {
|
||||
//公用分页
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
},
|
||||
title: '设置积分规则',
|
||||
projectSn: '',
|
||||
dialogVisible: false, //新增弹窗
|
||||
dialogVisible2: false, //新增二级弹窗
|
||||
dialogVisible3: false, //新增三级弹窗
|
||||
workerInfo: {
|
||||
subdivisionProjectName: '',
|
||||
children: [],
|
||||
id: '',
|
||||
level: 0,
|
||||
parentId: '',
|
||||
},
|
||||
listData: [],
|
||||
listData2: [],
|
||||
listData3: [
|
||||
{ ruleType: '1', symbol: '+', ruleScore: 3 },
|
||||
{ ruleType: '', symbol: '', ruleScore: '' },
|
||||
],
|
||||
addEditRules: {
|
||||
subdivisionProjectName: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('message.personnelPosition.required'),
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
dialogImageUrl: '',
|
||||
showBigImg: false,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dialogVisible(newV,oldV){
|
||||
this.clearDialog()
|
||||
if(newV === false){
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.projectSn = this.$store.state.projectSn
|
||||
this.getRecordList()
|
||||
},
|
||||
methods: {
|
||||
saveRule(val) {},
|
||||
cancelRule(type, val) {
|
||||
if (type === 1) {
|
||||
} else {
|
||||
this.listData3.pop()
|
||||
}
|
||||
},
|
||||
editRule(val) {},
|
||||
addRule() {
|
||||
this.listData3.push({
|
||||
ruleType: '',
|
||||
symbol: '',
|
||||
ruleScore: '',
|
||||
})
|
||||
},
|
||||
//新增按钮
|
||||
addExam() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
//删除按钮
|
||||
deleteBefore(val) {
|
||||
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
// delSubdivisionProjectApi({ id: val }).then((res) => {
|
||||
// this.$message({
|
||||
// type: 'success',
|
||||
// message: '删除成功!',
|
||||
// })
|
||||
// this.getRecordList()
|
||||
// })
|
||||
})
|
||||
.catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除',
|
||||
})
|
||||
})
|
||||
},
|
||||
//获取列表数据
|
||||
getRecordList() {
|
||||
let data = {
|
||||
projectSn: this.projectSn,
|
||||
}
|
||||
this.listData = [
|
||||
{
|
||||
subjectName: '123',
|
||||
questionName: '123',
|
||||
examCycle: '123',
|
||||
examPersonCount: '123',
|
||||
examSingle: '123',
|
||||
examMultiple: '123',
|
||||
examJudge: '123',
|
||||
uploadPerson: '123',
|
||||
uploadTime: '123',
|
||||
},
|
||||
]
|
||||
},
|
||||
|
||||
// 详情按钮
|
||||
detail(val) {
|
||||
this.listData2 = [
|
||||
{
|
||||
workerName: '李四',
|
||||
arReason: '完成安全培训考试',
|
||||
createTime: '2024-04-25 00:00:00',
|
||||
arScore: 3,
|
||||
},
|
||||
{
|
||||
workerName: '李四',
|
||||
arReason: '未完成安全课程',
|
||||
createTime: '2024-04-25 00:00:00',
|
||||
arScore: -3,
|
||||
},
|
||||
{
|
||||
workerName: '李四',
|
||||
arReason: '未完成安全课程',
|
||||
createTime: '2024-04-25 00:00:00',
|
||||
arScore: 0,
|
||||
},
|
||||
]
|
||||
},
|
||||
//新增/编辑
|
||||
submitBtn() {
|
||||
console.log("=====================================")
|
||||
console.log(this.examForm)
|
||||
// this.examForm.projectSn = this.projectSn
|
||||
// this.$refs.examForm.validate((valid) => {
|
||||
// if (valid) {
|
||||
// if (this.title == '新增工程名称') {
|
||||
// addSubdivisionProjectApi(this.workerInfo).then((res) => {
|
||||
// this.$message.success('新增成功')
|
||||
// this.dialogVisible = false
|
||||
// this.getRecordList()
|
||||
// })
|
||||
// } else {
|
||||
// // upSubdivisionProjectApi(this.workerInfo).then((res) => {
|
||||
// // this.$message.success('编辑成功')
|
||||
// // this.dialogVisible = false
|
||||
// // this.getRecordList()
|
||||
// // })
|
||||
// }
|
||||
// } else {
|
||||
// return false
|
||||
// }
|
||||
// })
|
||||
},
|
||||
handleDialog(val){
|
||||
if(val === '1'){
|
||||
this.dialogVisible2 = false
|
||||
this.dialogVisible2 = true
|
||||
}
|
||||
if(val === '0'){
|
||||
this.dialogVisible3 = false
|
||||
this.dialogVisible3 = true
|
||||
}
|
||||
},
|
||||
clearDialog(){
|
||||
this.examForm = {}
|
||||
},
|
||||
//切换条数
|
||||
sizeChange(val) {
|
||||
this.pagInfo.pageSize = val
|
||||
},
|
||||
//切换页数
|
||||
currentChange(val) {
|
||||
this.pagInfo.pageNo = val
|
||||
},
|
||||
handleChange(value, direction, movedKeys) {
|
||||
console.log(value, direction, movedKeys);
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
|
||||
// dialog2
|
||||
.dialogContainer2{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width:100%;
|
||||
height:575px;
|
||||
.d2Left{
|
||||
width: 25%;
|
||||
height: 100%;
|
||||
background-color: darkred;
|
||||
}
|
||||
.d2Right{
|
||||
width: 75%;
|
||||
height: 100%;
|
||||
// background-color: darkblue;
|
||||
|
||||
}
|
||||
}
|
||||
// dialog2
|
||||
|
||||
// dialog
|
||||
.transfer-footer {
|
||||
margin-left: 20px;
|
||||
padding: 6px 5px;
|
||||
}
|
||||
.dialogContainer{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width:100%;
|
||||
height:575px;
|
||||
/deep/ .el-dialog__body{
|
||||
padding: 0 20px;
|
||||
}
|
||||
.dialogLeft{
|
||||
width:35%;
|
||||
height:100%;
|
||||
// background-color: darkred;
|
||||
/deep/ .el-upload-dragger {
|
||||
width: 230px;
|
||||
height: auto;
|
||||
}
|
||||
/deep/ .el-input {
|
||||
width: 230px;
|
||||
}
|
||||
/deep/ .el-textarea {
|
||||
width: 230px;
|
||||
}
|
||||
/deep/ .el-date-editor--daterange.el-input__inner {
|
||||
width: 230px;
|
||||
}
|
||||
/deep/ .el-upload-dragger .el-icon-upload{
|
||||
margin: 0 0 0;
|
||||
}
|
||||
/deep/ .el-upload__tip{
|
||||
margin: 0 0 0;
|
||||
}
|
||||
/deep/ .el-upload--picture-card{
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
line-height: 102px;
|
||||
}
|
||||
}
|
||||
.dialogRight{
|
||||
width:65%;
|
||||
height:100%;
|
||||
// background-color: darkblue;
|
||||
/deep/ .el-transfer__buttons{
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
padding: 0 0;
|
||||
}
|
||||
/deep/ .el-button + .el-button{
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.dialogFooter{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
//dialog
|
||||
|
||||
.greenSpan {
|
||||
color: green;
|
||||
}
|
||||
.detailIcon {
|
||||
background: url(~@/assets/images/projectImg/numBgc.png);
|
||||
}
|
||||
.down {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
}
|
||||
.expintBtn {
|
||||
display: inline-block !important;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.table_wrap {
|
||||
height: 800px;
|
||||
overflow: auto;
|
||||
margin-top: -15px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -28,7 +28,7 @@
|
||||
<div class="courseInfo">
|
||||
<div class="infoItem">类型：<span>{{ item.courseType }}</span></div>
|
||||
<div class="infoItem">待质检数：<span>{{item.courseCount}}</span></div>
|
||||
<div class="infoItem">学习周期：<span>{{item.coursePeroid}}</span></div>
|
||||
<div class="infoItem">学习周期：<span>{{item.courseCycle}}</span></div>
|
||||
<div class="infoItem">选修人员数：<span>{{item.courseElective}}</span></div>
|
||||
<div class="infoItem">必修人员数：<span>{{item.courseCompulsory}}</span></div>
|
||||
</div>
|
||||
@ -97,8 +97,8 @@
|
||||
<el-radio label="文档"></el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="学习周期" prop="studyPeroid">
|
||||
<el-date-picker v-model="ruleForm.studyPeroid" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||
<el-form-item label="学习周期" prop="studyCycle">
|
||||
<el-date-picker v-model="ruleForm.studyCycle" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="desc">
|
||||
<el-input type="textarea" v-model="ruleForm.desc"></el-input>
|
||||
@ -225,7 +225,7 @@ export default {
|
||||
courseTime: '2021-10-12 00:00:00',
|
||||
courseType: '视频',
|
||||
courseCount: '120',
|
||||
coursePeroid: '1次/天',
|
||||
courseCycle: '1次/天',
|
||||
courseElective: '0人',
|
||||
courseCompulsory: '0人',
|
||||
}],
|
||||
@ -312,7 +312,7 @@ export default {
|
||||
total: 0,
|
||||
}
|
||||
|
||||
// this.getRecordList()
|
||||
this.getRecordList()
|
||||
},
|
||||
//切换Tab记录类型
|
||||
handleClick2(val) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user