From d51c68c450e8a20a367347d8b0ef35053bee0fa5 Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Tue, 25 Feb 2025 17:12:10 +0800
Subject: [PATCH] =?UTF-8?q?refactor(=E6=95=B0=E6=8D=AE=E5=A4=A7=E5=B1=8F):?=
 =?UTF-8?q?=20=E6=95=B0=E6=8D=AE=E5=A4=A7=E5=B1=8F=E8=BF=87=E6=BB=A4?=
 =?UTF-8?q?=E5=BC=B9=E7=AA=97=E6=8C=89=E9=92=AE=E5=A6=82=E6=9E=9C=E5=87=BA?=
 =?UTF-8?q?=E7=8E=B0=E6=BB=9A=E5=8A=A8=EF=BC=8C=E5=9B=BA=E5=AE=9A=E5=88=B0?=
 =?UTF-8?q?=E5=B1=8F=E5=B9=95=E6=8C=87=E5=AE=9A=E4=BD=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../data-visualization/canvas/DePreview.vue     |  8 +++++++-
 .../canvas-filter-btn/Component.vue             | 17 ++++++++++++++++-
 2 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue b/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue
index 704c5013a0..ab9111f184 100644
--- a/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue
+++ b/core/core-frontend/src/components/data-visualization/canvas/DePreview.vue
@@ -28,6 +28,7 @@ const openHandler = ref(null)
 const customDatasetParamsRef = ref(null)
 const emits = defineEmits(['onResetLayout'])
 const fullScreeRef = ref(null)
+const isOverSize = ref(false)
 const isDesktopFlag = isDesktop()
 const props = defineProps({
   canvasStyleData: {
@@ -286,6 +287,10 @@ const resetLayout = () => {
       }
       renderReady.value = true
       emits('onResetLayout')
+      isOverSize.value = false
+      if (previewCanvas.value?.clientHeight - previewCanvas.value?.parentNode?.clientHeight > 0) {
+        isOverSize.value = true
+      }
     }
   })
 }
@@ -464,6 +469,7 @@ const linkOptBarShow = computed(() => {
 const downloadAsPDF = () => {
   // test
 }
+
 defineExpose({
   restore
 })
@@ -480,7 +486,7 @@ defineExpose({
     v-if="state.initState"
   >
     <!--弹框触发区域-->
-    <canvas-filter-btn v-if="filterBtnShow"></canvas-filter-btn>
+    <canvas-filter-btn :is-fixed="isOverSize" v-if="filterBtnShow"></canvas-filter-btn>
     <!-- 弹框区域 -->
     <PopArea
       v-if="popAreaAvailable"
diff --git a/core/core-frontend/src/custom-component/canvas-filter-btn/Component.vue b/core/core-frontend/src/custom-component/canvas-filter-btn/Component.vue
index edc33a5635..c79d3e8bc3 100644
--- a/core/core-frontend/src/custom-component/canvas-filter-btn/Component.vue
+++ b/core/core-frontend/src/custom-component/canvas-filter-btn/Component.vue
@@ -1,7 +1,12 @@
 <!-- IconSlider.vue -->
 <template>
   <el-tooltip offset="22" effect="dark" placement="left" :content="t('visualization.query')">
-    <div class="canvas-filter" @mousedown.stop @mousedup.stop>
+    <div
+      class="canvas-filter"
+      :class="{ 'filter-btn-fix': isFixed }"
+      @mousedown.stop
+      @mousedup.stop
+    >
       <div class="icon-slider" @mouseenter="slideOut" @mouseleave="slideBack">
         <div
           class="icon-container"
@@ -28,6 +33,12 @@ const slideDistance = ref(14) // 滑动距离
 const { canvasState } = storeToRefs(dvMainStore)
 const { t } = useI18n()
 
+defineProps({
+  isFixed: {
+    type: Boolean,
+    default: false
+  }
+})
 const filterActive = computed(() => canvasState.value.curPointArea === 'hidden')
 const slideOut = () => {
   offset.value = -slideDistance.value
@@ -82,4 +93,8 @@ img {
   max-width: 100%;
   max-height: 100%;
 }
+
+.filter-btn-fix {
+  position: fixed !important;
+}
 </style>