绩效考核PC端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

797 lines
35 KiB

<template>
<div>
<el-row>
<!--搜索区域-->
<el-col :span="24">
<el-form ref="searchForm" :inline="true" :model="searchInfo" class="demo-form-inline">
<el-form-item label="考核指标">
<el-input v-model="searchInfo.title" placeholder="请输入指标名称"></el-input>
</el-form-item>
<el-form-item label="指标维度">
<el-select v-model="searchInfo.dimension" clearable placeholder="请选择指标维度">
<el-option
v-for="item in dutyclasslist"
:key="item.outId"
:label="item.title"
:value="item.outId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="指标性质" prop="type">
<el-select v-model="searchInfo.type" placeholder="请选择指标性质">
<el-option label="定性指标" :value=1></el-option>
<el-option label="定量指标" :value=2></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</el-col>
<el-col :span="24">
<div class="gva-btn-list">
<el-button size="mini" type="primary" icon="el-icon-plus" @click="showAdd()">新增</el-button>
</div>
</el-col>
<!--数据区域-->
<el-col :span="24">
<el-table
:data="tableData"
style="width: 95%"
max-height="100%">
<el-table-column
fixed
prop="title"
label="考核指标"
width="150">
</el-table-column>
<el-table-column
prop="dimensionname"
label="考核维度"
>
</el-table-column>
<el-table-column
label="指标性质"
>
<template #default="scope">
<div v-if="scope.row.type==1">定性指标</div>
<div v-if="scope.row.type==2">定量指标</div>
</template>
</el-table-column>
<el-table-column
prop="unites"
label="计量单位"
>
</el-table-column>
<el-table-column
prop="outId"
label="考核周期"
>
<template #default="scope">
<el-tag v-if="scope.row.cycle==1">班</el-tag>
<el-tag v-if="scope.row.cycle==2">天</el-tag>
<el-tag v-if="scope.row.cycle==3">周</el-tag>
<el-tag v-if="scope.row.cycle==4">月</el-tag>
<el-tag v-if="scope.row.cycle==5">季度</el-tag>
<el-tag v-if="scope.row.cycle==6">年</el-tag>
</template>
</el-table-column>
<el-table-column
prop="outId"
label="计分方式"
>
<template #default="scope">
<el-tag v-if="scope.row.scoringmethod==1">自动计分</el-tag>
<el-tag v-if="scope.row.scoringmethod==2">手动计分</el-tag>
</template>
</el-table-column>
<el-table-column
label="关联部门"
>
<template #default="scope">
<el-collapse>
<el-collapse-item title="详情" name="1">
<div v-for="(iteam,index) in scope.row.relevantdepartmentsmap" :key="index">
{{iteam.title}}
</div>
</el-collapse-item>
</el-collapse>
</template>
</el-table-column>
<el-table-column
label="数据提交"
>
<template #default="scope">
<div v-for="item in scope.row.reportmap" :key="item.key">{{item.title}}</div>
</template>
</el-table-column>
<el-table-column
prop="cycleattr"
label="辅助计数"
>
</el-table-column>
<el-table-column
label="状态"
>
<template #default="scope">
<el-switch
inline-prompt
v-model="scope.row.state"
active-color="#13ce66"
inactive-color="#ff4949"
:active-value=1
:inactive-value=2
@change="changeVal($event,scope.row.outid)"
/>
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="220">
<template slot-scope="scope">
<el-button
icon="el-icon-edit"
size="small"
type="text"
@click="showPost(scope.row)"
>关联岗位</el-button>
<el-button
icon="el-icon-edit"
size="small"
type="text"
@click="showEdit(scope.row)"
>编辑</el-button>
<el-button
icon="el-icon-delete"
size="small"
type="text"
@click="deleteOperate(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
</el-col>
<el-col :span="24">
<el-pagination class="page_body"
background
@current-change="handleCurrentChange"
layout="prev, pager, next"
:total="total"
>
</el-pagination>
</el-col>
</el-row>
<!--新增-->
<el-dialog :close-on-click-modal="false" :visible.sync="addDialogForm" :before-close="closeAddDialog" title="新增" width="40%">
<el-form ref="addForm" :model="addDiaFormDatal" :rules="addrules" label-width="100px" >
<el-form-item label="指标名称" prop="name">
<el-input v-model="addDiaFormDatal.name" autocomplete="off" placeholder="请输入指标名称" />
</el-form-item>
<el-form-item label="关联部门" prop="acceptdepartmentid">
<el-cascader filterable clearable v-model="addDiaFormDatal.acceptdepartmentid" :options="grouplist" :show-all-levels="false" :props="propsdepart"></el-cascader>
</el-form-item>
<el-form-item label="指标维度" prop="dimension">
<el-select v-model="addDiaFormDatal.dimension" clearable placeholder="请选择考核维度">
<el-option
v-for="item in dutyclasslist"
:key="item.outId"
:label="item.title"
:value="item.outId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="指标性质" prop="nature">
<el-select v-model="addDiaFormDatal.nature" placeholder="请选择指标性质">
<el-option label="定性指标" :value=1></el-option>
<el-option label="定量指标" :value=2></el-option>
</el-select>
</el-form-item>
<el-form-item label="计量单位" prop="unit">
<el-input v-model="addDiaFormDatal.unit" autocomplete="off" placeholder="请输入计量单位" />
</el-form-item>
<el-form-item label="数据提交" prop="userlist">
<!-- <el-cascader clearable v-model="form.report" :options="grouplistBackup" :show-all-levels="false" :props="userProps"></el-cascader> -->
<el-cascader filterable clearable v-model="addDiaFormDatal.userlist" :options="grouplistBackup" :show-all-levels="false" :props="userProps"></el-cascader>
</el-form-item>
<el-form-item label="计分方式" prop="scoringmethod">
<el-select v-model="addDiaFormDatal.scoringmethod" placeholder="请选择指标性质">
<el-option label="自动计分" :value=1></el-option>
<el-option label="手动计分" :value=2></el-option>
</el-select>
</el-form-item>
<el-form-item label="考核周期" prop="cycle">
<el-select v-model="addDiaFormDatal.cycle" placeholder="请选择考核周期">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="辅助计数" prop="cycleattr">
<el-input-number v-model="addDiaFormDatal.cycleattr" controls-position="right" :min="1" :max="12" value="1" placeholder="请输入辅助计数" ></el-input-number>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button size="small" @click="closeAddDialog">取 消</el-button>
<el-button size="small" type="primary" @click="enterAddDialog">确 定</el-button>
</div>
</template>
</el-dialog>
<!--编辑-->
<el-dialog :close-on-click-modal="false" :visible.sync="editDialogFormVisible" :before-close="editCloseDialog" title="修改" width="40%">
<el-form ref="editForm" :model="editAdd" :rules="addrules" label-width="100px" >
<el-form-item label="指标名称" prop="name">
<el-input v-model="editAdd.name" autocomplete="off" placeholder="请输入指标名称" />
</el-form-item>
<el-form-item label="关联部门" prop="acceptdepartmentid">
<el-cascader filterable clearable v-model="editAdd.acceptdepartmentid" :options="grouplist" :show-all-levels="false" :props="propsdepart"></el-cascader>
</el-form-item>
<el-form-item label="指标维度" prop="dimension">
<el-select v-model="editAdd.dimension" clearable placeholder="请选择考核维度">
<el-option
v-for="item in dutyclasslist"
:key="item.outId"
:label="item.title"
:value="item.outId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="指标性质" prop="nature">
<el-select v-model="editAdd.nature" placeholder="请选择指标性质">
<el-option label="定性指标" :value=1></el-option>
<el-option label="定量指标" :value=2></el-option>
</el-select>
</el-form-item>
<el-form-item label="计量单位" prop="unit">
<el-input v-model="editAdd.unit" autocomplete="off" placeholder="请输入计量单位" />
</el-form-item>
<el-form-item label="数据提交" prop="userlist">
<!-- <el-cascader clearable v-model="form.report" :options="grouplistBackup" :show-all-levels="false" :props="userProps"></el-cascader> -->
<el-cascader filterable clearable v-model="editAdd.userlist" :options="grouplistBackup" :show-all-levels="false" :props="userProps"></el-cascader>
</el-form-item>
<el-form-item label="计分方式" prop="scoringmethod">
<el-select v-model="editAdd.scoringmethod" placeholder="请选择指标性质">
<el-option label="自动计分" :value=1></el-option>
<el-option label="手动计分" :value=2></el-option>
</el-select>
</el-form-item>
<el-form-item label="考核周期" prop="cycle">
<el-select v-model="editAdd.cycle" placeholder="请选择考核周期">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="辅助计数" prop="cycleattr">
<el-input-number v-model="editAdd.cycleattr" controls-position="right" :min="1" :max="12" value="1" placeholder="请输入辅助计数" ></el-input-number>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button size="small" @click="editCloseDialog">取 消</el-button>
<el-button size="small" type="primary" @click="editEnterDialog">确 定</el-button>
</div>
</template>
</el-dialog>
<!--关联岗位-->
<el-dialog :close-on-click-modal="false" :visible.sync="relationPost" :before-close="relationCloseDialog" title="关联岗位" width="40%">
<el-form ref="relationPostForm" :model="relationPostData" :rules="relationRules" label-width="80px">
<el-form-item
v-for = "(relItem,relIndex) in orglist"
:key="relIndex"
label="部门">
<el-cascader @change="changeBm(relIndex,relItem.id)" filterable clearable v-model="relItem.id" :options="grouplist" :show-all-levels="false" :props="relationPostDepart" ></el-cascader>
<el-button @click.prevent="removeBumen(relIndex)">删除</el-button>
<el-table
:data="relItem.child"
style="width: 100%">
<el-table-column
prop="date"
label="关联岗位"
width="180">
<template slot-scope="scope">
<el-select
clearable
v-model="scope.row.id"
filterable
placeholder="请选择"
>
<el-option
v-for="item in postList"
:key="item.idstr"
:label="item.name"
:value="item.idstr"
>
</el-option>
</el-select>
</template>
</el-table-column>
<el-table-column
prop="name"
label="提报人"
width="180">
<template slot-scope="scope">
<el-cascader
filterable
clearable
v-model="scope.row.childCopy"
:options="grouplistBackup"
:show-all-levels="false"
:props="userProps"
></el-cascader>
</template>
</el-table-column>
<el-table-column
prop="address"
label="操作">
<template slot-scope="scope">
<el-button @click="jiaArrAddXi(relIndex)" type="primary" icon="el-icon-plus" circle size="mini"></el-button>
<el-button
icon="el-icon-delete"
size="small"
type="text"
@click="deleteAddXiList(relIndex,scope)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
</el-form-item>
<el-button @click="addBumen">新增部门</el-button>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button size="small" @click="relationCloseDialog">取 消</el-button>
<el-button size="small" type="primary" @click="associationPost"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script>
import { positionlist } from "@/api/personnel/post"; //岗位相关项
import { dutyclasslist } from '@/api/duty/dimension' //考核纬度api
import { add_department_target,get_one_terget_info,deparment_target_about_post,edit_one_target } from '@/api/duty/projectNew' //考核项目新接口
import { gettarget,addtarget,gettargetinfo,eiteassessinfo,eitetarget,deltarget } from '@/api/duty/project' //考核项目api
import {
getgroupdepartmap,
getgroupuser
} from '@/api/duty/group' //组织建构
export default {
props:['bmId'],
data(){
return {
//统计周期
options: [
{
value: 4,
label: '月'
}, {
value: 5,
label: '季度'
}, {
value: 6,
label: '年'
}],
dutyclasslist:{}, //维度
// 条件查询变量
searchInfo: {
page: 1,
pagesize: 10
},
//获取维度参数
searchList:{
page:1,
pagesize:10000,
},
tableData:[], //表格数据
total: 0,
grouplist:[], //部门列表
grouplistBackup:[], //数据提报人列表
// 新增弹窗变量
addDialogForm:false,
addDiaFormDatal:{
cycleattr:1
},
// 添加时验证规则
addrules: {
name: [{ required: true, message: '必填', trigger: 'blur' }],
type: [{ required: true, message: '必填', trigger: 'blur' }],
// share: [{ required: true, message: '必填', trigger: 'blur' }],
acceptdepartmentid: [{ required: true, message: '必填', trigger: 'blur' }],
dimension: [{ required: true, message: '必填', trigger: 'blur' }],
nature: [{ required: true, message: '必填', trigger: 'blur' }],
unit: [{ required: true, message: '必填', trigger: 'blur' }],
cycle: [{ required: true, message: '必填', trigger: 'blur' }],
cycleattr: [{ required: true, message: '必填', trigger: 'blur' }],
userlist: [{ required: true, message: '必填', trigger: 'blur' }],
scoringmethod: [{ required: true, message: '必填', trigger: 'blur' }],
},
//关联岗位
relationRules:{
title: [{ required: true, message: '必填', trigger: 'blur' }],
type: [{ required: true, message: '必填', trigger: 'blur' }],
// share: [{ required: true, message: '必填', trigger: 'blur' }],
relevantdepartments: [{ required: true, message: '必填', trigger: 'blur' }],
dimension: [{ required: true, message: '必填', trigger: 'blur' }],
report: [{ required: true, message: '必填', trigger: 'blur' }],
unites: [{ required: true, message: '必填', trigger: 'blur' }],
cycle: [{ required: true, message: '必填', trigger: 'blur' }],
cycleattr: [{ required: true, message: '必填', trigger: 'blur' }],
},
propsdepart: {
checkStrictly: true,
value: "id",
label: "name",
children: "children",
emitPath:false,
multiple: true
}, //关联部门
userProps: {
value: "key",
label: "name",
children: "govlist",
emitPath:false,
multiple: true
},//数据提报人
editDialogFormVisible:false, //修改数据
// 编辑时数据
editAdd:{
unittitle:'',
parentId:''
},
editFrom:{}, //获取指标详情参数
//关联岗位
relationPost:false,
orglist:[
{
// 岗位id
id:'',
// 多人员列表
child:[
{
// 岗位id
id:'',
// 多人员列表
child:[],
childCopy:[]
}
]
},
], //关联岗位初始值
relationPostData:{}, //关联岗位数据
relationPostDepart: {
checkStrictly: true,
value: "id",
label: "name",
children: "children",
emitPath:false,
},
postList:[],
}
},
//页面创建和执行
created() {
console.log(this.$store.state.user.token,"UserToken---------------->")
if (this.$store.state.user.token=='') {
this.$router.push('/login')
}
// 页面渲染时获取初始数据
this.getDataList()
this.getDutyclasslist()
this.getSystemadminlist()
this.getGrouplist()
},
watch:{
bmId(){
console.log("bmid变化")
console.log(this.bmId)
const list = []
list.push(this.bmId)
this.searchInfo.relevantdepartments=list
this.getDataList()
},
},
methods: {
// 获取初始数据
async getDataList() {
if(this.searchInfo.relevantdepartments!=null){
this.searchInfo.relevantdepartments=this.searchInfo.relevantdepartments.map(String)
}
const res = await gettarget(this.searchInfo)
// console.log("res------111----->",res)
if(res.data.list != null){
this.tableData = res.data.list
}else{
this.tableData = []
}
this.total = res.data.total
this.searchInfo.page = res.data.page
this.searchInfo.pagesize = res.data.pageSize
},
// 获取考核纬度列表
async getDutyclasslist(){
const res = await dutyclasslist(this.searchList)
this.dutyclasslist=res.data.list
},
// 条件搜索
onSubmit() {
this.searchInfo.page = 1
this.searchInfo.pagesize = 10
this.getDataList()
console.log("1111")
},
// 新增按钮
showAdd(){
this.addDialogForm=true;
console.log(this.dialogFormVisible)
},
// 改变page
handleCurrentChange(val) {
this.searchInfo.page=val
this.getDataList(this.searchInfo)
},
// 添加框关闭
closeAddDialog() {
console.log("closeDialog")
this.initAddForm()
this.addDiaFormDatal.cycleattr=1
this.addDialogForm = false
},
// 重置添加表单
initAddForm() {
console.log("initForm")
this.$refs.addForm.resetFields()
this.addDiaFormDatal = {}
console.log(this.form)
},
// 获取部门
async getGrouplist(){
const res = await getgroupdepartmap()
this.grouplist=res.data
},
// 获取员工列表
async getSystemadminlist(){
const from = {
id:309,
level: 4
}
const res = await getgroupuser(from)
this.grouplistBackup=res.data
this.grouplistBackup.forEach(item => {
if (item.govlist != null) {
// 即:this.digui(item);在这地方添加的
item.govlist.forEach(items => {
// 下面的就是执行递归的方法,因为我是从第二层才开始需要往下挖的,所以这里多了个forEach,如果从第一层起,从item就好了,即:this.digui(item);在上面添加
this.digui(items); // 这里是源头,把一个对象开始递归,开始循环
// 如果想看完整数据,那么是在这里打印数据哦
console.log(items, '看我查看完整的数据哦')
// 因为上一步递归时,就已经把循环children的动作做完了,这里是验收递归方法的地方。
})
} else {
item.govlist=item.child
// 如果第一层没有子项做的操作。。。。。
}
})
console.log(this.grouplistBackup,"获取员工列表-------------------------->")
},
// 添加提交按钮
async enterAddDialog(){
this.$refs.addForm.validate(async valid => {
if (valid) {
if(this.addDiaFormDatal.acceptdepartmentid!=null){
this.addDiaFormDatal.acceptdepartmentid=this.addDiaFormDatal.acceptdepartmentid.map(String)
}
this.addDiaFormDatal.cycleattr =parseInt(this.addDiaFormDatal.cycleattr)
// const res = await addtarget(this.form)
const res = await add_department_target(this.addDiaFormDatal)
if (res.code === 0) {
this.$message({
type: 'success',
message: '添加成功',
showClose: true
})
}
this.getDataList();
this.closeAddDialog();
}
})
},
// 编辑按钮
async showEdit(row){
console.log("this.editAdd=====================>",row)
this.editFrom.id=row.outid
// const res = await gettargetinfo(this.editFrom)
const res = await get_one_terget_info(this.editFrom)
this.editAdd = res.data
console.log("this.editAdd")
console.log(this.editAdd)
this.editDialogFormVisible=true;
},
// 修改框关闭
editCloseDialog() {
this.editInitForm()
this.editDialogFormVisible = false
},
// 修改重置表单
editInitForm() {
this.$refs.editForm.resetFields()
this.editAdd = {}
},
// 编辑提交按钮
async editEnterDialog(){
console.log("修改数据表单----》",this.editAdd)
this.$refs.editForm.validate(async valid => {
console.log("修改数据表单---1-》",this.editAdd)
console.log("修改数据表单---2-》",valid)
if (valid) {
console.log("修改数据表单---3-》",valid)
console.log(this.editAdd.relevantdepartments)
if (this.editAdd.share==1) {
this.editAdd.relevantdepartments=[]
this.editAdd.relevantdepartmentsmap=[]
this.$delete(this.editAdd,'relevantdepartments')
this.$delete(this.editAdd,'relevantdepartmentsmap')
}
var newDeaprtAry = new Array
this.editAdd.acceptdepartmentid.forEach(item=>{
newDeaprtAry.push(item.toString())
})
this.editAdd.acceptdepartmentid = newDeaprtAry
this.editAdd.report=this.editAdd.reportmap
this.editAdd.dimension=this.editAdd.dimensionidstr;
this.editAdd.cycleattr =parseInt(this.editAdd.cycleattr)
const res = await edit_one_target(this.editAdd)
if (res.code === 0) {
this.$message({
type: 'success',
message: '编辑成功',
showClose: true
})
}
this.getDataList();
this.editCloseDialog();
}
})
},
//关闭关联岗位弹窗
relationCloseDialog(){
this.relationPost = false
},
// 显示关联岗位弹窗
showPost(row){
this.projectId=row.outid
this.relationPost=true
},
// 点击部门触发 获取岗位
changeBm(index,id){
console.log("index:"+index+','+"id:"+id)
this.getPost(id)
},
// 获取岗位
async getPost(val) {
const from = {
organization: val.toString(),
page: 1,
pagesize: 1000000,
};
const res = await positionlist(from);
this.postList = res.data.list;
},
//获取岗位提报人
async getPostSubmitUser(departmentId){
},
// 新增关联岗位部门
addBumen(){
this.orglist.push({
// 岗位id
id:'',
// 多人员列表
child:[
{
// 岗位id
id:'',
// 多人员列表
child:[],
childCopy:[]
}
]
})
},
// 删除新增部门
removeBumen(index){
console.log("index")
console.log(index)
this.orglist.splice(index,1);
},
// 添加岗位人员数据
jiaArrAddXi(index){
console.log("indexJia"+index)
console.log(this.orglist[index])
this.orglist[index].child.push({
// 岗位id
id:'',
// 多人员列表
child:[],
childCopy:[]
})
},
// 删除岗位人员数据
deleteAddXiList(index,row){
this.orglist[index].childCopy.splice(row.$index,1);
},
// 关联岗位数据提交
async associationPost(){
this.orglist.forEach(ele=>{
ele.child.forEach(item=>{
ele.id=ele.id.toString()
item.childCopy.forEach(it=>{
item.child.push({id:it,child:[]})
})
})
})
console.log("this.orglist------------------>",this.orglist)
const from = {
id:this.projectId,
orglist:this.orglist
}
const res = await deparment_target_about_post(from);
this.relationPost=false
},
},
}
</script>
<style>
@import url("//unpkg.com/element-ui@2.15.10/lib/theme-chalk/index.css");
.page_body{
margin: 15px 0 0 0px;
}
</style>