import { computed } from 'vue';
import { useProjectSettingStore } from '@/store/modules/projectSetting';

export function useProjectSetting() {
  const projectStore = useProjectSettingStore();

  const getLayout = computed(() => projectStore.layout);

  const getHeaderTheme = computed(() => projectStore.headerTheme);

  const getNavTheme = computed(() => projectStore.navTheme);

  const getDarkTheme = computed(() => projectStore.darkTheme);

  const getHeaderCollapsed = computed(() => projectStore.headerSetting.collapsed);

  const getHeaderFixed = computed(() => projectStore.headerSetting.fixed);

  const getHeaderReload = computed(() => projectStore.headerSetting.reload);

  const getHeaderHeight = computed(() => projectStore.headerSetting.height);

  const getHeaderShow = computed(() => projectStore.headerSetting.show);

  const getHeaderRender = computed(() => (projectStore.headerSetting.show ? undefined : false));

  const getBodyFixed = computed(() => projectStore.bodySetting.fixed);

  const getMultiTabsShow = computed(() => projectStore.multiTabsSetting.show);

  const getMenuTitle = computed(() => projectStore.menuSetting.title);

  const getMenuWidth = computed(() =>
    projectStore.menuSetting.show ? projectStore.menuSetting.width : 0,
  );

  const getMenuMinWidth = computed(() => projectStore.menuSetting.minWidth);

  const getMenuFixed = computed(() => projectStore.menuSetting.fixed);

  const getMenuSplit = computed(() => projectStore.menuSetting.split);

  const getMenuCollapsed = computed(() => projectStore.menuSetting.collapsed);

  const getMenuShow = computed(() => projectStore.menuSetting.show);

  const getCrumbsShow = computed(() => projectStore.crumbsSetting.show);

  const getCrumbsShowIcon = computed(() => projectStore.crumbsSetting.showIcon);

  const getPermissionMode = computed(() => projectStore.permissionMode);

  const getIsPageAnimate = computed(() => projectStore.isPageAnimate);

  const getIsWaterMark = computed(() => projectStore.isWaterMark);

  const getPageAnimateType = computed(() => projectStore.pageAnimateType);

  const getIsProjectSetting = computed(() => projectStore.isProjectSetting);

  return {
    getLayout,
    getHeaderTheme,
    getNavTheme,
    getDarkTheme,
    getHeaderCollapsed,
    getHeaderFixed,
    getHeaderReload,
    getHeaderHeight,
    getHeaderShow,
    getHeaderRender,
    getBodyFixed,
    getMultiTabsShow,
    getMenuTitle,
    getMenuWidth,
    getMenuMinWidth,
    getMenuFixed,
    getMenuSplit,
    getMenuCollapsed,
    getMenuShow,
    getCrumbsShow,
    getCrumbsShowIcon,
    getPermissionMode,
    getIsPageAnimate,
    getIsWaterMark,
    getPageAnimateType,
    getIsProjectSetting,
  };
}