From 6f4bdae5c2a5455cb924e1903612f9fe96cf4481 Mon Sep 17 00:00:00 2001
From: xachary <179740385@qq.com>
Date: Tue, 30 Jan 2024 14:14:23 +0800
Subject: [PATCH] fix(BackTop): repair BackTup comp (#3581)

---
 src/layouts/default/content/index.vue | 14 ++++++++++++--
 src/layouts/default/feature/index.vue |  7 +------
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/layouts/default/content/index.vue b/src/layouts/default/content/index.vue
index ae5182db..68c794f4 100644
--- a/src/layouts/default/content/index.vue
+++ b/src/layouts/default/content/index.vue
@@ -1,9 +1,17 @@
 <template>
-  <div :class="[prefixCls, getLayoutContentMode]" v-loading="getOpenPageLoading && getPageLoading">
+  <div
+    :class="[prefixCls, getLayoutContentMode]"
+    v-loading="getOpenPageLoading && getPageLoading"
+    ref="content"
+  >
     <PageLayout />
+    <BackTop v-if="getUseOpenBackTop" :target="() => content" :visibilityHeight="100" />
   </div>
 </template>
 <script lang="ts" setup>
+  import { ref } from 'vue';
+  import { BackTop } from 'ant-design-vue';
+
   import PageLayout from '@/layouts/page/index.vue';
   import { useDesign } from '@/hooks/web/useDesign';
   import { useRootSetting } from '@/hooks/setting/useRootSetting';
@@ -14,9 +22,11 @@
 
   const { prefixCls } = useDesign('layout-content');
   const { getOpenPageLoading } = useTransitionSetting();
-  const { getLayoutContentMode, getPageLoading } = useRootSetting();
+  const { getLayoutContentMode, getPageLoading, getUseOpenBackTop } = useRootSetting();
 
   useContentViewHeight();
+
+  const content = ref();
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-layout-content';
diff --git a/src/layouts/default/feature/index.vue b/src/layouts/default/feature/index.vue
index 4f1fd628..b56d81c5 100644
--- a/src/layouts/default/feature/index.vue
+++ b/src/layouts/default/feature/index.vue
@@ -1,6 +1,5 @@
 <template>
   <LayoutLockPage />
-  <BackTop v-if="getUseOpenBackTop" :target="getTarget" />
   <SettingDrawer
     v-if="getIsFixedSettingDrawer && (!getShowMultipleTab || getFullContent)"
     :class="prefixCls"
@@ -9,7 +8,6 @@
 </template>
 <script lang="ts" setup>
   import { computed, unref } from 'vue';
-  import { BackTop } from 'ant-design-vue';
 
   import { useRootSetting } from '@/hooks/setting/useRootSetting';
   import { useHeaderSetting } from '@/hooks/setting/useHeaderSetting';
@@ -28,10 +26,7 @@
   const LayoutLockPage = createAsyncComponent(() => import('@/views/sys/lock/index.vue'));
   const SettingDrawer = createAsyncComponent(() => import('@/layouts/default/setting/index.vue'));
 
-  const getTarget = () => document.body;
-
-  const { getUseOpenBackTop, getShowSettingButton, getSettingButtonPosition, getFullContent } =
-    useRootSetting();
+  const { getShowSettingButton, getSettingButtonPosition, getFullContent } = useRootSetting();
   const userStore = useUserStoreWithOut();
   const { prefixCls } = useDesign('setting-drawer-feature');
   const { getShowHeader } = useHeaderSetting();