From c40e3de17653a10a06ead765813783a5614a32ce Mon Sep 17 00:00:00 2001
From: 王旭 <1377869194@qq.com>
Date: 星期四, 16 二月 2023 17:40:43 +0800
Subject: [PATCH] 调整运维管理部分页面格式
---
src/views/maintenance/eventlogManage.vue | 67 +++++++++++++++++++++++----------
1 files changed, 46 insertions(+), 21 deletions(-)
diff --git a/src/views/maintenance/eventlogManage.vue b/src/views/maintenance/eventlogManage.vue
index 3c05fb8..d1f71e0 100644
--- a/src/views/maintenance/eventlogManage.vue
+++ b/src/views/maintenance/eventlogManage.vue
@@ -5,13 +5,15 @@
`${$t('operatManage.ResourceLog')}`,
]"></My-bread>
<el-divider />
- <div class="inquire subpage_Div">
+ <div class="inquire subpage_Div" ref="container">
<el-form
:inline="true"
ref="sizeForm"
:model="sizeForm"
>
- <el-form-item
+ <div class="flex_box">
+ <div style="margin-right: auto">
+ <el-form-item
prop="uname"
:label="$t('operatManage.operationLogObj.username')"
>
@@ -85,8 +87,9 @@
>
</el-date-picker>
</el-form-item>
-
- <el-form-item style="float: right">
+ </div>
+ <div>
+ <el-form-item>
<el-button
@click="onSubmit"
icon="el-icon-search"
@@ -100,19 +103,24 @@
size="small"
>{{ $t("operatManage.operationLogObj.empty") }}</el-button>
</el-form-item>
+ </div>
+ </div>
+
+
+
</el-form>
</div>
- <div class="table_box subpage_Div">
+ <div class="table_box subpage_Div" :style="styleVar">
<el-table
:data="tableData"
style="width: 100%"
- height="84%"
+ height="calc(100% - 57px)"
>
<el-table-column
align="center"
type="index"
:label="$t('operatManage.ELM.index')"
- width="70px"
+ height="calc(100% - 57px)"
/>
<el-table-column
align="center"
@@ -144,7 +152,7 @@
/>
</el-table>
<div
- style="margin-top: 10px"
+
class="pagination_box"
>
<el-pagination
@@ -186,9 +194,27 @@
pageSize: 10,
},
count: 0,
+ tableHeight: 0,
+ timer: 0,
+ styleVar: {
+ "height": "calc(100% - 109px)",
+ },
};
},
methods: {
+ onResize() {
+ this.timer && clearTimeout(this.timer);
+ this.timer = setTimeout(() => {
+ this.calHeight();
+ }, 500);
+ },
+ calHeight() {
+ this.$nextTick(() => {
+ const rect = this.$refs.container.getBoundingClientRect();
+ this.tableHeight = `${rect.height + 97}px`;
+ this.styleVar["height"] = `calc(100% - ${rect.height + 97}px)`;
+ });
+ },
//鏍煎紡鍖栨椂闂�
add0(m) {
return m < 10 ? "0" + m : m;
@@ -276,6 +302,14 @@
this.count = data.count;
},
},
+ beforeDestroy() {
+ this.timer && clearTimeout(this.timer);
+ window.removeEventListener("resize", this.onResize);
+ },
+ mounted() {
+ window.addEventListener("resize", this.onResize);
+ this.calHeight()
+ },
created() {
this.getList();
},
@@ -293,27 +327,18 @@
}
.inquire {
- padding: 10px;
+ padding: 8px;
margin-top: 20px;
border-radius: 5px;
-
+
margin-bottom: 20px;
.el-form-item {
- margin: 7px;
+ margin: 5px;
}
}
- .table_box {
- overflow: auto;
- padding: 10px;
- border-radius: 5px;
-
- height: 57%;
- /*淇敼table 琛ㄤ綋鐨勮儗鏅鑹插拰鏂囧瓧棰滆壊*/
-
-
- }
+
.text-center {
text-align: center;
}
--
Gitblit v1.9.3