import { computed } from 'vue'
import { useAppStore } from '@/store/modules/app'
import { Menu } from '@/layout/components/Menu'
import { TabMenu } from '@/layout/components/TabMenu'
import { TagsView } from '@/layout/components/TagsView'
import { Logo } from '@/layout/components/Logo'
import AppView from './AppView.vue'
import ToolHeader from './ToolHeader.vue'
import { ElScrollbar } from 'element-plus'
import { useDesign } from '@/hooks/web/useDesign'
const { getPrefixCls } = useDesign()
const prefixCls = getPrefixCls('layout')
const appStore = useAppStore()
const pageLoading = computed(() => appStore.getPageLoading)
// 标签页
const tagsView = computed(() => appStore.getTagsView)
// 菜单折叠
const collapse = computed(() => appStore.getCollapse)
// logo
const logo = computed(() => appStore.logo)
// 固定头部
const fixedHeader = computed(() => appStore.getFixedHeader)
// 是否是移动端
const mobile = computed(() => appStore.getMobile)
// 固定菜单
const fixedMenu = computed(() => appStore.getFixedMenu)
export const useRenderLayout = () => {
const renderClassic = () => {
return (
<>
{logo.value ? (
) : undefined}
{tagsView.value ? (
) : undefined}
)
}
const renderTopLeft = () => {
return (
<>
{tagsView.value ? (
) : undefined}
)
}
const renderTop = () => {
return (
<>
{logo.value ? : undefined}
{tagsView.value ? (
) : undefined}
)
}
const renderCutMenu = () => {
return (
<>
{tagsView.value ? (
) : undefined}
)
}
return {
renderClassic,
renderTopLeft,
renderTop,
renderCutMenu
}
}