264 lines
7.9 KiB
Vue
264 lines
7.9 KiB
Vue
<template>
|
|
<div class="work-brnch-box">
|
|
<!-- 上 -->
|
|
<div class="flex-row-start top">
|
|
<div class="flex-row-start dept-left">
|
|
<dept-todo-view title="待办" v-loading="loadingToDo" :dataInfo="toToData"></dept-todo-view>
|
|
<dept-todo-view title="已办" v-loading="loadingHasToDo" :dataInfo="hasToDodoData"
|
|
style="margin-left: 0"></dept-todo-view>
|
|
</div>
|
|
<div class="flex-row-start dept-chart-box">
|
|
<dept-chart-view id="shelves" title="部门上架" v-loading="loadingResource" :dataList="resourceData"
|
|
ref="resourceChart" :colorArray="resourceColor">
|
|
</dept-chart-view>
|
|
<dept-chart-view id="apply" title="部门申请" v-loading="loadingApply" :dataList="applyData" ref="applyChart"
|
|
:colorArray="applyColor">
|
|
</dept-chart-view>
|
|
<dept-chart-view id="demand" title="部门需求" v-loading="loadingRequire" :dataList="requireData"
|
|
ref="requireChart" :colorArray="requireColor">
|
|
</dept-chart-view>
|
|
</div>
|
|
</div>
|
|
<!-- 中 -->
|
|
<div class="center">
|
|
<center-view></center-view>
|
|
</div>
|
|
<!-- 下 -->
|
|
<div class="bottom">
|
|
<bottom-view></bottom-view>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import BottomView from '../workBench/components/bottom-view.vue'
|
|
import CenterView from '../workBench/components/center-view.vue'
|
|
import DeptChartView from '../workBench/components/dept-chart-view.vue'
|
|
import deptTodoView from '../workBench/components/dept-todo-view.vue'
|
|
import * as Apis from './api.js'
|
|
import bus from '@/views/bus.js'
|
|
export default {
|
|
components: {
|
|
deptTodoView,
|
|
BottomView,
|
|
CenterView,
|
|
DeptChartView
|
|
},
|
|
data () {
|
|
return {
|
|
// 部门待办
|
|
toToData: {
|
|
color: '#f86f01',
|
|
imgSrc: require('@/assets/img/workBench/todo.png'),
|
|
bgColor: 'rgba(228,138,1,0.12)',
|
|
borderColor: 'rgba(250,123,12,0.54)',
|
|
textColor: '#f86f01',
|
|
num: 0,
|
|
list: [],
|
|
type: 'todo',
|
|
// url: 'activiti-my-todo-task',
|
|
url: 'myAgent-CompetencyApplication'
|
|
},
|
|
// 部门已办
|
|
hasToDodoData: {
|
|
noMarginleft: true,
|
|
color: '#21b107',
|
|
imgSrc: require('@/assets/img/workBench/hasToDo.png'),
|
|
bgColor: 'rgba(37,165,13,0.12)',
|
|
borderColor: 'rgba(49,194,20,0.54)',
|
|
textColor: '#21b107',
|
|
num: 0,
|
|
list: [],
|
|
// url: 'activiti-my-join-task',
|
|
url: 'hasToDoTasks-CompetencyApplication'
|
|
},
|
|
// 部门申请
|
|
resourceData: [],
|
|
resourceColor: ['#7b2cff', '#fd5151', , '#2ca1ff', '#0adbfa', '#febe13', '#65e5dd', '#f071ff', '#85f67a'],
|
|
// 部门申请
|
|
applyData: [],
|
|
applyColor: ['#5085f2', '#e75fc3', '#f87be2', '#f2719a', '#fca4bb', '#f59a8f', '#fdb301', '#57e7ec', '#cf9ef1'],
|
|
// 部门需求
|
|
requireData: [],
|
|
requireColor: ['#FD866A', '#9E87FF', '#58D5FF', '#73DDFF', '#73ACFF', '#FDD56A', '#FDB36A'],
|
|
loadingToDo: false,
|
|
loadingHasToDo: false,
|
|
loadingResource: false,
|
|
loadingApply: false,
|
|
loadingRequire: false
|
|
}
|
|
},
|
|
created () {
|
|
bus.$off('workInit')
|
|
bus.$on('workInit', () => {
|
|
console.log('刷新工作台===================')
|
|
this.getToDo()
|
|
this.getHasToDo()
|
|
})
|
|
},
|
|
mounted () {
|
|
// 部门待办
|
|
this.getToDo()
|
|
// 部门已办
|
|
this.getHasToDo()
|
|
// 上架
|
|
this.getShelvesTotal()
|
|
// 申请
|
|
this.getApplyTotal()
|
|
// 需求
|
|
this.getRequireTotal()
|
|
},
|
|
methods: {
|
|
// 待办
|
|
getToDo () {
|
|
this.loadingToDo = true
|
|
// const data = {
|
|
// limit: 5,
|
|
// page: 1
|
|
// }
|
|
this.$http.get('/act/task/myToDoTaskPage?page=1&limit=5').then(res => {
|
|
this.loadingToDo = false
|
|
this.toToData.list = res.data.data.list || []
|
|
this.toToData.num = res.data.data.total || 0
|
|
})
|
|
// Apis.getToDoTask(data, res => {
|
|
// this.loadingToDo = false
|
|
// if (res.data.code !== 0) {
|
|
// return this.$message.error(res.data.msg)
|
|
// }
|
|
// console.log('res----待办-------->', res.data)
|
|
// this.toToData.list = res.data.data.records || []
|
|
// this.toToData.num = res.data.data.total || 0
|
|
// }, err => {
|
|
// this.$message.error(err)
|
|
// this.loadingToDo = false
|
|
// })
|
|
},
|
|
// 已办
|
|
getHasToDo () {
|
|
// const data = {
|
|
// limit: 5,
|
|
// page: 1
|
|
// }
|
|
this.loadingHasToDo = true
|
|
this.$http.get('/act/his/getMyHandledInstancePage?ended=1?page=1&limit=5').then(res => {
|
|
this.loadingHasToDo = false
|
|
this.hasToDodoData.list = res.data.data.list || []
|
|
this.hasToDodoData.num = res.data.data.total || 0
|
|
})
|
|
// Apis.getHasToDoTask(data, res => {
|
|
// this.loadingHasToDo = false
|
|
// if (res.data.code !== 0) {
|
|
// return this.$message.error(res.data.msg)
|
|
// }
|
|
// console.log('res----已办-------->', res.data)
|
|
// this.hasToDodoData.list = res.data.data.records || []
|
|
// this.hasToDodoData.num = res.data.data.total || 0
|
|
// }, err => {
|
|
// this.$message.error(err)
|
|
// this.loadingHasToDo = false
|
|
// console.log('err-----已办------->', err)
|
|
// })
|
|
},
|
|
// 部门上架
|
|
getShelvesTotal () {
|
|
this.loadingResource = true
|
|
Apis.getTotalByDept({}, res => {
|
|
this.loadingResource = false
|
|
if (res.data.code !== 0) {
|
|
return this.$message.error(res.data.msg)
|
|
}
|
|
console.log('res----部门上架-------->', res.data)
|
|
this.resourceData = this.formatList(res.data.data.total || [])
|
|
this.$nextTick(() => {
|
|
this.$refs.resourceChart.initChart(this.resourceData)
|
|
})
|
|
}, err => {
|
|
this.$message.error(err)
|
|
this.loadingResource = false
|
|
})
|
|
},
|
|
// 部门申请
|
|
getApplyTotal () {
|
|
this.loadingApply = true
|
|
Apis.getApply({}, res => {
|
|
this.loadingApply = false
|
|
if (res.data.code !== 0) {
|
|
return this.$message.error(res.data.msg)
|
|
}
|
|
console.log('res----部门申请-------->', res.data)
|
|
this.applyData = this.formatList(res.data.data.total || [])
|
|
this.$nextTick(() => {
|
|
console.log('this.applyData------------>', this.applyData)
|
|
this.$refs.applyChart.initChart(this.applyData)
|
|
})
|
|
}, err => {
|
|
this.$message.error(err)
|
|
this.loadingApply = false
|
|
})
|
|
},
|
|
formatList (list = [], nameStr = 'type') {
|
|
const arr = []
|
|
list.map(v => {
|
|
const obj = {}
|
|
obj.name = v[nameStr]
|
|
obj.value = v.count
|
|
arr.push(obj)
|
|
})
|
|
return arr
|
|
},
|
|
// 部门需求
|
|
getRequireTotal () {
|
|
this.loadingRequire = true
|
|
Apis.getRequire({}, res => {
|
|
this.loadingRequire = false
|
|
if (res.data.code !== 0) {
|
|
return this.$message.error(res.data.msg)
|
|
}
|
|
console.log('res----部门需求-------->', res.data)
|
|
this.requireData = this.formatList(res.data.data.total || [], 'flag')
|
|
this.$nextTick(() => {
|
|
this.$refs.requireChart.initChart(this.requireData)
|
|
})
|
|
}, err => {
|
|
this.$message.error(err)
|
|
this.loadingRequire = false
|
|
})
|
|
}
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.margin-h-16 {
|
|
margin: 0 16px;
|
|
}
|
|
|
|
.flex-row-start {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.work-brnch-box {
|
|
|
|
.top {
|
|
height: 284px;
|
|
margin-bottom: 16px;
|
|
|
|
}
|
|
|
|
.dept-left {
|
|
width: 836px;
|
|
background: #fff;
|
|
margin-right: 16px;
|
|
}
|
|
|
|
.dept-chart-box {
|
|
width: 780px;
|
|
height: 100%;
|
|
background: #fff;
|
|
}
|
|
}
|
|
</style>
|