224 lines
7.7 KiB
Vue
224 lines
7.7 KiB
Vue
<template>
|
||
<a-card :bordered="false" title="组卷策略信息">
|
||
<a-form-model :rules="rules" :model="form" v-bind="formItemLayout">
|
||
<a-row :gutter="24">
|
||
<a-col :md="10" :sm="12">
|
||
<a-form-model-item label="总分" prop="totalScore">
|
||
<a-input-number v-model="form.totalScore" :disabled="true" />
|
||
</a-form-model-item>
|
||
</a-col>
|
||
<a-col :md="14" :sm="12">
|
||
<a-form-model-item label="及格分数" prop="passScore">
|
||
<a-input-number v-model="form.passScore" :min="1" :max="100" />
|
||
</a-form-model-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row :gutter="24">
|
||
<a-col :md="10" :sm="12">
|
||
<a-form-model-item label="考试时长" prop="examTime">
|
||
<a-input-number :min="0" v-model="form.examTime" />
|
||
</a-form-model-item>
|
||
</a-col>
|
||
<a-col :md="14" :sm="12">
|
||
<a-form-model-item label="默认组卷题量" prop="topicNumber">
|
||
<a-input-number :min="0" v-model="form.topicNumber" />
|
||
</a-form-model-item>
|
||
</a-col>
|
||
</a-row>
|
||
<a-row v-if="!['2'].includes(form.trainWay)" :gutter="24">
|
||
<h4>考试开启条件：</h4>
|
||
<a-col :md="10" :sm="12">
|
||
<a-form-model-item label="学时时长" prop="examOpenCondition">
|
||
<a-input-number :min="0" v-model="form.examOpenCondition" />
|
||
</a-form-model-item>
|
||
</a-col>
|
||
</a-row>
|
||
|
||
<a-card :bordered="false" title="组卷策略详情">
|
||
<a-table
|
||
:columns="columns"
|
||
:data-source="tableData"
|
||
bordered
|
||
:position="{ disabled: false }"
|
||
:pagination="false"
|
||
>
|
||
<template slot="topicNum" slot-scope="text, record">
|
||
<a-input-number style="margin: -5px 0" v-model="record.topicNum" :min="0" :max="record.totalNum" />
|
||
</template>
|
||
<template slot="topicScore" slot-scope="text, record">
|
||
<a-input-number style="margin: -5px 0" v-model="record.topicScore" :min="0" />
|
||
</template>
|
||
<template slot="totalScore" slot-scope="text, record">
|
||
<p>{{ record.topicScore }}</p>
|
||
</template>
|
||
<template slot="footer" :style="{ float: 'left' }">
|
||
<p class="right">总分数：{{ form.totalScore }} 分</p>
|
||
</template>
|
||
</a-table>
|
||
</a-card>
|
||
</a-form-model>
|
||
<a-col :span="24" style="text-align: center;">
|
||
<a-button type="primary" size="default" @click="toPrev" style="margin-right: 8px;">上一步</a-button>
|
||
<a-button type="primary" size="default" @click="toSave" style="margin-right: 8px;">保存</a-button>
|
||
<a-button type="primary" size="default" @click="toIssue">发布</a-button>
|
||
</a-col>
|
||
</a-card>
|
||
</template>
|
||
|
||
<script>
|
||
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
|
||
// 例如：import 《组件名称》 from '《组件路径》'
|
||
import { getQuestionNumByCourseIds } from '@/api/course/question/question'
|
||
import Item from '@/components/AvatarList/Item'
|
||
|
||
export default {
|
||
// import引入的组件需要注入到对象中才能使用
|
||
components: {},
|
||
props: {
|
||
projectForm: {
|
||
type: Object
|
||
}
|
||
},
|
||
data() {
|
||
// 这里存放数据
|
||
return {
|
||
form: this.projectForm,
|
||
formItemLayout: { labelCol: { span: 4 }, wrapperCol: { span: 14 } },
|
||
rules: {
|
||
totalScore: [{ required: true, message: '请输入组卷总分', trigger: 'blur' }],
|
||
trainClass: [{ required: true, message: '请选择培训分类', trigger: 'blur' }],
|
||
projectName: [{ required: true, message: '请输入项目名称', trigger: 'blur' }],
|
||
trainClass: [{ required: true, message: '请选择培训分类', trigger: 'blur' }],
|
||
projectName: [{ required: true, message: '请输入项目名称', trigger: 'blur' }],
|
||
trainClass: [{ required: true, message: '请选择培训分类', trigger: 'blur' }],
|
||
projectName: [{ required: true, message: '请输入项目名称', trigger: 'blur' }],
|
||
trainClass: [{ required: true, message: '请选择培训分类', trigger: 'blur' }]
|
||
},
|
||
columns: [
|
||
{ title: '序号', key: 'i', dataIndex: 'i', width: 70, scopedSlots: { customRender: 'serial' } },
|
||
{
|
||
title: '题目类型',
|
||
dataIndex: 'topicType',
|
||
key: 'topicType',
|
||
customRender: (text, record, index) => {
|
||
if (text == 1) return '单选题'
|
||
if (text == 2) return '多选题'
|
||
if (text == 3) return '判断题'
|
||
if (text == 4) return '简答题'
|
||
if (text == 5) return '填空题'
|
||
}
|
||
},
|
||
{ title: '总题量', dataIndex: 'totalNum', key: 'totalNum' },
|
||
{
|
||
title: '考试题量',
|
||
dataIndex: 'topicNum',
|
||
width: 100,
|
||
key: 'topicNum',
|
||
scopedSlots: { customRender: 'topicNum' }
|
||
},
|
||
{
|
||
title: '单题分值',
|
||
dataIndex: 'topicScore',
|
||
width: 100,
|
||
key: 'topicScore',
|
||
scopedSlots: { customRender: 'topicScore' }
|
||
},
|
||
{
|
||
title: '总分',
|
||
dataIndex: 'totalScore',
|
||
key: 'total',
|
||
customRender: (value, row, index) => {
|
||
if (!row.topicNum || !row.topicScore) return ''
|
||
return row.topicNum * row.topicScore + '分'
|
||
}
|
||
}
|
||
],
|
||
tableData: [],
|
||
totalScore: 0
|
||
}
|
||
},
|
||
// 计算属性 类似于data概念
|
||
computed: {},
|
||
// 监控data中的数据变化
|
||
watch: {
|
||
tableData: {
|
||
deep: true,
|
||
handler: function() {
|
||
let sum = 0
|
||
this.tableData.forEach(t => {
|
||
if (t.topicNum && t.topicScore) {
|
||
let score = t.topicNum * t.topicScore;
|
||
sum = sum + score;
|
||
}
|
||
})
|
||
this.form.totalScore = sum
|
||
}
|
||
}
|
||
},
|
||
// 方法集合
|
||
methods: {
|
||
//保存
|
||
toSave() {
|
||
this.form.testPaperTactics = this.tableData.filter((Item) => {return Item.topicNum && Item.topicScore});
|
||
this.form.projectStatus = 1
|
||
this.$emit('executeSave', this.form)
|
||
},
|
||
//发布
|
||
toIssue() {
|
||
this.form.testPaperTactics = this.tableData.filter((Item) => {return Item.topicNum && Item.topicScore});
|
||
this.form.projectStatus = 2
|
||
this.$emit('executeIssue', this.form)
|
||
},
|
||
//上一步
|
||
toPrev() {
|
||
this.$emit('prevStep', this.form)
|
||
},
|
||
initTable() {
|
||
let ids = this.form.lessonIds.map(t => {
|
||
return parseInt(t.ids)
|
||
})
|
||
getQuestionNumByCourseIds({ ids: ids }).then(res => {
|
||
this.tableData = res.data
|
||
if (this.tableData && this.form.testPaperTactics) {
|
||
this.tableData.forEach((t1, t1Index) => {
|
||
this.form.testPaperTactics.forEach(t2 => {
|
||
if (t1.topicType === t2.topicType) {
|
||
this.$set(this.tableData[t1Index], 'topicNum', t2.topicNum)
|
||
this.$set(this.tableData[t1Index], 'topicScore', t2.topicScore)
|
||
}
|
||
})
|
||
})
|
||
}
|
||
})
|
||
}
|
||
},
|
||
// 生命周期 - 创建完成（可以访问当前this实例）
|
||
created() {
|
||
this.initTable()
|
||
},
|
||
// 生命周期 - 挂载完成（可以访问DOM元素）
|
||
mounted() {},
|
||
// 生命周期 - 创建之前
|
||
beforeCreate() {},
|
||
// 生命周期 - 挂载之前
|
||
beforeMount() {},
|
||
// 生命周期 - 更新之前
|
||
beforeUpdate() {},
|
||
// 生命周期 - 更新之后
|
||
updated() {},
|
||
// 生命周期 - 销毁之前
|
||
beforeDestroy() {},
|
||
// 生命周期 - 销毁完成
|
||
destroyed() {},
|
||
// 如果页面有keep-alive缓存功能，这个函数会触发
|
||
activated() {}
|
||
}
|
||
</script>
|
||
<style scoped>
|
||
.right {
|
||
/* 右对齐 */
|
||
text-align: right;
|
||
font-size: 16px;
|
||
}
|
||
</style>
|