From 58c0f11fe2f23a1be2dec768f9ac02107301a634 Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期五, 19 九月 2025 17:30:36 +0800 Subject: [PATCH] 2025.9.19 数据产品(待完成) --- src/views/fysp/support/JingAnSupport.vue | 52 ++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 50 insertions(+), 2 deletions(-) diff --git a/src/views/fysp/support/JingAnSupport.vue b/src/views/fysp/support/JingAnSupport.vue index 1a0cc17..b3305ee 100644 --- a/src/views/fysp/support/JingAnSupport.vue +++ b/src/views/fysp/support/JingAnSupport.vue @@ -1,6 +1,9 @@ <template> - <el-tabs type="border-card"> - <el-tab-pane label="鏂拌澶�"> + <el-tabs ref="tabsRef"> + <el-tab-pane label="闈欏畨澶滈棿鏂藉伐绠$悊"> + <JingAnNightConstruction></JingAnNightConstruction> + </el-tab-pane> + <el-tab-pane label="闈欏畨宸ュ湴鎵皹璁惧淇℃伅鍖归厤"> <NewDevice></NewDevice> </el-tab-pane> <el-tab-pane label="鏂板伐鍦�"> @@ -9,7 +12,52 @@ </el-tabs> </template> <script setup> +import { ref, onMounted, provide, computed } from 'vue'; import NewDevice from './NewDevice.vue'; import NewConstruction from './NewConstruction.vue'; +import JingAnNightConstruction from './JingAnNightConstruction.vue'; + +// 瀹氫箟 tabs ref +const tabsRef = ref(null); +const tabsHeaderHeight = ref(0); + +onMounted(() => { + // 纭繚 DOM 宸茬粡娓叉煋瀹屾垚 + setTimeout(() => { + tabsHeaderHeight.value = getTabsHeaderHeight(); + }, 0); +}); + +function getTabsHeaderHeight() { + if (tabsRef.value) { + // 鑾峰彇 el-tabs 缁勪欢鐨� DOM 鍏冪礌 + const tabsElement = tabsRef.value.$el; + + // Element UI 鐨� el-tabs header 閫氬父鏈� .el-tabs__header 绫诲悕 + const headerElement = tabsElement.querySelector('.el-tabs__header'); + + if (headerElement) { + // 鑾峰彇 header 鐨� offsetHeight锛堝寘鍚� padding 鍜� border锛屼笉鍖呭惈 margin锛� + const offsetHeight = headerElement.offsetHeight; + + // 鑾峰彇璁$畻鏍峰紡浠ヨ幏鍙� margin 鍊� + const computedStyle = window.getComputedStyle(headerElement); + + // 瑙f瀽 margin 鍊硷紙涓婁笅宸﹀彸锛� + const marginTop = parseFloat(computedStyle.marginTop || 0); + const marginBottom = parseFloat(computedStyle.marginBottom || 0); + // const marginLeft = parseFloat(computedStyle.marginLeft || 0); + // const marginRight = parseFloat(computedStyle.marginRight || 0); + + // 璁$畻鎬婚珮搴︼紙鍖呭惈鎵�鏈� padding銆乥order 鍜� margin锛� + const totalHeightWithMargin = offsetHeight + marginTop + marginBottom; + + return totalHeightWithMargin; + } + } + return 0; +} + +provide('tabsHeaderHeight', computed(() => tabsHeaderHeight.value)); </script> <style scoped></style> -- Gitblit v1.9.3