<template>
|
<el-dialog v-model="params.visible" :title="params.title" width="50%" @open="openDialog" @close="dialogClose">
|
<div class="content">
|
<el-form :model="form" ref="formRef" :rules="rules" label-width="130px">
|
<el-form-item label="任务名称" prop="taskName">
|
<el-input v-model="form.taskName" placeholder="请输入任务名称"></el-input>
|
</el-form-item>
|
<el-form-item label="评优奖项" prop="awards">
|
<el-input v-model="form.awards" placeholder="请输入评优奖项"></el-input>
|
</el-form-item>
|
<el-form-item label="认定标准描述" prop="remark">
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入认定标准描述"></el-input>
|
</el-form-item>
|
<el-form-item label="投票人员" prop="employees">
|
<el-checkbox-group v-model="form.employees">
|
<el-checkbox v-for="item in employeeDict" :key="item.id" :label="item.dictKey">
|
{{ item.dictValue }}
|
</el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
<el-form-item label="投票时间" required>
|
<el-form-item class="time-box" prop="candidateCutoffTimeStart">
|
<el-date-picker v-model="form.candidateCutoffTimeStart" type="datetime" placeholder="请选择任务开始时间"
|
style="width: 100%;" />
|
</el-form-item>
|
<span class="time-span">至</span>
|
<el-form-item class="time-box" prop="candidateCutoffTimeEnd">
|
<el-date-picker v-model="form.candidateCutoffTimeEnd" type="datetime" placeholder="请选择任务结束时间"
|
style="width: 100%;" />
|
</el-form-item>
|
</el-form-item>
|
</el-form>
|
</div>
|
<template #footer>
|
<el-button @click="() => params.visible = false">取消</el-button>
|
<el-button type="primary" @click="submit">确定</el-button>
|
</template>
|
</el-dialog>
|
</template>
|
|
<script>
|
import { getDict } from '@/api/dict'
|
import _ from 'lodash';
|
|
export default {
|
props: {
|
params: {
|
type: Object,
|
default: () => {
|
return {
|
visible: false,
|
title: '新增部门评优任务',
|
isEdit: false,
|
addForm: {},
|
};
|
},
|
},
|
},
|
data() {
|
return {
|
form: {
|
taskName: '',
|
awards: '',
|
remark: '',
|
employees: [],
|
candidateCutoffTimeStart: '',
|
candidateCutoffTimeEnd: ''
|
},
|
rules: {
|
taskName: [
|
{ required: true, message: '请输入任务名称', trigger: 'click' },
|
],
|
awards: [
|
{ required: true, message: '请输入评优奖项', trigger: 'click' },
|
],
|
remark: [
|
{ required: true, message: '请输入认定标准', trigger: 'click' },
|
],
|
employees: [
|
{ required: true, message: '请选择评定人员', trigger: 'click' },
|
],
|
candidateCutoffTimeStart: [
|
{ required: true, message: '请选择任务开始时间', trigger: 'click' },
|
],
|
candidateCutoffTimeEnd: [
|
{ required: true, message: '请选择任务开始时间', trigger: 'click' },
|
]
|
},
|
employeeDict: []
|
}
|
},
|
methods: {
|
dialogClose() {
|
this.$refs.formRef.resetFields()
|
},
|
openDialog() {
|
this.initDict()
|
},
|
submit() {
|
this.$refs.formRef.validate(vaild => {
|
console.log(this.form);
|
})
|
},
|
initDict() {
|
getDict('employee_type').then(res => {
|
const { code, data } = res.data
|
if (code !== 200) {
|
return this.$message.error('人员类型字典加载失败')
|
}
|
this.employeeDict = data
|
})
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
$borderColor: var(--el-border-color);
|
|
.content {
|
max-height: 400px;
|
overflow-y: auto;
|
|
.time-span {
|
margin: 0 10px;
|
}
|
|
.time-box {
|
width: calc(100% / 2 - 20px);
|
}
|
}
|
</style>
|
