no message
This commit is contained in:
leave
parent
60878c86e1
commit
77670ad094
@ -1,9 +1,9 @@
|
|||||||
<!-- -->
|
<!-- -->
|
||||||
<template>
|
<template>
|
||||||
<div class="performance">
|
<div class="performance">
|
||||||
<SmallNav />
|
<SmallNav />
|
||||||
<div class="performance-content boderAndRadius">
|
<div class="performance-content boderAndRadius">
|
||||||
<!-- <div class="performance-content-top">
|
<!-- <div class="performance-content-top">
|
||||||
<div class="performance-content-top-left">
|
<div class="performance-content-top-left">
|
||||||
<el-select size="small" v-model="form.value" placeholder="请选择">
|
<el-select size="small" v-model="form.value" placeholder="请选择">
|
||||||
<el-option
|
<el-option
|
||||||
@ -19,82 +19,129 @@
|
|||||||
<el-button size="small" plain>管理</el-button>
|
<el-button size="small" plain>管理</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div> -->
|
</div> -->
|
||||||
<div class="performance-content-title">
|
<div class="performance-content-title">
|
||||||
<InfoHeader
|
<InfoHeader :obj="{
|
||||||
:obj="{
|
|
||||||
name:obj.currentApprovalStaffName,
|
name:obj.currentApprovalStaffName,
|
||||||
departmentName:obj.departmentName
|
departmentName:obj.departmentName
|
||||||
}"
|
}" />
|
||||||
/>
|
<div class="performance-content-title-right">
|
||||||
<div class="performance-content-title-right">
|
<el-button
|
||||||
<el-button size="mini" @click="handleZhiding" type="primary">制定目标</el-button>
|
size="mini"
|
||||||
</div>
|
@click="handleZhiding"
|
||||||
</div>
|
type="primary"
|
||||||
<div class="performance-content-center">
|
>制定目标</el-button>
|
||||||
<div class="performance-content-center-item"
|
</div>
|
||||||
:class="{
|
</div>
|
||||||
|
<div class="performance-content-center">
|
||||||
|
<div
|
||||||
|
class="performance-content-center-item"
|
||||||
|
:class="{
|
||||||
active:i.isActive,
|
active:i.isActive,
|
||||||
right:true,
|
right:true,
|
||||||
left:index !==0
|
left:index !==0
|
||||||
}"
|
}"
|
||||||
v-for="(i,index) in formList.flowRecordList"
|
v-for="(i,index) in formList.flowRecordList"
|
||||||
:key="index"
|
:key="index"
|
||||||
>
|
>
|
||||||
<el-tooltip v-if="i.flowName !== '执行中'" class="item" effect="dark" :content="(index >= (formList.flowRecordList.length-1))?i.flowName:i.flowName +' : '+i.staffName" placement="top">
|
<el-tooltip
|
||||||
<div >
|
v-if="i.flowName !== '执行中'"
|
||||||
{{index+1}}.{{i.flowName}} <span v-if="index !== (formList.flowRecordList.length-1)">:{{i.staffName}} <i v-if="i.status ===1 && !i.isActive" style="color:#3ba1ff;margin:0 0 0 4px;font-weight:800;" class="el-icon-check"></i></span>
|
class="item"
|
||||||
<i style="cursor: pointer;" @click="handleRight(i)" class="el-icon-video-pause"></i>
|
effect="dark"
|
||||||
</div>
|
:content="(index >= (formList.flowRecordList.length-1))?i.flowName:i.flowName +' : '+i.staffName"
|
||||||
</el-tooltip>
|
placement="top"
|
||||||
<el-tooltip v-if="i.flowName === '执行中'" class="item" effect="dark" placement="top">
|
>
|
||||||
<div slot="content">执行中”是员工在目标确认后，努力达成目标的一个过程，直到管理员发起评分。<br/>管理员如何发起评分：返回上级页面<考核详情>，点击"开始评分"按钮发起。</div>
|
<div>
|
||||||
<div>
|
{{index+1}}.{{i.flowName}} <span v-if="index !== (formList.flowRecordList.length-1)">:{{i.staffName}} <i
|
||||||
{{index+1}}.{{i.flowName}}<i class="el-icon-warning-outline" />:{{i.staffName}} <i v-if="i.status ===1 && !i.isActive" style="color:#3ba1ff;margin:0 0 0 4px;font-weight:800;" class="el-icon-check"></i>
|
v-if="i.status ===1 && !i.isActive"
|
||||||
<i style="cursor: pointer;" @click="handleRight(i)" class="el-icon-video-pause"></i>
|
style="color:#3ba1ff;margin:0 0 0 4px;font-weight:800;"
|
||||||
</div>
|
class="el-icon-check"
|
||||||
</el-tooltip>
|
></i></span>
|
||||||
|
<i
|
||||||
</div>
|
style="cursor: pointer;"
|
||||||
</div>
|
@click="handleRight(i)"
|
||||||
<div class="performance-content-bottom">
|
class="el-icon-video-pause"
|
||||||
<tables v-if="obj.length !==0" :obj='obj' />
|
></i>
|
||||||
</div>
|
|
||||||
<div class="performance-content-jilu">
|
|
||||||
<div class="performance-content-jilu-title commonFont">
|
|
||||||
记录
|
|
||||||
</div>
|
</div>
|
||||||
<div
|
</el-tooltip>
|
||||||
v-for="(i,index) in formList.resultCommentList"
|
<el-tooltip
|
||||||
:key="index"
|
v-if="i.flowName === '执行中'"
|
||||||
class="performance-content-jilu-item commonFont">
|
class="item"
|
||||||
<div class="performance-content-jilu-item-time">
|
effect="dark"
|
||||||
{{i.gmtCreate}}
|
placement="top"
|
||||||
</div>
|
>
|
||||||
<div class="performance-content-jilu-item-content">
|
<div slot="content">执行中”是员工在目标确认后，努力达成目标的一个过程，直到管理员发起评分。<br />管理员如何发起评分：返回上级页面<考核详情>，点击"开始评分"按钮发起。</div>
|
||||||
<div class="performance-content-jilu-item-content-img">
|
<div>
|
||||||
<img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2346299354,1694591848&fm=26&gp=0.jpg" alt="">
|
{{index+1}}.{{i.flowName}}<i class="el-icon-warning-outline" />:{{i.staffName}} <i
|
||||||
</div>
|
v-if="i.status ===1 && !i.isActive"
|
||||||
<div>
|
style="color:#3ba1ff;margin:0 0 0 4px;font-weight:800;"
|
||||||
<span>{{i.staffName}}</span><span class="mubiao">#{{i.optDesc}}#</span>
|
class="el-icon-check"
|
||||||
</div>
|
></i>
|
||||||
</div>
|
<i
|
||||||
|
style="cursor: pointer;"
|
||||||
|
@click="handleRight(i)"
|
||||||
|
class="el-icon-video-pause"
|
||||||
|
></i>
|
||||||
|
</div>
|
||||||
|
</el-tooltip>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="performance-content-bottom">
|
||||||
|
<tables
|
||||||
|
v-if="obj.length !==0"
|
||||||
|
:obj='obj'
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="performance-content-jilu">
|
||||||
|
<div class="performance-content-jilu-title commonFont">
|
||||||
|
记录
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
v-for="(i,index) in formList.resultCommentList"
|
||||||
|
:key="index"
|
||||||
|
class="performance-content-jilu-item commonFont"
|
||||||
|
>
|
||||||
|
<div class="performance-content-jilu-item-time">
|
||||||
|
{{i.gmtCreate}}
|
||||||
|
</div>
|
||||||
|
<div class="performance-content-jilu-item-content">
|
||||||
|
<div class="performance-content-jilu-item-content-img">
|
||||||
|
<img
|
||||||
|
src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2346299354,1694591848&fm=26&gp=0.jpg"
|
||||||
|
alt=""
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<span>{{i.staffName}}</span><span class="mubiao">#{{i.optDesc}}#</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<popup-right v-if="right.showRight" @cancel='handleCancel' @submit="handleSubmit" :footer='true' :title="form.item.flowName">
|
</div>
|
||||||
<div slot="content" class="chooseManage">
|
</div>
|
||||||
<div
|
<popup-right
|
||||||
class='chooseManage-item'
|
v-if="right.showRight"
|
||||||
:key="index"
|
@cancel='handleCancel'
|
||||||
v-for="(i,index) in form.item.flowDetailRespList">
|
@submit="handleSubmit"
|
||||||
{{i}}
|
:footer='true'
|
||||||
</div>
|
:title="form.item.flowName"
|
||||||
<!-- <div v-for="i in rightList" :key="i.id" class="chooseManage-item" >
|
>
|
||||||
|
<div
|
||||||
|
slot="content"
|
||||||
|
class="chooseManage"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class='chooseManage-item'
|
||||||
|
:key="index"
|
||||||
|
v-for="(i,index) in form.item.flowDetailRespList"
|
||||||
|
>
|
||||||
|
{{i}}
|
||||||
|
</div>
|
||||||
|
<!-- <div v-for="i in rightList" :key="i.id" 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>
|
<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> -->
|
||||||
</div>
|
</div>
|
||||||
</popup-right>
|
</popup-right>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
@ -143,7 +190,7 @@ export default {
|
|||||||
tables
|
tables
|
||||||
},
|
},
|
||||||
computed: {},
|
computed: {},
|
||||||
beforeMount () {},
|
beforeMount () { },
|
||||||
mounted () {
|
mounted () {
|
||||||
this.handleList()
|
this.handleList()
|
||||||
this.handleGetTbale()
|
this.handleGetTbale()
|
||||||
@ -159,7 +206,7 @@ export default {
|
|||||||
})
|
})
|
||||||
},
|
},
|
||||||
async handleGetTbale (id = 226) {
|
async handleGetTbale (id = 226) {
|
||||||
let res = await apiResultGetDetail({id})
|
let res = await apiResultGetDetail({ id })
|
||||||
this.obj = res.data
|
this.obj = res.data
|
||||||
console.log('res: ', res)
|
console.log('res: ', res)
|
||||||
},
|
},
|
||||||
@ -176,7 +223,7 @@ export default {
|
|||||||
},
|
},
|
||||||
async handleList () {
|
async handleList () {
|
||||||
// resultRecordId = == this.$route.query.id
|
// resultRecordId = == this.$route.query.id
|
||||||
let res = await apiResultRecordDetail({resultRecordId: 215})
|
let res = await apiResultRecordDetail({ resultRecordId: 215 })
|
||||||
if (res.code !== 200) return
|
if (res.code !== 200) return
|
||||||
for (let i in res.data.flowRecordList) {
|
for (let i in res.data.flowRecordList) {
|
||||||
if (res.data.flowRecordList[i].status !== 1) {
|
if (res.data.flowRecordList[i].status !== 1) {
|
||||||
@ -199,19 +246,19 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang='less' scoped>
|
<style lang='less' scoped>
|
||||||
.performance{
|
.performance {
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
.chooseManage-item{
|
.chooseManage-item {
|
||||||
padding: 24px 0;
|
padding: 24px 0;
|
||||||
border-bottom: 1px solid @borderColor;
|
border-bottom: 1px solid @borderColor;
|
||||||
}
|
}
|
||||||
&-content{
|
&-content {
|
||||||
padding: 28px;
|
padding: 28px;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
// height: 700px;
|
// height: 700px;
|
||||||
// overflow: auto;
|
// overflow: auto;
|
||||||
|
|
||||||
&-top{
|
&-top {
|
||||||
border-bottom: 1px solid @borderColor;
|
border-bottom: 1px solid @borderColor;
|
||||||
padding-bottom: 20px;
|
padding-bottom: 20px;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
@ -219,17 +266,17 @@ export default {
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
&-title{
|
&-title {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
&-center{
|
&-center {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
margin: 20px 0;
|
margin: 20px 0;
|
||||||
|
|
||||||
&-item{
|
&-item {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 10px 60px;
|
padding: 10px 60px;
|
||||||
margin: 4px 0;
|
margin: 4px 0;
|
||||||
@ -238,11 +285,11 @@ export default {
|
|||||||
background: #f5f5f5;
|
background: #f5f5f5;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
.active{
|
.active {
|
||||||
background: @fontBlue;
|
background: @fontBlue;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
.left::before{
|
.left::before {
|
||||||
content: "";
|
content: "";
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -252,7 +299,7 @@ export default {
|
|||||||
background: url(./img/left.png) no-repeat;
|
background: url(./img/left.png) no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
.right::after{
|
.right::after {
|
||||||
content: "";
|
content: "";
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -263,49 +310,49 @@ export default {
|
|||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&-jilu{
|
&-jilu {
|
||||||
&-title{
|
&-title {
|
||||||
padding: 20px 0 10px 0;
|
padding: 20px 0 10px 0;
|
||||||
}
|
}
|
||||||
&-item{
|
&-item {
|
||||||
padding: 0 0 0 10px;
|
padding: 0 0 0 10px;
|
||||||
&-time{
|
&-time {
|
||||||
margin: 4px 0;
|
margin: 4px 0;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
&-time::before{
|
&-time::before {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: -16px;
|
left: -16px;
|
||||||
top: 0;
|
top: 0;
|
||||||
content: "";
|
content: "";
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
width: 10px;
|
width: 10px;
|
||||||
height: 10px;
|
height: 10px;
|
||||||
background: @fontBlue;
|
background: @fontBlue;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
}
|
}
|
||||||
&-content{
|
&-content {
|
||||||
padding:0 0 0 10px;
|
padding: 0 0 0 10px;
|
||||||
display: flex;
|
display: flex;
|
||||||
min-height: 60px;
|
min-height: 60px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
span{
|
span {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
.mubiao{
|
.mubiao {
|
||||||
color: @fontBlue;
|
color: @fontBlue;
|
||||||
margin: 0 4px;
|
margin: 0 4px;
|
||||||
}
|
}
|
||||||
&-img{
|
&-img {
|
||||||
width: 30px;
|
width: 30px;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
img{
|
img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user