code-image-backup-public/fastbee
1
0
Fork 0
mirror of https://gitee.com/beecue/fastbee.git synced 2026-05-06 15:54:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(首页): 窗口大小改变时重新渲染图表

Browse Source
This commit is contained in:
Zhunianya
2026-03-31 14:23:27 +08:00
parent de782ec60e
commit 08aeb1593c
1 changed files with 24 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
vue/src/views/index.vue
View File

@@ -268,6 +268,11 @@ export default {
deviceCount: 0, deviceCount: 0,
// 版本号 // 版本号
version: '3.8.0', version: '3.8.0',
bMapChart: null,
pieCpuChart: null,
pieMemeryChart: null,
pieDiskChart: null,
// 服务器信息 // 服务器信息
server: { server: {
jvm: { jvm: {
@@ -302,10 +307,12 @@ export default {
}, },
mounted() { mounted() {
this.$nextTick(() => { this.$nextTick(() => {
this.draawPieCpu(); window.addEventListener('resize', this.handleResize);
window.addEventListener('resize', this.handleResize); // 监听窗口大小变化以重新渲染饼图
}); });
}, },
beforeDestroy() {
window.removeEventListener('resize', this.handleResize);
},
methods: { methods: {
init() { init() {
if (this.$store.state.user.roles.indexOf('tenant') === -1 && this.$store.state.user.roles.indexOf('general') === -1) { if (this.$store.state.user.roles.indexOf('tenant') === -1 && this.$store.state.user.roles.indexOf('general') === -1) {
@@ -372,12 +379,14 @@ export default {
if (this.bMapChart) { if (this.bMapChart) {
this.bMapChart.resize(); this.bMapChart.resize();
} }
if (this.gMapChart) {
this.gMapChart.resize();
}
if (this.pieCpuChart) { if (this.pieCpuChart) {
this.pieCpuChart.resize(); this.pieCpuChart.resize();
this.updateRadius(); }
if (this.pieMemeryChart) {
this.pieMemeryChart.resize();
}
if (this.pieDiskChart) {
this.pieDiskChart.resize();
} }
}, },
/** 查询服务器信息 */ /** 查询服务器信息 */
@@ -432,11 +441,11 @@ export default {
/** 地图 */ /** 地图 */
getmap() { getmap() {
var myChart = this.$echarts.init(this.$refs.map); this.bMapChart = this.$echarts.init(this.$refs.map);
var option; var option;
// 单击事件 // 单击事件
myChart.on('click', (params) => { this.bMapChart.on('click', (params) => {
if (params.data.deviceId) { if (params.data.deviceId) {
this.$router.push({ this.$router.push({
path: '/iot/device-edit', path: '/iot/device-edit',
@@ -699,12 +708,12 @@ export default {
], ],
}; };
option && myChart.setOption(option); option && this.bMapChart.setOption(option);
}, },
drawPieCpu() { drawPieCpu() {
// 基于准备好的dom，初始化echarts实例 // 基于准备好的dom，初始化echarts实例
let myChart = this.$echarts.init(this.$refs.pieCpu); this.pieCpuChart = this.$echarts.init(this.$refs.pieCpu);
var option; var option;
option = { option = {
title: { title: {
@@ -753,11 +762,11 @@ export default {
}, },
], ],
}; };
option && myChart.setOption(option); option && this.pieCpuChart.setOption(option);
}, },
drawPieMemery() { drawPieMemery() {
// 基于准备好的dom，初始化echarts实例 // 基于准备好的dom，初始化echarts实例
let myChart = this.$echarts.init(this.$refs.pieMemery); this.pieMemeryChart = this.$echarts.init(this.$refs.pieMemery);
var option; var option;
option = { option = {
title: { title: {
@@ -802,11 +811,11 @@ export default {
}, },
], ],
}; };
option && myChart.setOption(option); option && this.pieMemeryChart.setOption(option);
}, },
drawPieDisk() { drawPieDisk() {
// 基于准备好的dom，初始化echarts实例 // 基于准备好的dom，初始化echarts实例
let myChart = this.$echarts.init(this.$refs.pieDisk); this.pieDiskChart = this.$echarts.init(this.$refs.pieDisk);
var option; var option;
let one = this.server.sysFiles[0].used.replace('GB', ''); let one = this.server.sysFiles[0].used.replace('GB', '');
let two = this.server.sysFiles[0].free.replace('GB', ''); let two = this.server.sysFiles[0].free.replace('GB', '');
@@ -853,7 +862,7 @@ export default {
}, },
], ],
}; };
option && myChart.setOption(option); option && this.pieDiskChart.setOption(option);
}, },
}, },
}; };