Commit 0c2e72d22acb087fffbf55f95c52407f4ff8d0b0
1 parent
1bc237d7
chore: update README.md
Showing
3 changed files
with
31 additions
and
23 deletions
CHANGELOG.zh_CN.md
src/layouts/default/header/LayoutHeader.tsx
... | ... | @@ -3,7 +3,13 @@ import './index.less'; |
3 | 3 | import type { FunctionalComponent } from 'vue'; |
4 | 4 | import type { Component } from '/@/components/types'; |
5 | 5 | |
6 | -import { defineComponent, unref, computed, ref, nextTick } from 'vue'; | |
6 | +import { | |
7 | + defineComponent, | |
8 | + unref, | |
9 | + computed, | |
10 | + ref, | |
11 | + // nextTick | |
12 | +} from 'vue'; | |
7 | 13 | |
8 | 14 | import { Layout, Tooltip, Badge } from 'ant-design-vue'; |
9 | 15 | import { AppLogo } from '/@/components/Application'; |
... | ... | @@ -24,7 +30,7 @@ import { useModal } from '/@/components/Modal'; |
24 | 30 | |
25 | 31 | import { useFullscreen } from '/@/hooks/web/useFullScreen'; |
26 | 32 | import { useTabs } from '/@/hooks/web/useTabs'; |
27 | -import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn'; | |
33 | +// import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn'; | |
28 | 34 | import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting'; |
29 | 35 | import { useMenuSetting } from '/@/hooks/setting/useMenuSetting'; |
30 | 36 | import { useRootSetting } from '/@/hooks/setting/useRootSetting'; |
... | ... | @@ -61,9 +67,9 @@ export default defineComponent({ |
61 | 67 | fixed: propTypes.bool, |
62 | 68 | }, |
63 | 69 | setup(props) { |
64 | - let logoEl: Element | null | undefined; | |
70 | + // let logoEl: Element | null | undefined; | |
65 | 71 | |
66 | - const logoWidthRef = ref(200); | |
72 | + // const logoWidthRef = ref(200); | |
67 | 73 | const logoRef = ref<ComponentRef>(null); |
68 | 74 | const { refreshPage } = useTabs(); |
69 | 75 | const { t } = useI18n(); |
... | ... | @@ -88,22 +94,22 @@ export default defineComponent({ |
88 | 94 | const [register, { openModal }] = useModal(); |
89 | 95 | const { toggleFullscreen, isFullscreenRef } = useFullscreen(); |
90 | 96 | |
91 | - useWindowSizeFn( | |
92 | - () => { | |
93 | - nextTick(() => { | |
94 | - if (!unref(getShowTopMenu)) return; | |
95 | - let width = 0; | |
96 | - if (!logoEl) { | |
97 | - logoEl = unref(logoRef)?.$el; | |
98 | - } else { | |
99 | - width += logoEl.clientWidth; | |
100 | - } | |
101 | - logoWidthRef.value = width + 80; | |
102 | - }); | |
103 | - }, | |
104 | - 200, | |
105 | - { immediate: true } | |
106 | - ); | |
97 | + // useWindowSizeFn( | |
98 | + // () => { | |
99 | + // nextTick(() => { | |
100 | + // if (!unref(getShowTopMenu)) return; | |
101 | + // let width = 0; | |
102 | + // if (!logoEl) { | |
103 | + // logoEl = unref(logoRef)?.$el; | |
104 | + // } else { | |
105 | + // width += logoEl.clientWidth; | |
106 | + // } | |
107 | + // logoWidthRef.value = width + 80; | |
108 | + // }); | |
109 | + // }, | |
110 | + // 200, | |
111 | + // { immediate: true } | |
112 | + // ); | |
107 | 113 | |
108 | 114 | const headerClass = computed(() => { |
109 | 115 | const theme = unref(getHeaderTheme); |
... | ... | @@ -129,7 +135,7 @@ export default defineComponent({ |
129 | 135 | } |
130 | 136 | |
131 | 137 | function renderHeaderContent() { |
132 | - const width = unref(logoWidthRef); | |
138 | + // const width = unref(logoWidthRef); | |
133 | 139 | return ( |
134 | 140 | <div class="layout-header__content "> |
135 | 141 | {unref(getShowHeaderLogo) && ( |
... | ... | @@ -146,7 +152,8 @@ export default defineComponent({ |
146 | 152 | )} |
147 | 153 | |
148 | 154 | {unref(getShowTopMenu) && ( |
149 | - <div class={[`layout-header__menu `]} style={{ width: `calc(100% - ${width}px)` }}> | |
155 | + // <div class={[`layout-header__menu `]} style={{ width: `calc(100% - ${width}px)` }}> | |
156 | + <div class={[`layout-header__menu `]}> | |
150 | 157 | <LayoutMenu |
151 | 158 | isHorizontal={true} |
152 | 159 | class={`justify-${unref(getTopMenuAlign)}`} | ... | ... |