From c40e3de17653a10a06ead765813783a5614a32ce Mon Sep 17 00:00:00 2001
From: 王旭 <1377869194@qq.com>
Date: 星期四, 16 二月 2023 17:40:43 +0800
Subject: [PATCH] 调整运维管理部分页面格式
---
src/views/userManage/templateManage.vue | 61 +++++++++++++++++++++++++-----
1 files changed, 50 insertions(+), 11 deletions(-)
diff --git a/src/views/userManage/templateManage.vue b/src/views/userManage/templateManage.vue
index a7ea54a..f97e6be 100644
--- a/src/views/userManage/templateManage.vue
+++ b/src/views/userManage/templateManage.vue
@@ -5,20 +5,24 @@
`${$t('dataManage.templateManage')}`,
]"></My-bread>
<el-divider />
- <div class="searchComp subpage_Div">
+ <div class="searchComp subpage_Div" ref="container">
<el-form
ref="ruleForm"
:model="ruleForm"
:inline="true"
>
- <el-form-item>
+ <div class="flex_box">
+ <div style="margin-right: auto">
+ <el-form-item label="鍚嶇О">
<el-input
style="width:200px"
v-model="ruleForm.name"
- :placeholder="$t('common.pleaseInput')"
+
/>
- </el-form-item>
- <el-form-item style="float:right">
+ </el-form-item>
+ </div>
+ <div>
+ <el-form-item>
<el-button
icon="el-icon-refresh"
@click="restRefreshTable"
@@ -26,7 +30,7 @@
size="small"
>{{ $t('common.empty') }}</el-button>
</el-form-item>
- <el-form-item style="float:right">
+ <el-form-item>
<el-button
icon="el-icon-search"
@click="setRefreshTable"
@@ -34,7 +38,7 @@
size="small"
>{{ $t('common.iquery') }}</el-button>
</el-form-item>
- <el-form-item style="float:right">
+ <el-form-item>
<el-button
v-if="btnStatus.delete"
icon="el-icon-delete"
@@ -43,7 +47,7 @@
size="small"
>{{ $t('common.delete') }}</el-button>
</el-form-item>
- <el-form-item style="float:right">
+ <el-form-item>
<el-button
v-if="btnStatus.insert"
@click="setTableInsert"
@@ -52,13 +56,19 @@
size="small"
>{{ $t('common.append') }}</el-button>
</el-form-item>
+ </div>
+ </div>
+
+
+
</el-form>
</div>
- <div>
+ <div class="table_box" :style="styleVar">
<el-table
:data="tableData"
style="width: 100%"
@selection-change="handleSelectionChange"
+ height="calc(100% - 57px)"
>
<el-table-column
type="selection"
@@ -141,7 +151,7 @@
</template>
</el-table-column>
</el-table>
- <div style="margin-top:10px">
+ <div style="margin-top:25px">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
@@ -426,6 +436,11 @@
insert: false,
update: false,
},
+ tableHeight: 0,
+ timer: 0,
+ styleVar: {
+ "height": "calc(100% - 109px)",
+ },
}
},
created() {
@@ -433,7 +448,28 @@
this.showTableData();
},
+ beforeDestroy() {
+ this.timer && clearTimeout(this.timer);
+ window.removeEventListener("resize", this.onResize);
+ },
+ mounted() {
+ window.addEventListener("resize", this.onResize);
+ this.calHeight()
+ },
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)`;
+ });
+ },
//淇敼鍙栨秷
closeEditData() {
this.closeInsertData();
@@ -726,10 +762,13 @@
}
.searchComp {
- margin: 10px auto;
+ padding: 8px;
+ margin-top: 20px;
border-radius: 5px;
+ margin-bottom: 20px;
+
.el-form-item {
margin: 5px;
}
--
Gitblit v1.9.3