import { CSSProperties, ReactNode } from 'react'; import { ProWaterMarkType } from '../ProWaterMark/propsType'; /** * @description 应用选项类型(无分组模式) */ export interface AppsOption { /** * @description 应用唯一标识值 * @default - */ value: string; /** * @description 应用名称 * @default - */ label: ReactNode; /** * @description 应用图标 * @default - */ icon?: ReactNode; /** * @description 点击回调 * @default - */ onChange?: (value: string, option: AppsOption) => void; /** * @description 允许扩展字段 */ [key: string]: any; } /** * @description 应用分组类型(分组模式) */ export interface AppsGroup { /** * @description 分组唯一标识 * @default - */ value: string; /** * @description 分组名称 * @default - */ label: ReactNode; /** * @description 分组图标 * @default - */ icon?: ReactNode; /** * @description 该分组下的应用列表 * @default [] */ options: AppsOption[]; /** * @description 允许扩展字段 */ [key: string]: any; } export interface MenusType { /** * @description 菜单ID * @default - */ id?: number; /** * @description 菜单唯一code * @default - */ code?: string; /** * @description 菜单名称 * @default - */ name?: string; /** * @description 菜单路由 * @default - */ url?: string; /** * @description 点击路由时,重定向地址 * @default - */ redirectUrl?: string; /** * @description 关联的上级id * @default - */ parentId?: number | null; /** * @description 备注 * @default - */ description?: any; /** * @description 扩展备用字段 * @default - */ extraInfo?: any; /** * @description 排序 * @default - */ sort?: number | undefined | null; /** * @description 是否隐藏菜单 * @default false */ hideInMenu?: boolean; /** * @description iconfont图标 * @default - */ icon?: string; /** * @description 图片icon * @default - */ imgUrl?: string; /** * @description 菜单类型 * @default - */ type?: string; /** * @description 当前菜单点击后的打开方式 * @default "_self" */ target?: '_blank' | '_parent' | '_self' | '_top'; /** * @description 允许扩展字段 */ [key: string]: any; } export interface DataSourceType { /** * @description 用户信息 * @default - */ userInfo?: any; /** * @description 处理后一级菜单详情 * @default [] */ menus?: MenusType[]; } /** * @description 是否带有菜单界面的配置 */ type pureKey = boolean | { topMenu?: boolean; leftMenu?: boolean; }; interface ProLayoutBaseProps { /** * @description 左侧logo * @default - */ logo?: ReactNode | string; /** * @description 类名 * @default "" */ className?: string; /** * @description iconfontUrl * @default - */ iconfontUrl?: string; /** * @description 右侧内容渲染 * @default - */ rightContentRender?: ReactNode; /** * @description 头部内容渲染 * @default - */ headerContentRender?: ReactNode; /** * @description 侧边栏底部渲染 * @default - */ sideMenuFooterRender?: ReactNode; /** * @description 头部标题区自定义渲染 * @default - */ headerTitleRender?: ReactNode; /** * @description 通告 * @default - */ headerNotice?: ReactNode | string; /** * @description 通告 * @default - */ notice?: ReactNode | string; /** * @description 标题 * @default - */ title?: string; /** * @description 数据源 * @default - */ dataSource?: DataSourceType | Partial; /** * @description 是否折叠 * @default false */ collapsed?: boolean; /** * @description 菜单拼接路径前缀 * @default "" */ pathPrefix?: string; /** * @description 是否带有菜单界面,true不带,只显示content内容 * @default false */ pure?: pureKey; /** * @description 头部区域高度 * @default 64 */ headerHeight?: number; /** * @description 内容区域样式 * @default {} */ contentStyle?: CSSProperties; /** * @description 水印配置 * @default {} */ waterMarkProps?: ProWaterMarkType; /** * @description 折叠回调事件 * @default - */ onCollapsedChange?: (collapsed: boolean) => void; /** * @description 菜单点击回调事件,返回命中的菜单项数据和完整路径 * @default - */ onMenuClick?: (params: { item: MenusType | null; key: string; keyPath: string[]; }) => void | boolean; /** * @description 规定在何处打开被链接文档 * @default "_self" */ target?: '_blank' | '_parent' | '_self' | '_top'; /** * @description 子元素 * @default - */ children?: ReactNode; /** * @description 应用入口配置(支持分组和扁平两种模式) * @default - */ appsOptions?: AppsGroup[] | AppsOption[]; /** * @description 允许扩展字段 */ [key: string]: any; } export interface ProLayoutStatesType { /** * @description 是否折叠 * @default false */ collapsed?: boolean; /** * @description 通告 * @default - */ notice?: ReactNode | string; /** * @description 菜单列表 * @default [] */ menus?: MenusType[]; /** * @description 选中的路径 * @default "" */ selectedPath?: string; /** * @description 允许扩展字段 */ [key: string]: any; } export interface TabItem { /** * @description 标签唯一标识 */ id: string; /** * @description 组件标识码 */ code: string; /** * @description 标签名称 */ name: string; /** * @description 标签标题(废弃,保留兼容) */ title: string; /** * @description 标签关联路由 */ url?: string; /** * @description 是否可关闭 */ closable: boolean; /** * @description 关联菜单项 */ menuItem?: MenusType; /** * @description 额外扩展数据 */ extra?: Record; /** * @description 图标 */ icon?: ReactNode | string; } export interface TabsState { tabsList: TabItem[]; activeKey: string; activeTabInfo?: TabItem; newTabIndex: number; activeComponent?: string; } export type TabsStorageStrategy = 'localStorage' | 'sessionStorage'; /** * @description 添加标签页的业务参数 */ export interface AddTabParams { /** * @description 组件标识码,用于映射到具体的 React 组件 */ code: string; /** * @description 标签页显示名称 */ name: string; /** * @description 额外的业务数据 */ extra?: Record; } /** * @description 添加标签页的选项 */ export interface AddTabOptions { /** * @description 是否强制创建新标签页(忽略已存在的相同标签页),默认 false */ forceNew?: boolean; } /** * @description 获取标签页信息返回值 */ export interface TabsInfoResult { /** 标签页列表 */ tabsList: TabItem[]; /** 当前激活的标签页信息 */ activeTabInfo?: TabItem; /** 当前激活的组件标识 */ activeComponent: string; } /** * @description ProLayout 标签页实例接口(类似 FormInstance) */ export interface ProLayoutTabsInstance { /** * @description 添加标签页 */ addTab: (params: AddTabParams, options?: AddTabOptions) => void; /** * @description 删除标签页 */ removeTab: (tabId: string) => void; /** * @description 获取标签页信息 */ getTabInfo: () => TabsInfoResult; } export interface TabsConfig { max?: number; storage?: TabsStorageStrategy; cacheKey?: string; onTabChange?: (activeKey: string, activeTab: TabItem | undefined, allTabs: TabItem[]) => void; /** * @description 是否允许标签页拖拽排序 * @default true */ draggable?: boolean; /** * @description 激活组件解析函数,根据 component 标识返回对应的 React 组件 */ activeComponent?: (component: string) => React.ComponentType | null; /** * @description 空状态组件,当没有标签页时显示 */ empty?: ReactNode; /** * @description 自定义右键菜单项,会替换默认菜单项 */ menuItems?: import('antd').MenuProps['items']; /** * @description 自定义菜单项点击回调 */ tabMenuClick?: (params: { key: string; tab: TabItem; tabs: TabItem[]; }) => void; /** * @description 声明式固定标签页,传入菜单 code 数组,这些 tab 会在初始化时自动添加且不可关闭 * @example fixed: ['Workspace', 'PolicyInput'] */ fixed?: string[]; } export type ProLayoutMode = 'normal' | 'tabs'; export interface ProLayoutTabsProps extends ProLayoutBaseProps { mode: 'tabs'; tabs: TabsConfig; } export interface ProLayoutNormalProps extends ProLayoutBaseProps { mode?: 'normal'; tabs?: never; } export type ProLayoutType = ProLayoutTabsProps | ProLayoutNormalProps; export declare const isTabsMode: (props: ProLayoutType) => props is ProLayoutTabsProps; export declare const validateTabsProps: (mode?: ProLayoutMode, tabs?: TabsConfig) => void; export {};