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 | 46 +++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 45 insertions(+), 1 deletions(-) diff --git a/src/views/fysp/support/JingAnSupport.vue b/src/views/fysp/support/JingAnSupport.vue index 60016aa..b3305ee 100644 --- a/src/views/fysp/support/JingAnSupport.vue +++ b/src/views/fysp/support/JingAnSupport.vue @@ -1,5 +1,5 @@ <template> - <el-tabs type="border-card"> + <el-tabs ref="tabsRef"> <el-tab-pane label="闈欏畨澶滈棿鏂藉伐绠$悊"> <JingAnNightConstruction></JingAnNightConstruction> </el-tab-pane> @@ -12,8 +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