优化显示效果

This commit is contained in:
liuwei
2025-05-28 17:45:03 +08:00
parent 8df86516c2
commit 68780964d6

View File

@@ -3,16 +3,15 @@
{% block title %}服务器监控 - 机器人管理后台{% endblock %}
{% block content %}
<!-- 接口文档 -->
<div>
<div class="iframe-page-container">
<el-row :gutter="20">
<el-col :span="24">
<el-card shadow="hover">
<el-card shadow="hover" class="iframe-card">
<div slot="header">
<span>服务器监控</span>
</div>
<div class="iframe-container">
<iframe src="http://192.168.2.170:61208/" frameborder="0" width="100%" height="800px"></iframe>
<iframe src="http://192.168.2.170:61208/" frameborder="0"></iframe>
</div>
</el-card>
</el-col>
@@ -27,27 +26,48 @@
mixins: [baseApp],
data() {
return {
// 设置当前菜单项
currentView: '14' // 使用一个新的索引,确保在菜单中能正确高亮
currentView: '14',
showTimeRangeSelector: false // 禁用时间范围选择器
}
},
mounted() {
// 页面加载时设置当前视图
this.currentView = '14';
}
});
</script>
<style>
.iframe-container {
width: 100%;
.iframe-page-container {
height: 100%;
display: flex;
flex-direction: column;
}
.iframe-card {
flex: 1;
display: flex;
flex-direction: column;
margin: 0;
height: 100%;
}
.el-card__body {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
}
.iframe-container {
flex: 1;
overflow: auto;
}
.iframe-container iframe {
border: none;
width: 100%;
min-height: 800px;
height: 100%;
display: block;
}
</style>
{% endblock %}