Yuan
parent
d0a6b8e951
commit
b472601fbc
@ -1,96 +1,91 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="title"
|
||||
width="600px"
|
||||
:visible.sync="dialogShow"
|
||||
:before-close="handleCancel"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="140px">
|
||||
<el-form-item label="试题类型" prop="type">
|
||||
<el-select v-model="form.type" placeholder="请选择试题类型" style="width:240px;" @change="clearSubtype">
|
||||
<el-option
|
||||
v-for="item in types"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="规则类型" prop="subtype">
|
||||
<el-select
|
||||
v-model="form.subtype"
|
||||
placeholder="请选择规则类型"
|
||||
style="width:240px;"
|
||||
@change="subTypesChange"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in subtypes"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="分类" required>
|
||||
<el-select v-model="form.tags" @change="getQuestionAmount">
|
||||
<el-option
|
||||
v-for="item in labels"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.subtype === 5" label="场景实训">
|
||||
<el-row style="border: 1px solid #DCDFE6;width: 400px;">
|
||||
<el-col :span="12" style="border-right: 1px solid #DCDFE6;overflow: hidden;text-align: center;">场景实训名称</el-col>
|
||||
<el-col :span="12" style="text-align: center;">扮演角色</el-col>
|
||||
</el-row>
|
||||
<template v-for="scene in sceneTrainMap">
|
||||
<el-row :key="scene.id" style="border: 1px solid #DCDFE6;width: 400px;border-top: 0;">
|
||||
<el-col :span="12" style="border-right: 1px solid #DCDFE6;overflow: hidden;">
|
||||
<el-radio v-model="scene.check" :label="true" style="margin-left: 10px;">{{ scene.name }}</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-select v-model="scene.cosplayId" :disabled="!scene.check" size="mini" style="margin-left: 10px;" placeholder="请选择扮演角色">
|
||||
<el-option
|
||||
v-for="item in totalMemberList"
|
||||
v-show="scene.playerIdList.includes(item.value)"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="title"
|
||||
width="600px"
|
||||
:visible.sync="dialogShow"
|
||||
:before-close="handleCancel"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="140px">
|
||||
<el-form-item label="试题类型" prop="type">
|
||||
<el-select v-model="form.type" placeholder="请选择试题类型" style="width:240px;" @change="clearSubtype">
|
||||
<el-option v-for="item in types" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="规则类型" prop="subtype">
|
||||
<el-select
|
||||
v-model="form.subtype"
|
||||
placeholder="请选择规则类型"
|
||||
style="width:240px;"
|
||||
@change="subTypesChange"
|
||||
>
|
||||
<el-option v-for="item in subtypes" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" required>
|
||||
<el-select v-model="form.tags" @change="getQuestionAmount">
|
||||
<el-option v-for="item in labels" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.subtype === 5" label="场景实训">
|
||||
<el-row style="border: 1px solid #DCDFE6;width: 400px;">
|
||||
<el-col :span="12" style="border-right: 1px solid #DCDFE6;overflow: hidden;text-align: center;"
|
||||
>场景实训名称</el-col
|
||||
>
|
||||
<el-col :span="12" style="text-align: center;">扮演角色</el-col>
|
||||
</el-row>
|
||||
<template v-for="scene in sceneTrainMap">
|
||||
<el-row :key="scene.id" style="border: 1px solid #DCDFE6;width: 400px;border-top: 0;">
|
||||
<el-col :span="12" style="border-right: 1px solid #DCDFE6;overflow: hidden;">
|
||||
<el-radio v-model="scene.check" :label="true" style="margin-left: 10px;">{{
|
||||
scene.name
|
||||
}}</el-radio>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-select
|
||||
v-model="scene.cosplayId"
|
||||
:disabled="!scene.check"
|
||||
size="mini"
|
||||
style="margin-left: 10px;"
|
||||
placeholder="请选择扮演角色"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in totalMemberList"
|
||||
v-show="scene.playerIdList.includes(item.value)"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
</el-form-item>
|
||||
<el-form-item v-show="form.subtype !== 5" label="题目数量" prop="amount">
|
||||
<el-input-number
|
||||
v-model="form.amount"
|
||||
:min="0"
|
||||
style="width: 200px; float: left; margin-right: 10px;"
|
||||
/>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
</el-form-item>
|
||||
<el-form-item v-show="form.subtype !== 5" label="题目数量" prop="amount">
|
||||
<el-input-number
|
||||
v-model="form.amount"
|
||||
:min="0"
|
||||
style="width: 200px; float: left; margin-right: 10px;"
|
||||
/>
|
||||
<span style="width: 190px; float: left;">
|
||||
{{ $t('publish.allNumberTipOne') }} {{ topicNum }} {{ $t('publish.allNumberTipTwo') }}
|
||||
</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('publish.scorePerQuestion')" prop="score">
|
||||
<el-input-number v-model="form.score" :precision="0" :min="0" style="width:200px" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">{{ $t('global.cancel') }}</el-button>
|
||||
<el-button type="primary" @click="handleOk">{{ $t('global.confirm') }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<span style="width: 190px; float: left;">
|
||||
{{ $t('publish.allNumberTipOne') }} {{ topicNum }} {{ $t('publish.allNumberTipTwo') }}
|
||||
</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('publish.scorePerQuestion')" prop="score">
|
||||
<el-input-number v-model="form.score" :precision="0" :min="0" style="width:200px" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">{{ $t('global.cancel') }}</el-button>
|
||||
<el-button type="primary" @click="handleOk">{{ $t('global.confirm') }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getQuestionAmount, queryTagList } from '@/api/management/exam';
|
||||
import { getPublishTrainingListInOrg } from '@/api/jmap/training';
|
||||
import { getQuestionAmount, queryTagList } from '@/api/management/exam'
|
||||
import { getPublishTrainingListInOrg } from '@/api/jmap/training'
|
||||
|
||||
export default {
|
||||
name: 'EditRule',
|
||||
@ -98,53 +93,53 @@ export default {
|
||||
ruleList: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
}
|
||||
return []
|
||||
},
|
||||
},
|
||||
examData: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {};
|
||||
}
|
||||
return {}
|
||||
},
|
||||
},
|
||||
totalMemberList: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
return []
|
||||
},
|
||||
},
|
||||
},
|
||||
data() {
|
||||
var number = (rule, value, message) => {
|
||||
if (this.form.subtype !== 5) {
|
||||
if (!value) {
|
||||
return message(new Error(this.$t('publish.inputQuestionNumber')));
|
||||
return message(new Error(this.$t('publish.inputQuestionNumber')))
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (Number(value) == 0) {
|
||||
message(new Error(this.$t('publish.inputQuestionNumberError')));
|
||||
message(new Error(this.$t('publish.inputQuestionNumberError')))
|
||||
} else if (!Number(value)) {
|
||||
message(new Error(this.$t('publish.inputValidNumber')));
|
||||
message(new Error(this.$t('publish.inputValidNumber')))
|
||||
} else if (Number(value) > this.topicNum) {
|
||||
message(new Error(this.$t('publish.inputNumberError')));
|
||||
message(new Error(this.$t('publish.inputNumberError')))
|
||||
} else {
|
||||
message();
|
||||
message()
|
||||
}
|
||||
}, 100);
|
||||
}, 100)
|
||||
} else {
|
||||
message();
|
||||
message()
|
||||
}
|
||||
};
|
||||
}
|
||||
var score = (rule, value, message) => {
|
||||
if (!value) {
|
||||
return message(new Error(this.$t('publish.inputScorePerQuestion')));
|
||||
return message(new Error(this.$t('publish.inputScorePerQuestion')))
|
||||
} else {
|
||||
message();
|
||||
message()
|
||||
}
|
||||
};
|
||||
}
|
||||
const tagsValidator = (rule, value, message) => {
|
||||
message();
|
||||
};
|
||||
message()
|
||||
}
|
||||
return {
|
||||
form: {
|
||||
id: '',
|
||||
@ -152,7 +147,7 @@ export default {
|
||||
subtype: '',
|
||||
tags: '',
|
||||
amount: 1,
|
||||
score: 1
|
||||
score: 1,
|
||||
},
|
||||
sceneInfo: [],
|
||||
labels: [],
|
||||
@ -165,162 +160,188 @@ export default {
|
||||
subtype: [{ required: true, message: '请选择规则类型', trigger: 'change' }],
|
||||
amount: [{ required: true, validator: number, trigger: 'blur' }],
|
||||
score: [{ required: true, validator: score, trigger: 'blur' }],
|
||||
tags: [{ validator: tagsValidator, trigger: 'blur' }]
|
||||
}
|
||||
};
|
||||
tags: [{ validator: tagsValidator, trigger: 'blur' }],
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
types() {
|
||||
return [{ value: 1, label: '理论题' }, { value: 2, label: '实训题' }];
|
||||
return [{ value: 1, label: '理论题' }, { value: 2, label: '实训题' }]
|
||||
},
|
||||
subtypes() {
|
||||
const data = {
|
||||
'1': [{ value: 1, label: '单选题' }, { value: 2, label: '多选题' }, { value: 3, label: '判断题' }],
|
||||
'2': [{ value: 4, label: '单操实训' }, { value: 5, label: '场景实训' }]
|
||||
};
|
||||
return data[this.form.type];
|
||||
'2': [{ value: 4, label: '单操实训' }, { value: 5, label: '场景实训' }],
|
||||
}
|
||||
return data[this.form.type]
|
||||
},
|
||||
title() {
|
||||
return this.isEditMode ? this.$t('publish.modifyRules') : this.$t('publish.addRules');
|
||||
}
|
||||
return this.isEditMode ? this.$t('publish.modifyRules') : this.$t('publish.addRules')
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
show(detail) {
|
||||
this.dialogShow = true;
|
||||
this.dialogShow = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.form.resetFields();
|
||||
this.$refs.form.resetFields()
|
||||
if (detail) {
|
||||
this.isEditMode = true;
|
||||
this.index = detail.index;
|
||||
this.form = {
|
||||
type: detail.type,
|
||||
subtype: detail.subtype,
|
||||
amount: detail.amount,
|
||||
score: detail.score,
|
||||
id: detail.id || '',
|
||||
tags: detail.tags ? detail.tags[0] : ''
|
||||
};
|
||||
this.sceneInfo = detail.sceneInfo || [];
|
||||
this.topicNum = detail.topicNum;
|
||||
this.subTypesChange();
|
||||
this.fillLabelsOption().then(() => {
|
||||
this.isEditMode = true
|
||||
this.index = detail.index
|
||||
console.log(detail)
|
||||
this.form = {
|
||||
type: detail.type,
|
||||
subtype: detail.subtype,
|
||||
amount: detail.amount,
|
||||
score: detail.score,
|
||||
id: detail.id || '',
|
||||
tags: detail.tags ? detail.tags[0] : '',
|
||||
}
|
||||
this.sceneInfo = detail.sceneInfo || []
|
||||
this.topicNum = detail.topicNum
|
||||
this.getQuestionAmount()
|
||||
})
|
||||
} else {
|
||||
this.isEditMode = false;
|
||||
this.isEditMode = false
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
isDuplicated() {
|
||||
const isDuplicated =
|
||||
this.ruleList.length > 0 &&
|
||||
this.ruleList.some(rule => rule.type === this.form.type && rule.subtype === this.form.subtype && rule.tags && this.form.tags && rule.tags.includes(this.form.tags));
|
||||
return isDuplicated;
|
||||
this.ruleList.length > 0 &&
|
||||
this.ruleList.some(
|
||||
rule =>
|
||||
rule.type === this.form.type &&
|
||||
rule.subtype === this.form.subtype &&
|
||||
rule.tags &&
|
||||
this.form.tags &&
|
||||
rule.tags.includes(this.form.tags)
|
||||
)
|
||||
return isDuplicated
|
||||
},
|
||||
subTypesChange(val) {
|
||||
this.form.tags = ''
|
||||
this.fillLabelsOption()
|
||||
this.getQuestionAmount()
|
||||
},
|
||||
fillLabelsOption() {
|
||||
const param = {
|
||||
orgId: this.$store.state.user.companyId,
|
||||
groupType: this.form.type,
|
||||
mapId: this.examData.mapId,
|
||||
subType: this.form.subtype
|
||||
};
|
||||
this.form.tags = '';
|
||||
queryTagList(param).then(resp => {
|
||||
this.labels = [{ label: '无', value: '' }, ...resp.data.map(item => ({ label: item, value: item }))];
|
||||
});
|
||||
this.getQuestionAmount();
|
||||
subType: this.form.subtype,
|
||||
}
|
||||
return queryTagList(param).then(resp => {
|
||||
this.labels = [{ label: '无', value: '' }, ...resp.data.map(item => ({ label: item, value: item }))]
|
||||
})
|
||||
},
|
||||
getQuestionAmount(e) {
|
||||
if (!(this.form.type && this.form.subtype)) return;
|
||||
if (!(this.form.type && this.form.subtype)) return
|
||||
const param = {
|
||||
orgId: this.$store.state.user.companyId,
|
||||
groupType: this.form.type,
|
||||
subType: this.form.subtype,
|
||||
mapId: this.examData.mapId
|
||||
};
|
||||
mapId: this.examData.mapId,
|
||||
}
|
||||
if (this.form.tags !== '') {
|
||||
param.tags = this.form.tags;
|
||||
param.tags = this.form.tags
|
||||
}
|
||||
if (this.form.subtype === 5) {
|
||||
const data = {mapId: this.examData.mapId, type: 'scene', labels: [this.form.tags]};
|
||||
getPublishTrainingListInOrg(data).then(response => {
|
||||
if (response.data && response.data.length) {
|
||||
response.data.forEach(scene => {
|
||||
this.$set(this.sceneTrainMap, scene.id, { check: false, name: scene.name, playerIdList: JSON.parse(scene.playerIdJson), cosplayId: '' });
|
||||
});
|
||||
this.sceneInfo && this.sceneInfo.forEach(scene => {
|
||||
this.sceneTrainMap[scene.publishTrainId].check = true;
|
||||
this.sceneTrainMap[scene.publishTrainId].cosplayId = scene.cosplayId;
|
||||
});
|
||||
}
|
||||
}).catch(() => {
|
||||
this.$message.error('获取场景实训列表失败！');
|
||||
});
|
||||
const data = { mapId: this.examData.mapId, type: 'scene', labels: [this.form.tags] }
|
||||
getPublishTrainingListInOrg(data)
|
||||
.then(response => {
|
||||
if (response.data && response.data.length) {
|
||||
response.data.forEach(scene => {
|
||||
this.$set(this.sceneTrainMap, scene.id, {
|
||||
check: false,
|
||||
name: scene.name,
|
||||
playerIdList: JSON.parse(scene.playerIdJson),
|
||||
cosplayId: '',
|
||||
})
|
||||
})
|
||||
this.sceneInfo &&
|
||||
this.sceneInfo.forEach(scene => {
|
||||
this.sceneTrainMap[scene.publishTrainId].check = true
|
||||
this.sceneTrainMap[scene.publishTrainId].cosplayId = scene.cosplayId
|
||||
})
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.$message.error('获取场景实训列表失败！')
|
||||
})
|
||||
} else {
|
||||
getQuestionAmount(param).then(resp => {
|
||||
this.topicNum = resp.data;
|
||||
});
|
||||
this.topicNum = resp.data
|
||||
})
|
||||
}
|
||||
},
|
||||
clearSubtype() {
|
||||
this.form.subtype = '';
|
||||
this.form.tags = '';
|
||||
this.labels = [{ label: '无', value: '' }];
|
||||
this.form.subtype = ''
|
||||
this.form.tags = ''
|
||||
this.labels = [{ label: '无', value: '' }]
|
||||
},
|
||||
handleSceneData() {
|
||||
let validFlag = true;
|
||||
let validFlag = true
|
||||
if (this.form.subtype === 5) {
|
||||
this.sceneInfo = [];
|
||||
this.sceneInfo = []
|
||||
for (const sceneId in this.sceneTrainMap) {
|
||||
const scene = this.sceneTrainMap[sceneId];
|
||||
const scene = this.sceneTrainMap[sceneId]
|
||||
if (scene.check && scene.cosplayId) {
|
||||
this.sceneInfo.push({publishTrainId: sceneId, cosplayId: scene.cosplayId });
|
||||
this.sceneInfo.push({ publishTrainId: sceneId, cosplayId: scene.cosplayId })
|
||||
} else if (scene.check && !scene.cosplayId) {
|
||||
validFlag = false;
|
||||
validFlag = false
|
||||
}
|
||||
}
|
||||
this.form.amount = this.sceneInfo.length;
|
||||
this.form.amount = this.sceneInfo.length
|
||||
}
|
||||
if (!validFlag) {
|
||||
this.$message.warning('请选择场景实训的扮演角色！');
|
||||
this.$message.warning('请选择场景实训的扮演角色！')
|
||||
} else if (!this.form.amount) {
|
||||
this.$message.warning('请选择场景实训！');
|
||||
this.$message.warning('请选择场景实训！')
|
||||
}
|
||||
return validFlag;
|
||||
return validFlag
|
||||
},
|
||||
handleOk() {
|
||||
this.handleSceneData() && this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.ruleList.length > 0 && !this.isEditMode) {
|
||||
if (this.isDuplicated()) {
|
||||
this.$message.warning('与已有规则重复, 请重新选择');
|
||||
return;
|
||||
this.handleSceneData() &&
|
||||
this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.ruleList.length > 0 && !this.isEditMode) {
|
||||
if (this.isDuplicated()) {
|
||||
this.$message.warning('与已有规则重复, 请重新选择')
|
||||
return
|
||||
}
|
||||
}
|
||||
this.$emit(
|
||||
'submit',
|
||||
{ ...this.form, sceneInfo: this.sceneInfo, topicNum: this.topicNum },
|
||||
this.isEditMode
|
||||
)
|
||||
this.handleCancel()
|
||||
}
|
||||
this.$emit('submit', { ...this.form, sceneInfo: this.sceneInfo, topicNum: this.topicNum }, this.isEditMode);
|
||||
this.handleCancel();
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
this.topicNum = 0;
|
||||
this.dialogShow = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
this.topicNum = 0
|
||||
this.dialogShow = false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
/deep/ {
|
||||
.el-dialog {
|
||||
width: 600px;
|
||||
}
|
||||
.el-dialog {
|
||||
width: 600px;
|
||||
}
|
||||
|
||||
.el-form-item__content {
|
||||
width: calc(100% - 80px);
|
||||
}
|
||||
.el-form-item__content {
|
||||
width: calc(100% - 80px);
|
||||
}
|
||||
|
||||
.el-cascader {
|
||||
width: 100%;
|
||||
}
|
||||
.el-cascader {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.dialog-footer{
|
||||
text-align: center;
|
||||
.dialog-footer {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user