Merge branch 'v_1.0.0' of http://gitlab.ldxinyong.com/enterpriseManagement/digitization-ui into v_1.0.0
* 'v_1.0.0' of http://gitlab.ldxinyong.com/enterpriseManagement/digitization-ui: 优化 bug修改 优化 优化 update 弹窗透明度
This commit is contained in:
commit
60878c86e1
@ -35,3 +35,21 @@ export function apiManagerDetail (query) {
|
|||||||
data: query
|
data: query
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取考核详情
|
||||||
|
export function apiResultRecordDetail (query) {
|
||||||
|
return request({
|
||||||
|
url: '/lz_management/user/lzresultrecord/new/resultRecordDetail',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取考核详情表格数据
|
||||||
|
export function apiResultGetDetail (query) {
|
||||||
|
return request({
|
||||||
|
url: '/lz_management/user/lzresultrecord/getDetail',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|||||||
@ -17,3 +17,20 @@ export function getStartsData (query) {
|
|||||||
data: query
|
data: query
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
// 获取绩效排名详情
|
||||||
|
export function getChartDetail (query) {
|
||||||
|
return requestFuc({
|
||||||
|
url: '/lz_management/performance/chart/detail',
|
||||||
|
method: 'POST',
|
||||||
|
data: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取部门信息
|
||||||
|
export function getDepList (query) {
|
||||||
|
return requestFuc({
|
||||||
|
url: '/lz_management/staff/structure/deplist',
|
||||||
|
method: 'GET',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|||||||
56
src/components/InfoHeader/index.vue
Normal file
56
src/components/InfoHeader/index.vue
Normal file
@ -0,0 +1,56 @@
|
|||||||
|
<!-- -->
|
||||||
|
<template>
|
||||||
|
<div class="header-title">
|
||||||
|
<div class="header-title-img">
|
||||||
|
<img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2346299354,1694591848&fm=26&gp=0.jpg" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="header-title-right commonFont">
|
||||||
|
<span style="font-size:14px;">{{obj.name || "熊成强"}}</span>
|
||||||
|
<span style="font-size:12px;">{{obj.departmentName || "技术部门"}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: ['obj'],
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
beforeMount () {},
|
||||||
|
mounted () {},
|
||||||
|
methods: {},
|
||||||
|
watch: {}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang='less' scoped>
|
||||||
|
.header{
|
||||||
|
width: 100%;
|
||||||
|
&-title{
|
||||||
|
margin: 0 0 10PX 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
&-img{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
img{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&-right{
|
||||||
|
margin-left: 20px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,18 +1,18 @@
|
|||||||
<template>
|
<template>
|
||||||
<transition name="popupfade">
|
<!-- <transition name="popupfade"> -->
|
||||||
<div class="taskDetailRight" @click="getRight">
|
<div class="taskDetailRight" @click="getRight">
|
||||||
<div class="taskDetailRight-contant" @click.stop="aa">
|
<div class="taskDetailRight-contant" @click.stop="aa">
|
||||||
<div class="taskDetailRight-contant-title commonFont" >{{title}}</div>
|
<div class="taskDetailRight-contant-title commonFont" >{{title}}</div>
|
||||||
<div class="taskDetailRight-contant-content" >
|
<div class="taskDetailRight-contant-content" >
|
||||||
<slot name="content"></slot>
|
<slot name="content"></slot>
|
||||||
</div>
|
</div>
|
||||||
<div class="taskDetailRight-contant-footer" >
|
<div v-if="footer" class="taskDetailRight-contant-footer" >
|
||||||
<div>
|
<div>
|
||||||
<slot name="footer-left"></slot>
|
<slot name="footer-left"></slot>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<el-button size="small" @click="$emit('cancel')">取 消</el-button>
|
<el-button size="small" @click="$emit('cancel')">取 消</el-button>
|
||||||
<el-button size="small" type="primary" @click="$emit('submit')">确 定</el-button>
|
<el-button size="small" type="primary" @click="$emit('submit')">确 定</el-button>
|
||||||
<slot name="footer"></slot>
|
<slot name="footer"></slot>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -20,7 +20,7 @@
|
|||||||
<div>
|
<div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</transition>
|
<!-- </transition> -->
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
@ -30,10 +30,15 @@ export default {
|
|||||||
title: {
|
title: {
|
||||||
type: String,
|
type: String,
|
||||||
default: ''
|
default: ''
|
||||||
|
},
|
||||||
|
footer: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
isShow: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {},
|
computed: {},
|
||||||
@ -45,9 +50,11 @@ export default {
|
|||||||
aa () {},
|
aa () {},
|
||||||
onSubmit () {
|
onSubmit () {
|
||||||
console.log('submit!')
|
console.log('submit!')
|
||||||
|
this.isShow = false
|
||||||
this.$emit('update:show', false)
|
this.$emit('update:show', false)
|
||||||
},
|
},
|
||||||
getRight () {
|
getRight () {
|
||||||
|
this.isShow = false
|
||||||
this.$emit('update:show', false)
|
this.$emit('update:show', false)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -80,6 +87,7 @@ export default {
|
|||||||
height: 100vh;
|
height: 100vh;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-width: 200px;
|
min-width: 200px;
|
||||||
|
background: rgba(0,0,0,.12);
|
||||||
top: 0;
|
top: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
transition: all 1s;
|
transition: all 1s;
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
<!-- -->
|
<!-- -->
|
||||||
<template>
|
<template>
|
||||||
<div class="main noSelect">
|
<div class="main">
|
||||||
<nav-bar />
|
<nav-bar />
|
||||||
<app-main />
|
<app-main />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -147,6 +147,13 @@ export default [
|
|||||||
title: '智能测试带弹窗',
|
title: '智能测试带弹窗',
|
||||||
pop: true
|
pop: true
|
||||||
}
|
}
|
||||||
|
}, {
|
||||||
|
path: 'report-detial',
|
||||||
|
name: 'reportDetial',
|
||||||
|
component: (resolve) => require(['@/views/kpi/report/detail.vue'], resolve),
|
||||||
|
meta: {
|
||||||
|
title: '绩效详情'
|
||||||
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
@ -25,9 +25,9 @@ const service = axios.create({
|
|||||||
const options = {
|
const options = {
|
||||||
fullscreen: true,
|
fullscreen: true,
|
||||||
target: document.querySelector('.appamin'),
|
target: document.querySelector('.appamin'),
|
||||||
background: 'rgba(255, 255, 255, 0.1)',
|
background: 'rgba(255, 255, 255, 0.8)',
|
||||||
spinner: 'el-icon-loading',
|
spinner: 'el-icon-loading',
|
||||||
text: '请求加载中。。。'}
|
text: '数据加载中'}
|
||||||
|
|
||||||
// request拦截器
|
// request拦截器
|
||||||
service.interceptors.request.use(config => {
|
service.interceptors.request.use(config => {
|
||||||
|
|||||||
@ -3,44 +3,229 @@
|
|||||||
<div class="goals">
|
<div class="goals">
|
||||||
<SmallNav />
|
<SmallNav />
|
||||||
<div class="goals-content boderAndRadius">
|
<div class="goals-content boderAndRadius">
|
||||||
<div class="goals-content-title">
|
<div class="goals-content-name">
|
||||||
<div class="goals-content-title-img">
|
<InfoHeader :obj="{
|
||||||
<img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2346299354,1694591848&fm=26&gp=0.jpg" alt="">
|
name:obj.currentApprovalStaffName,
|
||||||
</div>
|
departmentName:obj.departmentName
|
||||||
<div class="goals-content-title-right commonFont">
|
}"/>
|
||||||
<span style="font-size:14px;">熊成强</span>
|
<div>
|
||||||
<span style="font-size:12px;">技术部门</span>
|
<el-button size='small' plain>暂存</el-button>
|
||||||
</div>
|
<el-button size='small' type="primary">提交</el-button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="goals-content-tabbar">
|
<div class="goals-content-tabbar">
|
||||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
<el-tabs
|
||||||
<el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane>
|
:value="activeId"
|
||||||
<el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
|
>
|
||||||
<el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
|
<el-tab-pane
|
||||||
<el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane>
|
v-for="(i,index) in obj.recortModelDtos"
|
||||||
|
:key="i.id"
|
||||||
|
:label="i.name"
|
||||||
|
:name="String(i.id)">
|
||||||
|
<div class="goals-content-tabbar-table">
|
||||||
|
<div class="goals-content-tabbar-table-header commonFont">
|
||||||
|
<span style="width:30%">指标名称</span>
|
||||||
|
<span style="width:30%">考核标准</span>
|
||||||
|
<span style="width:30%">权重</span>
|
||||||
|
<span style="width:10%">操作</span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
style="justify-content:center;"
|
||||||
|
v-if="handleFilter(i.detailDtos).length===0"
|
||||||
|
class="goals-content-tabbar-table-content commonFont items">
|
||||||
|
暂无指标
|
||||||
|
</div>
|
||||||
|
<draggable
|
||||||
|
v-model="i.tagetLibItems"
|
||||||
|
:options='options1'
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="goals-content-tabbar-table-content commonFont items"
|
||||||
|
v-for="(j,indexJ) in handleFilter(i.detailDtos)"
|
||||||
|
:key="indexJ"
|
||||||
|
>
|
||||||
|
<div style="width:30%"><i style="margin-right:6px;" class="my-handle el-icon-s-operation"></i>{{j.target}}</div>
|
||||||
|
<div style="width:30%">{{j.keyResult}}</div>
|
||||||
|
<div style="width:30%">{{ Math.round((j.checkWeight * 100)*1000)/1000}}%</div>
|
||||||
|
<div style="width:10%">
|
||||||
|
<el-button
|
||||||
|
@click="hanidleEdit(j,indexJ,index)"
|
||||||
|
type="text"
|
||||||
|
size="small">
|
||||||
|
编辑
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
@click="handleDelateWeidu(j,indexJ,index)"
|
||||||
|
type="text"
|
||||||
|
size="small">
|
||||||
|
删除
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</draggable>
|
||||||
|
<div style=" padding: 10px;">
|
||||||
|
<!-- <el-button size="mini" plain>选择指标项</el-button> -->
|
||||||
|
<el-button @click="hanidleEdit(i,-1,index)" size="mini" plain>增加指标项</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<popup-right v-if="showIndicators" @cancel='handleCancelZhibiao' @submit="handleSubmitZhibiao" :title="zhibiaoTitle">
|
||||||
|
<div slot="content" class="weiduManage">
|
||||||
|
<el-form label-position="left" ref="formIndicators" :model="formIndicators" :rules="ruleIndicators" label-width="180px">
|
||||||
|
<el-form-item label="指标类型">
|
||||||
|
<el-select v-model="formIndicators.type" disabled placeholder="请选择维度类型">
|
||||||
|
<el-option
|
||||||
|
v-for="i in dimensionsList"
|
||||||
|
:key="i.id"
|
||||||
|
:label="i.name"
|
||||||
|
:value="i.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item prop="target" label='指标名称'>
|
||||||
|
<el-input clearable size="small" v-model="formIndicators.target"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="考核标准" prop="keyResult">
|
||||||
|
<el-input size="small" clearable type="textarea" v-model="formIndicators.keyResult"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="权重" prop="weight">
|
||||||
|
<el-input size="small" clearable v-model="formIndicators.checkWeight">
|
||||||
|
<template slot="append">%</template>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</popup-right>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import SmallNav from '@/components/kpi-layout/SmallNav'
|
import SmallNav from '@/components/kpi-layout/SmallNav'
|
||||||
|
import InfoHeader from '@/components/InfoHeader'
|
||||||
|
import PopupRight from '@/components/PopupRight'
|
||||||
|
import draggable from 'vuedraggable'
|
||||||
|
import {getDimensions} from '@/api/data'
|
||||||
|
import { apiResultGetDetail } from '@/api/assessment'
|
||||||
export default {
|
export default {
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
activeName: 'second'
|
zhibiaoTitle: '添加指标',
|
||||||
|
showIndicators: false,
|
||||||
|
dimensionsList: [],
|
||||||
|
formIndicators: {},
|
||||||
|
ruleIndicators: {
|
||||||
|
target: [{ required: true,
|
||||||
|
message: '请输入指标名称',
|
||||||
|
trigger: 'blur' }
|
||||||
|
],
|
||||||
|
keyResult: [{ required: true,
|
||||||
|
message: '请输入考核标准',
|
||||||
|
trigger: 'blur' }
|
||||||
|
],
|
||||||
|
checkWeight: [{ required: true,
|
||||||
|
message: '请输入权重大小',
|
||||||
|
trigger: 'blur' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
activeId: null,
|
||||||
|
obj: {
|
||||||
|
recortModelDto: []
|
||||||
|
},
|
||||||
|
options1: {
|
||||||
|
group: 'names',
|
||||||
|
draggable: '.items',
|
||||||
|
handle: '.my-handle',
|
||||||
|
scroll: true,
|
||||||
|
sort: true, // 内部排序列表
|
||||||
|
delay: 0, // 以毫秒为单位定义排序何时开始。
|
||||||
|
touchStartThreshold: 0, // px,在取消延迟拖动事件之前,点应该移动多少像素?
|
||||||
|
disabled: false, // 如果设置为真,则禁用sortable。
|
||||||
|
store: null, // @see Store
|
||||||
|
animation: 150 // ms, 动画速度运动项目排序时,' 0 ' -没有动画。
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
SmallNav
|
SmallNav,
|
||||||
|
InfoHeader,
|
||||||
|
draggable,
|
||||||
|
PopupRight
|
||||||
},
|
},
|
||||||
computed: {},
|
computed: {},
|
||||||
beforeMount () {},
|
beforeMount () {},
|
||||||
mounted () {},
|
mounted () {
|
||||||
|
this.handleGetDimensions()
|
||||||
|
this.handleGetTbale()
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleClick (tab, event) {
|
// 获取维度类型
|
||||||
console.log(tab, event)
|
async handleGetDimensions () {
|
||||||
|
try {
|
||||||
|
let res = await getDimensions()
|
||||||
|
if (res.code !== 200) {
|
||||||
|
this.dimensionsList = []
|
||||||
|
return
|
||||||
|
}
|
||||||
|
res = res.data
|
||||||
|
this.dimensionsList = res
|
||||||
|
} catch (error) {
|
||||||
|
this.$message.error(error.msg)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleCancelZhibiao () {
|
||||||
|
this.showIndicators = false
|
||||||
|
},
|
||||||
|
handleSubmitZhibiao () {
|
||||||
|
this.$refs.formIndicators.validate((v) => {
|
||||||
|
if (v) {
|
||||||
|
if (this.formIndicators.index === -1) {
|
||||||
|
this.obj.recortModelDtos[this.formIndicators.dazhibiaoIndex].detailDtos.push(Object.assign({}, this.formIndicators, {checkWeight: this.formIndicators.checkWeight / 100}))
|
||||||
|
console.log('this.obj.recortModelDtos[this.formIndicators.dazhibiaoIndex].: ', this.obj.recortModelDtos[this.formIndicators.dazhibiaoIndex])
|
||||||
|
} else {
|
||||||
|
this.obj.recortModelDtos[this.formIndicators.dazhibiaoIndex].detailDtos[this.formIndicators.index] = Object.assign({}, this.formIndicators, {checkWeight: this.formIndicators.checkWeight / 100})
|
||||||
|
}
|
||||||
|
this.showIndicators = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleAddIndicators (item) {
|
||||||
|
console.log(item)
|
||||||
|
this.showIndicators = true
|
||||||
|
this.formIndicators = Object.assign({}, item)
|
||||||
|
},
|
||||||
|
// 编辑
|
||||||
|
hanidleEdit (item, index, type) {
|
||||||
|
if (index === -1) {
|
||||||
|
this.formIndicators = {}
|
||||||
|
} else {
|
||||||
|
this.formIndicators = Object.assign({}, item)
|
||||||
|
this.formIndicators.checkWeight = this.formIndicators.checkWeight * 100
|
||||||
|
}
|
||||||
|
this.formIndicators.dazhibiaoIndex = type
|
||||||
|
this.formIndicators.index = index
|
||||||
|
this.formIndicators.type = item.type
|
||||||
|
this.showIndicators = true
|
||||||
|
},
|
||||||
|
handleDelateWeidu (item, index, type) {
|
||||||
|
if (item.id) {
|
||||||
|
item.isDelete = 1
|
||||||
|
this.$forceUpdate()
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.obj.recortModelDtos[type].detailDtos = this.obj.recortModelDtos[type].detailDtos.filter(i => i !== item)
|
||||||
|
this.$forceUpdate()
|
||||||
|
},
|
||||||
|
handleFilter (item) {
|
||||||
|
return item ? item.filter(i => !i.isDelete) : []
|
||||||
|
},
|
||||||
|
async handleGetTbale (id = 226) {
|
||||||
|
let res = await apiResultGetDetail({id})
|
||||||
|
if (res.code !== 200) return
|
||||||
|
this.obj = res.data
|
||||||
|
this.activeId = String(res.data.recortModelDtos[0].id)
|
||||||
|
console.log('res: ', res)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {}
|
watch: {}
|
||||||
@ -51,8 +236,16 @@ export default {
|
|||||||
|
|
||||||
<style lang='less' scoped>
|
<style lang='less' scoped>
|
||||||
.goals{
|
.goals{
|
||||||
|
.my-handle{
|
||||||
|
cursor: move ;
|
||||||
|
}
|
||||||
&-content{
|
&-content{
|
||||||
padding: 28px;
|
padding: 28px;
|
||||||
|
&-name{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
&-title{
|
&-title{
|
||||||
margin: 0 0 10PX 0;
|
margin: 0 0 10PX 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -74,7 +267,29 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
&-tabbar{
|
&-tabbar{
|
||||||
|
&-table{
|
||||||
|
&-header{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
height: 60px;
|
||||||
|
background: rgb(231, 231, 231);
|
||||||
|
border-bottom: 1px solid @borderColor;
|
||||||
|
span{
|
||||||
|
padding:0 0 0 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&-content{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 60px;
|
||||||
|
border-bottom: 1px solid @borderColor;
|
||||||
|
justify-content: space-between;
|
||||||
|
div{
|
||||||
|
padding:0 0 0 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -73,6 +73,7 @@
|
|||||||
@current-change="handleChangePage"
|
@current-change="handleChangePage"
|
||||||
layout="prev, pager, next"
|
layout="prev, pager, next"
|
||||||
:page-size.sync='params.pageSize'
|
:page-size.sync='params.pageSize'
|
||||||
|
:current-page.sync='params.currPage'
|
||||||
:total="params.totalCount">
|
:total="params.totalCount">
|
||||||
</el-pagination>
|
</el-pagination>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
85
src/views/kpi/assessment/performance/components/table.vue
Normal file
85
src/views/kpi/assessment/performance/components/table.vue
Normal file
@ -0,0 +1,85 @@
|
|||||||
|
<template>
|
||||||
|
<table
|
||||||
|
cellspacing="0"
|
||||||
|
border="1">
|
||||||
|
<!-- 顶部title -->
|
||||||
|
<tr>
|
||||||
|
<th>维度</th>
|
||||||
|
<th>名称</th>
|
||||||
|
<th>考核标准</th>
|
||||||
|
<th>权重({{obj.weight*100}}%)</th>
|
||||||
|
</tr>
|
||||||
|
<!-- 暂无数据时显示 -->
|
||||||
|
<tr v-if="obj.recortModelDtos.length === 0">
|
||||||
|
<td :colspan="6">
|
||||||
|
暂无数据
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<!-- 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>
|
||||||
|
</tr>
|
||||||
|
<!-- 右侧数据 -->
|
||||||
|
<tr v-for="(child,index1) in item.detailDtos" :key="index1">
|
||||||
|
<td>
|
||||||
|
{{child.target}}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
{{child.keyResult}}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
{{child.checkWeight*100}}%
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</template>
|
||||||
|
</table>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'columnsTbale',
|
||||||
|
props: {
|
||||||
|
obj: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {
|
||||||
|
return {
|
||||||
|
recortModelDtos: []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
console.log('list', this.obj)
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
table{
|
||||||
|
margin-top: 15px;
|
||||||
|
width: 100%;
|
||||||
|
border:1px solid #e9eaec;
|
||||||
|
border-collapse:collapse
|
||||||
|
}
|
||||||
|
th{
|
||||||
|
background-color: #f8f8f9;
|
||||||
|
}
|
||||||
|
th,td{
|
||||||
|
padding: 5px;
|
||||||
|
border: 1px solid #e9eaec;
|
||||||
|
text-align: center;
|
||||||
|
vertical-align: top;
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
BIN
src/views/kpi/assessment/performance/img/left.png
Normal file
BIN
src/views/kpi/assessment/performance/img/left.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
src/views/kpi/assessment/performance/img/right.png
Normal file
BIN
src/views/kpi/assessment/performance/img/right.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
@ -3,7 +3,7 @@
|
|||||||
<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
|
||||||
@ -18,53 +18,106 @@
|
|||||||
<el-button size="small" @click="handleChangeTtitle" plain>沟通管理</el-button>
|
<el-button size="small" @click="handleChangeTtitle" plain>沟通管理</el-button>
|
||||||
<el-button size="small" plain>管理</el-button>
|
<el-button size="small" plain>管理</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> -->
|
||||||
|
<div class="performance-content-title">
|
||||||
|
<InfoHeader
|
||||||
|
:obj="{
|
||||||
|
name:obj.currentApprovalStaffName,
|
||||||
|
departmentName:obj.departmentName
|
||||||
|
}"
|
||||||
|
/>
|
||||||
|
<div class="performance-content-title-right">
|
||||||
|
<el-button size="mini" @click="handleZhiding" type="primary">制定目标</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="performance-content-center">
|
<div class="performance-content-center">
|
||||||
<div class="performance-content-center-item" v-for="i in 10"></div>
|
<div class="performance-content-center-item"
|
||||||
|
:class="{
|
||||||
|
active:i.isActive,
|
||||||
|
right:true,
|
||||||
|
left:index !==0
|
||||||
|
}"
|
||||||
|
v-for="(i,index) in formList.flowRecordList"
|
||||||
|
: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">
|
||||||
|
<div >
|
||||||
|
{{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>
|
||||||
|
<i style="cursor: pointer;" @click="handleRight(i)" class="el-icon-video-pause"></i>
|
||||||
|
</div>
|
||||||
|
</el-tooltip>
|
||||||
|
<el-tooltip v-if="i.flowName === '执行中'" class="item" effect="dark" placement="top">
|
||||||
|
<div slot="content">执行中”是员工在目标确认后,努力达成目标的一个过程,直到管理员发起评分。<br/>管理员如何发起评分:返回上级页面<考核详情>,点击"开始评分"按钮发起。</div>
|
||||||
|
<div>
|
||||||
|
{{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>
|
||||||
|
<i style="cursor: pointer;" @click="handleRight(i)" class="el-icon-video-pause"></i>
|
||||||
|
</div>
|
||||||
|
</el-tooltip>
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="performance-content-bottom">
|
<div class="performance-content-bottom">
|
||||||
<el-table
|
<tables v-if="obj.length !==0" :obj='obj' />
|
||||||
:data="tableData"
|
|
||||||
:header-cell-style="{background:'#F5F7FA'}"
|
|
||||||
border
|
|
||||||
style="width: 100%">
|
|
||||||
<el-table-column
|
|
||||||
prop="date"
|
|
||||||
label="日期"
|
|
||||||
align="center"
|
|
||||||
width="180">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<div>
|
|
||||||
<div v-for="(i,index) in scope.row.date" :key="index">{{i}}</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
prop="name"
|
|
||||||
label="姓名"
|
|
||||||
align="center"
|
|
||||||
width="180">
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
prop="address"
|
|
||||||
align="center"
|
|
||||||
label="地址">
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="performance-content-jilu">
|
<div class="performance-content-jilu">
|
||||||
ss
|
<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>
|
</div>
|
||||||
|
<popup-right v-if="right.showRight" @cancel='handleCancel' @submit="handleSubmit" :footer='true' :title="form.item.flowName">
|
||||||
|
<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>
|
||||||
|
</div> -->
|
||||||
|
</div>
|
||||||
|
</popup-right>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import SmallNav from '@/components/kpi-layout/SmallNav'
|
import SmallNav from '@/components/kpi-layout/SmallNav'
|
||||||
|
import InfoHeader from '@/components/InfoHeader'
|
||||||
|
import PopupRight from '@/components/PopupRight'
|
||||||
|
import { apiResultRecordDetail, apiResultGetDetail } from '@/api/assessment'
|
||||||
|
import tables from './components/table'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
right: {
|
||||||
|
showRight: false
|
||||||
|
},
|
||||||
form: {},
|
form: {},
|
||||||
|
formList: {
|
||||||
|
flowRecordList: [],
|
||||||
|
resultCommentList: []
|
||||||
|
},
|
||||||
|
obj: {
|
||||||
|
recortModelDtos: []
|
||||||
|
},
|
||||||
options: [{
|
options: [{
|
||||||
value: '选项1',
|
value: '选项1',
|
||||||
label: '黄金糕'
|
label: '黄金糕'
|
||||||
@ -80,33 +133,60 @@ export default {
|
|||||||
}, {
|
}, {
|
||||||
value: '选项5',
|
value: '选项5',
|
||||||
label: '北京烤鸭'
|
label: '北京烤鸭'
|
||||||
}],
|
|
||||||
tableData: [{
|
|
||||||
date: '2016-05-02',
|
|
||||||
name: '王小虎',
|
|
||||||
address: '上海市普陀区金沙江路 1518 弄'
|
|
||||||
}, {
|
|
||||||
date: '2016-05-04',
|
|
||||||
name: '王小虎',
|
|
||||||
address: '上海市普陀区金沙江路 1517 弄'
|
|
||||||
}, {
|
|
||||||
date: '2016-05-01',
|
|
||||||
name: '王小虎',
|
|
||||||
address: '上海市普陀区金沙江路 1519 弄'
|
|
||||||
}, {
|
|
||||||
date: '2016-05-03',
|
|
||||||
name: '王小虎',
|
|
||||||
address: '上海市普陀区金沙江路 1516 弄'
|
|
||||||
}]
|
}]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
SmallNav
|
SmallNav,
|
||||||
|
InfoHeader,
|
||||||
|
PopupRight,
|
||||||
|
tables
|
||||||
},
|
},
|
||||||
computed: {},
|
computed: {},
|
||||||
beforeMount () {},
|
beforeMount () {},
|
||||||
mounted () {},
|
mounted () {
|
||||||
|
this.handleList()
|
||||||
|
this.handleGetTbale()
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 制定目标
|
||||||
|
handleZhiding () {
|
||||||
|
this.$router.push({
|
||||||
|
name: 'assessment-goals',
|
||||||
|
query: {
|
||||||
|
id: this.$route.query.id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
async handleGetTbale (id = 226) {
|
||||||
|
let res = await apiResultGetDetail({id})
|
||||||
|
this.obj = res.data
|
||||||
|
console.log('res: ', res)
|
||||||
|
},
|
||||||
|
handleRight (item) {
|
||||||
|
console.log('item: ', item)
|
||||||
|
this.form.item = item
|
||||||
|
this.right.showRight = true
|
||||||
|
},
|
||||||
|
handleCancel () {
|
||||||
|
this.right.showRight = false
|
||||||
|
},
|
||||||
|
handleSubmit () {
|
||||||
|
this.right.showRight = false
|
||||||
|
},
|
||||||
|
async handleList () {
|
||||||
|
// resultRecordId = == this.$route.query.id
|
||||||
|
let res = await apiResultRecordDetail({resultRecordId: 215})
|
||||||
|
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
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.formList = res.data
|
||||||
|
console.log('res: ', res)
|
||||||
|
},
|
||||||
handleChangeTtitle () {
|
handleChangeTtitle () {
|
||||||
// this.$route
|
// this.$route
|
||||||
console.log('this.$route: ', this.$route.meta.title = '123')
|
console.log('this.$route: ', this.$route.meta.title = '123')
|
||||||
@ -121,11 +201,16 @@ export default {
|
|||||||
<style lang='less' scoped>
|
<style lang='less' scoped>
|
||||||
.performance{
|
.performance{
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
.chooseManage-item{
|
||||||
|
padding: 24px 0;
|
||||||
|
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;
|
||||||
@ -134,19 +219,99 @@ export default {
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
&-title{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
&-center{
|
&-center{
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
margin: 20px 0;
|
margin: 20px 0;
|
||||||
|
|
||||||
&-item{
|
&-item{
|
||||||
width: 20%;
|
text-align: center;
|
||||||
height: 20px;
|
padding: 10px 60px;
|
||||||
background: #09f;
|
margin: 4px 0;
|
||||||
|
font-size: 16px;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
background: #f5f5f5;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
background: @fontBlue;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.left::before{
|
||||||
|
content: "";
|
||||||
|
width: 20px;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
background: url(./img/left.png) no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.right::after{
|
||||||
|
content: "";
|
||||||
|
width: 20px;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
background: url(./img/right.png) no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&-jilu{
|
&-jilu{
|
||||||
|
&-title{
|
||||||
|
padding: 20px 0 10px 0;
|
||||||
|
}
|
||||||
|
&-item{
|
||||||
|
padding: 0 0 0 10px;
|
||||||
|
&-time{
|
||||||
|
margin: 4px 0;
|
||||||
|
font-size: 14px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
&-time::before{
|
||||||
|
position: absolute;
|
||||||
|
left: -16px;
|
||||||
|
top: 0;
|
||||||
|
content: "";
|
||||||
|
bottom: 0;
|
||||||
|
margin: auto;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
background: @fontBlue;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
&-content{
|
||||||
|
padding:0 0 0 10px;
|
||||||
|
display: flex;
|
||||||
|
min-height: 60px;
|
||||||
|
align-items: center;
|
||||||
|
span{
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.mubiao{
|
||||||
|
color: @fontBlue;
|
||||||
|
margin: 0 4px;
|
||||||
|
}
|
||||||
|
&-img{
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-right: 10px;
|
||||||
|
img{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -3,15 +3,21 @@
|
|||||||
<div class="step">
|
<div class="step">
|
||||||
<small-nav :showTitle='false'>
|
<small-nav :showTitle='false'>
|
||||||
<div slot="content">
|
<div slot="content">
|
||||||
<el-cascader size="mini" :props="props" :options="timeOptions" @change="handleChange"></el-cascader>
|
<el-cascader
|
||||||
|
:key="key"
|
||||||
|
v-model="startId"
|
||||||
|
size="mini"
|
||||||
|
:props="props"
|
||||||
|
:options="timeOptions"
|
||||||
|
@change="handleChange"></el-cascader>
|
||||||
</div>
|
</div>
|
||||||
</small-nav>
|
</small-nav>
|
||||||
<div class="step-content boderAndRadius">
|
<div class="step-content boderAndRadius">
|
||||||
<div class="step-content-top">
|
<div class="step-content-top">
|
||||||
<div class="step-content-top-left">
|
<div class="step-content-top-left">
|
||||||
<el-button size="small" @click="handleChoose" plain>{{formTitle}}<i style="margin-left:10px;" class="el-icon-arrow-down"></i></el-button>
|
<el-button size="small" @click="handleChoose" plain>{{formTitle}}<i style="margin-left:10px;" class="el-icon-arrow-down"></i></el-button>
|
||||||
<el-button size="small" @click="kaopingFrom.showRight = true" plain>选择考评组<i style="margin-left:10px;" class="el-icon-arrow-down"></i></el-button>
|
<el-button size="small" @click="handleKaoping" plain>选择考评组<i style="margin-left:10px;" class="el-icon-arrow-down"></i></el-button>
|
||||||
<el-input size="small" style="margin-left:10px;" v-model="formInline.user" prefix-icon="el-icon-search" placeholder="请输入姓名搜索"></el-input>
|
<el-input clearable @change="handleChangeInput" @keyup.enter="handleChangeInput" size="small" style="margin-left:10px;" v-model="params.name" prefix-icon="el-icon-search" placeholder="请输入姓名搜索"></el-input>
|
||||||
</div>
|
</div>
|
||||||
<div class="step-content-top-right">
|
<div class="step-content-top-right">
|
||||||
<el-button size="small" type="primary">开始评分</el-button>
|
<el-button size="small" type="primary">开始评分</el-button>
|
||||||
@ -33,37 +39,70 @@
|
|||||||
:data="tableData"
|
:data="tableData"
|
||||||
style="width: 100%">
|
style="width: 100%">
|
||||||
<el-table-column
|
<el-table-column
|
||||||
prop="date"
|
prop="staffName"
|
||||||
label="日期"
|
|
||||||
align='center'
|
|
||||||
width="180">
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
prop="name"
|
|
||||||
label="姓名"
|
label="姓名"
|
||||||
align='center'
|
align='center'
|
||||||
width="180">
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="departmentName"
|
||||||
|
label="部门"
|
||||||
|
align='center'
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="evaluationName"
|
||||||
|
label="考评组"
|
||||||
|
align='center'
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="allScore"
|
||||||
|
label="考核结果"
|
||||||
|
align='center'
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column
|
||||||
|
prop="scoreLevel"
|
||||||
|
label="绩效等级"
|
||||||
|
align='center'
|
||||||
|
>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
prop="address"
|
prop="address"
|
||||||
align='center'
|
align='center'
|
||||||
label="地址">
|
label="操作">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<div>
|
<div>
|
||||||
{{scope.row}}
|
<el-button
|
||||||
|
@click="handleLook(scope.row.id)"
|
||||||
|
type="text"
|
||||||
|
size="small">
|
||||||
|
查 看
|
||||||
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
|
||||||
</el-table>
|
</el-table>
|
||||||
|
<div class="footer">
|
||||||
|
<el-pagination
|
||||||
|
small
|
||||||
|
:hide-on-single-page='true'
|
||||||
|
@current-change="handleChangePage"
|
||||||
|
layout="prev, pager, next"
|
||||||
|
:page-size.sync='params.pageSize'
|
||||||
|
:current-page.sync='params.currPage'
|
||||||
|
:total="params.totalCount">
|
||||||
|
</el-pagination>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<popup-right v-if="kaopingFrom.showRight" @cancel='handleCancel' @submit="handleSubmit" title="考评组筛选">
|
<popup-right v-if="kaopingFrom.showRight" @cancel='handleCancel' @submit="handleSubmit" title="考评组筛选">
|
||||||
<div slot="content" class="chooseManage">
|
<div slot="content" class="chooseManage">
|
||||||
66
|
<div v-for="i in rightList" :key="i.id" class="chooseManage-item" >
|
||||||
<!-- <div v-for="i in GroundList" :key="i.staffId" class="chooseManage-item" >
|
|
||||||
<el-checkbox :true-label='1' :false-label='0' :disabled='i.isDisable===1' :checked='i.isDisable===1' v-model='i.isSelect'></el-checkbox><span class='commonFont' style="margin:0 0 0 10px;">{{i.staffName}} </span>
|
<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>
|
||||||
<getPersonnel v-if="form.isShowPersonnel" :value.sync='params.staffIds' :isShow.sync='form.isShowPersonnel' :showDataList.sync='form.personnelList'/>
|
<getPersonnel v-if="form.isShowPersonnel" :value.sync='params.staffIds' :isShow.sync='form.isShowPersonnel' :showDataList.sync='form.personnelList'/>
|
||||||
@ -75,6 +114,7 @@ import SmallNav from '@/components/kpi-layout/SmallNav'
|
|||||||
import getPersonnel from '@/components/getPersonnel'
|
import getPersonnel from '@/components/getPersonnel'
|
||||||
import PopupRight from '@/components/PopupRight'
|
import PopupRight from '@/components/PopupRight'
|
||||||
import { apiManagerDetail, apiChartList } from '@/api/assessment'
|
import { apiManagerDetail, apiChartList } from '@/api/assessment'
|
||||||
|
import {getWorkList} from '@/api/workbench'
|
||||||
import { getStartsData } from '@/api/report'
|
import { getStartsData } from '@/api/report'
|
||||||
let id = 0
|
let id = 0
|
||||||
export default {
|
export default {
|
||||||
@ -89,15 +129,17 @@ export default {
|
|||||||
list: []
|
list: []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
startId: null,
|
||||||
params: {
|
params: {
|
||||||
'currPage': 1,
|
'currPage': 1,
|
||||||
// 'evaluationIds': '',
|
'evaluationIds': '',
|
||||||
'flowProcess': 0,
|
'flowProcess': null,
|
||||||
'pageSize': 10,
|
'pageSize': 5,
|
||||||
// 'staffIds': '',
|
// 'staffIds': '',
|
||||||
// 'staffName': '',
|
// 'staffName': '',
|
||||||
'startId': 10
|
'startId': 10
|
||||||
},
|
},
|
||||||
|
key: 0,
|
||||||
timeOptions: [{
|
timeOptions: [{
|
||||||
startId: 0,
|
startId: 0,
|
||||||
time: '月底',
|
time: '月底',
|
||||||
@ -110,25 +152,10 @@ export default {
|
|||||||
//
|
//
|
||||||
props: {
|
props: {
|
||||||
value: 'startId',
|
value: 'startId',
|
||||||
label: 'time'
|
label: 'time',
|
||||||
|
level: true
|
||||||
},
|
},
|
||||||
tableData: [{
|
tableData: [],
|
||||||
date: '2016-05-02',
|
|
||||||
name: '王小虎',
|
|
||||||
address: '上海市普陀区金沙江路 1518 弄'
|
|
||||||
}, {
|
|
||||||
date: '2016-05-04',
|
|
||||||
name: '王小虎',
|
|
||||||
address: '上海市普陀区金沙江路 1517 弄'
|
|
||||||
}, {
|
|
||||||
date: '2016-05-01',
|
|
||||||
name: '王小虎',
|
|
||||||
address: '上海市普陀区金沙江路 1519 弄'
|
|
||||||
}, {
|
|
||||||
date: '2016-05-03',
|
|
||||||
name: '王小虎',
|
|
||||||
address: '上海市普陀区金沙江路 1516 弄'
|
|
||||||
}],
|
|
||||||
formInline: {},
|
formInline: {},
|
||||||
titleList: []
|
titleList: []
|
||||||
}
|
}
|
||||||
@ -144,11 +171,48 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeMount () {},
|
beforeMount () {},
|
||||||
mounted () {
|
async mounted () {
|
||||||
this.handleGetChartList()
|
this.params.startId = Number(this.$route.query.id)
|
||||||
this.handleStartsReq()
|
await this.handleStartsReq()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 获取考评组
|
||||||
|
async handleKaoping () {
|
||||||
|
let res = await getWorkList(Object.assign({}, {startId: this.params.startId}, {
|
||||||
|
'currPage': 1,
|
||||||
|
'pageSize': 999
|
||||||
|
}))
|
||||||
|
if (res.code !== 200) {
|
||||||
|
this.rightList = []
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.rightList = res.data.list
|
||||||
|
this.kaopingFrom.showRight = true
|
||||||
|
},
|
||||||
|
handleLook (id) {
|
||||||
|
// this.handleKaoping()
|
||||||
|
this.$router.push({
|
||||||
|
name: 'assessment-performance',
|
||||||
|
query: {id}
|
||||||
|
})
|
||||||
|
console.log('id: ', id)
|
||||||
|
},
|
||||||
|
handleChangeInput () {
|
||||||
|
this.params.currPage = 1
|
||||||
|
this.handleGetListContent()
|
||||||
|
},
|
||||||
|
handleChangePage (value) {
|
||||||
|
this.params.currPage = value
|
||||||
|
this.handleGetListContent()
|
||||||
|
},
|
||||||
|
async handleGetListContent (params = this.params) {
|
||||||
|
let res = await apiManagerDetail(params)
|
||||||
|
if (res.code !== 200) return
|
||||||
|
this.tableData = res.data.list
|
||||||
|
this.params.totalCount = res.data.totalCount
|
||||||
|
this.params.currPage = res.data.currPage
|
||||||
|
console.log('res: ', res)
|
||||||
|
},
|
||||||
// 为了不分页直接传999
|
// 为了不分页直接传999
|
||||||
async handleStartsReq (type, handleNode) {
|
async handleStartsReq (type, handleNode) {
|
||||||
let params = {
|
let params = {
|
||||||
@ -157,6 +221,7 @@ export default {
|
|||||||
pageSize: 999
|
pageSize: 999
|
||||||
}
|
}
|
||||||
for (let j in this.timeOptions) {
|
for (let j in this.timeOptions) {
|
||||||
|
// params.startId
|
||||||
try {
|
try {
|
||||||
let res = await getStartsData({
|
let res = await getStartsData({
|
||||||
currentPage: 1,
|
currentPage: 1,
|
||||||
@ -165,13 +230,26 @@ export default {
|
|||||||
})
|
})
|
||||||
res = res.data
|
res = res.data
|
||||||
console.log('res: ', res)
|
console.log('res: ', res)
|
||||||
this.timeOptions[j].children = res.list
|
this.key += 10
|
||||||
|
this.timeOptions[j].children = res.list.map(i => {
|
||||||
|
if (i.startId === this.params.startId) {
|
||||||
|
this.startId = [this.timeOptions[j].startId, i.startId]
|
||||||
|
}
|
||||||
|
return i
|
||||||
|
})
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log(error)
|
console.log(error)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
await this.handleGetChartList()
|
||||||
},
|
},
|
||||||
handleChange (item) {
|
async handleChange (item) {
|
||||||
|
this.params.startId = item[1]
|
||||||
|
// await this.handleGetChartList(Object.assign({}, this.params, {startId: item[1]}))
|
||||||
|
this.params.currPage = 1
|
||||||
|
this.params.startId = item[1]
|
||||||
|
await this.handleGetChartList()
|
||||||
|
console.log('this.params: ', this.params)
|
||||||
console.log('item: ', item)
|
console.log('item: ', item)
|
||||||
},
|
},
|
||||||
handleSubmit () {
|
handleSubmit () {
|
||||||
@ -187,23 +265,37 @@ export default {
|
|||||||
handleGetList () {
|
handleGetList () {
|
||||||
console.log('1', this.form.personnelList)
|
console.log('1', this.form.personnelList)
|
||||||
},
|
},
|
||||||
handleActive (i) {
|
async handleActive (i) {
|
||||||
|
if (i.active) return
|
||||||
this.titleList = this.titleList.map(j => {
|
this.titleList = this.titleList.map(j => {
|
||||||
j.active = false
|
j.active = false
|
||||||
return j
|
return j
|
||||||
})
|
})
|
||||||
|
this.params.flowProcess = i.flowProcess
|
||||||
|
this.params.currPage = 1
|
||||||
i.active = true
|
i.active = true
|
||||||
|
await this.handleGetListContent()
|
||||||
},
|
},
|
||||||
// 获取tabbar
|
// 获取tabbar
|
||||||
async handleGetChartList (params = this.params) {
|
async handleGetChartList (params = this.params) {
|
||||||
let res = await apiChartList(params)
|
let res = await apiChartList(Object.assign({}, this.params, {
|
||||||
|
currPage: 1,
|
||||||
|
pageSize: 100
|
||||||
|
}))
|
||||||
if (res.code !== 200) return
|
if (res.code !== 200) return
|
||||||
this.titleList = res.data
|
this.titleList = res.data
|
||||||
this.titleList[0].active = true
|
this.titleList[0].active = true
|
||||||
|
this.params.flowProcess = this.titleList[0].flowProcess
|
||||||
|
this.handleGetListContent()
|
||||||
|
console.log('this.params: ', this.params)
|
||||||
console.log('res: ', res)
|
console.log('res: ', res)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {}
|
watch: {
|
||||||
|
'params.staffIds' (n, o) {
|
||||||
|
this.handleGetListContent()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -211,10 +303,14 @@ export default {
|
|||||||
|
|
||||||
<style lang='less' scoped>
|
<style lang='less' scoped>
|
||||||
.step-content{
|
.step-content{
|
||||||
|
.footer{
|
||||||
|
text-align: right;
|
||||||
|
margin: 20px 0 0 0;
|
||||||
|
}
|
||||||
padding: 28px;
|
padding: 28px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 20px 0;
|
margin: 20px 0;
|
||||||
height: 537px;
|
min-height: 537px;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
&-top{
|
&-top{
|
||||||
|
|||||||
@ -1,40 +1,121 @@
|
|||||||
<!-- -->
|
<!-- -->
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div>返回</div>
|
<div class="title_bar">
|
||||||
<span></span>
|
<div @click="handleBack">返回</div>
|
||||||
<div>等级分布详情<div>
|
<span></span>
|
||||||
</div>
|
<div>等级分布详情</div>
|
||||||
<div>
|
</div>
|
||||||
<el-cascader></el-cascader>
|
<div class="detail_content">
|
||||||
<el-table :data="tableData"
|
<el-cascader :options="depList" @change="handleChange" style="margin-bottom:20px" ></el-cascader>
|
||||||
|
<el-table :data="tableData"
|
||||||
border
|
border
|
||||||
:header-cell-style="{ background:'#F5F7FA'}">
|
:header-cell-style="{ background:'#F5F7FA'}"
|
||||||
<el-table-column></el-table-column>
|
style="margin-top:20px">
|
||||||
<el-table-column></el-table-column>
|
<el-table-column prop="staffName" label="姓名"></el-table-column>
|
||||||
<el-table-column></el-table-column>
|
<el-table-column prop="staffNo" label="工号"></el-table-column>
|
||||||
<el-table-column><el-table-column>
|
<el-table-column prop="departmentName" label="部门"></el-table-column>
|
||||||
|
<el-table-column prop="allScore" label="考评结果"></el-table-column>
|
||||||
|
<el-table-column prop="scoreLevel" label="实际分布"></el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import {getChartDetail, getDepList} from '@/api/report'
|
||||||
export default {
|
export default {
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
// 表格数据
|
||||||
|
tableData: [],
|
||||||
|
// 部门数据列表
|
||||||
|
depList: []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {},
|
computed: {},
|
||||||
beforeMount () {},
|
beforeMount () {},
|
||||||
mounted () {},
|
mounted () {
|
||||||
methods: {},
|
this.handleDepListReq()
|
||||||
watch: {}
|
this.handleDetailReq()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 返回上一页
|
||||||
|
handleBack () {
|
||||||
|
this.$router.go(-1)
|
||||||
|
},
|
||||||
|
// 多选框转中处理
|
||||||
|
handleChange (val) {
|
||||||
|
this.handleDetailReq(val[1])
|
||||||
|
},
|
||||||
|
// 请求详情页面信息
|
||||||
|
async handleDetailReq (depId) {
|
||||||
|
let params = {
|
||||||
|
currPage: 1,
|
||||||
|
departmentId: depId,
|
||||||
|
flowProcess: this.$route.query.flowProcess,
|
||||||
|
startId: this.$route.query.startId,
|
||||||
|
pageSize: 20
|
||||||
|
}
|
||||||
|
let result = await getChartDetail(params)
|
||||||
|
this.tableData = result.data.list
|
||||||
|
},
|
||||||
|
// 请求部门信息
|
||||||
|
async handleDepListReq (handleNode) {
|
||||||
|
let params = {
|
||||||
|
type: 0
|
||||||
|
}
|
||||||
|
let result = await getDepList(params)
|
||||||
|
console.log(result)
|
||||||
|
this.depList = this.handleDepResult(result.data)
|
||||||
|
},
|
||||||
|
// 递归生成可用数组
|
||||||
|
handleDepResult (list) {
|
||||||
|
return Array.from(list).map(item => {
|
||||||
|
let resItem = {
|
||||||
|
value: item.departmentId,
|
||||||
|
label: item.departmentName
|
||||||
|
}
|
||||||
|
// 如果有下一级部门则递归调用
|
||||||
|
if (item.list && item.list.length > 0) {
|
||||||
|
let children = this.handleDepResult(item.list)
|
||||||
|
resItem['children'] = children
|
||||||
|
}
|
||||||
|
return resItem
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang='' scoped>
|
<style lang='' scoped>
|
||||||
|
.title_bar{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.title_bar>:nth-child(1){
|
||||||
|
font-size: 16px;
|
||||||
|
color: #b4b4b4;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.title_bar>:nth-child(2){
|
||||||
|
height: 15px ;
|
||||||
|
width: 1px;
|
||||||
|
background: #333;
|
||||||
|
}
|
||||||
|
.title_bar>:nth-child(3){
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
.detail_content{
|
||||||
|
background: white;
|
||||||
|
padding: 40px 20px;
|
||||||
|
border:solid 1px #b4b4b4;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -27,61 +27,65 @@
|
|||||||
<div>{{statisticals[4].desc}}</div>
|
<div>{{statisticals[4].desc}}</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div>{{statisticals[4].num}}</div>
|
<div>{{statisticals[5].num}}</div>
|
||||||
<div>{{statisticals[4].desc}}</div>
|
<div>{{statisticals[5].desc}}</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div>{{statisticals[4].num}}</div>
|
<div>{{statisticals[6].num}}</div>
|
||||||
<div>{{statisticals[4].desc}}</div>
|
<div>{{statisticals[6].desc}}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="num_title">考核人数分析</div>
|
<div class="num_title">考核人数分析</div>
|
||||||
<div class="num_tips">
|
<div class="chart_content">
|
||||||
|
<div class="num_chart">
|
||||||
<div>考核人数分析</div>
|
<div>考核人数分析</div>
|
||||||
<div>参与考核部门人数</div>
|
<div id="num_chart"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="num_report">
|
<div class="num_report">
|
||||||
<div id="num_chart"></div>
|
<div>参与考核部门人数</div>
|
||||||
<ul>
|
<ul class="num_report_list">
|
||||||
<li v-for="(assessItem, index) in assessNum" :key="assessItem.desc">
|
<li v-for="(assessItem, index) in assessNum" :key="assessItem.desc">
|
||||||
<div class="rep_list">
|
<div class="rep_list">
|
||||||
<div :style="handleliColor(index)">{{index}}
|
<div style="display:flex">
|
||||||
</div>
|
<div :style="handleliColor(index)">{{index}}</div>
|
||||||
<div>{{assessItem.desc}} {{ assessItem.num }}人</div>
|
<div style="margin-left:10px">{{assessItem.desc}} </div>
|
||||||
</div>
|
</div>
|
||||||
|
<div>{{ assessItem.num }}人</div>
|
||||||
|
</div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="level_title">结果分析</div>
|
</div>
|
||||||
<div class="level_tips">等级分布</div>
|
<div class="level_title">结果分析</div>
|
||||||
<div class="reslut_display">
|
<div class="level_content">
|
||||||
|
<div class="level_chart">
|
||||||
|
<div class="level_tips">等级分布</div>
|
||||||
<div id="level_chart"></div>
|
<div id="level_chart"></div>
|
||||||
<el-table :data="tableData"
|
</div>
|
||||||
:header-cell-style="{ background:'#F5F7FA'}"
|
<el-table :data="tableData"
|
||||||
border
|
:header-cell-style="{ background:'#F5F7FA'}"
|
||||||
>
|
border
|
||||||
<el-table-column prop="desc" label="绩效等级">
|
style="flex-grow:2;margin-top:20px">
|
||||||
</el-table-column>
|
<el-table-column prop="desc" label="绩效等级">
|
||||||
<el-table-column prop="num" label="实际分布" width="200">
|
</el-table-column>
|
||||||
</el-table-column>
|
<el-table-column prop="num" label="实际分布">
|
||||||
<el-table-column label="操作" width="150">
|
</el-table-column>
|
||||||
<template slot-scope="scope">
|
<el-table-column label="操作" width="150">
|
||||||
<el-button
|
<template slot-scope="scope">
|
||||||
@click.native.prevent="
|
<el-button
|
||||||
handleDetailClick(scope.$index, tableData)
|
@click.native.prevent="handleDetailClick(scope.$index, scope.row)"
|
||||||
"
|
|
||||||
type="text"
|
type="text"
|
||||||
size="small"
|
size="small"
|
||||||
>
|
>
|
||||||
查看详情
|
查看详情
|
||||||
</el-button>
|
</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -102,6 +106,8 @@ export default {
|
|||||||
// 当前选择的月份
|
// 当前选择的月份
|
||||||
pickerTime: '',
|
pickerTime: '',
|
||||||
//
|
//
|
||||||
|
startId: '',
|
||||||
|
//
|
||||||
statisticals: [
|
statisticals: [
|
||||||
{num: '0', desc: '参与人数'},
|
{num: '0', desc: '参与人数'},
|
||||||
{num: '0', desc: '目标制定'},
|
{num: '0', desc: '目标制定'},
|
||||||
@ -255,9 +261,13 @@ export default {
|
|||||||
background: color
|
background: color
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
//
|
// 页面跳转
|
||||||
handleDetailClick (index, rows) {
|
handleDetailClick (index, rows) {
|
||||||
|
this.$router.push({
|
||||||
|
path: ('report-detial'),
|
||||||
|
query: {startId: this.startId, flowProcess: rows.desc}
|
||||||
|
})
|
||||||
|
console.log(this.$router)
|
||||||
},
|
},
|
||||||
// Y轴坐标计算,取靠近最大值的3的倍数作为上限,然后划分成4个刻度(0为初始刻度)
|
// Y轴坐标计算,取靠近最大值的3的倍数作为上限,然后划分成4个刻度(0为初始刻度)
|
||||||
handleChartYMul (val) {
|
handleChartYMul (val) {
|
||||||
@ -277,7 +287,7 @@ export default {
|
|||||||
},
|
},
|
||||||
//
|
//
|
||||||
handleChange (val) {
|
handleChange (val) {
|
||||||
console.log(val)
|
this.startId = val[1]
|
||||||
this.handleChartDataReq(val[1])
|
this.handleChartDataReq(val[1])
|
||||||
},
|
},
|
||||||
// 获取报表内容
|
// 获取报表内容
|
||||||
@ -332,10 +342,8 @@ export default {
|
|||||||
|
|
||||||
<style lang='' scoped>
|
<style lang='' scoped>
|
||||||
.report_content {
|
.report_content {
|
||||||
width: fit-content;
|
|
||||||
height: fit-content;
|
|
||||||
background: white;
|
background: white;
|
||||||
border-style: #fcfcfc solid 3px;
|
border: #fcfcfc solid 1px;
|
||||||
margin-top:20px;
|
margin-top:20px;
|
||||||
padding-top:40px;
|
padding-top:40px;
|
||||||
padding-left: 20px;
|
padding-left: 20px;
|
||||||
@ -343,17 +351,13 @@ export default {
|
|||||||
}
|
}
|
||||||
.header {
|
.header {
|
||||||
background: #fcfcfc;
|
background: #fcfcfc;
|
||||||
width: fit-content;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
.header > div {
|
.header > div {
|
||||||
display: inline-block;
|
flex-grow: 1;
|
||||||
width: fit-content;
|
|
||||||
height: fit-content;
|
|
||||||
padding-top: 20px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
padding-left: 30px;
|
|
||||||
padding-right: 30px;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
padding:20px
|
||||||
}
|
}
|
||||||
.header > div > div:nth-child(1) {
|
.header > div > div:nth-child(1) {
|
||||||
color: black;
|
color: black;
|
||||||
@ -369,29 +373,48 @@ export default {
|
|||||||
background: #333333;
|
background: #333333;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
width: 1px;
|
width: 1px;
|
||||||
margin-top: 20px;
|
|
||||||
}
|
}
|
||||||
.num_title{
|
.num_title{
|
||||||
margin-top:20px;
|
margin-top:20px;
|
||||||
margin-bottom: 25px;
|
margin-bottom: 25px;
|
||||||
color: #333333;
|
color: #333333;
|
||||||
}
|
}
|
||||||
.num_tips > div:nth-child(1) {
|
.chart_content{
|
||||||
display: inline-block;
|
display: flex;
|
||||||
color: #3a3a3a;
|
|
||||||
font-size: 14px;
|
|
||||||
width: fit-content;
|
|
||||||
padding-left: 20px;
|
|
||||||
position: relative;
|
|
||||||
}
|
}
|
||||||
.num_tips > div:nth-child(2) {
|
.num_tips{
|
||||||
display: inline-block;
|
display: flex;
|
||||||
|
}
|
||||||
|
.num_chart {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
.num_chart>:nth-child(1){
|
||||||
color: #3a3a3a;
|
color: #3a3a3a;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
width: fit-content;
|
padding-left: 20px;
|
||||||
padding-left: 50%;
|
}
|
||||||
margin-bottom: 20px;
|
.num_report {
|
||||||
position: relative;
|
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{
|
.level_title{
|
||||||
margin-top:20px;
|
margin-top:20px;
|
||||||
@ -408,25 +431,19 @@ export default {
|
|||||||
.num_report{
|
.num_report{
|
||||||
display: flex
|
display: flex
|
||||||
}
|
}
|
||||||
.rep_list{
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.rep_list>:nth-child(2){
|
|
||||||
width: 200px;
|
|
||||||
margin-left: 10px;
|
|
||||||
flex:1
|
|
||||||
}
|
|
||||||
#num_chart {
|
#num_chart {
|
||||||
display: inline-block;
|
widows: 500px;
|
||||||
width: 600px;
|
|
||||||
height: 360px;
|
height: 360px;
|
||||||
}
|
}
|
||||||
.reslut_display {
|
.level_content{
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
.level_chart {
|
||||||
|
display: flex;
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
#level_chart {
|
#level_chart {
|
||||||
width: 600px;
|
width: 500px;
|
||||||
height: 360px;
|
height: 360px;
|
||||||
flex: 1;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -236,7 +236,7 @@ export default {
|
|||||||
formIndicators: {}, // 指标表单
|
formIndicators: {}, // 指标表单
|
||||||
ruleIndicators: {
|
ruleIndicators: {
|
||||||
name: [{ required: true,
|
name: [{ required: true,
|
||||||
message: '请输入维度名称',
|
message: '请输入指标名称',
|
||||||
trigger: 'blur' }
|
trigger: 'blur' }
|
||||||
],
|
],
|
||||||
keyResult: [{ required: true,
|
keyResult: [{ required: true,
|
||||||
@ -294,6 +294,7 @@ export default {
|
|||||||
async handleGetByGroupId (id) {
|
async handleGetByGroupId (id) {
|
||||||
try {
|
try {
|
||||||
let res = await getByGroupId({id})
|
let res = await getByGroupId({id})
|
||||||
|
res = res.data
|
||||||
res = Object.assign({}, res, {
|
res = Object.assign({}, res, {
|
||||||
evaluationGroupId: res.id,
|
evaluationGroupId: res.id,
|
||||||
calculateId: 1 }
|
calculateId: 1 }
|
||||||
@ -315,7 +316,12 @@ export default {
|
|||||||
// 获取维度类型
|
// 获取维度类型
|
||||||
async handleGetDimensions () {
|
async handleGetDimensions () {
|
||||||
try {
|
try {
|
||||||
const res = await getDimensions()
|
let res = await getDimensions()
|
||||||
|
if (res.code !== 200) {
|
||||||
|
this.dimensionsList = []
|
||||||
|
return
|
||||||
|
}
|
||||||
|
res = res.data
|
||||||
this.dimensionsList = res
|
this.dimensionsList = res
|
||||||
console.log('res: ', res)
|
console.log('res: ', res)
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
@ -367,7 +373,7 @@ export default {
|
|||||||
} else {
|
} else {
|
||||||
this.zhibiaoTitle = '编辑指标'
|
this.zhibiaoTitle = '编辑指标'
|
||||||
this.formIndicators = Object.assign({}, item, {index, index2: type, isEdit: true})
|
this.formIndicators = Object.assign({}, item, {index, index2: type, isEdit: true})
|
||||||
this.formIndicators.weight = this.formIndicators.weight
|
this.formIndicators.weight = this.formIndicators.weight * 100
|
||||||
this.showIndicators = true
|
this.showIndicators = true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -408,7 +414,7 @@ export default {
|
|||||||
}
|
}
|
||||||
if (!this.zanshi.tagetLibItems) this.zanshi.tagetLibItems = []
|
if (!this.zanshi.tagetLibItems) this.zanshi.tagetLibItems = []
|
||||||
this.zanshi.tagetLibItems.push(Object.assign({}, this.formIndicators, {isDelete: 0}))
|
this.zanshi.tagetLibItems.push(Object.assign({}, this.formIndicators, {isDelete: 0}))
|
||||||
// this.showIndicators = false
|
this.showIndicators = false
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
@ -54,6 +54,10 @@ export default {
|
|||||||
},
|
},
|
||||||
computed: {},
|
computed: {},
|
||||||
beforeMount () {},
|
beforeMount () {},
|
||||||
|
created () {
|
||||||
|
const id = this.$route.query.id
|
||||||
|
this.$route.meta.title = !id ? '新增考评组' : '编辑考评组'
|
||||||
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
|
|
||||||
},
|
},
|
||||||
@ -135,6 +139,7 @@ export default {
|
|||||||
overflow: auto;
|
overflow: auto;
|
||||||
}
|
}
|
||||||
&-header{
|
&-header{
|
||||||
|
cursor: pointer;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 50;
|
z-index: 50;
|
||||||
width: 420px;
|
width: 420px;
|
||||||
|
|||||||
@ -60,6 +60,7 @@
|
|||||||
@current-change="handleChangePage"
|
@current-change="handleChangePage"
|
||||||
layout="prev, pager, next"
|
layout="prev, pager, next"
|
||||||
:page-size.sync='params.pageSize'
|
:page-size.sync='params.pageSize'
|
||||||
|
:current-page.sync='params.currPage'
|
||||||
:total="params.totalCount">
|
:total="params.totalCount">
|
||||||
</el-pagination>
|
</el-pagination>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -79,9 +79,7 @@
|
|||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button
|
<el-button
|
||||||
type="text"
|
type="text"
|
||||||
@click.native.prevent="
|
@click.native.prevent="handleGroupDelete(scope.$index, formData.assessmentList)"
|
||||||
handleGroupDelete(scope.$index, formData.assessmentList)
|
|
||||||
"
|
|
||||||
size="small"
|
size="small"
|
||||||
>删除</el-button>
|
>删除</el-button>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user