电脑绩效考核用户端
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.

409 lines
17 KiB

4 years ago
<template>
<div style="background-color:rgb(242,244,246)">
<!-- <div class="p2" v-if="cardShow">定性考核审批</div> -->
<div :style="'width:' + bianKuan + '%;margin: 0 auto;padding: 5px;'">
<el-card class="box-card" style="margin-bottom: 10px;">
<p class="xiao">审批编号{{list.orderid}}</p>
<p class="da">
{{list.title}}
</p>
</el-card>
<el-card class="box-card" v-if="carddianShow" style="margin-bottom: 10px;">
<el-descriptions class="margin-top" :column="3" border>
<el-descriptions-item>
<template slot="label">
考核纬度
</template>
{{list.dimension}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
考核指标
</template>
{{list.target}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
指标子类
</template>
{{list.targetsun}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
指标详情
</template>
{{list.detailedtargent}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
指标描述
</template>
{{list.content}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
操作
</template>
{{list.reasoninfo}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
原因
</template>
{{list.reason}}
</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card class="box-card" v-if="cardShow" style="margin-bottom: 10px;">
<el-descriptions class="margin-top" :column="1">
<el-descriptions-item label="考核纬度">{{list.dimension}}</el-descriptions-item>
<el-descriptions-item label="考核指标">{{list.target}}</el-descriptions-item>
<el-descriptions-item label="考核项目">{{list.targetsun}}</el-descriptions-item>
<el-descriptions-item label="考核内容">{{list.detailedtargent}}</el-descriptions-item>
<el-descriptions-item label="考核标准">{{list.content}}</el-descriptions-item>
<el-descriptions-item label="操作">{{list.reasoninfo}}</el-descriptions-item>
<el-descriptions-item label="考核原因">{{list.reason}}</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card class="box-card" v-for="(item,index) in list.divresbil" :key="index" style="margin-bottom: 10px;">
<div slot="header" class="clearfix">
<span>责任划分</span>
</div>
<el-descriptions class="margin-top" :column="1">
<el-descriptions-item label="责任类型">{{item.type}}</el-descriptions-item>
<el-descriptions-item label="姓名">{{item.username}}</el-descriptions-item>
<el-descriptions-item label="比重">{{item.weight}}</el-descriptions-item>
</el-descriptions>
</el-card>
<el-card class="box-card" v-for="(item,index) in list.rectifmeasures" :key="index" style="margin-bottom: 10px;">
<div slot="header" class="clearfix">
<span>整改措施</span>
</div>
<el-descriptions class="margin-top" :column="1">
<el-descriptions-item label="姓名">{{item.recname}}</el-descriptions-item>
<el-descriptions-item label="内容">{{item.reccont}}</el-descriptions-item>
<el-descriptions-item label="时间">{{item.timeval}}</el-descriptions-item>
</el-descriptions>
</el-card>
<!-- <el-table
:data="list.divresbil"
border
style="width: 100%">
<el-table-column
prop="type"
label="责任类型">
</el-table-column>
<el-table-column
prop="username"
label="姓名">
</el-table-column>
<el-table-column
prop="weight"
label="比重">
</el-table-column>
</el-table> -->
<!-- <div v-for="(item,index) in list.TechnologicalProcess">
<el-descriptions class="margin-top" :column="3" border>
<el-descriptions-item>
<template slot="label">
节点
</template>
{{item.groupname}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
步骤
</template>
{{item.step}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
状态
</template>
<div v-if="item.state==1">
未操作
</div>
<div v-if="item.state==2">
已操作
</div>
</el-descriptions-item>
</el-descriptions>
<el-table
:data="item.userlist"
border
style="width: 100%">
<el-table-column
prop="name"
label="姓名">
</el-table-column>
<el-table-column
prop="istrue"
label="操作">
<template #default="scope">
<div v-if="scope.row.istrue==1"><img width="20px" src="../../assets/duihao.png"></div>
<div v-if="scope.row.istrue==0"></div>
</template>
</el-table-column>
<el-table-column
prop="timeval"
label="操作时间">
</el-table-column>
</el-table>
</div> -->
<!-- -->
<el-card class="box-card">
<el-steps direction="vertical" :active="buzhou">
<el-step v-for="(item,index) in list.flowmapall" :key="index" :title="item.nodename" icon="el-icon-circle-check" >
<template slot="description">
<div style="color: rgb(153,153,153);" v-for="(a,userlistIndex) in item.userlist" :key="userlistIndex">
<el-row>
<el-col :span="2">
<el-badge is-dot type="primary ">
<el-avatar style="margin-right: 5px;" shape="square" size="small" :src="a.icon"></el-avatar>
</el-badge>
</el-col>
<el-col :span="22">
{{a.workshopname}}-{{a.postname}}-{{a.name}}
<el-row>
<div v-for="(i,logIndex) in a.log" :key="logIndex">
<div class="left" v-if="i.state==2">已同意&nbsp·&nbsp</div>
<div class="left" v-if="i.state==1" type="info">未操作&nbsp·&nbsp</div>
<div class="left" v-if="i.state==3" type="danger">驳回&nbsp·&nbsp</div>
<div class="left">{{i.time}}</div>
</div>
</el-row>
</el-col>
</el-row>
<!-- {{userlist.log}} -->
<!-- <div class="left">
<el-avatar style="margin-right: 5px;" shape="square" size="small" :src="a.icon"></el-avatar>
</div>
<div class="left">{{a.workshopname}}-{{a.postname}}-{{a.name}} </div>
<div class="left" v-for="(i,logIndex) in a.log">
<el-tag v-if="i.state==2">通过</el-tag>
<el-tag v-if="i.state==1" type="info">未操作</el-tag>
<el-tag v-if="i.state==3" type="danger">驳回</el-tag>
<div>{{i.time}}</div>
</div> -->
<!-- <template v-if="a.log!=null">
<div v-for="(i,logIndex) in a.log">
<el-tag v-if="i.state==2">通过</el-tag>
<el-tag v-if="i.state==1" type="info">未操作</el-tag>
<el-tag v-if="i.state==3" type="danger">驳回</el-tag>
<div>{{i.time}}</div>
</div>
</template> -->
<!-- <el-tag v-if="a.log!=null||a.log.state==1" type="info">未操作</el-tag>
<el-tag v-if="a.log!=null||a.log.state==3" type="danger">驳回</el-tag> -->
<!-- <div>{{}}</div> -->
</div>
</template>
</el-step>
</el-steps>
</el-card>
<!-- <el-table
:data="list.rectifmeasures"
border
style="width: 100%">
<el-table-column
prop="recname"
label="姓名">
</el-table-column>
<el-table-column
prop="reccont"
label="操作">
</el-table-column>
<el-table-column
prop="timeval"
label="时间">
</el-table-column>
</el-table> -->
</div>
</div>
</template>
<script>
import { getToken, setToken, removeToken,setKey } from '@/utils/auth'
import { getgroupuser,adddivisionresponsibility,addcorrectivemeasures,lookdutkscoreflow } from '@/api/dutys'
export default {
data() {
return{
// 步骤显示
buzhou:0,
carddianShow:false,
cardShow:false,
// 数据列表
list:[],
// 选择员工配置项
userProps: {
value: "id",
label: "name",
children: "groupUser",
emitPath:false,
multiple: false
},
grouplistBackup:[],
form:{
outid:'',
},
tableData:[
{
type:1,//类型
userkey:'',//人员
weight:''//比重
},
],
}
},
created () {
if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) {
setToken(this.$route.query.token)
setKey(this.$route.query.key)
if (getToken()=='') {
window.location.href = 'https://www.hxgk.group/jumpapiurl/?url=http://new.hxgk.group&controll=approvalList&id='+this.$route.query.id;
}
if (typeof this.$route.query.token === 'undefined') {
window.location.href = 'https://www.hxgk.group/jumpapiurl/?url=http://new.hxgk.group&controll=approvalList&id='+this.$route.query.id;
}
}else{
if (sessionStorage.getItem('userinfo')==null) {
this.$router.push('/dingxingLogin?id='+this.$route.query.id)
}
if (sessionStorage.getItem('userinfo')==undefined) {
this.$router.push('/dingxingLogin?id='+this.$route.query.id)
}
if (sessionStorage.getItem('userinfo')=='') {
this.$router.push('/dingxingLogin?id='+this.$route.query.id)
}
if (this.$store.state.user.token=='') {
this.$router.push('/dingxingLogin?id='+this.$route.query.id)
}
if (this.$store.state.user.token==null) {
this.$router.push('/dingxingLogin?id='+this.$route.query.id)
}
if (this.$store.state.user.token===undefined) {
this.$router.push('/dingxingLogin?id='+this.$route.query.id)
}
if (typeof this.$store.state.user.token=="undefined") {
this.$router.push('/dingxingLogin?id='+this.$route.query.id)
}
}
this.form.outid=this.$route.query.id
if (document.body.clientWidth<1000) {
this.bianKuan=100
this.carddianShow=false
this.cardShow=true
}else{
this.bianKuan=40
this.carddianShow=true
this.cardShow=false
}
this.getData()
},
methods: {
// 获取数据
async getData(){
const res = await lookdutkscoreflow(this.form)
this.list=res.data
this.list.flowmapall.forEach(element => {
if (element.state==2) {
this.buzhou=this.buzhou+1
}
});
this.list.flowmapall.forEach(function(element) {
if (element.userlist!=null) {
element.userlist.forEach(function(iteam){
if (iteam.log==null) {
iteam.log=[{
state: 0,
time: ""
}]
}
})
}
});
console.log("this.list")
console.log(this.list)
},
// 提交数据
async tijiao(){
console.log(this.tableData)
const res = await addcorrectivemeasures(this.form)
if (res.code==0) {
this.$message({
type: 'success',
message: '提交成功',
showClose: true
})
}
},
// 删除行
deleteRulesList(row){
this.tableData.splice(row.$index,1);
},
// 数组加行
jiaArr(){
this.tableData.push({
type:'',//类型
userkey:'',//人员
weight:''//比重
})
},
// 获取员工列表
async getSystemadminlist(){
const res = await getgroupuser()
this.grouplistBackup=res.data.list
},
}
}
</script>
<style lang="scss" scoped>
.left{
float: left;
}
.xiao{
color: rgb(174,174,174);
}
.da{
font-size: 22px;
font-weight:bold;
}
.form{
width: 100%;
margin: 0 auto;
}
.p{
margin-bottom: 10px !important;
margin-top: 20px !important;
width: 235px;
// font-size: 30px;
// font-weight:bold;
margin: 0 auto;
}
.p2{
margin-bottom: 10px !important;
margin-top: 20px !important;
width: 270px;
font-size: 24px;
margin: 0 auto;
}
</style>