优化
This commit is contained in:
熊成强
parent
8867e15955
commit
efd376e181
@ -1,387 +0,0 @@
|
||||
<!-- -->
|
||||
<template>
|
||||
<div class="basis">
|
||||
<div class="basis-title commonFont">
|
||||
基本信息
|
||||
</div>
|
||||
<div class="basis-form">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||||
<el-form-item label="考评组名称：" prop="name">
|
||||
<el-input
|
||||
size="small"
|
||||
v-model="form.name" placeholder="请输入名称"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="周期类型：">
|
||||
<el-radio-group v-model="form.radio">
|
||||
<el-radio
|
||||
v-for="(i,index) in zhouqi"
|
||||
:key="index"
|
||||
:label="i.id">{{i.name}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="考评组管理员：" >
|
||||
<el-tooltip class="item" effect="light" placement="right">
|
||||
<div slot="content">
|
||||
考评组管理员<br/>
|
||||
只有考评组管理员可以编辑这个考评组，<br/>
|
||||
权限为全部考评组的管理员默认可以管理<br/>
|
||||
所有考评组，考评组管理员只能从智能绩<br/>
|
||||
效的管理员中选择
|
||||
</div>
|
||||
<el-input
|
||||
@focus='showRight=true'
|
||||
style="width:300px;cursor: pointer;"
|
||||
size="mini"
|
||||
placeholder="请选择考评组管理员"
|
||||
readonly
|
||||
:value="Ground.title?(Ground.title+ ' 等'+ Ground.list.length + '人'):''">
|
||||
<i @click='showRight=true' slot="suffix" class="el-input__icon el-icon-edit"></i>
|
||||
</el-input>
|
||||
</el-tooltip>
|
||||
<div class="commonFont" style="font-size:12px">设置哪些管理员可以管理该考评组</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="被考核人员" prop="name">
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item label="考评员工：">
|
||||
<div v-if="showData.list.length>0">
|
||||
<el-input
|
||||
@focus="handleGetChoose('isShow')"
|
||||
style="width:300px;cursor: pointer;"
|
||||
size="small"
|
||||
:value ="showData.title + '等' + showData.list.length + '个部门' || '请选择部门'"
|
||||
readonly>
|
||||
<i @click="handleGetChoose('isShow')" slot="suffix" class="el-input__icon el-icon-edit"></i>
|
||||
</el-input>
|
||||
<i @click="handleClearList('showData')" style="margin-left:10px;cursor: pointer;" class="el-icon-delete"></i>
|
||||
</div>
|
||||
<div v-if="personnelList.list.length>0">
|
||||
<el-input
|
||||
@focus="handleGetChoose('isShowPersonnel')"
|
||||
style="width:300px;cursor: pointer;"
|
||||
size="small"
|
||||
:value ="personnelList.list[0].name + '等' + personnelList.list.length + '个人'"
|
||||
readonly>
|
||||
<i @click="handleGetChoose('isShowPersonnel')" slot="suffix" class="el-input__icon el-icon-edit"></i>
|
||||
</el-input>
|
||||
<i @click="handleClearList('personnelList')" style="margin-left:10px;cursor: pointer;" class="el-icon-delete"></i>
|
||||
</div>
|
||||
<el-button size='mini' @click="handleGetChoose('isShow')" icon="el-icon-plus">选部门</el-button>
|
||||
<!-- <el-button size='mini' @click="handleGetChoose" icon="el-icon-plus">选角色</el-button> -->
|
||||
<el-button size='mini' @click="handleGetChoose('isShowPersonnel')" icon="el-icon-plus">选人员</el-button>
|
||||
<div class="commonFont" style="font-size:12px">
|
||||
按部门设置，新加入部门的员工将自动加入考评组
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="showData.list.length>0" label="无需考评人员：">
|
||||
<div v-if="outIdsLsit.list.length>0">
|
||||
<el-input
|
||||
@focus="handleGetChoose('isSshowOutIds')"
|
||||
style="width:300px;cursor: pointer;"
|
||||
size="small"
|
||||
:value ="outIdsLsit.list[0].name + '等' + outIdsLsit.list.length + '个人'"
|
||||
readonly>
|
||||
<i @clcik="handleGetChoose('isSshowOutIds')" slot="suffix" class="el-input__icon el-icon-edit"></i>
|
||||
</el-input>
|
||||
<i @click="handleClearList('outIdsLsit')" style="margin-left:10px;cursor: pointer;" class="el-icon-delete"></i>
|
||||
</div>
|
||||
<!-- <el-button size='mini' @click="handleGetChoose(0)" icon="el-icon-plus">选部门</el-button> -->
|
||||
<!-- <el-button size='mini' @click="handleGetChoose" icon="el-icon-plus">选角色</el-button> -->
|
||||
<el-button size='mini' @click="handleGetChoose('isSshowOutIds')" icon="el-icon-plus">选人员</el-button>
|
||||
<div class="commonFont" style="font-size:12px">
|
||||
从已选部门中排除无需在本考评组或无需考核的人员
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<getPersonnel @cb='handleCheckOutIds' v-if="isSshowOutIds" :value.sync='form.outIds' :isShow.sync='isSshowOutIds' :showDataList.sync='outIdsLsit'/>
|
||||
<getPersonnel @cb='handleCheckStaffIds' v-if="isShowPersonnel" :value.sync='form.staffIds' :isShow.sync='isShowPersonnel' :showDataList.sync='personnelList'/>
|
||||
<get-depart @cb='handleCheckDepIds' v-if="isShow" :value.sync='form.depIds' :isShow.sync='isShow' :showDataList.sync='showData'/>
|
||||
<popup-right v-if="showRight" @cancel='handleCancel' @submit="handleSubmit" title="选择考评组管理员">
|
||||
<div slot="content" class="chooseManage">
|
||||
<div v-for="i in GroundList" :key="i.staffId" class="chooseManage-item" >
|
||||
<el-checkbox :true-label='1' :false-label='0' :disabled='i.isDisable===1' :checked='i.isDisable===1' v-model='i.isSelect'></el-checkbox><span class='commonFont' style="margin:0 0 0 10px;">{{i.staffName}} </span>
|
||||
</div>
|
||||
</div>
|
||||
</popup-right>
|
||||
<el-dialog title="将重复的人员进行归位" :visible.sync="dialogTableVisible">
|
||||
<el-transfer :props="options" :titles="transferTitle" v-model="mobileList" :data="repeatList"></el-transfer>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogTableVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="handleChangeList">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import getDepart from '@/components/getDepart'
|
||||
import getPersonnel from '@/components/getPersonnel'
|
||||
import PopupRight from '@/components/PopupRight'
|
||||
import { getGround } from '@/api/data'
|
||||
import { getByIdForBasis, apiCheckStaff } from '@/api/workbench'
|
||||
export default {
|
||||
props: {
|
||||
basisForm: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
counts: '', // 参与考核人数
|
||||
depIds: '', // 参与部门id，逗号隔开
|
||||
managerIdList: [],
|
||||
managerIds: '', // 绩效管理员ID，system_user,id，逗号隔开
|
||||
outIds: '', // 排除人员ids，逗号隔开
|
||||
staffIds: '', // 参与考核员工staff_id，逗号隔开
|
||||
name: ''
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
repeatList: [],
|
||||
mobileList: [],
|
||||
chooseList: [],
|
||||
options: {key: 'staffId', label: 'name'},
|
||||
transferTitle: ['排除人员', '参评人员'],
|
||||
dialogTableVisible: false,
|
||||
id: '',
|
||||
GroundList: [],
|
||||
GroundList1: [],
|
||||
isSshowOutIds: false,
|
||||
outIdsLsit: {
|
||||
list: []
|
||||
},
|
||||
showRight: false,
|
||||
isShow: false,
|
||||
isShowPersonnel: false,
|
||||
personnelList: {
|
||||
list: []
|
||||
},
|
||||
showData: {
|
||||
list: []
|
||||
}, // 部门信息
|
||||
form: {
|
||||
name: ''
|
||||
},
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: '请输入考评组', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
getDepart,
|
||||
getPersonnel,
|
||||
PopupRight
|
||||
},
|
||||
computed: {
|
||||
Ground () {
|
||||
const params = {
|
||||
list: [],
|
||||
title: '',
|
||||
managerIds: ''
|
||||
}
|
||||
params.list = this.GroundList1.filter(i => i.isSelect === 1)
|
||||
params.list.map((i, index) => {
|
||||
params.managerIds += i.staffId + ','
|
||||
if (index < 2) params.title += i.staffName.split(' ')[0] + ','
|
||||
})
|
||||
params.managerIds = params.managerIds.substring(0, params.managerIds.length - 1)
|
||||
params.title = params.title.substring(0, params.title.length - 1)
|
||||
// eslint-disable-next-line vue/no-side-effects-in-computed-properties
|
||||
this.form.managerIds = params.managerIds
|
||||
return params
|
||||
}
|
||||
},
|
||||
beforeMount () {},
|
||||
async mounted () {
|
||||
this.$loadingStart()
|
||||
await this.handleGetGround()
|
||||
const id = this.$route.query.id || ''
|
||||
this.id = id
|
||||
if (id) {
|
||||
await this.handleGetByIdForBasis(id)
|
||||
}
|
||||
this.$loadingEnd()
|
||||
this.form = this.basisForm
|
||||
},
|
||||
methods: {
|
||||
handleChangeList (diff) {
|
||||
console.log('repeatList: ', this.repeatList)
|
||||
console.log('mobileList: ', this.mobileList)
|
||||
},
|
||||
handleClearList (item) {
|
||||
this[item].list = []
|
||||
if (item === 'outIdsLsit') {
|
||||
this.form.outIds = ''
|
||||
}
|
||||
if (item === 'personnelList') {
|
||||
this.form.staffIds = ''
|
||||
}
|
||||
if (item === 'showData') {
|
||||
this.form.depIds = ''
|
||||
}
|
||||
},
|
||||
handleDifferec (list, choose) {
|
||||
this.repeatList = list
|
||||
this.chooseList = choose
|
||||
this.dialogTableVisible = true
|
||||
},
|
||||
handleCheckOutIds (item) {
|
||||
this.transferTitle = ['排除人员', '参评人员']
|
||||
this.handleDifferec(this._.intersectionBy(this.personnelList.list, item.list, 'staffId'), ['outIdsLsit', 'personnelList'])
|
||||
this.dialogTableVisible = true
|
||||
console.log(this._.intersectionBy(this.personnelList.list, item.list, 'staffId'))
|
||||
// this.form.outIds = item.value
|
||||
// this.outIdsLsit = item
|
||||
// this.isSshowOutIds = false
|
||||
},
|
||||
async handleCheckStaffIds (item) {
|
||||
const params = Object.assign({}, this.form, {staffIds: item.value})
|
||||
const bool = await this.handleCheckStaff(params)
|
||||
if (bool) {
|
||||
this.form.staffIds = item.value
|
||||
this.personnelList = item
|
||||
this.isShowPersonnel = false
|
||||
}
|
||||
},
|
||||
async handleCheckDepIds (item) {
|
||||
const params = Object.assign({}, this.form, {depIds: item.value})
|
||||
const bool = await this.handleCheckStaff(params)
|
||||
if (bool) {
|
||||
this.form.depIds = item.value
|
||||
this.showData = item
|
||||
this.isShow = false
|
||||
}
|
||||
},
|
||||
async handleCheckStaff (parmas = this.form) {
|
||||
return new Promise(async (resolve, reject) => {
|
||||
let res = await apiCheckStaff(Object.assign({}, parmas, {confirm: 0, id: this.$route.query.id || ''}))
|
||||
if (res.code === 504) {
|
||||
this.$confirm(res.msg, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
resolve(true)
|
||||
}).catch(() => {
|
||||
resolve(false)
|
||||
})
|
||||
} else if (res.code === 200) {
|
||||
resolve(true)
|
||||
} else {
|
||||
resolve(false)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取基础设置
|
||||
async handleGetByIdForBasis (id) {
|
||||
try {
|
||||
let res = await getByIdForBasis({id})
|
||||
res = res.data
|
||||
this.GroundList1 = res.managers ? res.managers.map(i => {
|
||||
i.staffId = i.id
|
||||
i.staffName = i.name
|
||||
i.isSelect = 1
|
||||
this.GroundList = this.GroundList.map(j => {
|
||||
if (i.staffId === j.staffId) {
|
||||
i = Object.assign({}, j, i)
|
||||
j.isSelect = 1
|
||||
}
|
||||
return j
|
||||
})
|
||||
return i
|
||||
}) : []
|
||||
|
||||
const obj = {
|
||||
id: this.$route.query.copy ? '' : res.id,
|
||||
name: this.$route.query.copy ? '' : res.name
|
||||
}
|
||||
if (res.deps && res.deps.length !== 0 && !this.$route.query.copy) {
|
||||
const b = this.$personlGetForm(res.outs)
|
||||
this.outIdsLsit = b
|
||||
obj.outIds = b.value
|
||||
}
|
||||
if (!this.$route.query.copy) {
|
||||
const a = this.$personlGetForm(res.staffs)
|
||||
const c = this.$departGetForm(res.deps)
|
||||
obj.staffIds = a.value
|
||||
obj.depIds = c.value
|
||||
this.personnelList = a
|
||||
this.showData = c
|
||||
}
|
||||
|
||||
this.form = obj
|
||||
} catch (error) {
|
||||
this.$message.error(error.msg)
|
||||
}
|
||||
},
|
||||
async handleGetGround () {
|
||||
try {
|
||||
let res = await getGround({groupId: 1})
|
||||
res = res.data
|
||||
res = res.map(i => {
|
||||
i.isDisable = i.isSelect
|
||||
return i
|
||||
})
|
||||
this.GroundList = JSON.parse(JSON.stringify(res))
|
||||
this.GroundList1 = JSON.parse(JSON.stringify(res))
|
||||
} catch (error) {
|
||||
this.$message.error(error.msg)
|
||||
}
|
||||
},
|
||||
handleCancel () {
|
||||
this.GroundList = JSON.parse(JSON.stringify(this.GroundList1))
|
||||
this.showRight = false
|
||||
},
|
||||
handleSubmit () {
|
||||
this.GroundList1 = JSON.parse(JSON.stringify(this.GroundList))
|
||||
this.showRight = false
|
||||
},
|
||||
handleGetChoose (item) {
|
||||
this[item] = true
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
form: {
|
||||
deep: true,
|
||||
handler (n, o) {
|
||||
this.$emit('update:basisForm', n)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
.basis{
|
||||
.el-transfer{
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
<style lang='less' scoped>
|
||||
.basis{
|
||||
&-title{
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
&-form{
|
||||
margin: 0 auto;
|
||||
width: 50%;
|
||||
}
|
||||
.chooseManage-item{
|
||||
min-width: 300px;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid @borderColor;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user