Skip to content
This repository has been archived by the owner on Aug 28, 2024. It is now read-only.

Commit

Permalink
refactor: transfer admin/hooks to @vben/hooks (#84)
Browse files Browse the repository at this point in the history 
* todo

* show menu & main content
  • Loading branch information
@likui628
likui628 authored Sep 7, 2023
1 parent 435f907 commit 193de24
Show file tree
Hide file tree
Showing 3 changed files with 54 additions and 59 deletions.
34 changes: 15 additions & 19 deletions apps/admin/src/hooks/setting/useHeaderSetting.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,8 @@ import type { HeaderSetting } from '@vben/types'

import { computed, unref } from 'vue'

import { useConfigStoreWithOut } from '@/store/config'
// import { useConfigStoreWithOut } from '@/store/config'
import { useAppConfig } from '@vben/hooks'

import { useMenuSetting } from '@/hooks/setting/useMenuSetting'
import { useRootSetting } from '@/hooks/setting/useRootSetting'
Expand All @@ -11,13 +12,10 @@ import { MenuModeEnum } from '@vben/constants'

export function useHeaderSetting() {
const { getFullContent } = useFullContent()
const configStore = useConfigStoreWithOut()
const configStore = useAppConfig()

const getShowFullHeaderRef = computed(() => {
return (
(!unref(getFullContent) &&
unref(getShowHeader))
)
return !unref(getFullContent) && unref(getShowHeader)
})

const getUnFixedAndFull = computed(
Expand Down Expand Up @@ -47,28 +45,26 @@ export function useHeaderSetting() {
() => !unref(getIsSidebarType) && unref(getShowHeader),
)

const getShowDoc = computed(() => configStore.getHeaderSetting.showDoc)
const getShowDoc = computed(() => configStore.header.showDoc)

const getHeaderTheme = computed(() => configStore.getHeaderSetting.theme)
const getHeaderTheme = computed(() => configStore.header.theme)

const getShowHeader = computed(() => configStore.getHeaderSetting.show)
const getShowHeader = computed(() => configStore.header.show)

const getFixed = computed(() => configStore.getHeaderSetting.fixed)
const getFixed = computed(() => configStore.header.fixed)

const getHeaderBgColor = computed(() => configStore.getHeaderSetting.bgColor)
const getHeaderBgColor = computed(() => configStore.header.bgColor)

const getShowSearch = computed(() => configStore.getHeaderSetting.showSearch)
const getShowSearch = computed(() => configStore.header.showSearch)

const getUseLockPage = computed(() => configStore.getHeaderSetting.useLockPage)
const getUseLockPage = computed(() => false)

const getShowFullScreen = computed(
() => configStore.getHeaderSetting.showFullScreen,
)
const getShowFullScreen = computed(() => configStore.header.showFullScreen)
const getShowLocalePicker = computed(
() => configStore.getHeaderSetting.showLocalePicker,
() => configStore.header.showLocalePicker,
)

const getShowNotice = computed(() => configStore.getHeaderSetting.showNotice)
const getShowNotice = computed(() => configStore.header.showNotice)

const getShowBread = computed(() => {
return (
Expand All @@ -90,7 +86,7 @@ export function useHeaderSetting() {

// Set header configuration
function setHeaderSetting(headerSetting: Partial<HeaderSetting>) {
configStore.setProjectConfig({ headerSetting })
configStore.setAppConfig({ header: headerSetting })
}
return {
setHeaderSetting,
Expand Down
58 changes: 28 additions & 30 deletions apps/admin/src/hooks/setting/useMenuSetting.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,8 @@ import type { MenuSetting } from '@vben/types'

import { computed, unref, ref } from 'vue'

import { useConfigStoreWithOut } from '@/store/config'
// import { useConfigStoreWithOut } from '@/store/config'
import { useAppConfig } from '@vben/hooks'

import {
SIDE_BAR_MINI_WIDTH,
Expand All @@ -12,13 +13,15 @@ import {
TriggerEnum,
} from '@vben/constants'
import { useFullContent } from '@/hooks/web/useFullContent'
import {useRootSetting} from "@/hooks/setting/useRootSetting";
import { useRootSetting } from '@/hooks/setting/useRootSetting'

const mixSideHasChildren = ref(false)

// todo src/hooks 在往 @VBen\hooks 转移
export function useMenuSetting() {
const { getFullContent: fullContent } = useFullContent()
const configStore = useConfigStoreWithOut()
const configStore = useAppConfig()
// const useAppConfigStore = appConfigStore()
const { getShowLogo } = useRootSetting()
const getShowSidebar = computed(() => {
return (
Expand All @@ -29,46 +32,42 @@ export function useMenuSetting() {
)
})

const getCollapsed = computed(() => configStore.getMenuSetting.collapsed)
const getCollapsed = computed(() => false)

const getMenuType = computed(() => configStore.getMenuSetting.type)
const getMenuType = computed(() => 'sidebar')

const getMenuMode = computed(() => configStore.getMenuSetting.mode)
const getMenuMode = computed(() => configStore.menu.mode)

const getMenuFixed = computed(() => configStore.getMenuSetting.fixed)
const getMenuFixed = computed(() => true)

const getShowMenu = computed(() => configStore.getMenuSetting.show)
const getShowMenu = computed(() => true)

const getMenuHidden = computed(() => configStore.getMenuSetting.hidden)
const getMenuHidden = computed(() => false)

const getMenuWidth = computed(() => configStore.getMenuSetting.menuWidth)
const getMenuWidth = computed(() => 210)

const getTrigger = computed(() => configStore.getMenuSetting.trigger)
const getTrigger = computed(() => 'HEADER')

const getMenuTheme = computed(() => configStore.getMenuSetting.theme)
const getMenuTheme = computed(() => 'dark')

const getSplit = computed(() => configStore.getMenuSetting.split)
const getSplit = computed(() => configStore.menu.split)

const getMenuBgColor = computed(() => configStore.getMenuSetting.bgColor)
const getMenuBgColor = computed(() => '#001529')

const getMixSideTrigger = computed(
() => configStore.getMenuSetting.mixSideTrigger,
() => configStore.menu.mixSideTrigger,
)

const getCanDrag = computed(() => configStore.getMenuSetting.canDrag)
const getCanDrag = computed(() => configStore.menu.canDrag)

const getAccordion = computed(() => configStore.getMenuSetting.accordion)
const getAccordion = computed(() => configStore.menu.accordion)

const getMixSideFixed = computed(
() => configStore.getMenuSetting.mixSideFixed,
)
const getMixSideFixed = computed(() => configStore.menu.mixSideFixed)

const getTopMenuAlign = computed(
() => configStore.getMenuSetting.topMenuAlign,
)
const getTopMenuAlign = computed(() => configStore.menu.topMenuAlign)

const getCloseMixSidebarOnChange = computed(
() => configStore.getMenuSetting.closeMixSidebarOnChange,
() => false,
)

const getIsSidebarType = computed(
Expand All @@ -80,18 +79,17 @@ export function useMenuSetting() {
)

const getMenuShowLogo = computed(
()=> unref(getShowLogo) && unref(getIsSidebarType)
() => unref(getShowLogo) && unref(getIsSidebarType),
)

const getCollapsedShowTitle = computed(
() => configStore.getMenuSetting.collapsedShowTitle,
() => configStore.menu.collapsedShowTitle,
)

const getShowTopMenu = computed(() => {
return unref(getMenuMode) === MenuModeEnum.HORIZONTAL || unref(getSplit)
})


const getShowHeaderTrigger = computed(() => {
if (
unref(getMenuType) === MenuTypeEnum.TOP_MENU ||
Expand Down Expand Up @@ -129,7 +127,7 @@ export function useMenuSetting() {
})

const getMiniWidthNumber = computed(() => {
const { collapsedShowTitle } = configStore.getMenuSetting
const { collapsedShowTitle } = configStore.menu
return collapsedShowTitle
? SIDE_BAR_SHOW_TIT_MINI_WIDTH
: SIDE_BAR_MINI_WIDTH
Expand All @@ -155,7 +153,7 @@ export function useMenuSetting() {

// Set menu configuration
function setMenuSetting(menuSetting: Partial<MenuSetting>): void {
configStore.setProjectConfig({ menuSetting })
configStore.setAppConfig({ menu: menuSetting })
}

function toggleCollapsed() {
Expand Down Expand Up @@ -196,6 +194,6 @@ export function useMenuSetting() {
getMixSideTrigger,
getMixSideFixed,
mixSideHasChildren,
getMenuShowLogo
getMenuShowLogo,
}
}
21 changes: 11 additions & 10 deletions apps/admin/src/hooks/setting/useMultipleTabSetting.ts
View file
Original file line number Diff line number Diff line change
@@ -1,28 +1,29 @@
import type { MultiTabsSetting } from '@vben/types';
import type { MultiTabsSetting } from '@vben/types'

import { computed } from 'vue';
import { computed } from 'vue'

import { useConfigStoreWithOut } from '@/store/config';
// import { useConfigStoreWithOut } from '@/store/config';
import { useAppConfig } from '@vben/hooks'

export function useMultipleTabSetting() {
const configStore = useConfigStoreWithOut()
const configStore = useAppConfig()

const getShowMultipleTab = computed(() => configStore.getMultiTabsSetting.show);
const getShowMultipleTab = computed(() => configStore.tabTar.show)

const getShowQuick = computed(() => configStore.getMultiTabsSetting.showQuick);
const getShowQuick = computed(() => configStore.tabTar.showQuick)

const getShowRedo = computed(() => configStore.getMultiTabsSetting.showRedo);
const getShowRedo = computed(() => configStore.tabTar.showRedo)

const getShowFold = computed(() => configStore.getMultiTabsSetting.showFold);
const getShowFold = computed(() => configStore.tabTar.showFold)

function setMultipleTabSetting(multiTabsSetting: Partial<MultiTabsSetting>) {
configStore.setProjectConfig({ multiTabsSetting });
configStore.setAppConfig({ tabTar: multiTabsSetting })
}
return {
setMultipleTabSetting,
getShowMultipleTab,
getShowQuick,
getShowRedo,
getShowFold,
};
}
}

0 comments on commit 193de24

Please sign in to comment.