工作台：添加loading
This commit is contained in:
parent
6c88eb6da3
commit
b4d28c2418
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class="chart-box">
|
||||
<div class="title">{{ title }}</div>
|
||||
<div v-if="dataListCopy.length > 0" style="width:260px; height:232px" class="dept-chart-view" :id="id">
|
||||
</div>
|
||||
|
|
@ -40,7 +40,7 @@ export default {
|
|||
// 解决数据初始渲染不出来的问题
|
||||
setTimeout(() => {
|
||||
this.initChart()
|
||||
}, 1000)
|
||||
}, 2000)
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -51,7 +51,7 @@ export default {
|
|||
mounted() {
|
||||
setTimeout(() => {
|
||||
this.initChart()
|
||||
}, 1000)
|
||||
}, 2000)
|
||||
},
|
||||
methods: {
|
||||
initChart() {
|
||||
|
|
@ -188,6 +188,12 @@ export default {
|
|||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.chart-box {
|
||||
width: 260px;
|
||||
height: 232px;
|
||||
margin: 1px;
|
||||
}
|
||||
|
||||
.dept-chart-view {
|
||||
width: 260px;
|
||||
height: 232px;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="frequency">
|
||||
<contentTitle title="部门能力使用频率TOP5"></contentTitle>
|
||||
<div v-if="!noData">
|
||||
<div v-if="!noData" v-loading="loading">
|
||||
<div class="no-box">
|
||||
<div class="no no2">
|
||||
<div class="name" :style="{ color: colorObj[2] }">{{ no2Obj.name || '--' }}</div>
|
||||
|
|
@ -52,7 +52,8 @@ export default {
|
|||
name: '',
|
||||
count: '',
|
||||
},
|
||||
noData: false
|
||||
noData: false,
|
||||
loading: true,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
|
@ -65,7 +66,9 @@ export default {
|
|||
limit: 5,
|
||||
page: 1,
|
||||
};
|
||||
this.loading = true
|
||||
Apis.getFrequence(data, res => {
|
||||
this.loading = false;
|
||||
if (res.data.code !== 0) {
|
||||
return this.$message.error(res.data.msg);
|
||||
}
|
||||
|
|
@ -83,7 +86,9 @@ export default {
|
|||
this.listInfo = []
|
||||
this.listInfo.push(_arr[3])
|
||||
this.listInfo.push(_arr[4])
|
||||
|
||||
}, err => {
|
||||
this.loading = false;
|
||||
this.$message.error(err);
|
||||
});
|
||||
},
|
||||
|
|
|
|||
|
|
@ -3,13 +3,17 @@
|
|||
<!-- 上 -->
|
||||
<div class="flex-row-start top">
|
||||
<div class="flex-row-start dept-left">
|
||||
<dept-todo-view title="部门待办" :dataInfo="toToData"></dept-todo-view>
|
||||
<dept-todo-view title="部门已办" :dataInfo="hasToDodoData" style="margin-left: 0"></dept-todo-view>
|
||||
<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="部门上架" :dataList="resourceData"></dept-chart-view>
|
||||
<dept-chart-view id="apply" title="部门申请" :dataList="applyData"></dept-chart-view>
|
||||
<dept-chart-view id="demand" title="部门需求" :dataList="requireData"></dept-chart-view>
|
||||
<dept-chart-view id="shelves" title="部门上架" v-loading="loadingResource" :dataList="resourceData">
|
||||
</dept-chart-view>
|
||||
<dept-chart-view id="apply" title="部门申请" v-loading="loadingApply" :dataList="applyData">
|
||||
</dept-chart-view>
|
||||
<dept-chart-view id="demand" title="部门需求" v-loading="loadingRequire" :dataList="requireData">
|
||||
</dept-chart-view>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 中 -->
|
||||
|
|
@ -67,6 +71,11 @@ export default {
|
|||
applyData: [],
|
||||
// 上架
|
||||
requireData: [],
|
||||
loadingToDo: false,
|
||||
loadingHasToDo: false,
|
||||
loadingResource: false,
|
||||
loadingApply: false,
|
||||
loadingRequire: false,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
|
@ -84,11 +93,13 @@ export default {
|
|||
methods: {
|
||||
// 待办
|
||||
getToDo() {
|
||||
this.loadingToDo = true;
|
||||
let data = {
|
||||
limit: 5,
|
||||
page: 1,
|
||||
}
|
||||
Apis.getToDoTask(data, res => {
|
||||
this.loadingToDo = false;
|
||||
if (res.data.code !== 0) {
|
||||
return this.$message.error(res.data.msg)
|
||||
}
|
||||
|
|
@ -96,7 +107,8 @@ export default {
|
|||
this.toToData.list = res.data.data.records || []
|
||||
this.toToData.num = res.data.data.records.length || 0
|
||||
}, err => {
|
||||
this.$message.error(err)
|
||||
this.$message.error(err);
|
||||
this.loadingToDo = false;
|
||||
})
|
||||
},
|
||||
// 已办
|
||||
|
|
@ -105,7 +117,9 @@ export default {
|
|||
limit: 5,
|
||||
page: 1,
|
||||
}
|
||||
this.loadingHasToDo = true;
|
||||
Apis.getHasToDoTask(data, res => {
|
||||
this.loadingHasToDo = false;
|
||||
if (res.data.code !== 0) {
|
||||
return this.$message.error(res.data.msg)
|
||||
}
|
||||
|
|
@ -114,12 +128,15 @@ export default {
|
|||
this.hasToDodoData.num = res.data.data.records.length || 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)
|
||||
}
|
||||
|
|
@ -127,11 +144,14 @@ export default {
|
|||
this.resourceData = this.formatList(res.data.data.total || [])
|
||||
}, 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)
|
||||
}
|
||||
|
|
@ -139,6 +159,7 @@ export default {
|
|||
this.applyData = this.formatList(res.data.data.total || [])
|
||||
}, err => {
|
||||
this.$message.error(err)
|
||||
this.loadingApply = false;
|
||||
})
|
||||
},
|
||||
formatList(list = [], nameStr = 'type') {
|
||||
|
|
@ -153,14 +174,18 @@ export default {
|
|||
},
|
||||
// 部门需求
|
||||
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')
|
||||
|
||||
}, err => {
|
||||
this.$message.error(err)
|
||||
this.loadingRequire = false;
|
||||
})
|
||||
},
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue