useHeaderSetting.ts 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. import type { HeaderSetting } from '/#/config';
  2. import { computed, unref } from 'vue';
  3. import { useAppStore } from '/@/store/modules/app';
  4. import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
  5. import { useRootSetting } from '/@/hooks/setting/useRootSetting';
  6. import { useFullContent } from '/@/hooks/web/useFullContent';
  7. import { MenuModeEnum } from '/@/enums/menuEnum';
  8. export function useHeaderSetting() {
  9. const { getFullContent } = useFullContent();
  10. const appStore = useAppStore();
  11. const getShowFullHeaderRef = computed(() => {
  12. return !unref(getFullContent) && unref(getShowMixHeaderRef) && unref(getShowHeader) && !unref(getIsTopMenu) && !unref(getIsMixSidebar);
  13. });
  14. const getUnFixedAndFull = computed(() => !unref(getFixed) && !unref(getShowFullHeaderRef));
  15. const getShowInsetHeaderRef = computed(() => {
  16. const need = !unref(getFullContent) && unref(getShowHeader);
  17. return (need && !unref(getShowMixHeaderRef)) || (need && unref(getIsTopMenu)) || (need && unref(getIsMixSidebar));
  18. });
  19. const { getMenuMode, getSplit, getShowHeaderTrigger, getIsSidebarType, getIsMixSidebar, getIsTopMenu } = useMenuSetting();
  20. const { getShowBreadCrumb, getShowLogo } = useRootSetting();
  21. const getShowMixHeaderRef = computed(() => !unref(getIsSidebarType) && unref(getShowHeader));
  22. const getShowDoc = computed(() => appStore.getHeaderSetting.showDoc);
  23. const getHeaderTheme = computed(() => appStore.getHeaderSetting.theme);
  24. const getShowHeader = computed(() => appStore.getHeaderSetting.show);
  25. const getFixed = computed(() => appStore.getHeaderSetting.fixed);
  26. const getHeaderBgColor = computed(() => appStore.getHeaderSetting.bgColor);
  27. const getShowSearch = computed(() => appStore.getHeaderSetting.showSearch);
  28. const getUseLockPage = computed(() => appStore.getHeaderSetting.useLockPage);
  29. const getShowFullScreen = computed(() => appStore.getHeaderSetting.showFullScreen);
  30. const getShowNotice = computed(() => appStore.getHeaderSetting.showNotice);
  31. const getShowBread = computed(() => {
  32. return unref(getMenuMode) !== MenuModeEnum.HORIZONTAL && unref(getShowBreadCrumb) && !unref(getSplit);
  33. });
  34. const getShowBreadTitle = computed(() => {
  35. return unref(getMenuMode) !== MenuModeEnum.HORIZONTAL && !unref(getShowBreadCrumb) && !unref(getSplit);
  36. });
  37. const getShowHeaderLogo = computed(() => {
  38. return unref(getShowLogo) && !unref(getIsSidebarType) && !unref(getIsMixSidebar);
  39. });
  40. const getShowContent = computed(() => {
  41. return unref(getShowBread) || unref(getShowHeaderTrigger);
  42. });
  43. // Set header configuration
  44. function setHeaderSetting(headerSetting: Partial<HeaderSetting>) {
  45. appStore.setProjectConfig({ headerSetting });
  46. }
  47. return {
  48. setHeaderSetting,
  49. getShowDoc,
  50. getShowSearch,
  51. getHeaderTheme,
  52. getUseLockPage,
  53. getShowFullScreen,
  54. getShowNotice,
  55. getShowBread,
  56. getShowContent,
  57. getShowHeaderLogo,
  58. getShowHeader,
  59. getFixed,
  60. getShowMixHeaderRef,
  61. getShowFullHeaderRef,
  62. getShowInsetHeaderRef,
  63. getUnFixedAndFull,
  64. getHeaderBgColor,
  65. getShowBreadTitle
  66. };
  67. }