fix: 云资源大屏调整
parent
806c0edd22
commit
ed3a9ffe97
|
@ -1,7 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<bar-reverse-chart v-bind="$attrs"
|
<bar-reverse-chart v-bind="$attrs" :setting="configs"></bar-reverse-chart>
|
||||||
:setting="configs"
|
|
||||||
></bar-reverse-chart>
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import charts from 'cmp-echarts'
|
import charts from 'cmp-echarts'
|
||||||
|
@ -12,7 +10,7 @@ const configs = {
|
||||||
show: true,
|
show: true,
|
||||||
formatter: '{b}',
|
formatter: '{b}',
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
position: [10, -20]
|
position: [10, -15]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
|
|
|
@ -23,7 +23,12 @@ export const overviewConfigs = [{
|
||||||
icon: 'el-icon-monitor',
|
icon: 'el-icon-monitor',
|
||||||
type: 'COUNT',
|
type: 'COUNT',
|
||||||
data: [{
|
data: [{
|
||||||
title: '私有云',
|
title: '数据中心',
|
||||||
|
className: 'purple',
|
||||||
|
unit: '个',
|
||||||
|
value: 0
|
||||||
|
}, {
|
||||||
|
title: '区域',
|
||||||
className: 'lgreen',
|
className: 'lgreen',
|
||||||
unit: '个',
|
unit: '个',
|
||||||
value: 0
|
value: 0
|
||||||
|
|
|
@ -31,7 +31,7 @@
|
||||||
<div class="card h-300">
|
<div class="card h-300">
|
||||||
<div class="card-title">告警统计</div>
|
<div class="card-title">告警统计</div>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<pie-charts :data="alarmCount" width="100%" height="240px" unit="" :configs="{color: ['#EC1C24', '#FF7F27', '#FFF200', '#4EAFF5']}"></pie-charts>
|
<pie-charts :data="alarmCount" width="100%" height="240px" unit="" :configs="{ color: ['#EC1C24', '#FF7F27', '#FFF200', '#4EAFF5'] }"></pie-charts>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
@ -75,18 +75,7 @@ import OverviewState from 'components/OverviewState'
|
||||||
import PlatformCard from './PlatformCard'
|
import PlatformCard from './PlatformCard'
|
||||||
import ResourceCount from '../count_screen/ResourceCount'
|
import ResourceCount from '../count_screen/ResourceCount'
|
||||||
import { overviewConfigs } from './data'
|
import { overviewConfigs } from './data'
|
||||||
import {
|
import { getOverview, getPlatformOverview, getUsed, getPlatforms, getAlarmPieChart, getResourceApply, getResourceTrend, getResTops, getHostStatus, getResourceCount } from 'services/screen/resource'
|
||||||
getOverview,
|
|
||||||
getPlatformOverview,
|
|
||||||
getUsed,
|
|
||||||
getPlatforms,
|
|
||||||
getAlarmPieChart,
|
|
||||||
getResourceApply,
|
|
||||||
getResourceTrend,
|
|
||||||
getResTops,
|
|
||||||
getHostStatus,
|
|
||||||
getResourceCount
|
|
||||||
} from 'services/screen/resource'
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
ScreenWrapper,
|
ScreenWrapper,
|
||||||
|
@ -124,9 +113,9 @@ export default {
|
||||||
const res = await getPlatformOverview()
|
const res = await getPlatformOverview()
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
// 处理数据对configs赋值
|
// 处理数据对configs赋值
|
||||||
const { pubNum, priNum } = res.data
|
const { dcsNum, pubNum, priNum } = res.data
|
||||||
const unit = state.overviewConfigs[1]
|
const unit = state.overviewConfigs[1]
|
||||||
;[priNum, pubNum].forEach((item, index) => {
|
;[dcsNum, priNum, pubNum].forEach((item, index) => {
|
||||||
unit.data[index].value = item
|
unit.data[index].value = item
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@ -136,14 +125,7 @@ export default {
|
||||||
const res = await getUsed()
|
const res = await getUsed()
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
// 处理数据对configs赋值
|
// 处理数据对configs赋值
|
||||||
const {
|
const { menUnused, memTotal, cpuUnused, cpuTotal, diskTotal, diskUnused } = res.data
|
||||||
menUnused,
|
|
||||||
memTotal,
|
|
||||||
cpuUnused,
|
|
||||||
cpuTotal,
|
|
||||||
diskTotal,
|
|
||||||
diskUnused
|
|
||||||
} = res.data
|
|
||||||
const unit = state.overviewConfigs[2]
|
const unit = state.overviewConfigs[2]
|
||||||
;[
|
;[
|
||||||
{ used: cpuUnused, total: cpuTotal },
|
{ used: cpuUnused, total: cpuTotal },
|
||||||
|
@ -237,27 +219,14 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// 切换平台
|
// 切换平台
|
||||||
const change = async (type) => {
|
const change = async type => {
|
||||||
state.vendorType = type
|
state.vendorType = type
|
||||||
const proArr = [
|
const proArr = [getApplyCount(), getUsedCount(), getCpuTop5(), getMemTop5(), getHostCount(), getResource()]
|
||||||
getApplyCount(),
|
|
||||||
getUsedCount(),
|
|
||||||
getCpuTop5(),
|
|
||||||
getMemTop5(),
|
|
||||||
getHostCount(),
|
|
||||||
getResource()
|
|
||||||
]
|
|
||||||
await Promise.all(proArr)
|
await Promise.all(proArr)
|
||||||
}
|
}
|
||||||
const init = async () => {
|
const init = async () => {
|
||||||
try {
|
try {
|
||||||
await Promise.all([
|
await Promise.all([getOverviewState(), getUsedState(), getPlatformState(), getAlarmCount(), change()])
|
||||||
getOverviewState(),
|
|
||||||
getUsedState(),
|
|
||||||
getPlatformState(),
|
|
||||||
getAlarmCount(),
|
|
||||||
change()
|
|
||||||
])
|
|
||||||
} catch (error) {}
|
} catch (error) {}
|
||||||
state.loading = false
|
state.loading = false
|
||||||
}
|
}
|
||||||
|
@ -296,7 +265,7 @@ export default {
|
||||||
height: calc(100% - 30px);
|
height: calc(100% - 30px);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.resource-count ::v-deep .cell{
|
.resource-count ::v-deep .cell {
|
||||||
height: 85px;
|
height: 85px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue