|
|
@@ -197,6 +197,7 @@
|
|
|
:data="roomList"
|
|
|
row-key="id"
|
|
|
border
|
|
|
+ :height="tableMaxHeight"
|
|
|
:expand-row-keys="expandedRowKeys"
|
|
|
@expand-change="handleExpandChange"
|
|
|
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
|
|
@@ -358,7 +359,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup name="DormRoomTreeManagement" lang="ts">
|
|
|
-import { ref, computed, reactive, onMounted, nextTick, watch, getCurrentInstance } from 'vue';
|
|
|
+import { ref, computed, reactive, onMounted, onUnmounted, nextTick, watch, getCurrentInstance } from 'vue';
|
|
|
import { InfoFilled, House, Avatar, UserFilled } from '@element-plus/icons-vue';
|
|
|
import type { DormBuildingTreeVO } from '@/api/xg/xgss/dormBedStudent/dormBedStudent/types';
|
|
|
import type { DormTreeNode, BedInfo } from '@/api/xg/xgss/xsssfjgl/types';
|
|
|
@@ -389,6 +390,9 @@ const showSearch = ref(true);
|
|
|
const loading = ref(false);
|
|
|
const expandedRowKeys = ref<string[]>([]);
|
|
|
|
|
|
+// 窗口高度响应式变量
|
|
|
+const windowHeight = ref(window.innerHeight);
|
|
|
+
|
|
|
// 加载状态:展开/收起/选择
|
|
|
const expandAllLoading = ref(false);
|
|
|
const collapseAllLoading = ref(false);
|
|
|
@@ -468,6 +472,30 @@ const studentTreeRef = ref();
|
|
|
const studentSearchKey = ref('');
|
|
|
const studentTreeData = ref<XgStudentTreeVO[]>([]);
|
|
|
|
|
|
+// 表格最大高度计算
|
|
|
+const tableMaxHeight = computed(() => {
|
|
|
+ // 根据不同屏幕尺寸动态调整预留空间
|
|
|
+ let reservedHeight = 280; // 基础预留高度
|
|
|
+
|
|
|
+ if (windowHeight.value < 768) {
|
|
|
+ // 小屏幕(手机/平板)- 预留更多空间
|
|
|
+ reservedHeight = 320;
|
|
|
+ } else if (windowHeight.value < 1024) {
|
|
|
+ // 中等屏幕
|
|
|
+ reservedHeight = 300;
|
|
|
+ } else {
|
|
|
+ // 大屏幕 - 预留较少空间,充分利用屏幕
|
|
|
+ reservedHeight = 260;
|
|
|
+ }
|
|
|
+
|
|
|
+ return Math.max(400, windowHeight.value - reservedHeight);
|
|
|
+});
|
|
|
+
|
|
|
+// 处理窗口大小变化
|
|
|
+const handleResize = () => {
|
|
|
+ windowHeight.value = window.innerHeight;
|
|
|
+};
|
|
|
+
|
|
|
/** 通过条件过滤节点 */
|
|
|
const filterNode = (value: string, data: DormTreeNode) => {
|
|
|
if (!value) return true;
|
|
|
@@ -1163,6 +1191,14 @@ onMounted(() => {
|
|
|
currentController.abort();
|
|
|
currentController = null;
|
|
|
}
|
|
|
+
|
|
|
+ // 添加窗口大小变化监听器
|
|
|
+ window.addEventListener('resize', handleResize);
|
|
|
+});
|
|
|
+
|
|
|
+// 组件卸载时移除事件监听器
|
|
|
+onUnmounted(() => {
|
|
|
+ window.removeEventListener('resize', handleResize);
|
|
|
});
|
|
|
</script>
|
|
|
|