Merge branch 'v_1.0.0' of http://gitlab.ldxinyong.com/enterpriseManagement/digitization-ui into v_1.0.0
This commit is contained in:
sean yu
commit
7ce57c5efa
@ -62,3 +62,21 @@ export function apiSaveDetail (query) {
|
||||
data: query
|
||||
})
|
||||
}
|
||||
|
||||
// 审批流程-
|
||||
export function apiSaveapproval (query) {
|
||||
return request({
|
||||
url: '/lz_management/user/lzresultrecord/new/approval',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 获取3.75分等级列表 -
|
||||
export function apiGet375 (query) {
|
||||
return request({
|
||||
url: '/lz_management/resultGrade/get375',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
title="考评组筛选"
|
||||
:visible="true"
|
||||
:before-close="handleCancel"
|
||||
width="920"
|
||||
width="920px"
|
||||
>
|
||||
<div class="team-filter-content">
|
||||
<el-col
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
<el-dialog
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
append-to-body
|
||||
@close='close'
|
||||
width="800px"
|
||||
center>
|
||||
|
||||
@ -3,6 +3,7 @@
|
||||
<div>
|
||||
<el-dialog
|
||||
:title="title"
|
||||
append-to-body
|
||||
:visible.sync="show"
|
||||
@close='close'
|
||||
width="800px"
|
||||
|
||||
@ -71,6 +71,15 @@ export default [
|
||||
title: '考核管理',
|
||||
isNav: true
|
||||
}
|
||||
}, {
|
||||
path: 'initiate',
|
||||
name: 'initiate',
|
||||
component: (resolve) => require(['@/views/kpi/workbench/initiateAssessment/index.vue'], resolve),
|
||||
meta: {
|
||||
title: '发起考核',
|
||||
isNav: false,
|
||||
hide: true
|
||||
}
|
||||
}, {
|
||||
path: 'stepList',
|
||||
name: 'assessment-stepList',
|
||||
@ -99,15 +108,6 @@ export default [
|
||||
}
|
||||
}
|
||||
]
|
||||
}, {
|
||||
path: 'initiate',
|
||||
name: 'initiate',
|
||||
component: (resolve) => require(['@/views/kpi/workbench/initiateAssessment/index.vue'], resolve),
|
||||
meta: {
|
||||
title: '发起考核',
|
||||
isNav: false,
|
||||
hide: true
|
||||
}
|
||||
}, {
|
||||
path: 'okr',
|
||||
name: 'okr',
|
||||
@ -123,7 +123,25 @@ export default [
|
||||
meta: {
|
||||
title: '绩效报表',
|
||||
isNav: true
|
||||
}
|
||||
},
|
||||
redirect: 'report/reportHome',
|
||||
children: [{
|
||||
path: 'reportHome',
|
||||
name: 'reportHome',
|
||||
component: (resolve) => require(['@/views/kpi/report/home/index.vue'], resolve),
|
||||
meta: {
|
||||
title: '绩效报表',
|
||||
isNav: true
|
||||
}
|
||||
}, {
|
||||
path: 'detial',
|
||||
name: 'reportDetial',
|
||||
component: (resolve) => require(['@/views/kpi/report/detail/index.vue'], resolve),
|
||||
meta: {
|
||||
title: '绩效详情',
|
||||
isNav: true
|
||||
}
|
||||
}]
|
||||
}, {
|
||||
path: 'set',
|
||||
name: 'set',
|
||||
@ -147,14 +165,6 @@ export default [
|
||||
title: '智能测试带弹窗',
|
||||
pop: true
|
||||
}
|
||||
}, {
|
||||
path: 'report-detial',
|
||||
name: 'reportDetial',
|
||||
component: (resolve) => require(['@/views/kpi/report/detail.vue'], resolve),
|
||||
meta: {
|
||||
title: '绩效详情',
|
||||
isNav: true
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -45,20 +45,15 @@ service.interceptors.request.use(config => {
|
||||
|
||||
// 响应拦截器
|
||||
service.interceptors.response.use(res => {
|
||||
console.log('res: ', res)
|
||||
const id = setTimeout(() => {
|
||||
Loading.service(options).close()
|
||||
clearTimeout(id)
|
||||
}, 300)
|
||||
// 未设置状态码则默认成功状态
|
||||
const code = res.data.code || 200
|
||||
if (code !== 200) {
|
||||
return Promise.reject(res.data)
|
||||
} else {
|
||||
if (res.config.responseType === 'blob') {
|
||||
return res
|
||||
}
|
||||
return res.data
|
||||
if (res.config.responseType === 'blob') {
|
||||
return res
|
||||
}
|
||||
return res.data
|
||||
},
|
||||
error => {
|
||||
const id = setTimeout(() => {
|
||||
|
||||
@ -168,11 +168,14 @@ export default {
|
||||
async handleSaveDetail (params = this.obj) {
|
||||
let res = await apiSaveDetail(params)
|
||||
if (res.code !== 200) {
|
||||
this.$message.error = res.msg
|
||||
this.$message.error(res.msg)
|
||||
return
|
||||
}
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
})
|
||||
this.handleGetTbale()
|
||||
console.log('res: ', res)
|
||||
},
|
||||
// 获取维度类型
|
||||
async handleGetDimensions () {
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
</div>
|
||||
<div>
|
||||
<el-form-item >
|
||||
<el-button type="primary" size="small" @click="handlePush">发起考核</el-button>
|
||||
<el-button type="primary" size="small" @click="$router.push({name:'initiate'})">发起考核</el-button>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item >
|
||||
<el-button size="small" >导入历史绩效</el-button>
|
||||
|
||||
@ -1,13 +1,15 @@
|
||||
<!-- -->
|
||||
<template>
|
||||
<div>
|
||||
<el-button size="mini" @click="handleJieguo" type="primary">结果值录入</el-button>
|
||||
<el-button size="mini" @click="handlePingfen" type="primary">开始评分</el-button>
|
||||
<el-button size="mini" @click="handleZhiding" type="primary">制定目标</el-button>
|
||||
<el-button size="mini" @click="handleTongyi" type="primary">同 意</el-button>
|
||||
<el-button size="mini" @click="handleBohui" type="primary">驳 回</el-button>
|
||||
<el-button size="mini" v-if="!info" @click="handleJieguo" type="primary">结果值录入</el-button>
|
||||
<el-button size="mini" v-if="!info" @click="handlePingfen" type="primary">开始评分</el-button>
|
||||
<el-button size="mini" v-if="!info" @click="handleZhiding" type="primary">制定目标</el-button>
|
||||
<el-button size="mini" v-if="!info" @click="handleTongyi" type="primary">同 意</el-button>
|
||||
<el-button size="mini" v-if="!info" @click="handleBohui" type="primary">驳 回</el-button>
|
||||
<el-button size="mini" v-else @click="handleJump" type="primary" plain>跳过</el-button>
|
||||
<el-button size="mini" @click="handleZhuanjiao" type="primary">转 交</el-button>
|
||||
<getPersonnel @cb='cb' v-if="isShowPersonnel" :value.sync='staffIds' :isShow.sync='isShowPersonnel' :showDataList.sync='personnelList'/>
|
||||
<getPersonnel @cb='cb' v-if="isShowPersonnel" :isShow.sync='isShowPersonnel' :len='1'/>
|
||||
<!-- 驳回 -->
|
||||
<popup-right
|
||||
v-if="bohui"
|
||||
@cancel='handleCancel'
|
||||
@ -19,18 +21,55 @@
|
||||
slot="content"
|
||||
class="chooseManage"
|
||||
>
|
||||
999
|
||||
<el-form style="width:400px;" :model="form" :rules="rules" ref="form" label-width="80px" class="demo-ruleForm">
|
||||
<el-form-item label="驳回理由" >
|
||||
<el-input
|
||||
:rows="5"
|
||||
type="textarea"
|
||||
v-model="ruleForm.comment"
|
||||
placeholder="请输入驳回理由"
|
||||
maxlength="9999"
|
||||
show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</popup-right>
|
||||
<!-- 同意 -->
|
||||
<el-dialog title="意见说明" :visible.sync="dialogFormVisible">
|
||||
<el-form :model="form" ref="form">
|
||||
<el-form-item label="" >
|
||||
<el-input
|
||||
:rows="5"
|
||||
type="textarea"
|
||||
v-model="form.comment"
|
||||
placeholder="请输入意见说明"
|
||||
maxlength="9999"
|
||||
show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button size="small" @click="dialogFormVisible = false">取 消</el-button>
|
||||
<el-button size="small" type="primary" @click="handleAgree">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import getPersonnel from '@/components/getPersonnel'
|
||||
import PopupRight from '@/components/PopupRight'
|
||||
import { apiSaveapproval } from '@/api/assessment'
|
||||
export default {
|
||||
props: ['tableInfo', 'formList', 'info'],
|
||||
data () {
|
||||
return {
|
||||
dialogFormVisible: false,
|
||||
form: {},
|
||||
rules: {
|
||||
name: [
|
||||
{ required: true, message: '请输入驳回理由', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
bohui: false,
|
||||
isShowPersonnel: false,
|
||||
staffIds: '',
|
||||
@ -45,32 +84,59 @@ export default {
|
||||
},
|
||||
computed: {},
|
||||
beforeMount () {},
|
||||
mounted () {},
|
||||
mounted () {
|
||||
},
|
||||
methods: {
|
||||
// 结果值录入
|
||||
handleJieguo () {
|
||||
|
||||
this.$emit('update:tableInfo', Object.assign({}, this.tableInfo, {result: true}))
|
||||
},
|
||||
// 开始评分
|
||||
handlePingfen () {
|
||||
|
||||
this.$emit('update:tableInfo', Object.assign({}, this.tableInfo, {score: true}))
|
||||
},
|
||||
// 同意
|
||||
handleTongyi () {
|
||||
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
async handleAgree () {
|
||||
let res = await this.handlApiSaveapproval({status: 1, menuName: '同意了'})
|
||||
this.dialogFormVisible = !!res
|
||||
},
|
||||
// 驳回
|
||||
handleBohui () {
|
||||
this.ruleForm = {}
|
||||
this.bohui = true
|
||||
},
|
||||
handleSubmit () {
|
||||
this.bohui = false
|
||||
},
|
||||
handleCancel () {
|
||||
this.bohui = false
|
||||
},
|
||||
cb (info) {
|
||||
console.log(info)
|
||||
// 跳过
|
||||
handleJump () {
|
||||
if (!this.info) return
|
||||
console.log('item: ', this.info)
|
||||
this.$confirm('确认跳过该人员?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
const obj = {status: 4, menuName: '跳过了'}
|
||||
if (this.info) obj.flowRecordId = this.info.flowRecordId
|
||||
const params = Object.assign({}, this.form, {resultRecordId: this.$route.query.id || ''}, obj)
|
||||
let res = await apiSaveapproval(params)
|
||||
if (res.code !== 200) {
|
||||
this.$message.error(res.msg)
|
||||
return
|
||||
}
|
||||
this.form = {}
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
})
|
||||
history.go(0)
|
||||
}).catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '取消跳过'
|
||||
})
|
||||
})
|
||||
},
|
||||
// 转交
|
||||
handleZhuanjiao () {
|
||||
@ -84,6 +150,51 @@ export default {
|
||||
id: 267 || this.$route.query.id
|
||||
}
|
||||
})
|
||||
},
|
||||
async handleSubmit () {
|
||||
let res = await this.handlApiSaveapproval({status: 5, menuName: '驳回了'})
|
||||
console.log('!!res: ', !!res)
|
||||
this.bohui = !!res
|
||||
},
|
||||
handleCancel () {
|
||||
this.bohui = false
|
||||
},
|
||||
async cb (info) {
|
||||
const obj = {status: 8, menuName: '转交了', transferStaffId: info.value}
|
||||
if (this.info) obj.flowRecordId = this.info.flowRecordId
|
||||
const params = Object.assign({}, this.form, {resultRecordId: this.$route.query.id || ''}, obj)
|
||||
let res = await apiSaveapproval(params)
|
||||
if (res.code !== 200) {
|
||||
this.$message.error(res.msg)
|
||||
return
|
||||
}
|
||||
this.form = {}
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
})
|
||||
history.go(0)
|
||||
},
|
||||
// 封装请求
|
||||
handlApiSaveapproval (obj = {}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$refs.form.validate(async v => {
|
||||
if (v) {
|
||||
const params = Object.assign({}, this.form, {resultRecordId: this.$route.query.id || ''}, obj)
|
||||
let res = await apiSaveapproval(params)
|
||||
if (res.code !== 200) {
|
||||
this.$message.error(res.msg)
|
||||
resolve(1)
|
||||
}
|
||||
this.form = {}
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
})
|
||||
resolve(0)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
watch: {}
|
||||
|
||||
@ -5,13 +5,13 @@
|
||||
border="1">
|
||||
<!-- 顶部title -->
|
||||
<tr>
|
||||
<th>维度</th>
|
||||
<th style="width: 90px;">维度</th>
|
||||
<th>名称</th>
|
||||
<th>考核标准</th>
|
||||
<th>结果值</th>
|
||||
<th v-if="tableInfo.result">结果值</th>
|
||||
<th>权重({{obj.weight*100}}%)</th>
|
||||
<th>上级评分</th>
|
||||
<th>评分说明</th>
|
||||
<th v-if="tableInfo.score">上级评分</th>
|
||||
<th v-if="tableInfo.score">评分说明</th>
|
||||
</tr>
|
||||
<!-- 暂无数据时显示 -->
|
||||
<tr v-if="obj.recortModelDtos.length === 0">
|
||||
@ -22,50 +22,73 @@
|
||||
<!-- template不会被渲染 -->
|
||||
<template v-for="(item,index) in obj.recortModelDtos" >
|
||||
<!-- 左侧跨行区域 -->
|
||||
<tr :key="index+1000">
|
||||
<td :rowspan="item.detailDtos.length+1">{{item.name}}</td>
|
||||
<td v-if="item.detailDtos.length===0"></td>
|
||||
<td v-if="item.detailDtos.length===0"></td>
|
||||
<td v-if="item.detailDtos.length===0"></td>
|
||||
<td v-if="item.detailDtos.length===0"></td>
|
||||
<tr :key="index+'-only'">
|
||||
<td :rowspan="item.detailDtos.length+1">
|
||||
<!-- <div v-for="(i,index) in item.name">
|
||||
{{i}}
|
||||
</div> -->
|
||||
{{item.name}}
|
||||
</td>
|
||||
<td v-if="item.detailDtos.length===0"></td>
|
||||
<td v-if="item.detailDtos.length===0"></td>
|
||||
<td v-if="item.detailDtos.length===0 && tableInfo.score"></td>
|
||||
<td v-if="item.detailDtos.length===0 && tableInfo.score"></td>
|
||||
<td v-if="item.detailDtos.length===0 && tableInfo.result"></td>
|
||||
<td v-if="item.detailDtos.length===0"></td>
|
||||
</tr>
|
||||
<!-- 右侧数据 -->
|
||||
<tr v-for="(child,index1) in item.detailDtos" :key="index1">
|
||||
<tr v-for="(child) in item.detailDtos" :key="child.id">
|
||||
<td>
|
||||
{{child.target}}
|
||||
<span> {{child.target || ''}}</span>
|
||||
</td>
|
||||
<td>
|
||||
{{child.keyResult}}
|
||||
{{child.keyResult || ''}}
|
||||
</td>
|
||||
<td v-if="tableInfo.result">
|
||||
<!-- <span>{{child.checkResult || '--'}}</span> -->
|
||||
<el-input style="width:120px;" size="mini" placeholder="请输入内容" v-model="child.checkResult" clearable></el-input>
|
||||
</td>
|
||||
<td>
|
||||
<span>{{child.checkResult || '--'}}</span>
|
||||
<el-input type="textarea" placeholder="请输入内容" v-model="child.checkResulted" clearable></el-input>
|
||||
{{(child.checkWeight)*100}}%
|
||||
</td>
|
||||
<td>
|
||||
{{child.checkWeight*100}}%
|
||||
<td v-if="tableInfo.score">
|
||||
<!-- gradeGroupId=== 1 下拉 -->
|
||||
<el-select style="width:100px;" size="mini" v-model="child.scoreDtos[child.scoreDtos.length-1].acquireScore">
|
||||
<el-option
|
||||
v-for="item in scoreList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.score">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<!-- <span>{{child.scoreDtos[child.scoreDtos.length-1].acquireScore || 0}}</span> -->
|
||||
<!-- <el-input style="width:120px;" size="mini" placeholder="请输入内容" v-model="child.superScore" clearable></el-input> -->
|
||||
</td>
|
||||
<td>
|
||||
<span>{{child.superScore || '--'}}</span>
|
||||
<el-input type="textarea" placeholder="请输入内容" v-model="child.superScoreed" clearable></el-input>
|
||||
</td>
|
||||
<td style="padding:10px;">
|
||||
<span>{{child.scoreComment || '--'}}</span>
|
||||
<el-input type="textarea" placeholder="请输入内容" v-model="child.scoreCommented" clearable></el-input>
|
||||
<td style="padding:10px;" v-if="tableInfo.score">
|
||||
<!-- <span>{{child.scoreComment || '--'}}</span> -->
|
||||
<el-input style="width:200px;" size="mini" type="textarea" placeholder="请输入内容" v-model="child.scoreComment" clearable></el-input>
|
||||
</td>
|
||||
</tr>
|
||||
</template>
|
||||
</table>
|
||||
<div class="table-bottom">
|
||||
<div v-if="tableInfo.result || tableInfo.score" class="table-bottom">
|
||||
<div class="table-bottom-content">
|
||||
<el-button size='small' @click="handleCancelResult" plain>取消</el-button>
|
||||
<el-button size='small' @click="handleSaveDetail()" plain>暂存</el-button>
|
||||
<el-button size='small' type="primary" >提交</el-button>
|
||||
<el-button size='small' type="primary" >{{tableInfo.result?'提交结果值':'提交评分'}}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div v-else class="table-bottoms">
|
||||
<div class="table-bottoms-contenct">
|
||||
<div class="table-bottoms-contenct-left"><i class="el-icon-arrow-left"></i>朱吉达</div>
|
||||
<div class="table-bottoms-contenct-center commonFont">参与考核（7/8）</div>
|
||||
<div class="table-bottoms-contenct-right">熊成强<i class="el-icon-arrow-right"></i></div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { apiSaveDetail, apiGet375 } from '@/api/assessment'
|
||||
export default {
|
||||
name: 'columnsTbale',
|
||||
props: {
|
||||
@ -89,15 +112,33 @@ export default {
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
input: ''
|
||||
input: '',
|
||||
scoreList: []
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
console.log('list', this.obj)
|
||||
this.handleGrt375()
|
||||
},
|
||||
methods: {
|
||||
handleSaveDetail () {
|
||||
|
||||
handleCancelResult () {
|
||||
this.$emit('update:tableInfo', Object.assign({}, this.tableInfo, {result: false, score: false}))
|
||||
},
|
||||
async handleGrt375 () {
|
||||
let res = await apiGet375()
|
||||
if (res.code !== 200) return
|
||||
this.scoreList = res.data
|
||||
console.log('resssss: ', res)
|
||||
},
|
||||
async handleSaveDetail (params = this.obj) {
|
||||
let res = await apiSaveDetail(params)
|
||||
if (res.code !== 200) {
|
||||
this.$message.error(res.msg)
|
||||
}
|
||||
this.$message({
|
||||
message: res.msg,
|
||||
type: 'success'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -105,10 +146,57 @@ export default {
|
||||
<style lang='less' scoped>
|
||||
.table{
|
||||
position: relative;
|
||||
&-bottoms{
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
z-index: 1000000;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background:transparent;
|
||||
position: fixed;
|
||||
display: flex;
|
||||
// align-items: center;
|
||||
justify-content: center;
|
||||
&-contenct{
|
||||
height: 40px;
|
||||
display: flex;
|
||||
background: #fff;
|
||||
justify-content: space-between;
|
||||
border-radius: 40px;
|
||||
box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 6px 0 rgba(0, 0, 0, 0.12);
|
||||
&-left{
|
||||
line-height: 40px;
|
||||
font-size: 14px;
|
||||
padding: 0 16px;
|
||||
i{
|
||||
margin:0 6px;
|
||||
font-weight: 800;
|
||||
}
|
||||
cursor: pointer;
|
||||
color: @fontBlue;
|
||||
}
|
||||
&-center{
|
||||
.center();
|
||||
font-size: 14px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
&-right{
|
||||
line-height: 40px;
|
||||
font-size: 14px;
|
||||
padding: 0 16px;
|
||||
i{
|
||||
margin:0 6px;
|
||||
font-weight: 800;
|
||||
}
|
||||
cursor: pointer;
|
||||
color: @fontBlue;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.table-bottom {
|
||||
position: fixed;
|
||||
height: 60px;
|
||||
position: fixed;
|
||||
padding: 0 80px;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
@ -140,4 +228,7 @@ export default {
|
||||
vertical-align: top;
|
||||
line-height: 30px;
|
||||
}
|
||||
td{
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
departmentName:obj.departmentName
|
||||
}" />
|
||||
<div class="performance-content-title-right">
|
||||
<UseButton />
|
||||
<UseButton :formList='formList' :tableInfo.sync='tableInfo'/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="performance-content-center">
|
||||
@ -31,8 +31,9 @@
|
||||
placement="top"
|
||||
>
|
||||
<div>
|
||||
{{index+1}}.{{i.flowName}} <span v-if="index !== (formList.flowRecordList.length-1)">:{{i.staffName}} <i
|
||||
v-if="i.status ===1 && !i.isActive"
|
||||
{{index+1}}.{{i.flowName}} <span v-if="index !== (formList.flowRecordList.length-1)">:{{i.staffName}}
|
||||
<i
|
||||
v-if="i.isGou && !i.isActive"
|
||||
style="color:#3ba1ff;margin:0 0 0 4px;font-weight:800;"
|
||||
class="el-icon-check"
|
||||
></i></span>
|
||||
@ -63,12 +64,11 @@
|
||||
></i>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="performance-content-bottom">
|
||||
<tables
|
||||
:tableInfo='tableInfo'
|
||||
:tableInfo.sync='tableInfo'
|
||||
v-if="obj.recortModelDtos.length !==0"
|
||||
:obj='obj'
|
||||
/>
|
||||
@ -125,15 +125,11 @@
|
||||
<el-tag type="success">已确认</el-tag> -->
|
||||
</div>
|
||||
<div>
|
||||
<el-button size="mini" @click="handleJump(i)" type="primary" plain>跳过</el-button>
|
||||
<el-button size="mini" @click="handleZhuanjiao(i)" type="primary" plain>转交</el-button>
|
||||
<UseButton :info='i' :formList='formList' :tableInfo.sync='tableInfo'/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</popup-right>
|
||||
<getPersonnel title='选择转交给' :len='1' @cb='cb' v-if="choosePerson"
|
||||
:value.sync='Personnel.value'
|
||||
:isShow.sync='choosePerson' :showDataList.sync='Personnel'/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -142,17 +138,12 @@ import SmallNav from '@/components/kpi-layout/SmallNav'
|
||||
import InfoHeader from '@/components/InfoHeader'
|
||||
import PopupRight from '@/components/PopupRight'
|
||||
import UseButton from './components/UseButton'
|
||||
import getPersonnel from '@/components/getPersonnel'
|
||||
import { apiResultRecordDetail, apiResultGetDetail } from '@/api/assessment'
|
||||
import tables from './components/table'
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
Personnel: {
|
||||
list: []
|
||||
},
|
||||
choosePerson: false,
|
||||
right: {
|
||||
showRight: false
|
||||
},
|
||||
@ -175,8 +166,7 @@ export default {
|
||||
InfoHeader,
|
||||
PopupRight,
|
||||
tables,
|
||||
UseButton,
|
||||
getPersonnel
|
||||
UseButton
|
||||
},
|
||||
computed: {},
|
||||
beforeMount () { },
|
||||
@ -185,33 +175,7 @@ export default {
|
||||
this.handleGetTbale()
|
||||
},
|
||||
methods: {
|
||||
cb (info) {
|
||||
console.log('info: ', info)
|
||||
},
|
||||
// 转交
|
||||
handleZhuanjiao (item) {
|
||||
this.choosePerson = true
|
||||
},
|
||||
// 跳过
|
||||
handleJump (item) {
|
||||
console.log('item: ', item)
|
||||
this.$confirm('确认跳过该人员?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功!'
|
||||
})
|
||||
}).catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
})
|
||||
})
|
||||
},
|
||||
async handleGetTbale (id = 267) {
|
||||
async handleGetTbale (id = this.$route.query.id) {
|
||||
let res = await apiResultGetDetail({ id })
|
||||
this.obj = res.data
|
||||
console.log('res: ', res)
|
||||
@ -229,20 +193,16 @@ export default {
|
||||
},
|
||||
async handleList () {
|
||||
// resultRecordId = == this.$route.query.id
|
||||
let res = await apiResultRecordDetail({ resultRecordId: 267 })
|
||||
let res = await apiResultRecordDetail({ resultRecordId: this.$route.query.id })
|
||||
if (res.code !== 200) return
|
||||
for (let i in res.data.flowRecordList) {
|
||||
if (res.data.flowRecordList[i].status !== 1) {
|
||||
res.data.flowRecordList[i - 1].isActive = true
|
||||
res.data.flowRecordList[i === '0' ? i : (i - 1)].isGou = true
|
||||
if (res.data.flowRecordList[i].status === 0) {
|
||||
res.data.flowRecordList[i === '0' ? i : (i - 1)].isActive = true
|
||||
break
|
||||
}
|
||||
}
|
||||
this.formList = res.data
|
||||
console.log('res: ', res)
|
||||
},
|
||||
handleChangeTtitle () {
|
||||
// this.$route
|
||||
console.log('this.$route: ', this.$route.meta.title = '123')
|
||||
}
|
||||
},
|
||||
watch: {}
|
||||
@ -267,7 +227,7 @@ export default {
|
||||
}
|
||||
&-content {
|
||||
padding: 28px;
|
||||
margin: 10px 0;
|
||||
margin: 10px 0 50px;
|
||||
// height: 700px;
|
||||
// overflow: auto;
|
||||
|
||||
|
||||
@ -186,7 +186,7 @@ export default {
|
||||
// this.handleKaoping()
|
||||
this.$router.push({
|
||||
name: 'assessment-performance',
|
||||
query: {id}
|
||||
query: {id: 267}
|
||||
})
|
||||
console.log('id: ', id)
|
||||
},
|
||||
@ -283,11 +283,19 @@ export default {
|
||||
}))
|
||||
if (res.code !== 200) return
|
||||
this.titleList = res.data
|
||||
this.titleList[0].active = true
|
||||
this.params.flowProcess = this.titleList[0].flowProcess
|
||||
if (this.$route.query.step) {
|
||||
this.titleList = this.titleList.map(i => {
|
||||
if (String(i.flowProcess) === String(this.$route.query.step)) {
|
||||
i.active = true
|
||||
}
|
||||
return i
|
||||
})
|
||||
this.params.flowProcess = this.$route.query.step
|
||||
} else {
|
||||
this.titleList[0].active = true
|
||||
this.params.flowProcess = this.titleList[0].flowProcess
|
||||
}
|
||||
this.handleGetListContent()
|
||||
console.log('this.params: ', this.params)
|
||||
console.log('res: ', res)
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
467
src/views/kpi/report/home/index.vue
Normal file
467
src/views/kpi/report/home/index.vue
Normal file
@ -0,0 +1,467 @@
|
||||
<!-- -->
|
||||
<template>
|
||||
<div class="report_index">
|
||||
<el-cascader
|
||||
:props="props"
|
||||
:options="timeOptions"
|
||||
@change="handleChange"
|
||||
v-model="defaultStartId"
|
||||
style="width:250px">
|
||||
</el-cascader>
|
||||
<div class="report_content">
|
||||
<div class="header">
|
||||
<div v-for="(i,index) in statisticals" :key="i.id" @click="handleJump(i)">
|
||||
<div>
|
||||
<div>{{i.num}}</div>
|
||||
<div>{{i.desc}}</div>
|
||||
</div>
|
||||
<span v-if="index===0"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="num_title">考核人数分析</div>
|
||||
<div class="chart_content">
|
||||
<div class="num_chart">
|
||||
<div>考核人数分析</div>
|
||||
<div id="num_chart"></div>
|
||||
</div>
|
||||
<div class="num_report">
|
||||
<div>参与考核部门人数</div>
|
||||
<ul class="num_report_list">
|
||||
<li v-for="(assessItem, index) in assessNum" :key="assessItem.desc">
|
||||
<div class="rep_list">
|
||||
<div style="display:flex">
|
||||
<div :style="handleliColor(index)">{{index}}</div>
|
||||
<div style="margin-left:10px">{{assessItem.desc}} </div>
|
||||
</div>
|
||||
<div>{{ assessItem.num }}人</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="level_title">结果分析</div>
|
||||
<div class="level_content">
|
||||
<div class="level_chart">
|
||||
<div class="level_tips">等级分布</div>
|
||||
<div id="level_chart"></div>
|
||||
</div>
|
||||
<el-table :data="tableData"
|
||||
:header-cell-style="{ background:'#F5F7FA'}"
|
||||
border
|
||||
style="flex-grow:2;margin-top:20px;height:100%">
|
||||
<el-table-column prop="desc" label="绩效等级">
|
||||
</el-table-column>
|
||||
<el-table-column prop="num" label="实际分布">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
@click.native.prevent="handleDetailClick(scope.$index, scope.row)"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
查看详情
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 引入基本模板
|
||||
import { getChartData, getStartsData } from '@/api/report'
|
||||
// 引入 ECharts 主模块
|
||||
var echarts = require('echarts/lib/echarts')
|
||||
// 引入柱状图
|
||||
require('echarts/lib/chart/bar')
|
||||
// 引入提示框和标题组件
|
||||
require('echarts/lib/component/tooltip')
|
||||
require('echarts/lib/component/title')
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
// 当前选择的月份
|
||||
pickerTime: '',
|
||||
// 给选择器设置默认选项
|
||||
defaultStartId: [],
|
||||
// 当前的绩效id
|
||||
startId: '',
|
||||
//
|
||||
statisticals: [
|
||||
{num: '0', desc: '参与人数'},
|
||||
{num: '0', desc: '目标制定'},
|
||||
{num: '0', desc: '目标确认'},
|
||||
{num: '0', desc: '执行中'},
|
||||
{num: '0', desc: '结果值录入'},
|
||||
{num: '0', desc: '评分'},
|
||||
{num: '0', desc: '考核结束'}],
|
||||
// 表格内容
|
||||
tableData: [],
|
||||
// 考核人数
|
||||
assessNum: [],
|
||||
//
|
||||
value: [],
|
||||
timeOptions: [{
|
||||
value: 0,
|
||||
label: '月底',
|
||||
children: []
|
||||
}, {
|
||||
value: 1,
|
||||
label: '自定义',
|
||||
children: []
|
||||
}],
|
||||
//
|
||||
props: {
|
||||
lazy: true,
|
||||
lazyLoad: (node, resolve) => {
|
||||
// 获取节点类型
|
||||
let type = node.data.value
|
||||
// 请求获取2级列表
|
||||
this.handleStartsReq(type, function (reslut) {
|
||||
const childNode = Array.from(reslut.list).map(item => ({
|
||||
value: item.startId,
|
||||
label: item.time
|
||||
}))
|
||||
// console.log(childNode)
|
||||
resolve(childNode)
|
||||
})
|
||||
}
|
||||
},
|
||||
// 考核人数报表持有类
|
||||
option: {
|
||||
color: ['#3398DB'],
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: [],
|
||||
axisTick: {
|
||||
alignWithLabel: true
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '',
|
||||
type: 'bar',
|
||||
barWidth: '60%',
|
||||
data: []
|
||||
}
|
||||
]
|
||||
},
|
||||
// 等级分布数据报表持有类
|
||||
levelOption: {
|
||||
color: ['#3398DB'],
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: [],
|
||||
axisTick: {
|
||||
alignWithLabel: true
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '直接访问',
|
||||
type: 'bar',
|
||||
barWidth: '60%',
|
||||
data: []
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
beforeMount () { },
|
||||
mounted () {
|
||||
this.handleChartDataReq()
|
||||
},
|
||||
methods: {
|
||||
handleJump (item) {
|
||||
this.$router.push({name: 'assessment-stepList', query: {id: 10, step: item.flowProcess}})
|
||||
},
|
||||
// 背景色计算
|
||||
handleliColor (val) {
|
||||
let color
|
||||
switch (val) {
|
||||
case 0:
|
||||
color = '#ff7705'
|
||||
break
|
||||
case 1:
|
||||
color = '#ff8b22'
|
||||
break
|
||||
case 2:
|
||||
color = '#ff9e45'
|
||||
break
|
||||
default:
|
||||
color = '#bcbcbc'
|
||||
break
|
||||
}
|
||||
return {
|
||||
width: '20px',
|
||||
height: '20px',
|
||||
'text-align': 'center',
|
||||
'line-height': '20px',
|
||||
color: 'white',
|
||||
background: color
|
||||
}
|
||||
},
|
||||
// 页面跳转
|
||||
handleDetailClick (index, rows) {
|
||||
this.$router.push({
|
||||
name: ('reportDetial'),
|
||||
query: {startId: this.startId, flowProcess: rows.desc}
|
||||
})
|
||||
},
|
||||
// Y轴坐标计算，取靠近最大值的3的倍数作为上限，然后划分成4个刻度(0为初始刻度)
|
||||
handleChartYMul (val) {
|
||||
let max = val
|
||||
max = max + (3 - max % 3)
|
||||
return [0, max / 3 * 1, max / 3 * 2, max]
|
||||
},
|
||||
// 绩效分析
|
||||
handleNumChart () {
|
||||
let numChart = echarts.init(document.getElementById('num_chart'))
|
||||
numChart.setOption(this.option)
|
||||
},
|
||||
// 结果分析
|
||||
handleLevelChart () {
|
||||
let levelChart = echarts.init(document.getElementById('level_chart'))
|
||||
levelChart.setOption(this.levelOption)
|
||||
},
|
||||
//
|
||||
handleChange (val) {
|
||||
console.log(val)
|
||||
this.startId = val[1]
|
||||
this.handleChartDataReq(val[1])
|
||||
},
|
||||
// 获取报表内容
|
||||
async handleChartDataReq (startId) {
|
||||
let params = {
|
||||
startId: startId
|
||||
}
|
||||
try {
|
||||
const result = await getChartData(params)
|
||||
// 如果没传startId则对startId赋予初始值，
|
||||
if (typeof startId === 'undefined') {
|
||||
this.defaultStartId[0] = result.data[0].type
|
||||
this.defaultStartId[1] = result.data[0].defaultId
|
||||
this.startId = result.data[0].defaultId
|
||||
this.defaultStartName = result.data[0].defaultTime
|
||||
//
|
||||
this.handleStartsReq(result.data[0].type)
|
||||
}
|
||||
result.data.forEach((val, index) => {
|
||||
if (val.type === 0) {
|
||||
// 头部数据
|
||||
this.statisticals = val.statisticals
|
||||
} else if (val.type === 1) {
|
||||
// 等级分布数据
|
||||
this.tableData = val.statisticals
|
||||
this.levelOption.series[0].data = Array.from(this.tableData).map(item => (item.num))
|
||||
this.levelOption.xAxis[0].data = Array.from(this.tableData).map(item => (item.desc))
|
||||
this.handleLevelChart()
|
||||
} else if (val.type === 2) {
|
||||
// 报表数据
|
||||
this.assessNum = val.statisticals
|
||||
this.option.series[0].data = Array.from(this.assessNum).map(item => (item.num))
|
||||
this.option.xAxis[0].data = Array.from(this.assessNum).map(item => (item.desc))
|
||||
this.handleNumChart()
|
||||
}
|
||||
})
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
// 为了不分页直接传999
|
||||
async handleStartsReq (type, handleNode) {
|
||||
let params = {
|
||||
currentPage: 1,
|
||||
cycleType: type,
|
||||
pageSize: 999
|
||||
}
|
||||
try {
|
||||
let res = await getStartsData(params)
|
||||
if (typeof handleNode === 'undefined') {
|
||||
let children = Array.from(res.data.list).map(item => ({
|
||||
value: item.startId,
|
||||
label: item.time,
|
||||
leaf: true
|
||||
}))
|
||||
if (type === 0) {
|
||||
this.timeOptions[0].children = children
|
||||
} else {
|
||||
this.timeOptions[1].children = children
|
||||
}
|
||||
} else {
|
||||
handleNode(res.data)
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='' scoped>
|
||||
.report_index{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.report_content {
|
||||
background: white;
|
||||
border: #fcfcfc solid 1px;
|
||||
margin-top:20px;
|
||||
padding-top:40px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
.header {
|
||||
background: #fcfcfc;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding:0 20px;
|
||||
}
|
||||
.header > div{
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
}
|
||||
.header > div>div {
|
||||
flex-grow: 1;
|
||||
text-align: center;
|
||||
padding:20px
|
||||
}
|
||||
.header > div >div> div:nth-child(1) {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
}
|
||||
.header > div>div > div:nth-child(2) {
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
}
|
||||
.header span {
|
||||
display: inline-block;
|
||||
background: #333333;
|
||||
height: 30px;
|
||||
width: 1px;
|
||||
}
|
||||
.num_title{
|
||||
margin-top:20px;
|
||||
margin-bottom: 25px;
|
||||
color: #333333;
|
||||
}
|
||||
.chart_content{
|
||||
display: flex;
|
||||
}
|
||||
.num_tips{
|
||||
display: flex;
|
||||
}
|
||||
.num_chart{
|
||||
flex-grow: 1
|
||||
}
|
||||
.num_chart>:nth-child(1){
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.num_report {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.num_report>:nth-child(1){
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
}
|
||||
.num_report_list{
|
||||
margin-top: 20px;
|
||||
height: 360px;
|
||||
overflow:auto
|
||||
}
|
||||
.rep_list{
|
||||
width: 200px;
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.rep_list>:nth-child(2){
|
||||
text-align: start;
|
||||
}
|
||||
.level_title{
|
||||
margin-top:20px;
|
||||
margin-bottom: 25px;
|
||||
color: #333333;
|
||||
}
|
||||
.level_tips{
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
width: fit-content;
|
||||
padding-left: 20px;
|
||||
position: relative;
|
||||
}
|
||||
.num_report{
|
||||
display: flex
|
||||
}
|
||||
#num_chart {
|
||||
widows: 500px;
|
||||
height: 360px;
|
||||
}
|
||||
.level_content{
|
||||
display: flex;
|
||||
}
|
||||
.level_chart {
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
}
|
||||
#level_chart {
|
||||
width: 500px;
|
||||
height: 360px;
|
||||
}
|
||||
</style>
|
||||
@ -1,478 +1,27 @@
|
||||
<!-- -->
|
||||
<template>
|
||||
<div class="report_index">
|
||||
<el-cascader
|
||||
:props="props"
|
||||
:options="timeOptions"
|
||||
@change="handleChange"
|
||||
v-model="defaultStartId"
|
||||
style="width:250px">
|
||||
</el-cascader>
|
||||
<div class="report_content">
|
||||
<div class="header">
|
||||
<div>
|
||||
<div>{{statisticals[0].num}}</div>
|
||||
<div>{{statisticals[0].desc}}</div>
|
||||
</div>
|
||||
<span></span>
|
||||
<div>
|
||||
<div>{{statisticals[1].num}}</div>
|
||||
<div>{{statisticals[1].desc}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>{{statisticals[2].num}}</div>
|
||||
<div>{{statisticals[2].desc}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>{{statisticals[3].num}}</div>
|
||||
<div>{{statisticals[3].desc}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>{{statisticals[4].num}}</div>
|
||||
<div>{{statisticals[4].desc}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>{{statisticals[5].num}}</div>
|
||||
<div>{{statisticals[5].desc}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>{{statisticals[6].num}}</div>
|
||||
<div>{{statisticals[6].desc}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="num_title">考核人数分析</div>
|
||||
<div class="chart_content">
|
||||
<div class="num_chart">
|
||||
<div>考核人数分析</div>
|
||||
<div id="num_chart"></div>
|
||||
</div>
|
||||
<div class="num_report">
|
||||
<div>参与考核部门人数</div>
|
||||
<ul class="num_report_list">
|
||||
<li v-for="(assessItem, index) in assessNum" :key="assessItem.desc">
|
||||
<div class="rep_list">
|
||||
<div style="display:flex">
|
||||
<div :style="handleliColor(index)">{{index}}</div>
|
||||
<div style="margin-left:10px">{{assessItem.desc}} </div>
|
||||
</div>
|
||||
<div>{{ assessItem.num }}人</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="level_title">结果分析</div>
|
||||
<div class="level_content">
|
||||
<div class="level_chart">
|
||||
<div class="level_tips">等级分布</div>
|
||||
<div id="level_chart"></div>
|
||||
</div>
|
||||
<el-table :data="tableData"
|
||||
:header-cell-style="{ background:'#F5F7FA'}"
|
||||
border
|
||||
style="flex-grow:2;margin-top:20px;height:100%">
|
||||
<el-table-column prop="desc" label="绩效等级">
|
||||
</el-table-column>
|
||||
<el-table-column prop="num" label="实际分布">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
@click.native.prevent="handleDetailClick(scope.$index, scope.row)"
|
||||
type="text"
|
||||
size="small"
|
||||
>
|
||||
查看详情
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div>
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// 引入基本模板
|
||||
import { getChartData, getStartsData } from '@/api/report'
|
||||
// 引入 ECharts 主模块
|
||||
var echarts = require('echarts/lib/echarts')
|
||||
// 引入柱状图
|
||||
require('echarts/lib/chart/bar')
|
||||
// 引入提示框和标题组件
|
||||
require('echarts/lib/component/tooltip')
|
||||
require('echarts/lib/component/title')
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
// 当前选择的月份
|
||||
pickerTime: '',
|
||||
// 给选择器设置默认选项
|
||||
defaultStartId: [],
|
||||
// 当前的绩效id
|
||||
startId: '',
|
||||
//
|
||||
statisticals: [
|
||||
{num: '0', desc: '参与人数'},
|
||||
{num: '0', desc: '目标制定'},
|
||||
{num: '0', desc: '目标确认'},
|
||||
{num: '0', desc: '执行中'},
|
||||
{num: '0', desc: '结果值录入'},
|
||||
{num: '0', desc: '评分'},
|
||||
{num: '0', desc: '考核结束'}],
|
||||
// 表格内容
|
||||
tableData: [],
|
||||
// 考核人数
|
||||
assessNum: [],
|
||||
//
|
||||
value: [],
|
||||
timeOptions: [{
|
||||
value: 0,
|
||||
label: '月底',
|
||||
children: []
|
||||
}, {
|
||||
value: 1,
|
||||
label: '自定义',
|
||||
children: []
|
||||
}],
|
||||
//
|
||||
props: {
|
||||
lazy: true,
|
||||
lazyLoad: (node, resolve) => {
|
||||
// 获取节点类型
|
||||
let type = node.data.value
|
||||
// 请求获取2级列表
|
||||
this.handleStartsReq(type, function (reslut) {
|
||||
const childNode = Array.from(reslut.list).map(item => ({
|
||||
value: item.startId,
|
||||
label: item.time
|
||||
}))
|
||||
// console.log(childNode)
|
||||
resolve(childNode)
|
||||
})
|
||||
}
|
||||
},
|
||||
// 考核人数报表持有类
|
||||
option: {
|
||||
color: ['#3398DB'],
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: [],
|
||||
axisTick: {
|
||||
alignWithLabel: true
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '',
|
||||
type: 'bar',
|
||||
barWidth: '60%',
|
||||
data: []
|
||||
}
|
||||
]
|
||||
},
|
||||
// 等级分布数据报表持有类
|
||||
levelOption: {
|
||||
color: ['#3398DB'],
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: [],
|
||||
axisTick: {
|
||||
alignWithLabel: true
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '直接访问',
|
||||
type: 'bar',
|
||||
barWidth: '60%',
|
||||
data: []
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
beforeMount () { },
|
||||
mounted () {
|
||||
this.handleChartDataReq()
|
||||
},
|
||||
methods: {
|
||||
// 背景色计算
|
||||
handleliColor (val) {
|
||||
let color
|
||||
switch (val) {
|
||||
case 0:
|
||||
color = '#ff7705'
|
||||
break
|
||||
case 1:
|
||||
color = '#ff8b22'
|
||||
break
|
||||
case 2:
|
||||
color = '#ff9e45'
|
||||
break
|
||||
default:
|
||||
color = '#bcbcbc'
|
||||
break
|
||||
}
|
||||
return {
|
||||
width: '20px',
|
||||
height: '20px',
|
||||
'text-align': 'center',
|
||||
'line-height': '20px',
|
||||
color: 'white',
|
||||
background: color
|
||||
}
|
||||
},
|
||||
// 页面跳转
|
||||
handleDetailClick (index, rows) {
|
||||
this.$router.push({
|
||||
path: ('report-detial'),
|
||||
query: {startId: this.startId, flowProcess: rows.desc}
|
||||
})
|
||||
},
|
||||
// Y轴坐标计算，取靠近最大值的3的倍数作为上限，然后划分成4个刻度(0为初始刻度)
|
||||
handleChartYMul (val) {
|
||||
let max = val
|
||||
max = max + (3 - max % 3)
|
||||
return [0, max / 3 * 1, max / 3 * 2, max]
|
||||
},
|
||||
// 绩效分析
|
||||
handleNumChart () {
|
||||
let numChart = echarts.init(document.getElementById('num_chart'))
|
||||
numChart.setOption(this.option)
|
||||
},
|
||||
// 结果分析
|
||||
handleLevelChart () {
|
||||
let levelChart = echarts.init(document.getElementById('level_chart'))
|
||||
levelChart.setOption(this.levelOption)
|
||||
},
|
||||
//
|
||||
handleChange (val) {
|
||||
console.log(val)
|
||||
this.startId = val[1]
|
||||
this.handleChartDataReq(val[1])
|
||||
},
|
||||
// 获取报表内容
|
||||
async handleChartDataReq (startId) {
|
||||
let params = {
|
||||
startId: startId
|
||||
}
|
||||
try {
|
||||
const result = await getChartData(params)
|
||||
// 如果没传startId则对startId赋予初始值，
|
||||
if (typeof startId === 'undefined') {
|
||||
this.defaultStartId[0] = result.data[0].type
|
||||
this.defaultStartId[1] = result.data[0].defaultId
|
||||
this.startId = result.data[0].defaultId
|
||||
this.defaultStartName = result.data[0].defaultTime
|
||||
//
|
||||
this.handleStartsReq(result.data[0].type)
|
||||
}
|
||||
result.data.forEach((val, index) => {
|
||||
if (val.type === 0) {
|
||||
// 头部数据
|
||||
this.statisticals = val.statisticals
|
||||
} else if (val.type === 1) {
|
||||
// 等级分布数据
|
||||
this.tableData = val.statisticals
|
||||
this.levelOption.series[0].data = Array.from(this.tableData).map(item => (item.num))
|
||||
this.levelOption.xAxis[0].data = Array.from(this.tableData).map(item => (item.desc))
|
||||
this.handleLevelChart()
|
||||
} else if (val.type === 2) {
|
||||
// 报表数据
|
||||
this.assessNum = val.statisticals
|
||||
this.option.series[0].data = Array.from(this.assessNum).map(item => (item.num))
|
||||
this.option.xAxis[0].data = Array.from(this.assessNum).map(item => (item.desc))
|
||||
this.handleNumChart()
|
||||
}
|
||||
})
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
// 为了不分页直接传999
|
||||
async handleStartsReq (type, handleNode) {
|
||||
let params = {
|
||||
currentPage: 1,
|
||||
cycleType: type,
|
||||
pageSize: 999
|
||||
}
|
||||
try {
|
||||
let res = await getStartsData(params)
|
||||
if (typeof handleNode === 'undefined') {
|
||||
let children = Array.from(res.data.list).map(item => ({
|
||||
value: item.startId,
|
||||
label: item.time,
|
||||
leaf: true
|
||||
}))
|
||||
if (type === 0) {
|
||||
this.timeOptions[0].children = children
|
||||
} else {
|
||||
this.timeOptions[1].children = children
|
||||
}
|
||||
} else {
|
||||
handleNode(res.data)
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
beforeMount () {},
|
||||
mounted () {},
|
||||
methods: {},
|
||||
watch: {}
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang='' scoped>
|
||||
.report_index{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.report_content {
|
||||
background: white;
|
||||
border: #fcfcfc solid 1px;
|
||||
margin-top:20px;
|
||||
padding-top:40px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
.header {
|
||||
background: #fcfcfc;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.header > div {
|
||||
flex-grow: 1;
|
||||
text-align: center;
|
||||
padding:20px
|
||||
}
|
||||
.header > div > div:nth-child(1) {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
}
|
||||
.header > div > div:nth-child(2) {
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
}
|
||||
.header > span {
|
||||
display: inline-block;
|
||||
background: #333333;
|
||||
height: 30px;
|
||||
width: 1px;
|
||||
}
|
||||
.num_title{
|
||||
margin-top:20px;
|
||||
margin-bottom: 25px;
|
||||
color: #333333;
|
||||
}
|
||||
.chart_content{
|
||||
display: flex;
|
||||
}
|
||||
.num_tips{
|
||||
display: flex;
|
||||
}
|
||||
.num_chart{
|
||||
flex-grow: 1
|
||||
}
|
||||
.num_chart>:nth-child(1){
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
.num_report {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.num_report>:nth-child(1){
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
}
|
||||
.num_report_list{
|
||||
margin-top: 20px;
|
||||
height: 360px;
|
||||
overflow:auto
|
||||
}
|
||||
.rep_list{
|
||||
width: 200px;
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.rep_list>:nth-child(2){
|
||||
text-align: start;
|
||||
}
|
||||
.level_title{
|
||||
margin-top:20px;
|
||||
margin-bottom: 25px;
|
||||
color: #333333;
|
||||
}
|
||||
.level_tips{
|
||||
color: #3a3a3a;
|
||||
font-size: 14px;
|
||||
width: fit-content;
|
||||
padding-left: 20px;
|
||||
position: relative;
|
||||
}
|
||||
.num_report{
|
||||
display: flex
|
||||
}
|
||||
#num_chart {
|
||||
widows: 500px;
|
||||
height: 360px;
|
||||
}
|
||||
.level_content{
|
||||
display: flex;
|
||||
}
|
||||
.level_chart {
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
}
|
||||
#level_chart {
|
||||
width: 500px;
|
||||
height: 360px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@ -7,6 +7,7 @@
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
plain
|
||||
@click="handleChangeDirector"
|
||||
>更换智能绩效主管理员</el-button>
|
||||
</div>
|
||||
@ -55,40 +56,211 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<dialog-depart
|
||||
v-if="showDialogDepart"
|
||||
<dialog-personnel
|
||||
v-if="showDialogPersonnel"
|
||||
title="更换智能绩效主管理员"
|
||||
:len="1"
|
||||
:value.sync='depIds'
|
||||
:isShow.sync='showDialogDepart'
|
||||
:isShow.sync='showDialogPersonnel'
|
||||
:showDataList.sync='showData'
|
||||
/>
|
||||
@cb="handleDialogSubmitDepart"
|
||||
></dialog-personnel>
|
||||
<popup-right
|
||||
v-if="showPopupAddSub"
|
||||
@cancel="hundlePopupAddSubHide"
|
||||
@submit="handlePopupAddSubSubmit"
|
||||
title="智能绩效子管理员设置"
|
||||
class="popup"
|
||||
></popup-right>
|
||||
>
|
||||
<div
|
||||
slot="content"
|
||||
style="width: 480px;"
|
||||
>
|
||||
<el-form
|
||||
:model="popupFromSub"
|
||||
label-width="110px"
|
||||
label-suffix="："
|
||||
label-position="left"
|
||||
size="small"
|
||||
>
|
||||
<el-form-item label="子管理员">
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
plain
|
||||
@click="handlePopupChooseSub"
|
||||
>请选择</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
label="功能模块"
|
||||
label-width="90px"
|
||||
>
|
||||
<el-col :span="1">
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
content="分别控制管理员有1.发起OKR考核权限（基础设置-OKR模块需要开启，开启后OKR全公司可见）2.发起绩效考核的权限"
|
||||
placement="bottom"
|
||||
>
|
||||
<i class="el-icon-info" />
|
||||
</el-tooltip>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-checkbox-group
|
||||
v-model="popupFromSub.checkList"
|
||||
@change="handlePopupCheckModel"
|
||||
>
|
||||
<el-checkbox label="0">OKR</el-checkbox>
|
||||
<el-checkbox label="1">绩效考核</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<div v-if="popupFromSub.showChoosePerformance">
|
||||
<el-form-item
|
||||
label="管理范围"
|
||||
label-width="90px"
|
||||
>
|
||||
<el-col :span="1">
|
||||
<el-tooltip
|
||||
class="item"
|
||||
effect="dark"
|
||||
content="管理员能查看和管理那些员工的绩效考核（非OKR）"
|
||||
placement="bottom"
|
||||
>
|
||||
<i class="el-icon-info" />
|
||||
</el-tooltip>
|
||||
</el-col>
|
||||
<el-col :span="23">
|
||||
<el-col :span="10">
|
||||
<el-radio-group v-model="popupFromSub.radioScope">
|
||||
<el-radio :label="3">全公司</el-radio>
|
||||
<el-radio :label="6">所在部门及以下部门</el-radio>
|
||||
<el-radio :label="9">特定部门</el-radio>
|
||||
</el-radio-group>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-tag
|
||||
v-for="tag in tags"
|
||||
:key="tag.name"
|
||||
closable
|
||||
:type="tag.type"
|
||||
>
|
||||
{{tag.name}}
|
||||
</el-tag>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
@click="handlePopupChooseDept"
|
||||
>请选择</el-button>
|
||||
</el-col>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否可见考核结果">
|
||||
<el-switch v-model="popupFromSub.resultsVisible"></el-switch>
|
||||
</el-form-item>
|
||||
<el-form-item label="菜单权限">
|
||||
<div>
|
||||
<el-checkbox
|
||||
v-model="popupFromSub.popupMenu"
|
||||
@change="handleMenuCheckAllChange"
|
||||
>全部权限</el-checkbox>
|
||||
</div>
|
||||
<div>
|
||||
<el-checkbox
|
||||
:indeterminate="popupFromSub.isIndeterminate"
|
||||
v-model="popupFromSub.menuMngCheckAll"
|
||||
@change="handleMenuMngCheckAllChange"
|
||||
>考核管理</el-checkbox>
|
||||
<el-checkbox-group
|
||||
v-model="popupFromSub.menuManage"
|
||||
@change="handleMenuMngCheckChange"
|
||||
class="popup-menu-mange-group"
|
||||
>
|
||||
<el-checkbox label="发起考核"></el-checkbox>
|
||||
<el-checkbox label="发起考核"></el-checkbox>
|
||||
<el-checkbox label="发起考核"></el-checkbox>
|
||||
<el-checkbox label="发起考核"></el-checkbox>
|
||||
<el-checkbox label="发起考核"></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
<div>
|
||||
<el-checkbox label="指标库"></el-checkbox>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-if="popupFromSub.showGroup"
|
||||
label="考评组权限"
|
||||
>
|
||||
<div>
|
||||
<el-radio
|
||||
v-model="popupFromSub.groupRadio"
|
||||
label="0"
|
||||
>全部考评组</el-radio>
|
||||
</div>
|
||||
<div>
|
||||
<el-radio
|
||||
v-model="popupFromSub.groupRadio"
|
||||
label="1"
|
||||
>特定考评组</el-radio>
|
||||
</div>
|
||||
<div v-if="popupFromSub.groupRadio ==='1'">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
@click="handlePopupChooseGroup"
|
||||
>请选择</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
</popup-right>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import dialogDepart from '@/components/getDepart'
|
||||
import dialogPersonnel from '@/components/getPersonnel'
|
||||
import popupRight from '@/components/PopupRight'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
dialogDepart,
|
||||
dialogPersonnel,
|
||||
popupRight
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
url: '',
|
||||
showDialogDepart: false,
|
||||
showDialogPersonnel: false,
|
||||
tableDataList: [],
|
||||
showData: {},
|
||||
showData: {
|
||||
list: []
|
||||
},
|
||||
depIds: '22',
|
||||
showPopupAddSub: false // 显示添加子管理员
|
||||
showPopupAddSub: false, // 显示添加子管理员
|
||||
popupFromSub: {
|
||||
showChoosePerformance: true, // 选择绩效选择
|
||||
radioScope: 3, // 管理范围
|
||||
resultsVisible: true, // 结果是否可见
|
||||
checkList: ['1'],
|
||||
menuManage: [], // 考核管理
|
||||
menuCheckAll: false,
|
||||
menuMngCheckAll: false, // 考核管理
|
||||
isIndeterminate: true, // 考核管理 全选联动
|
||||
showGroup: true, // 考评组权限是否显示
|
||||
groupRadio: '0' // 考评组选择 0 全部考评组 1 特定考评组
|
||||
|
||||
},
|
||||
tags: [
|
||||
{ name: '标签一', type: '' },
|
||||
{ name: 'llkk卡卡街坊邻里', type: 'success' },
|
||||
{ name: '标签三', type: 'info' },
|
||||
{ name: '标签四', type: 'warning' },
|
||||
{ name: '标签五', type: 'danger' }
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@ -97,10 +269,57 @@ export default {
|
||||
},
|
||||
handleChangeDirector () {
|
||||
// 更换主管
|
||||
this.showDialogDepart = true
|
||||
this.showDialogPersonnel = true
|
||||
},
|
||||
handleDialogSubmitDepart (val) {
|
||||
if (val.list.length <= 0) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '请选择主管理员',
|
||||
type: 'error'
|
||||
}); return
|
||||
}
|
||||
console.log('handleDialogSubmitDepart== ', val)
|
||||
let msg = '是否将智能绩效主管理员变更为' + val.title
|
||||
this.$confirm(msg, '提示')
|
||||
.then(_ => {
|
||||
this.showDialogPersonnel = false
|
||||
})
|
||||
.catch(_ => { })
|
||||
},
|
||||
handleSubAdd () {
|
||||
|
||||
this.showPopupAddSub = true
|
||||
},
|
||||
hundlePopupAddSubHide () {
|
||||
this.showPopupAddSub = false
|
||||
},
|
||||
handlePopupAddSubSubmit () {
|
||||
this.showPopupAddSub = false
|
||||
},
|
||||
handlePopupChooseSub () {
|
||||
// 选择子管理员
|
||||
},
|
||||
handlePopupCheckModel (val) {
|
||||
console.log(val.indexOf('1'))
|
||||
this.popupFromSub.showChoosePerformance = val.indexOf('1') > -1
|
||||
// 功能模块
|
||||
console.log('功能模块--======', val, this.popupFromSub.checkList)
|
||||
},
|
||||
handlePopupChooseDept () {
|
||||
// 特定部门 选择
|
||||
},
|
||||
// 菜单权限
|
||||
handleMenuCheckAllChange () {
|
||||
// 菜单权限 是否权限
|
||||
},
|
||||
handleMenuMngCheckAllChange () {
|
||||
// 考核管理 全选
|
||||
},
|
||||
handleMenuMngCheckChange () {
|
||||
// 考核管理 子选项
|
||||
},
|
||||
handlePopupChooseGroup () {
|
||||
// 特定考评组 选择
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -143,5 +362,20 @@ export default {
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
.popup {
|
||||
.el-radio-group {
|
||||
line-height: inherit !important;
|
||||
padding-top: 5px;
|
||||
}
|
||||
.el-tag {
|
||||
margin-right: 10px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
.popup-menu-mange-group {
|
||||
width: 300px;
|
||||
padding: 5px 15px;
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -213,8 +213,8 @@ export default {
|
||||
this.form.depIds = c.value
|
||||
this.personnelList = a
|
||||
this.showData = c
|
||||
this.form.id = res.id
|
||||
this.form.name = res.name
|
||||
this.form.id = this.$route.query.copy ? '' : res.id
|
||||
this.form.name = this.$route.query.copy ? '' : res.name
|
||||
} catch (error) {
|
||||
this.$message.error(error.msg)
|
||||
}
|
||||
|
||||
@ -66,8 +66,6 @@ export default {
|
||||
},
|
||||
|
||||
async handSaveBasisc () {
|
||||
console.log('this.processInfo: ', this.processInfo)
|
||||
console.log('this.basisForm: ', this.basisForm)
|
||||
if (!this.basisForm.name) {
|
||||
return this.$message.error('请输入考评组名称')
|
||||
}
|
||||
@ -82,7 +80,6 @@ export default {
|
||||
this.basisForm = res
|
||||
this.templateForm.evaluationGroupId = res.id
|
||||
for (let i in this.processInfo) {
|
||||
console.log('processInfo: ', i)
|
||||
try {
|
||||
let res1 = await saveDetailProcs(Object.assign({}, this.processInfo[i].chartDetails, {evaluationGroupId: res.id}))
|
||||
console.log('res: ', res1)
|
||||
|
||||
@ -66,7 +66,25 @@
|
||||
</div>
|
||||
<popup-right v-if="showRight" @cancel='handleCancel' @submit="handleSubmit" title="选择复制考评组">
|
||||
<div slot="content" class="chooseManage">
|
||||
99
|
||||
<el-table
|
||||
:data="copyList"
|
||||
@row-click='handleRowChange'
|
||||
>
|
||||
<el-table-column align="center">
|
||||
<!-- label非常重要 -->
|
||||
<template v-slot="props">
|
||||
<div class="chooseManage-item">
|
||||
<el-radio
|
||||
:value="selectId"
|
||||
:label="props.row.id"
|
||||
>{{props.row.name}}</el-radio>
|
||||
<div class="left">
|
||||
{{props.row.counts}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</popup-right>
|
||||
</div>
|
||||
@ -78,13 +96,15 @@ import PopupRight from '@/components/PopupRight'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
selectId: '',
|
||||
showRight: false,
|
||||
params: {
|
||||
'currPage': 1,
|
||||
'pageSize': 10
|
||||
},
|
||||
form: {},
|
||||
tableData: []
|
||||
tableData: [],
|
||||
copyList: []
|
||||
}
|
||||
},
|
||||
components: {
|
||||
@ -96,8 +116,17 @@ export default {
|
||||
this.handleGetData()
|
||||
},
|
||||
methods: {
|
||||
handleRowChange (data) {
|
||||
this.selectId = data.id
|
||||
},
|
||||
handleSubmit () {
|
||||
if (!this.selectId) {
|
||||
this.$message.error('请选择考评组！')
|
||||
return
|
||||
}
|
||||
console.log('this.copyList : ', this.copyList)
|
||||
this.showRight = false
|
||||
this.$router.push({name: 'workbench-edit-group', query: {id: this.selectId, copy: 1}})
|
||||
},
|
||||
handleCancel () {
|
||||
this.showRight = false
|
||||
@ -105,9 +134,14 @@ export default {
|
||||
handlePush (id) {
|
||||
this.$router.push({name: 'workbench-edit-group', query: {id}})
|
||||
},
|
||||
handleToEidtCopy (id) {
|
||||
async handleToEidtCopy (id) {
|
||||
let res = await getWorkList({
|
||||
'currPage': 1,
|
||||
'pageSize': 99999
|
||||
})
|
||||
if (res.code !== 200) return
|
||||
this.copyList = res.data.list
|
||||
this.showRight = true
|
||||
// this.$router.push({name: 'workbench-edit-group', query: {id: id, copy: 1}})
|
||||
},
|
||||
handleChange (value) {
|
||||
this.params = {
|
||||
@ -121,9 +155,10 @@ export default {
|
||||
this.params.currPage = value
|
||||
this.handleGetData()
|
||||
},
|
||||
async handleGetData () {
|
||||
async handleGetData (parmas = Object.assign({}, this.params)) {
|
||||
try {
|
||||
let res = await getWorkList(Object.assign({}, this.params))
|
||||
let res = await getWorkList(parmas)
|
||||
if (res.code !== 200) return
|
||||
res = res.data
|
||||
console.log('res: ', res)
|
||||
this.tableData = res.list
|
||||
@ -170,9 +205,28 @@ export default {
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.assessment{
|
||||
.el-table__header{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang='less' scoped>
|
||||
.assessment{
|
||||
.chooseManage{
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
.chooseManage-item{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 30px;
|
||||
// .left{
|
||||
// flex: 1;
|
||||
// }
|
||||
}
|
||||
.footer{
|
||||
text-align: right;
|
||||
margin: 20px 0 0 0;
|
||||
|
||||
@ -2,12 +2,13 @@
|
||||
<template>
|
||||
<div class="home boderAndRadius" >
|
||||
<div class='home-left'>
|
||||
<div class="home-left-todo">
|
||||
<div class="home-left-todo " :class="{borderBottom:selectedTableList.length===0}">
|
||||
<div class="home-left-todo-top">
|
||||
<div class="commonFont">待办事项<span style="margin:0 4px" class="blueColor">0</span>条</div>
|
||||
<div class="commonFont">待办事项<span style="margin:0 4px" class="blueColor">{{pageProcessedInfo.totalCount || 0}}</span>条</div>
|
||||
<div class="blueColor noSelect commonFont" style="cursor: pointer;" @click="handleGetMoreToDo('workbench-todo')">查看更多<i class="el-icon-arrow-right"></i></div>
|
||||
</div>
|
||||
<div class="home-left-todo-center">
|
||||
<tableItem v-if="selectedTableList.length!==0" :selectedTableList='selectedTableList' />
|
||||
<!-- <div style="height:300px">
|
||||
sassa
|
||||
</div> -->
|
||||
@ -31,19 +32,42 @@
|
||||
|
||||
<script>
|
||||
import report from './report'
|
||||
import tableItem from '../todo/tableItem'
|
||||
import { apiGetWaitList } from '@/api/toDo'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
|
||||
pageProcessedInfo: {
|
||||
currPage: 1,
|
||||
pageSize: 3,
|
||||
status: 0,
|
||||
totalCount: 1,
|
||||
totalPage: 1
|
||||
},
|
||||
selectedTableList: []
|
||||
}
|
||||
},
|
||||
components: {
|
||||
report
|
||||
report,
|
||||
tableItem
|
||||
},
|
||||
computed: {},
|
||||
beforeMount () {},
|
||||
mounted () {},
|
||||
mounted () {
|
||||
this.handleGetList()
|
||||
},
|
||||
methods: {
|
||||
handleGetList () {
|
||||
apiGetWaitList(this.pageProcessedInfo).then(res => {
|
||||
console.log('res: ', res)
|
||||
if (res.code === 200) {
|
||||
this.pageProcessedInfo.currPage = res.data.currPage
|
||||
this.pageProcessedInfo.totalCount = res.data.totalCount
|
||||
this.pageProcessedInfo.totalPage = res.data.totalPage
|
||||
this.selectedTableList = res.data.list
|
||||
}
|
||||
})
|
||||
},
|
||||
handleGetMoreToDo (name) {
|
||||
const params = {
|
||||
name
|
||||
@ -69,9 +93,11 @@ export default {
|
||||
align-items: flex-start;
|
||||
&-left{
|
||||
width: 828px;
|
||||
.borderBottom{
|
||||
border-bottom: 1px solid @borderColor;
|
||||
}
|
||||
&-todo{
|
||||
width: 100%;
|
||||
border-bottom: 1px solid @borderColor;
|
||||
|
||||
padding-top: 18px;
|
||||
&-top{
|
||||
@ -80,6 +106,7 @@ export default {
|
||||
}
|
||||
&-center{
|
||||
padding: 10px 0;
|
||||
box-sizing: content-box;
|
||||
max-height: 200px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
@ -15,31 +15,7 @@
|
||||
</div>
|
||||
<div class="todo-content-right">
|
||||
<div v-if="selectedTableList.length > 0">
|
||||
<el-table
|
||||
:data="selectedTableList"
|
||||
@row-click="handleRowClick"
|
||||
:show-header="false"
|
||||
style="border-top: 1px solid #ebebeb;"
|
||||
max-height="500"
|
||||
>
|
||||
<el-table-column width="100">
|
||||
<template slot-scope="scope">
|
||||
<img
|
||||
:src="scope.row.avatar"
|
||||
class="todo-content-right-avatar"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="title"></el-table-column>
|
||||
<el-table-column
|
||||
width="200"
|
||||
align="right"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.time}}<i class="el-icon-arrow-right"></i>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<tableItem :selectedTableList='selectedTableList'/>
|
||||
<el-pagination
|
||||
:hide-on-single-page="true"
|
||||
:current-page.sync="pageSelectedInfo.currPage"
|
||||
@ -64,6 +40,7 @@
|
||||
|
||||
<script>
|
||||
import SmallNav from '@/components/kpi-layout/SmallNav'
|
||||
import tableItem from './tableItem'
|
||||
import { apiGetWaitList } from '@/api/toDo'
|
||||
export default {
|
||||
data () {
|
||||
@ -95,7 +72,8 @@ export default {
|
||||
}
|
||||
},
|
||||
components: {
|
||||
SmallNav
|
||||
SmallNav,
|
||||
tableItem
|
||||
},
|
||||
computed: {},
|
||||
beforeMount () { },
|
||||
|
||||
60
src/views/kpi/workbench/todo/tableItem.vue
Normal file
60
src/views/kpi/workbench/todo/tableItem.vue
Normal file
@ -0,0 +1,60 @@
|
||||
<!-- -->
|
||||
<template>
|
||||
<div>
|
||||
<el-table
|
||||
:data="selectedTableList"
|
||||
@row-click="handleRowClick"
|
||||
:show-header="false"
|
||||
style="border-top: 1px solid #ebebeb;"
|
||||
max-height="500"
|
||||
>
|
||||
<el-table-column width="100">
|
||||
<template slot-scope="scope">
|
||||
<img
|
||||
:src="scope.row.avatar"
|
||||
class="todo-content-right-avatar"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="title"></el-table-column>
|
||||
<el-table-column
|
||||
width="200"
|
||||
align="right"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.time}}<i class="el-icon-arrow-right"></i>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['selectedTableList'],
|
||||
data () {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
beforeMount () {},
|
||||
mounted () {},
|
||||
methods: {
|
||||
handleRowClick (row) {
|
||||
this.$router.push({ name: 'assessment-performance', query: { id: row.recordId } })
|
||||
}
|
||||
},
|
||||
watch: {}
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang='less' scoped>
|
||||
.todo-content-right-avatar{
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border-radius: 17px;
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user