NEZ-645 feat: overview右下图更改

This commit is contained in:
chenjinsong
2021-05-20 17:21:38 +08:00
parent 28c3a7d951
commit 04bc60df2b
3 changed files with 9 additions and 8 deletions

View File

@@ -433,6 +433,7 @@ const en = {
asset: { asset: {
title: 'Asset', title: 'Asset',
assetType: 'Asset type', assetType: 'Asset type',
assetState: 'Asset state',
modelStat: 'Model', modelStat: 'Model',
dcStat: 'Data center', dcStat: 'Data center',
num: 'Num', num: 'Num',

View File

@@ -111,7 +111,7 @@ export default {
const type = legendData.find(item => { const type = legendData.find(item => {
return item[0] == name return item[0] == name
}) })
return type ? `${name} (${type[1]}%)` : null return type ? `${name} (${type[1]})` : null
} }
this.$set(this.option, 'legend', legend) this.$set(this.option, 'legend', legend)
} }

View File

@@ -137,10 +137,10 @@
<!--第一个图--> <!--第一个图-->
<div class="content-col-box"> <div class="content-col-box">
<div class="content-col-title"> <div class="content-col-title">
<span>{{$t("dashboard.overview.asset.assetType")}}</span> <span>{{$t("dashboard.overview.asset.assetState")}}</span>
</div> </div>
<div class="content-col-content"> <div class="content-col-content">
<chart-box ref="assetTypePie" :show-toolbox="false" :tooltip-formatter="assetTypeFormatter" chart-type="pie" name="assetTypePie" @is-loading="(isLoading)=>{this.assetTypeLoading = isLoading}"></chart-box> <chart-box ref="assetTypePie" :show-toolbox="false" :tooltip-formatter="assetStateFormatter" chart-type="pie" name="assetTypePie" @is-loading="(isLoading)=>{this.assetTypeLoading = isLoading}"></chart-box>
<div v-if="!assetTypeLoading && (!assetTypeData || assetTypeData.length === 0)" class="chart-no-data">No Data</div> <div v-if="!assetTypeLoading && (!assetTypeData || assetTypeData.length === 0)" class="chart-no-data">No Data</div>
</div> </div>
</div> </div>
@@ -461,7 +461,7 @@ export default {
queryAssetTypeData () { queryAssetTypeData () {
return new Promise(resolve => { return new Promise(resolve => {
this.assetTypeLoading = true this.assetTypeLoading = true
this.$get('stat/asset/type').then(response => { this.$get('stat/asset/state').then(response => {
this.assetTypeLoading = false this.assetTypeLoading = false
if (response.code === 200) { if (response.code === 200) {
this.assetTypeData = response.data.list this.assetTypeData = response.data.list
@@ -470,15 +470,15 @@ export default {
const typeSeriesData = [] const typeSeriesData = []
const vm = this const vm = this
const assetTotalCount = (function () { /* const assetTotalCount = (function () {
let count = 0 let count = 0
vm.assetTypeData.forEach(item => { vm.assetTypeData.forEach(item => {
count += item.num count += item.num
}) })
return count return count
}()) }()) */
this.assetTypeData.forEach(item => { this.assetTypeData.forEach(item => {
legendData.push([item.name, (item.num * 100 / assetTotalCount).toFixed(2)]) legendData.push([item.name, item.num])
typeSeriesData.push({ name: item.name, value: item.num }) typeSeriesData.push({ name: item.name, value: item.num })
}) })
const series = [{ const series = [{
@@ -1045,7 +1045,7 @@ export default {
simpleFormatter (params) { simpleFormatter (params) {
return `<div class="tooltip" style="min-width: unset;">${params.value}</div>` return `<div class="tooltip" style="min-width: unset;">${params.value}</div>`
}, },
assetTypeFormatter (params) { assetStateFormatter (params) {
return `<div class="tooltip" style="min-width: unset;">${params.name}:&nbsp;${params.value}</div>` return `<div class="tooltip" style="min-width: unset;">${params.name}:&nbsp;${params.value}</div>`
}, },
switchFullScreen () { switchFullScreen () {