挂载文件系统监控提示框添加存储使用大小字段和添加懒加载功能

1、优化table列表操作按钮点击后的效果展示
2、监控看板打开弹窗form重置功能、关闭弹窗数据闪烁问题
3、消息推送提示人手机根据推送方式的必填状态变化
4、网卡流量图表请求顺序展示
5、升级到最新a
This commit is contained in:
康冉冉
2026-01-28 18:50:58 +08:00
parent 3d5bdcd0c4
commit e19cdd4c09
8 changed files with 179 additions and 54 deletions
+50 -13
View File
@@ -44,20 +44,20 @@
</div>
<template v-if="echartDataList && Object.keys(echartDataList).length > 0">
<template v-for="(val, key, index) of echartDataList">
<div v-for="(item, chartIndex) of val.echartList" class="disInlineBlock mt10 mb10 plr-10" :style="`width: calc(100% / ${layoutModel}); height:300px;position: relative;`">
<div v-for="(item, chartIndex) of val.echartList" :ref="`scroll_${val.title}`" class="disInlineBlock mt10 mb10 plr-10" :style="`width: calc(100% / ${layoutModel}); height:300px;position: relative;`">
<!-- 图表标题 -->
<div style="width: 100%;position: absolute;top: 12px;left: 30px;z-index:999;cursor: default;">
<template v-if="val && val.serverIp">
<div class="w45 disInlineBlock" :title="`${val.toTitle}${val.titleTo}${item.title}`">
<div class="w45 disInlineBlock" :title="`${val && val.toTitle || 'toTitle'}${val && val.titleTo || 'titleTo'}${item && item.title || ''}`">
<span v-if="val && val.toTitle" class="disInlineBlock" style="vertical-align: middle;">{{val.toTitle}}</span>
<span class="disInlineBlock" style="width:25%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: middle;">{{val.titleTo}}</span>
<span class="disInlineBlock" style="width:25%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: middle;">{{val && val.titleTo || ''}}</span>
<span class="disInlineBlock" style="vertical-align: middle;">{{item && item.title}}</span>
</div>
<div class="disInlineBlock" style="vertical-align: bottom;">{{val.serverIp}}</div>
</template>
<div v-else class="w100" :title="`${val.toTitle}${val.titleTo}${item.title}`">
<div v-else class="w100" :title="`${val && val.toTitle || 'toTitle'}${val && val.titleTo || 'titleTo'}${item && item.title || ''}`">
<span v-if="val && val.toTitle" class="disInlineBlock" style="vertical-align: middle;">{{val.toTitle}}</span>
<span class="disInlineBlock" style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: middle;">{{val.titleTo}}</span>
<span class="disInlineBlock" style="max-width: calc(100% - 240px);overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: middle;">{{val.titleTo}}</span>
<span class="disInlineBlock" style="vertical-align: middle;">{{item && item.title}}</span>
</div>
</div>
@@ -124,7 +124,7 @@
this.interCardName = Object.keys(this.interCartList)[0];
this.radioTimeChange(this.timeModel);
});
} else if (this.activeName === '挂载文件系统监控') {
} else if (this.activeName === '挂载文件系统监控' || this.activeName === '硬盘设备监控') {
setTimeout(() => {
this.radioTimeChange(this.timeModel);
},500);
@@ -189,12 +189,47 @@
this.timedRefresh = null;
},
methods: {
scrollContent() {
Object.keys(this.$refs).forEach(key => {
if (key.includes('scroll_')) {
if (this.$refs[key]) {
const ref = this.$refs[key];
if (Array.isArray(ref)) {
ref.forEach(item => {
const rect = item.getBoundingClientRect();
const windowHeight = (window.innerHeight || document.documentElement.clientHeight) + (800 / Number(this.layoutModel));
if (rect.top <= windowHeight) {
let originalKey = key.split('scroll_')[1];
this.$emit('lazyLoad', {key: originalKey,currTimeList: this.currTimeList});
}
})
} else if (ref) {
const rect = ref.getBoundingClientRect();
const windowHeight = (window.innerHeight || document.documentElement.clientHeight) + (800 / Number(this.layoutModel));
if (rect.top <= windowHeight) {
let originalKey = key.split('scroll_')[1];
this.$emit('lazyLoad', {key: originalKey,currTimeList: this.currTimeList});
}
}
}
}
})
},
// 定时刷新下拉
fnTimeInter(val) {
clearInterval(this.timedRefresh);
this.timedRefresh = null;
if (val !== '0') {
this.timedRefresh = setInterval(() => {
if (this.timeModel === '6') {
this.getTimeInterval();
} else if (this.timeModel === '24') {
this.get24Time();
} else if (this.timeModel === '-1') {
this.get24Time('-1');
} else if (this.timeModel === '7') {
this.get7dayTime();
}
this.$emit('timeChangeData', {currTimeList: this.currTimeList, interCardName: this.interCardName});
}, Number(val));
}
@@ -235,13 +270,15 @@
this.$nextTick(() => {
// 遍历所有图表实例,分别调用 resize
Object.keys(this.$refs).forEach(key => {
const chartRefs = this.$refs[key];
if (Array.isArray(chartRefs)) {
chartRefs.forEach(chartRef => {
if (chartRef.resizeChart) {
chartRef.resizeChart();
}
});
if (!key.includes('scroll_')) {
const chartRefs = this.$refs[key];
if (Array.isArray(chartRefs)) {
chartRefs.forEach(chartRef => {
if (chartRef.resizeChart) {
chartRef.resizeChart();
}
});
}
}
});
});