| | |
| | | <template> |
| | | <el-dialog v-model="params.visible" :title="params.title" width="70%" destroy-on-close @close="dialogClose"> |
| | | <el-dialog v-model="params.visible" :title="params.title" width="50%" destroy-on-close @close="dialogClose"> |
| | | <div class="content"> |
| | | <el-form :model="addForm" label-width="170px" :rules="rules" ref="addFormRef"> |
| | | <el-form-item label="任务名称:" prop="taskName"> |
| | |
| | | <el-form-item label="认定标准描述:" prop="remark"> |
| | | <el-input type="textarea" v-model="addForm.remark" placeholder="请输入认定标准描述"></el-input> |
| | | </el-form-item> |
| | | <el-form-item :label="params.type ? '评定人:' : '候选部门:'" prop="candidateNum"> |
| | | <el-select :disabled="!addForm.taskName" v-model="selectGroup" value-key="deptId" multiple style="width: 100%;" placeholder="请选择候选部门" |
| | | collapse-tags collapse-tags-tooltip :max-collapse-tags="4"> |
| | | <el-option v-for="dept in depts" :key="dept.deptId" |
| | | :label="dept.employees.length === 0 ? (dept.deptName + '(当前部门下员工人数为0)') : dept.deptName" |
| | | :value="dept" :disabled="dept.employees.length === 0"></el-option> |
| | | </el-select> |
| | | <div class="select-list"> |
| | | <div v-if="!addForm.taskName"> |
| | | <el-alert title="请先填写任务名称" type="warning" style="margin-top: 15px;" /> |
| | | </div> |
| | | <div v-else> |
| | | <el-form-item label-width="130px" v-for="content in selectGroup" :key="content.deptId" |
| | | :label="content.deptName" required class="select-item"> |
| | | <span v-if="!params.type"> |
| | | <el-input-number min="0" :max="content.employees.length || Infinity" |
| | | v-model="content.val" controls-position="right" placeholder="请输入候选人数量" |
| | | class="select-num"></el-input-number> |
| | | </span> |
| | | <el-select v-model="content.users" value-key="id" multiple collapse-tags |
| | | collapse-tags-tooltip :max-collapse-tags="4" |
| | | :placeholder="params.type ? '请选择评定人' : '请选择候选人'"> |
| | | <div class="allSelected"> |
| | | <el-checkbox @change="handleEmployeeChange($event, content)">全选</el-checkbox> |
| | | </div> |
| | | <el-option v-for="employee in content.employees" :key="employee.id" |
| | | :label="employee.name" :value="employee"></el-option> |
| | | </el-select> |
| | | <el-button type="primary" @click="assessorDialog(content)" |
| | | v-if="!params.type">设置评选人</el-button> |
| | | </el-form-item> |
| | | </div> |
| | | |
| | | </div> |
| | | </el-form-item> |
| | | <el-form-item :label="`${params.type ? '评优截止日期' : '第一次评优截止日期'}`" prop="candidateCutoffTime"> |
| | | <el-date-picker v-model="addForm.candidateCutoffTime" type="datetimerange" placeholder="请选择截止时间" |
| | | start-placeholder="请选择开始时间" end-placeholder="请选择结束时间" format="YYYY-MM-DD HH:mm:ss" |
| | | valueFormat="YYYY-MM-DD HH:mm:ss" style="width: 100%;" /> |
| | | </el-form-item> |
| | | <el-form-item label="评优数量:" prop="evaluateNum"> |
| | | <el-input-number min="0" :max="(params.type ? false : maxEvaluateNum) || Infinity" |
| | | v-model="addForm.evaluateNum" controls-position="right" |
| | | :placeholder="`请输入评优数量${params.type ? '' : '(最多可选' + maxEvaluateNum + '人)'}`" |
| | | class="evaluateNum-input"></el-input-number> |
| | | </el-form-item> |
| | | <el-form-item label="是否需要进行二次评优:" prop="isAgain" v-if="!params.type"> |
| | | <el-radio-group v-model="addForm.isAgain"> |
| | |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | <set-assessor :params="assessorDialogParams"></set-assessor> |
| | | </template> |
| | | |
| | | <script> |
| | | import website from '@/config/website'; |
| | | import { getDeptTree } from '@/api/system/dept'; |
| | | import { add, update } from '@/api/evaluate/evaluateTask'; |
| | | import { getList } from '@/api/system/user.js'; |
| | | import _ from 'lodash'; |
| | | import setAssessor from './setAssessor.vue'; |
| | | |
| | | export default { |
| | | components: { |
| | | setAssessor |
| | | }, |
| | | props: { |
| | | params: { |
| | | type: Object, |
| | |
| | | title: '新增', |
| | | isEdit: false, |
| | | type: 0, |
| | | taskData: {}, |
| | | addForm: {}, |
| | | }; |
| | | }, |
| | |
| | | evaluateCutoffTime: '', |
| | | evaluateState: '', |
| | | isAgain: null, |
| | | createUser: '', |
| | | createDept: '', |
| | | createTime: '', |
| | | updateUser: '', |
| | | updateTime: '', |
| | | status: '', |
| | | isDeleted: '', |
| | | }, |
| | | rules: { |
| | | taskName: [ |
| | |
| | | type: [ |
| | | { required: true, message: '请选择评优类型', trigger: 'blur' } |
| | | ], |
| | | candidateNum: [ |
| | | { required: true, message: '请选择候选人', trigger: 'click' } |
| | | ], |
| | | candidateCutoffTime: [ |
| | | { required: true, message: '请选择候选人截止日期', trigger: 'click' }, |
| | | ], |
| | | evaluateNum: [ |
| | | { required: true, message: '请输入评优数量', trigger: 'click' } |
| | | ], |
| | | isAgain: [ |
| | | { required: true, message: '请选择是否进行二次评优', trigger: 'click' } |
| | |
| | | { required: true, message: '请选择评优截止时间', trigger: 'click' }, |
| | | ], |
| | | }, |
| | | maxEvaluateNum: 0, |
| | | assessorDialogParams: { |
| | | visible: false, |
| | | data: [] |
| | | } |
| | | maxEvaluateNum: 0 |
| | | }; |
| | | }, |
| | | watch: { |
| | | 'params.visible': { |
| | | handler(val) { |
| | | val && this.initData(website.tenantId); |
| | | this.addForm = this.params.addForm; |
| | | val && (this.addForm.type = this.params.type + '') |
| | | if (this.params.isEdit) { |
| | |
| | | deep: true, |
| | | immediate: true, |
| | | }, |
| | | selectGroup: { |
| | | handler(val) { |
| | | // this.addForm.candidateNum = 0; |
| | | // this.addForm.candidateEntities = [] |
| | | val.forEach(item => { |
| | | // const candidates = [] |
| | | // item.users.forEach(user => { |
| | | // users.push({ |
| | | // id: user.id, |
| | | // name: user.name, |
| | | // }); |
| | | // }); |
| | | // if (!this.params.type) { |
| | | // this.maxEvaluateNum += (item.val * 1); |
| | | // } else { |
| | | // this.maxEvaluateNum += item.users.length; |
| | | // } |
| | | // this.addForm.candidateNum.push({ |
| | | // deptId: item.deptId, |
| | | // deptName: item.deptName, |
| | | // val: this.params.type ? item.users.length : item.val, |
| | | // users, |
| | | // }); |
| | | }); |
| | | }, |
| | | deep: true, |
| | | }, |
| | | }, |
| | | methods: { |
| | | submitOrEdit() { |
| | | const { candidateNum } = this.addForm |
| | | const isExist = candidateNum.find(item => item.val === void 0 || item.val === 0 || item.users.length === 0) |
| | | candidateNum.forEach(candidate => { |
| | | if (candidate.val > candidate.users.length) { |
| | | candidate.val = candidate.users.length |
| | | } |
| | | }) |
| | | if (isExist) { |
| | | this.$message.warning(`${isExist.deptName}候选人人数不可为空或者0`) |
| | | } else { |
| | | Object.keys(this.addForm).forEach(key => { |
| | | if (['evaluateCutoffTime', 'candidateCutoffTime'].includes(key)) { |
| | | const [start, end] = this.addForm[key] |
| | | if (key === 'candidateCutoffTime') { |
| | | this.addForm.candidateCutoffTimeStart = start |
| | | this.addForm.candidateCutoffTimeEnd = end |
| | | } else if (this.addForm.isAgain) { |
| | | this.addForm.evaluateCutoffTimeStart = start |
| | | this.addForm.evaluateCutoffTimeEnd = end |
| | | } |
| | | } |
| | | }) |
| | | this.params.isEdit ? this.handleEdit() : this.handleSubmit() |
| | | } |
| | | this.params.isEdit ? this.handleEdit() : this.handleSubmit() |
| | | }, |
| | | handleSubmit() { |
| | | this.$refs.addFormRef.validate(valid => { |
| | | this.params.type && (this.addForm.evaluateState = 1) |
| | | valid && add(this.addForm).then( |
| | | this.params.type && (data.evaluateState = 1) |
| | | if (!valid) return |
| | | const data = _.cloneDeep(this.addForm) |
| | | Object.keys(data).forEach(key => { |
| | | if (['candidateCutoffTime', 'evaluateCutoffTime'].includes(key)) { |
| | | const [start, end] = this.addForm[key] |
| | | if (key === 'candidateCutoffTime') { |
| | | data.candidateCutoffTimeStart = start |
| | | data.candidateCutoffTimeEnd = end |
| | | } else { |
| | | data.evaluateCutoffTimeStart = start |
| | | data.evaluateCutoffTimeEnd = end |
| | | } |
| | | delete data[key] |
| | | } |
| | | }) |
| | | add(data).then( |
| | | () => { |
| | | this.$message({ |
| | | type: 'success', |
| | |
| | | }); |
| | | this.params.visible = false; |
| | | }, |
| | | async initData(tenantId) { |
| | | const deptTreeRes = await getDeptTree(tenantId) |
| | | let deptList = [] |
| | | const cloneDeptTreeRes = _.cloneDeep(deptTreeRes.data.data) |
| | | // 扁平化deptTree |
| | | cloneDeptTreeRes.forEach(item => { |
| | | deptList.push(item); |
| | | if (item.children) { |
| | | item.children.forEach(ic => { |
| | | ic.title = item.title + '/' + ic.title; |
| | | }) |
| | | deptList = deptList.concat(item.children); |
| | | delete item.children; |
| | | } |
| | | }) |
| | | const depts_list = _.cloneDeep(deptList) |
| | | this.depts = [] |
| | | for (const dept of depts_list) { |
| | | const employeeRes = await getList(1, 99999, { userType: 2 }, dept.id) |
| | | const { records } = employeeRes.data.data |
| | | this.depts.push({ |
| | | deptId: dept.id, |
| | | deptName: dept.title, |
| | | users: [], |
| | | employees: records |
| | | }); |
| | | } |
| | | const params = _.cloneDeep(this.params.addForm.candidateNum) || [] |
| | | const newParams = params.map(item => { |
| | | const value = this.depts.find(dept => item.deptId === dept.deptId); |
| | | item.employees = value?.employees || []; |
| | | return item |
| | | }) |
| | | let defaultUsers = [] |
| | | newParams.forEach(item => { |
| | | const users = item.users.filter(user => item.employees.find(employee => employee.id === user.id)) |
| | | // 判断当前item.users和users的区别 |
| | | defaultUsers = item.users.filter(iUser => !users.includes(iUser)) |
| | | // 改变为修改后的users |
| | | item.users = users |
| | | }) |
| | | const resParams = newParams.filter(item => item.employees.length > 0 && item.users.length > 0) |
| | | this.selectGroup = resParams |
| | | // 是否有修改的user, 有的话去修改 |
| | | defaultUsers.length > 0 && update(this.addForm) |
| | | }, |
| | | handleEmployeeChange(val, content) { |
| | | console.log(this.params); |
| | | if (val) { |
| | | content.users = [] |
| | | content.employees.forEach(item => { |
| | | content.users.push({ |
| | | id: item.id, |
| | | name: item.name |
| | | }) |
| | | }) |
| | | } else { |
| | | content.users = [] |
| | | } |
| | | }, |
| | | dialogClose() { |
| | | this.selectGroup = [] |
| | | this.$refs.addFormRef.resetFields() |
| | | }, |
| | | assessorDialog(value) { |
| | | if (value.users.length == 0) { |
| | | return this.$message.warning('请选择候选人') |
| | | } |
| | | this.assessorDialogParams = { |
| | | visible: true, |
| | | data: value |
| | | } |
| | | } |
| | | }, |
| | | }; |
| | | </script> |