|
@@ -1,7 +1,7 @@
|
|
|
<!-- 人员管理页面 -->
|
|
<!-- 人员管理页面 -->
|
|
|
<template>
|
|
<template>
|
|
|
<div class="resource">
|
|
<div class="resource">
|
|
|
- <div class="zy-head-search">
|
|
|
|
|
|
|
+ <div class="zy-head-search" id="headerSearch">
|
|
|
<span>人员姓名</span>
|
|
<span>人员姓名</span>
|
|
|
<el-input
|
|
<el-input
|
|
|
v-model="search.empName"
|
|
v-model="search.empName"
|
|
@@ -76,6 +76,7 @@
|
|
|
highlight-current-row
|
|
highlight-current-row
|
|
|
@selection-change="handleSelectionChange"
|
|
@selection-change="handleSelectionChange"
|
|
|
:data="table.list"
|
|
:data="table.list"
|
|
|
|
|
+ :height="height_top"
|
|
|
:icore-filter-flag="icoreFilterFlag"
|
|
:icore-filter-flag="icoreFilterFlag"
|
|
|
:header-cell-style="tableHeaderCellStyle"
|
|
:header-cell-style="tableHeaderCellStyle"
|
|
|
@row-click="getAllListByEmpNo"
|
|
@row-click="getAllListByEmpNo"
|
|
@@ -2064,6 +2065,11 @@ export default {
|
|
|
components: { alertComponents, alertComponents2, alertComponents3, alertComponents4, alertComponents5, alertComponents6, alertComponents7 },
|
|
components: { alertComponents, alertComponents2, alertComponents3, alertComponents4, alertComponents5, alertComponents6, alertComponents7 },
|
|
|
data () {
|
|
data () {
|
|
|
return {
|
|
return {
|
|
|
|
|
+ headerHeight: 0, // 搜索栏高度
|
|
|
|
|
+ titleHeight: 0, // 标题栏高度
|
|
|
|
|
+ footerHeight: 0, // 分页栏高度
|
|
|
|
|
+ minTableHeight: 250, // 表格最小高度阈值
|
|
|
|
|
+ resizeObserver: null, // 窗口监听对象
|
|
|
text: '',
|
|
text: '',
|
|
|
table: {
|
|
table: {
|
|
|
list: [],
|
|
list: [],
|
|
@@ -2155,27 +2161,60 @@ export default {
|
|
|
imgVisible: false
|
|
imgVisible: false
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
- created () {
|
|
|
|
|
- this.height_top = window.innerHeight / 2 - 130 < 250 ? 250 : window.innerHeight / 2 - 110;
|
|
|
|
|
- this.height_bot = window.innerHeight / 2 - 130 < 250 ? 250 : window.innerHeight / 2 - 110;
|
|
|
|
|
|
|
+ // created () {
|
|
|
|
|
+ // this.height_top = window.innerHeight / 2 - 130 < 250 ? 250 : window.innerHeight / 2 - 110;
|
|
|
|
|
+ // this.height_bot = window.innerHeight / 2 - 130 < 250 ? 250 : window.innerHeight / 2 - 110;
|
|
|
|
|
+ // },
|
|
|
|
|
+ // mounted () {
|
|
|
|
|
+ // this.getDataList();
|
|
|
|
|
+ // },
|
|
|
|
|
+ beforeDestroy() {
|
|
|
|
|
+ window.removeEventListener('resize', this.calcTableHeight);
|
|
|
|
|
+ if (this.resizeObserver) {
|
|
|
|
|
+ this.resizeObserver.disconnect();
|
|
|
|
|
+ this.resizeObserver = null;
|
|
|
|
|
+ }
|
|
|
},
|
|
},
|
|
|
- mounted () {
|
|
|
|
|
|
|
+ mounted() {
|
|
|
this.getDataList();
|
|
this.getDataList();
|
|
|
- // this.getDataList2();
|
|
|
|
|
- // this.getDataList3();
|
|
|
|
|
- // this.getDataList4();
|
|
|
|
|
- // this.getDataList5();
|
|
|
|
|
- // this.getDataList6();
|
|
|
|
|
- // this.getDataList7();
|
|
|
|
|
- // this.addScreen();
|
|
|
|
|
- // this.addScreen2();
|
|
|
|
|
- // this.addScreen3();
|
|
|
|
|
- // this.addScreen4();
|
|
|
|
|
- // this.addScreen5();
|
|
|
|
|
- // this.addScreen6();
|
|
|
|
|
- // this.addScreen7();
|
|
|
|
|
|
|
+ this.calcTableHeight();
|
|
|
|
|
+ window.addEventListener('resize', this.calcTableHeight);
|
|
|
|
|
+ this.resizeObserver = new ResizeObserver(() => {
|
|
|
|
|
+ this.calcTableHeight();
|
|
|
|
|
+ });
|
|
|
|
|
+ const headerEl = document.getElementById('headerSearch');
|
|
|
|
|
+ const titleEl = document.querySelector('.zy-title-div');
|
|
|
|
|
+ const footerEl = document.querySelector('.zy-foot-page');
|
|
|
|
|
+ if (headerEl) this.resizeObserver.observe(headerEl);
|
|
|
|
|
+ if (titleEl) this.resizeObserver.observe(titleEl);
|
|
|
|
|
+ if (footerEl) this.resizeObserver.observe(footerEl);
|
|
|
},
|
|
},
|
|
|
methods: {
|
|
methods: {
|
|
|
|
|
+ calcTableHeight() {
|
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
|
+ const headerEl = document.getElementById('headerSearch');
|
|
|
|
|
+ const titleEl = document.querySelector('.zy-title-div');
|
|
|
|
|
+ const footerEl = document.querySelector('.zy-foot-page');
|
|
|
|
|
+
|
|
|
|
|
+ this.headerHeight = headerEl ? headerEl.offsetHeight : 0;
|
|
|
|
|
+ this.titleHeight = titleEl ? titleEl.offsetHeight : 0;
|
|
|
|
|
+ this.footerHeight = footerEl ? footerEl.offsetHeight : 0;
|
|
|
|
|
+
|
|
|
|
|
+ const totalReserveHeight = this.headerHeight + this.titleHeight + this.footerHeight + 20; // 20为额外边距(可调整)
|
|
|
|
|
+
|
|
|
|
|
+ const calcHeight = window.innerHeight / 2 - totalReserveHeight;
|
|
|
|
|
+ this.height_top = calcHeight < this.minTableHeight ? this.minTableHeight : calcHeight;
|
|
|
|
|
+ this.height_bot = this.height_top;
|
|
|
|
|
+
|
|
|
|
|
+ this.$refs.dataTable.doLayout();
|
|
|
|
|
+ this.$refs.dataTable2.doLayout();
|
|
|
|
|
+ this.$refs.dataTable3.doLayout();
|
|
|
|
|
+ this.$refs.dataTable4.doLayout();
|
|
|
|
|
+ this.$refs.dataTable5.doLayout();
|
|
|
|
|
+ this.$refs.dataTable6.doLayout();
|
|
|
|
|
+ this.$refs.dataTable7.doLayout();
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
getSummaries (param) {
|
|
getSummaries (param) {
|
|
|
const { columns, data } = param;
|
|
const { columns, data } = param;
|
|
|
const sums = [];
|
|
const sums = [];
|