From c1d2051abc8ca88cd07f0d7c56c0dbf8165d5c33 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期四, 18 九月 2025 17:02:22 +0800
Subject: [PATCH] 2025.9.18 数据产品（待完成）
---
src/views/fysp/support/JingAnSupport.vue | 115 ++++++++++++++++++++++++++-------------------------------
1 files changed, 53 insertions(+), 62 deletions(-)
diff --git a/src/views/fysp/support/JingAnSupport.vue b/src/views/fysp/support/JingAnSupport.vue
index ad2c9a4..b3305ee 100644
--- a/src/views/fysp/support/JingAnSupport.vue
+++ b/src/views/fysp/support/JingAnSupport.vue
@@ -1,72 +1,63 @@
<template>
- <FYOptionTime :initValue="true" type="date" v-model:value="updateTime"></FYOptionTime>
- <el-button type="primary" @click="fetchNewDevice">鏌ヨ鏂拌澶�</el-button>
- <el-button type="primary" @click="fetchNewConstruction">鏌ヨ鏂板伐鍦�</el-button>
- <el-row>
- <el-col :span="12">
- <el-text>鏂拌澶�</el-text>
- <div v-for="item in deviceList" :key="item.id">
- <div>{{ item.id }}</div>
- <div>{{ item.code }}</div>
- <div>{{ item.name }}</div>
- <div>{{ item.address }}</div>
- <div>{{ item.status }}</div>
- <span>{{ item.createTime }} |</span>
- <span>{{ item.updateTime }} |</span>
- <span>{{ item.remark }} |</span>
- <span>{{ item.lon }} |</span>
- <span>{{ item.lat }}</span>
- </div>
- </el-col>
- <el-col :span="12">
- <el-text>鏂板伐鍦�</el-text>
- <div v-for="item in constructionList" :key="item.id">
- <div>{{ item.id }}</div>
- <div>{{ item.code }}</div>
- <div>{{ item.name }}</div>
- <div>{{ item.address }}</div>
- <div>{{ item.street }}</div>
- <div>{{ item.status }}</div>
- <span>{{ item.lon }} |</span>
- <span>{{ item.lat }}</span>
- <span>{{ item.score }} |</span>
- <span>{{ item.grade }}</span>
- <span>{{ item.subTaskId }} |</span>
- <span>{{ item.createTime }} |</span>
- </div>
- </el-col>
- </el-row>
+ <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="鏂板伐鍦�">
+ <NewConstruction></NewConstruction>
+ </el-tab-pane>
+ </el-tabs>
</template>
<script setup>
-import { ref } from 'vue';
-import dayjs from 'dayjs';
-import constructionApi from '@/api/additional-jingan/constructionApi';
-import { useFetchData } from '@/composables/fetchData';
+import { ref, onMounted, provide, computed } from 'vue';
+import NewDevice from './NewDevice.vue';
+import NewConstruction from './NewConstruction.vue';
+import JingAnNightConstruction from './JingAnNightConstruction.vue';
-const { loading, fetchData } = useFetchData();
+// 瀹氫箟 tabs ref
+const tabsRef = ref(null);
+const tabsHeaderHeight = ref(0);
-const updateTime = ref();
-const deviceList = ref([]);
-const constructionList = ref([]);
+onMounted(() => {
+ // 纭繚 DOM 宸茬粡娓叉煋瀹屾垚
+ setTimeout(() => {
+ tabsHeaderHeight.value = getTabsHeaderHeight();
+ }, 0);
+});
-// 鏌ヨ闇�纭鐨勮澶囨竻鍗�
-function fetchNewDevice() {
- const param = dayjs(updateTime.value).format('YYYY-MM-DD HH:mm:ss');
- fetchData(() => {
- return constructionApi.queryDevice(param).then((res) => {
- deviceList.value = res.data;
- });
- });
+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);
+
+ // 瑙ｆ瀽 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;
}
-// 鏌ヨ鏂板缓宸ュ湴
-function fetchNewConstruction() {
- const param = dayjs(updateTime.value).format('YYYY-MM-DD HH:mm:ss');
- fetchData(() => {
- return constructionApi.queryGdNew(param).then((res) => {
- constructionList.value = res.data;
- });
- });
-}
+provide('tabsHeaderHeight', computed(() => tabsHeaderHeight.value));
</script>
<style scoped></style>
--
Gitblit v1.9.3