From 3310934d3bdbbed0227c4909dfb8575da5aec138 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=8E=8B=E5=98=89=E8=B1=AA?=
 <42510293+ziyujiahao@users.noreply.github.com>
Date: Thu, 2 Apr 2026 11:46:22 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20tab=E9=A1=B5=E9=9A=90=E8=97=8F?=
 =?UTF-8?q?=E5=90=8E=EF=BC=8C=E4=B8=8D=E5=8F=82=E4=B8=8E=E8=BD=AE=E6=92=AD?=
 =?UTF-8?q?=20(#18185)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../custom-component/de-tabs/Component.vue    | 15 ++++++-
 .../de-tabs/CustomTabsSortSide.vue            | 42 +++++++++++++++----
 2 files changed, 48 insertions(+), 9 deletions(-)

diff --git a/core/core-frontend/src/custom-component/de-tabs/Component.vue b/core/core-frontend/src/custom-component/de-tabs/Component.vue
index fab16cd76a..e3e96876b7 100644
--- a/core/core-frontend/src/custom-component/de-tabs/Component.vue
+++ b/core/core-frontend/src/custom-component/de-tabs/Component.vue
@@ -661,6 +661,10 @@ const reShow = () => {
   })
 }
 
+const activateTab = (tabName: string) => {
+  editableTabsValue.value = tabName
+}
+
 watch(
   () => isEditMode.value,
   () => {
@@ -674,15 +678,20 @@ const initCarousel = () => {
   if (!isEditMode.value) {
     if (element.value.carousel?.enable) {
       const switchTime = (element.value.carousel.time || 5) * 1000
+      // 过滤出可见的标签页
+      const visibleTabs = element.value.propValue.filter(tab => !tab.hidden)
+
+      // 如果没有可见的标签页，则不启动轮播
+      if (visibleTabs.length === 0) return
       let switchCount = 1
       // 轮播定时器
       carouselTimer = setInterval(() => {
         // 鼠标移入时 停止轮播
         if (!state.hoverFlag) {
-          const nowIndex = switchCount % element.value.propValue.length
+          const nowIndex = switchCount % visibleTabs.length
           switchCount++
           nextTick(() => {
-            editableTabsValue.value = element.value.propValue[nowIndex].name
+            editableTabsValue.value = visibleTabs[nowIndex].name
           })
         }
       }, switchTime)
@@ -701,6 +710,7 @@ onMounted(() => {
     eventBus.on('onTabSortChange-' + element.value.id, reShow)
     eventBus.on('onTabDelete-' + element.value.id, deleteCur)
     eventBus.on('onTabCopy-' + element.value.id, copyCur)
+    eventBus.on('onTabActivate-' + element.value.id, activateTab)
   }
 
   currentInstance = getCurrentInstance()
@@ -716,6 +726,7 @@ onBeforeUnmount(() => {
     eventBus.off('onTabSortChange-' + element.value.id, reShow)
     eventBus.off('onTabDelete-' + element.value.id, deleteCur)
     eventBus.off('onTabCopy-' + element.value.id, copyCur)
+    eventBus.off('onTabActivate-' + element.value.id, activateTab)
   }
 })
 onBeforeMount(() => {
diff --git a/core/core-frontend/src/custom-component/de-tabs/CustomTabsSortSide.vue b/core/core-frontend/src/custom-component/de-tabs/CustomTabsSortSide.vue
index f063424f43..d86c801eb0 100644
--- a/core/core-frontend/src/custom-component/de-tabs/CustomTabsSortSide.vue
+++ b/core/core-frontend/src/custom-component/de-tabs/CustomTabsSortSide.vue
@@ -27,15 +27,11 @@
         <el-icon
           v-show="item.hidden"
           class="component-base component-icon-display"
-          @click="() => (item['hidden'] = false)"
+          @click="onShow(item)"
         >
           <Icon name="dv-eye-close"><dvEyeClose class="svg-icon opt-icon" /></Icon>
         </el-icon>
-        <el-icon
-          v-show="!item.hidden"
-          class="component-base"
-          @click="() => (item['hidden'] = true)"
-        >
+        <el-icon v-show="!item.hidden" class="component-base" @click="onHidden(item)">
           <Icon name="dv-show"><dvShow class="svg-icon opt-icon" /></Icon>
         </el-icon>
 
@@ -50,7 +46,7 @@
 <script setup lang="ts">
 import drag from '@/assets/svg/drag.svg'
 import draggable from 'vuedraggable'
-import { toRefs } from 'vue'
+import { nextTick, toRefs } from 'vue'
 import { snapshotStoreWithOut } from '@/store/modules/data-visualization/snapshot'
 import eventBus from '@/utils/eventBus'
 import dvEyeClose from '@/assets/svg/dv-eye-close.svg'
@@ -73,14 +69,46 @@ const props = withDefaults(
 
 const { config, themes } = toRefs(props)
 
+// 检查并修正当前激活的tab页（传入当前隐藏的tabItem）
+const checkAndFixCurrentTab = tabItem => {
+  // 如果隐藏的不是当前激活的tab，不需要处理
+  if (tabItem.name !== config.value.editableTabsValue) return
+
+  // 过滤出可见的标签页
+  const visibleTabs = config.value.propValue.filter(tab => !tab.hidden)
+
+  // 如果没有可见标签页，不做处理
+  if (visibleTabs.length === 0) return
+
+  // 切换到第一个可见的tab
+  nextTick(() => {
+    config.value.editableTabsValue = visibleTabs[0].name
+    eventBus.emit('onTabActivate-' + config.value.id, visibleTabs[0].name)
+  })
+}
+
 const onSortChange = () => {
   snapshotStore.recordSnapshotCache('tab-sort-save')
   eventBus.emit('onTabSortChange-' + config.value.id)
 }
 
+const onShow = tabItem => {
+  snapshotStore.recordSnapshotCache('tab')
+  tabItem['hidden'] = false
+  config.value.editableTabsValue = tabItem.name
+  eventBus.emit('onTabActivate-' + config.value.id, tabItem.name)
+}
+
+const onHidden = tabItem => {
+  snapshotStore.recordSnapshotCache('tab')
+  tabItem['hidden'] = true
+  checkAndFixCurrentTab(tabItem)
+}
+
 const onDelete = item => {
   snapshotStore.recordSnapshotCache('tab')
   eventBus.emit('onTabDelete-' + config.value.id, deepCopy(item))
+  checkAndFixCurrentTab(item)
 }
 
 const onCopy = item => {