|
|
|
@ -25,13 +25,9 @@ export default defineComponent({ |
|
|
|
|
|
|
|
const { getFullContent } = useFullContent(); |
|
|
|
|
|
|
|
const getProjectConfigRef = computed(() => { |
|
|
|
return appStore.getProjectConfig; |
|
|
|
}); |
|
|
|
const getProjectConfigRef = computed(() => appStore.getProjectConfig); |
|
|
|
|
|
|
|
const getLockMainScrollStateRef = computed(() => { |
|
|
|
return appStore.getLockMainScrollState; |
|
|
|
}); |
|
|
|
const getLockMainScrollStateRef = computed(() => appStore.getLockMainScrollState); |
|
|
|
|
|
|
|
const showHeaderRef = computed(() => { |
|
|
|
const { |
|
|
|
@ -47,6 +43,12 @@ export default defineComponent({ |
|
|
|
return type !== MenuTypeEnum.SIDEBAR && unref(showHeaderRef); |
|
|
|
}); |
|
|
|
|
|
|
|
const getIsLockRef = computed(() => { |
|
|
|
const { getLockInfo } = appStore; |
|
|
|
const { isLock } = getLockInfo; |
|
|
|
return isLock; |
|
|
|
}); |
|
|
|
|
|
|
|
const showSideBarRef = computed(() => { |
|
|
|
const { |
|
|
|
menuSetting: { show, mode, split }, |
|
|
|
@ -54,59 +56,74 @@ export default defineComponent({ |
|
|
|
return split || (show && mode !== MenuModeEnum.HORIZONTAL && !unref(getFullContent)); |
|
|
|
}); |
|
|
|
|
|
|
|
function getTarget(): any { |
|
|
|
const { |
|
|
|
headerSetting: { fixed }, |
|
|
|
} = unref(getProjectConfigRef); |
|
|
|
return document.querySelector(`.default-layout__${fixed ? 'main' : 'content'}`); |
|
|
|
} |
|
|
|
const showFullHeaderRef = computed(() => { |
|
|
|
return !unref(getFullContent) && unref(isShowMixHeaderRef) && unref(showHeaderRef); |
|
|
|
}); |
|
|
|
|
|
|
|
return () => { |
|
|
|
const { getLockInfo } = appStore; |
|
|
|
const showInsetHeaderRef = computed(() => { |
|
|
|
return !unref(getFullContent) && !unref(isShowMixHeaderRef) && unref(showHeaderRef); |
|
|
|
}); |
|
|
|
|
|
|
|
const fixedHeaderClsRef = computed(() => { |
|
|
|
const { |
|
|
|
useOpenBackTop, |
|
|
|
showSettingButton, |
|
|
|
multiTabsSetting: { show: showTabs }, |
|
|
|
headerSetting: { fixed }, |
|
|
|
menuSetting: { split, hidden }, |
|
|
|
} = unref(getProjectConfigRef); |
|
|
|
|
|
|
|
const fixedHeaderCls = fixed |
|
|
|
? 'fixed' + (unref(getLockMainScrollStateRef) ? ' lock' : '') |
|
|
|
: ''; |
|
|
|
return fixedHeaderCls; |
|
|
|
}); |
|
|
|
|
|
|
|
const { isLock } = getLockInfo; |
|
|
|
const showTabsRef = computed(() => { |
|
|
|
const { |
|
|
|
multiTabsSetting: { show }, |
|
|
|
} = unref(getProjectConfigRef); |
|
|
|
return show && !unref(getFullContent); |
|
|
|
}); |
|
|
|
|
|
|
|
const showClassSideBarRef = computed(() => { |
|
|
|
const { |
|
|
|
menuSetting: { split, hidden }, |
|
|
|
} = unref(getProjectConfigRef); |
|
|
|
return split ? hidden : true; |
|
|
|
}); |
|
|
|
|
|
|
|
const showSideBar = split ? hidden : true; |
|
|
|
function getTarget(): any { |
|
|
|
const { |
|
|
|
headerSetting: { fixed }, |
|
|
|
} = unref(getProjectConfigRef); |
|
|
|
return document.querySelector(`.default-layout__${fixed ? 'main' : 'content'}`); |
|
|
|
} |
|
|
|
|
|
|
|
return () => { |
|
|
|
const { useOpenBackTop, showSettingButton } = unref(getProjectConfigRef); |
|
|
|
return ( |
|
|
|
<Layout class="default-layout relative"> |
|
|
|
{() => ( |
|
|
|
<> |
|
|
|
{/* lock page */} |
|
|
|
{isLock && <LockPage />} |
|
|
|
{unref(getIsLockRef) && <LockPage />} |
|
|
|
{/* back top */} |
|
|
|
{useOpenBackTop && <BackTop target={getTarget} />} |
|
|
|
{/* open setting drawer */} |
|
|
|
{showSettingButton && <SettingBtn />} |
|
|
|
|
|
|
|
{!unref(getFullContent) && unref(isShowMixHeaderRef) && unref(showHeaderRef) && ( |
|
|
|
<LayoutHeader /> |
|
|
|
)} |
|
|
|
{unref(showFullHeaderRef) && <LayoutHeader />} |
|
|
|
|
|
|
|
<Layout> |
|
|
|
{() => ( |
|
|
|
<> |
|
|
|
{unref(showSideBarRef) && <LayoutSideBar class={showSideBar ? '' : 'hidden'} />} |
|
|
|
<Layout class={[`default-layout__content`, fixedHeaderCls]}> |
|
|
|
{unref(showSideBarRef) && ( |
|
|
|
<LayoutSideBar class={unref(showClassSideBarRef) ? '' : 'hidden'} /> |
|
|
|
)} |
|
|
|
<Layout class={[`default-layout__content`, unref(fixedHeaderClsRef)]}> |
|
|
|
{() => ( |
|
|
|
<> |
|
|
|
{!unref(getFullContent) && |
|
|
|
!unref(isShowMixHeaderRef) && |
|
|
|
unref(showHeaderRef) && <LayoutHeader />} |
|
|
|
{unref(showInsetHeaderRef) && <LayoutHeader />} |
|
|
|
|
|
|
|
{showTabs && !unref(getFullContent) && <MultipleTabs />} |
|
|
|
{unref(showTabsRef) && <MultipleTabs />} |
|
|
|
|
|
|
|
<LayoutContent class={fixedHeaderCls} /> |
|
|
|
<LayoutContent class={unref(fixedHeaderClsRef)} /> |
|
|
|
</> |
|
|
|
)} |
|
|
|
</Layout> |
|
|
|
|
vben
5 years ago