Files
lgp-admin-plus/packages/@core/ui-kit/layout-ui/src/vben-layout.ts

177 lines
3.0 KiB
TypeScript
Raw Normal View History

2024-05-19 21:20:42 +08:00
import type {
ContentCompactType,
2024-06-01 23:15:29 +08:00
LayoutHeaderModeType,
2024-05-19 21:20:42 +08:00
LayoutType,
2024-06-01 23:15:29 +08:00
ThemeModeType,
2024-05-19 21:20:42 +08: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;
/**
* footer背景颜色
* @default #fff
*/
footerBackgroundColor?: string;
2024-06-09 13:31:43 +08:00
/**
* footer 是否可见
* @default false
*/
footerEnable?: boolean;
2024-05-19 21:20:42 +08:00
/**
* footer 是否固定
* @default true
*/
footerFixed?: boolean;
/**
* footer 高度
* @default 32
*/
footerHeight?: number;
/**
* 背景颜色
* @default #fff
*/
headerBackgroundColor?: string;
/**
* header高度
* @default 48
*/
headerHeight?: number;
/**
* header高度增加高度
* 在顶部存在导航时,额外加高header高度
* @default 10
*/
headerHeightOffset?: number;
2024-06-01 22:17:52 +08:00
/**
* 顶栏是否隐藏
* @default false
*/
headerHidden?: boolean;
2024-05-19 21:20:42 +08:00
/**
* header 显示模式
* @default 'fixed'
*/
2024-06-01 23:15:29 +08:00
headerMode?: LayoutHeaderModeType;
2024-05-19 21:20:42 +08:00
/**
* header是否显示
* @default true
*/
headerVisible?: boolean;
/**
* 是否移动端显示
* @default false
*/
isMobile?: boolean;
/**
* 布局方式
2024-06-09 15:39:11 +08:00
* sidebar-nav 侧边菜单布局
2024-05-19 21:20:42 +08:00
* header-nav 顶部菜单布局
* mixed-nav 侧边&顶部菜单布局
2024-06-09 15:39:11 +08:00
* sidebar-mixed-nav 侧边混合菜单布局
2024-05-19 21:20:42 +08:00
* full-content 全屏内容布局
2024-06-09 15:39:11 +08:00
* @default sidebar-nav
2024-05-19 21:20:42 +08:00
*/
layout?: LayoutType;
2024-06-09 15:39:11 +08:00
/**
* 侧边菜单折叠宽度
* @default 48
*/
sideCollapseWidth?: number;
2024-05-19 21:20:42 +08:00
/**
* 侧边菜单折叠状态
* @default false
*/
2024-06-09 15:39:11 +08:00
sidebarCollapse?: boolean;
2024-05-19 21:20:42 +08:00
/**
* 侧边菜单是否折叠时,是否显示title
* @default true
*/
2024-06-09 15:39:11 +08:00
sidebarCollapseShowTitle?: boolean;
2024-05-19 21:20:42 +08:00
/**
2024-06-09 15:39:11 +08:00
* 侧边栏是否可见
* @default true
2024-05-19 21:20:42 +08:00
*/
2024-06-09 15:39:11 +08:00
sidebarEnable?: boolean;
2024-06-01 22:17:52 +08:00
/**
* 侧边栏是否隐藏
* @default false
*/
2024-06-09 15:39:11 +08:00
sidebarHidden?: boolean;
2024-05-19 21:20:42 +08:00
/**
* 混合侧边栏宽度
* @default 80
*/
2024-06-09 15:39:11 +08:00
sidebarMixedWidth?: number;
2024-05-19 21:20:42 +08:00
/**
* 侧边栏是否半深色
* @default false
*/
2024-06-09 15:39:11 +08:00
sidebarSemiDark?: boolean;
2024-05-19 21:20:42 +08:00
/**
* 侧边栏
* @default dark
*/
2024-06-09 15:39:11 +08:00
sidebarTheme?: ThemeModeType;
2024-05-19 21:20:42 +08:00
/**
* 侧边栏宽度
* @default 210
*/
2024-06-09 15:39:11 +08:00
sidebarWidth?: number;
/**
* tab是否可见
* @default true
*/
tabbarEnable?: boolean;
2024-05-19 21:20:42 +08:00
/**
* footer背景颜色
* @default #fff
*/
tabsBackgroundColor?: string;
/**
* tab高度
* @default 30
*/
tabsHeight?: number;
/**
* zIndex
* @default 100
*/
zIndex?: number;
}
export type { VbenLayoutProps };