2024-05-19 13:20:42 +00:00
|
|
|
|
import type {
|
|
|
|
|
ContentCompactType,
|
2024-06-01 15:15:29 +00:00
|
|
|
|
LayoutHeaderModeType,
|
2024-05-19 13:20:42 +00:00
|
|
|
|
LayoutType,
|
2024-06-01 15:15:29 +00:00
|
|
|
|
ThemeModeType,
|
2024-05-19 13:20:42 +00:00
|
|
|
|
} from '@vben-core/typings';
|
|
|
|
|
|
|
|
|
|
interface VbenLayoutProps {
|
|
|
|
|
/**
|
|
|
|
|
* 内容区域定宽
|
|
|
|
|
* @default 'wide'
|
|
|
|
|
*/
|
|
|
|
|
contentCompact?: ContentCompactType;
|
|
|
|
|
/**
|
|
|
|
|
* 定宽布局宽度
|
|
|
|
|
* @default 1200
|
|
|
|
|
*/
|
|
|
|
|
contentCompactWidth?: number;
|
|
|
|
|
/**
|
|
|
|
|
* padding
|
|
|
|
|
* @default 16
|
|
|
|
|
*/
|
|
|
|
|
contentPadding?: number;
|
|
|
|
|
/**
|
|
|
|
|
* paddingBottom
|
|
|
|
|
* @default 16
|
|
|
|
|
*/
|
|
|
|
|
contentPaddingBottom?: number;
|
|
|
|
|
/**
|
|
|
|
|
* paddingLeft
|
|
|
|
|
* @default 16
|
|
|
|
|
*/
|
|
|
|
|
contentPaddingLeft?: number;
|
|
|
|
|
/**
|
|
|
|
|
* paddingRight
|
|
|
|
|
* @default 16
|
|
|
|
|
*/
|
|
|
|
|
contentPaddingRight?: number;
|
|
|
|
|
/**
|
|
|
|
|
* paddingTop
|
|
|
|
|
* @default 16
|
|
|
|
|
*/
|
|
|
|
|
contentPaddingTop?: number;
|
2024-06-09 05:31:43 +00:00
|
|
|
|
/**
|
|
|
|
|
* footer 是否可见
|
|
|
|
|
* @default false
|
|
|
|
|
*/
|
|
|
|
|
footerEnable?: boolean;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* footer 是否固定
|
|
|
|
|
* @default true
|
|
|
|
|
*/
|
|
|
|
|
footerFixed?: boolean;
|
|
|
|
|
/**
|
|
|
|
|
* footer 高度
|
|
|
|
|
* @default 32
|
|
|
|
|
*/
|
|
|
|
|
footerHeight?: number;
|
2024-07-15 15:53:58 +00:00
|
|
|
|
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* header高度
|
|
|
|
|
* @default 48
|
|
|
|
|
*/
|
|
|
|
|
headerHeight?: number;
|
2024-06-01 14:17:52 +00:00
|
|
|
|
/**
|
|
|
|
|
* 顶栏是否隐藏
|
|
|
|
|
* @default false
|
|
|
|
|
*/
|
|
|
|
|
headerHidden?: boolean;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* header 显示模式
|
|
|
|
|
* @default 'fixed'
|
|
|
|
|
*/
|
2024-06-01 15:15:29 +00:00
|
|
|
|
headerMode?: LayoutHeaderModeType;
|
2024-08-14 13:47:37 +00:00
|
|
|
|
/**
|
|
|
|
|
* header 顶栏主题
|
|
|
|
|
*/
|
|
|
|
|
headerTheme?: ThemeModeType;
|
2024-07-10 13:20:11 +00:00
|
|
|
|
/**
|
|
|
|
|
* 是否显示header切换侧边栏按钮
|
|
|
|
|
* @default
|
|
|
|
|
*/
|
|
|
|
|
headerToggleSidebarButton?: boolean;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* header是否显示
|
|
|
|
|
* @default true
|
|
|
|
|
*/
|
|
|
|
|
headerVisible?: boolean;
|
|
|
|
|
/**
|
|
|
|
|
* 是否移动端显示
|
|
|
|
|
* @default false
|
|
|
|
|
*/
|
|
|
|
|
isMobile?: boolean;
|
|
|
|
|
/**
|
|
|
|
|
* 布局方式
|
2024-06-09 07:39:11 +00:00
|
|
|
|
* sidebar-nav 侧边菜单布局
|
2024-05-19 13:20:42 +00:00
|
|
|
|
* header-nav 顶部菜单布局
|
|
|
|
|
* mixed-nav 侧边&顶部菜单布局
|
2024-06-09 07:39:11 +00:00
|
|
|
|
* sidebar-mixed-nav 侧边混合菜单布局
|
2024-05-19 13:20:42 +00:00
|
|
|
|
* full-content 全屏内容布局
|
2024-06-09 07:39:11 +00:00
|
|
|
|
* @default sidebar-nav
|
2024-05-19 13:20:42 +00:00
|
|
|
|
*/
|
|
|
|
|
layout?: LayoutType;
|
|
|
|
|
/**
|
|
|
|
|
* 侧边菜单折叠状态
|
|
|
|
|
* @default false
|
|
|
|
|
*/
|
2024-06-09 07:39:11 +00:00
|
|
|
|
sidebarCollapse?: boolean;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* 侧边菜单是否折叠时,是否显示title
|
|
|
|
|
* @default true
|
|
|
|
|
*/
|
2024-06-09 07:39:11 +00:00
|
|
|
|
sidebarCollapseShowTitle?: boolean;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
2024-06-09 07:39:11 +00:00
|
|
|
|
* 侧边栏是否可见
|
|
|
|
|
* @default true
|
2024-05-19 13:20:42 +00:00
|
|
|
|
*/
|
2024-06-09 07:39:11 +00:00
|
|
|
|
sidebarEnable?: boolean;
|
2024-07-18 13:59:18 +00:00
|
|
|
|
/**
|
|
|
|
|
* 侧边菜单折叠额外宽度
|
|
|
|
|
* @default 48
|
|
|
|
|
*/
|
|
|
|
|
sidebarExtraCollapsedWidth?: number;
|
2024-06-01 14:17:52 +00:00
|
|
|
|
/**
|
|
|
|
|
* 侧边栏是否隐藏
|
|
|
|
|
* @default false
|
|
|
|
|
*/
|
2024-06-09 07:39:11 +00:00
|
|
|
|
sidebarHidden?: boolean;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* 混合侧边栏宽度
|
|
|
|
|
* @default 80
|
|
|
|
|
*/
|
2024-06-09 07:39:11 +00:00
|
|
|
|
sidebarMixedWidth?: number;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* 侧边栏
|
|
|
|
|
* @default dark
|
|
|
|
|
*/
|
2024-06-09 07:39:11 +00:00
|
|
|
|
sidebarTheme?: ThemeModeType;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* 侧边栏宽度
|
|
|
|
|
* @default 210
|
|
|
|
|
*/
|
2024-06-09 07:39:11 +00:00
|
|
|
|
sidebarWidth?: number;
|
2024-07-22 16:03:59 +00:00
|
|
|
|
/**
|
|
|
|
|
* 侧边菜单折叠宽度
|
|
|
|
|
* @default 48
|
|
|
|
|
*/
|
|
|
|
|
sideCollapseWidth?: number;
|
2024-06-09 07:39:11 +00:00
|
|
|
|
/**
|
|
|
|
|
* tab是否可见
|
|
|
|
|
* @default true
|
|
|
|
|
*/
|
|
|
|
|
tabbarEnable?: boolean;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* tab高度
|
|
|
|
|
* @default 30
|
|
|
|
|
*/
|
2024-07-10 13:20:11 +00:00
|
|
|
|
tabbarHeight?: number;
|
2024-05-19 13:20:42 +00:00
|
|
|
|
/**
|
|
|
|
|
* zIndex
|
|
|
|
|
* @default 100
|
|
|
|
|
*/
|
|
|
|
|
zIndex?: number;
|
|
|
|
|
}
|
|
|
|
|
export type { VbenLayoutProps };
|