Parcourir la source

fix(BackTop): repair BackTup comp (#3581)

xachary il y a 1 an
Parent
commit
6f4bdae5c2
2 fichiers modifiés avec 13 ajouts et 8 suppressions
  1. 12 2
      src/layouts/default/content/index.vue
  2. 1 6
      src/layouts/default/feature/index.vue

+ 12 - 2
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';

+ 1 - 6
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();