281 lines
7.7 KiB
Vue
281 lines
7.7 KiB
Vue
<template>
|
|
<div class="dashboard-editor-container">
|
|
<el-row :gutter="20">
|
|
<el-col :span="18">
|
|
<panel-group :chart-data="hidCount" />
|
|
<el-row style="background:#fff;padding:16px 16px 0;margin-bottom:15px;">
|
|
<line-qingdan-chart :chart-data="qingdanChartData" />
|
|
</el-row>
|
|
|
|
<el-row :gutter="15">
|
|
<el-col :xs="24" :sm="24" :lg="10">
|
|
<div class="chart-wrapper">
|
|
<pie-yhlx-chart :chart-data="hiddenTypeMap" />
|
|
</div>
|
|
</el-col>
|
|
<el-col :xs="24" :sm="24" :lg="14">
|
|
<div class="chart-wrapper">
|
|
<div class="chart-search" style="position: absolute;right: 20px">
|
|
<el-date-picker v-model="jinduData" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" format="yyyy-MM-dd" class="filter-item" />
|
|
<el-button class="filter-item" type="primary" icon="el-icon-search" @click="getJindu">
|
|
搜索
|
|
</el-button>
|
|
</div>
|
|
|
|
<bar-jindu-chart :chart-data="jinduChartData" style="margin-top: 35px" />
|
|
</div>
|
|
</el-col>
|
|
</el-row>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<work-group />
|
|
</el-col>
|
|
</el-row>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import PanelGroup from './components/PanelGroup'
|
|
import LineChart from './components/LineChart'
|
|
import RaddarChart from './components/RaddarChart'
|
|
import PieChart from './components/PieChart'
|
|
import TodoList from './components/TodoList'
|
|
import WorkGroup from './components/WorkGroup'
|
|
|
|
const lineChartData = {
|
|
newVisitis: {
|
|
expectedData: [100, 120, 161, 134, 105, 160, 165],
|
|
actualData: [120, 82, 91, 154, 162, 140, 145]
|
|
},
|
|
messages: {
|
|
expectedData: [200, 192, 120, 144, 160, 130, 140],
|
|
actualData: [180, 160, 151, 106, 145, 150, 130]
|
|
},
|
|
purchases: {
|
|
expectedData: [80, 100, 121, 104, 105, 90, 100],
|
|
actualData: [120, 90, 100, 138, 142, 130, 130]
|
|
},
|
|
shoppings: {
|
|
expectedData: [130, 140, 141, 142, 145, 150, 160],
|
|
actualData: [120, 82, 91, 154, 162, 140, 130]
|
|
}
|
|
}
|
|
import { requestFN } from '@/utils/request'
|
|
import BarJinduChart from './components/BarJinduChart'
|
|
import LineQingdanChart from './components/LineQingdanChart'
|
|
import PieYhlxChart from './components/PieYhlxChart'
|
|
|
|
export default {
|
|
name: 'DashboardAdmin',
|
|
components: {
|
|
PieYhlxChart,
|
|
PanelGroup,
|
|
LineChart,
|
|
RaddarChart,
|
|
PieChart,
|
|
TodoList,
|
|
WorkGroup,
|
|
BarJinduChart,
|
|
LineQingdanChart
|
|
},
|
|
data() {
|
|
return {
|
|
lineChartData: lineChartData.newVisitis,
|
|
hidCount: {
|
|
dzg: 0,
|
|
ycq: 0,
|
|
yys: 0
|
|
},
|
|
riskCount: {
|
|
|
|
unitcount: 0,
|
|
idcount: 0,
|
|
cnzfx: 0
|
|
},
|
|
jinduList: [],
|
|
jinduData: ['0', '0'],
|
|
jinduChartData: {
|
|
x_Data: [],
|
|
y_Data: [],
|
|
sum_Data: []
|
|
},
|
|
qingdanChartData: {
|
|
valName: [],
|
|
xcqd: [],
|
|
jcqd: [],
|
|
zhqd: []
|
|
},
|
|
hiddenTypeMap: {
|
|
data: []
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
var date = new Date()
|
|
var nowYear = date.getFullYear()
|
|
this.jinduData[0] = nowYear + '-01-01'
|
|
this.jinduData[1] = nowYear + '-12-31'
|
|
this.getJindu()
|
|
this.getQingdan()
|
|
this.getWorkNumber()
|
|
this.getRiskNumber()
|
|
this.getHiddenTypeCount()/*
|
|
this.getNoticeList()
|
|
this.getNoticeCorpList()*/
|
|
},
|
|
methods: {
|
|
handleSetLineChartData(type) {
|
|
this.lineChartData = lineChartData[type]
|
|
},
|
|
// 工作进度
|
|
getJindu() {
|
|
this.loading = true
|
|
requestFN(
|
|
'/checkrecord/goIndexCount',
|
|
{
|
|
STARTTIME: this.jinduData[0],
|
|
ENDTIME: this.jinduData[1],
|
|
tm: new Date().getTime()
|
|
}
|
|
).then((data) => {
|
|
if (data.result == 'success') {
|
|
for (var i = 0; i < data.varList.length; i++) {
|
|
this.$set(this.jinduChartData.x_Data, i, data.varList[i].percentage)
|
|
this.$set(this.jinduChartData.y_Data, i, data.varList[i].name)
|
|
this.$set(this.jinduChartData.sum_Data, i, data.varList[i].denominator)
|
|
}
|
|
} else if (data.result == 'exception') {
|
|
// showException('系统首页', '数据异常')// 显示异常
|
|
}
|
|
}).catch((e) => {
|
|
this.listLoading = false
|
|
})
|
|
},
|
|
getQingdan() {
|
|
this.loading = true
|
|
requestFN(
|
|
'/listmanager/goIndexCount',
|
|
{
|
|
tm: new Date().getTime()
|
|
}
|
|
).then((data) => {
|
|
if (data.result == 'success') {
|
|
for (let i = 0; i < data.xAxisData.length; i++) {
|
|
this.qingdanChartData.xcqd[i] = 0
|
|
this.qingdanChartData.jcqd[i] = 0
|
|
this.qingdanChartData.zhqd[i] = 0
|
|
}
|
|
this.$set(this.qingdanChartData, 'valName', data.xAxisData)
|
|
for (let i = 0; i < data.xAxisData.length; i++) {
|
|
for (let j = 0; j < data.valList.length; j++) {
|
|
var type = data.valList[j].screenType
|
|
var count = data.valList[j].count
|
|
if (data.xAxisData[i] === data.valList[j].months) {
|
|
if (type == 'riskChecklistType0001') {
|
|
this.$set(this.qingdanChartData.xcqd, i, count)
|
|
} else if (type == 'riskChecklistType0002') {
|
|
this.$set(this.qingdanChartData.jcqd, i, count)
|
|
} else {
|
|
this.$set(this.qingdanChartData.zhqd, i, count)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
} else if (data.result == 'exception') {
|
|
// showException('系统首页', '数据异常')// 显示异常
|
|
}
|
|
}).catch((e) => {
|
|
this.listLoading = false
|
|
})
|
|
},
|
|
getWorkNumber() {
|
|
this.loading = true
|
|
requestFN(
|
|
'/hidden/getCountByUserId',
|
|
{
|
|
tm: new Date().getTime()
|
|
}
|
|
).then((data) => {
|
|
if (data.result == 'success') {
|
|
this.hidCount = Object.assign(data.hidCount, this.riskCount)
|
|
} else if (data.result == 'exception') {
|
|
// showException('系统首页', '数据异常')// 显示异常
|
|
}
|
|
}).catch((e) => {
|
|
this.listLoading = false
|
|
})
|
|
},
|
|
getRiskNumber() {
|
|
this.loading = true
|
|
|
|
requestFN(
|
|
'/riskpoint/statistic',
|
|
{
|
|
tm: new Date().getTime()
|
|
}
|
|
).then((data) => {
|
|
if (data.result == 'success') {
|
|
this.hidCount = Object.assign(this.hidCount, data.riskCount)
|
|
} else if (data.result == 'exception') {
|
|
// showException('系统首页', '数据异常')// 显示异常
|
|
}
|
|
}).catch((e) => {
|
|
this.listLoading = false
|
|
})
|
|
},
|
|
// 工作进度
|
|
getHiddenTypeCount() {
|
|
this.loading = true
|
|
requestFN(
|
|
'/hidden/getCountByHiddenType',
|
|
{
|
|
tm: new Date().getTime()
|
|
}
|
|
).then((data) => {
|
|
if (data.result == 'success') {
|
|
this.hiddenTypeMap.data = data.hiddenTypeCount
|
|
} else if (data.result == 'exception') {
|
|
// showException('系统首页', '数据异常')// 显示异常
|
|
}
|
|
}).catch((e) => {
|
|
this.listLoading = false
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.dashboard-editor-container {
|
|
// border: 1px solid red;
|
|
padding: 15px;
|
|
background-color: rgb(240, 242, 245);
|
|
position: relative;
|
|
height: 100%;
|
|
|
|
.github-corner {
|
|
position: absolute;
|
|
top: 0px;
|
|
border: 0;
|
|
right: 0;
|
|
}
|
|
|
|
.chart-wrapper {
|
|
background: #fff;
|
|
padding: 16px 16px 0;
|
|
margin-bottom: 0px;
|
|
.chart-search {
|
|
text-align: right;
|
|
align-items: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1024px) {
|
|
.chart-wrapper {
|
|
padding: 8px;
|
|
}
|
|
}
|
|
</style>
|