0.3.19 • Published 4 months ago
@ljweb/layout-antdv v0.3.19
@ljweb/layout-antdv
LayoutAdmin 组件
管理端页面级整体布局。
Props
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
logo | string| slot | - | 图标 |
title | string| slot | - | 标题 |
menus | MenuConfig[] | [] | 左侧菜单 |
layoutType | sidermenu|topmenu | mixedmenu | mixedmenu | 布局类型。sidermenu: 显示在 Sider不显示 Header。topmenu:显示在 Header不显示 Sider。mixedmenu: menu.position 为 top 显示在 Header, 否则显示在 Sider |
contentWidth | fluid| fixed | fluid | 内容显示宽度。fluid:100% 宽度。fixed:固定宽度 |
fixedHeader | boolean | true | 固定 Header |
fixSiderbar | boolean | true | 固定 Siderbar |
autoHideHeader | boolean | false | 向下滚动时隐藏 Header |
sideCollapsed | boolean | auto | disabled | auto | 折叠方式 boolean 时,初始化折叠状态 auto 时,根据页面宽度展开/折叠 disabled: 不折叠 |
sideCollapsedMouseAnimationDisabled | boolean | false | 鼠标动画禁用 |
menuTriggerImmediately | boolean | true | 点击立即切换页面 |
loading | boolean | false | 显示 loading |
loadingText | string | Loading... | loading 文字 |
prefixCls | string | - | 样式名称前缀 |
i18nKeyPrefix | string | components.layout_admin | 多语言 key 前缀 |
onInitRouteChange | Function | (callback: (path: string) => void) => void | 初始化路由变更监听 |
事件
名称 | 回调参数 | 说明 |
---|---|---|
menuClick | Function({ path: string, resolved: { path: string; resolved: boolean } }) | 菜单点击事件 |
LayoutAdmin.BreadcrumbProvider
提供路由面包屑数据给 BreadcrumbContainer 使用
Props
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
breadcrumb | BreadcrumbConfig[] | - | 面包屑(必须) |
LayoutAdmin.BreadcrumbContainer
面包屑容器 如果嵌套使用时,只显示最外层的面包屑
Props
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
breadcrumb | boolean | PresetBreadcrumbItem[] | ((routeBreadcrumbs: BreadcrumbConfig[]) => Exclude<PresetBreadcrumbItem, String>[]) | true | 传入的面包屑数据, 默认值:true;当为 true 时,使用路由的面包屑数据;当为 false 时,不显示面包屑 |
MenuConfigType
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
key | string | - | 唯一标识 |
title | string | - | 标题 |
path | string | - | 跳转地址 |
redirect | string | - | 重定向地址 |
icon | any | - | svg格式地址或antd icon |
target | _blank | _self | - | 跳转方式。_self: 当前标签页打开。_blank:新标签页打开 |
position | top | side | sub | - | 菜单位置。top:一级菜单。side:二级菜单。sub:三级菜单 |
display | boolean | false | 菜单中不显示 |
breadcrumb | boolean | false | 面包屑不显示 |
PresetBreadcrumbItem
type PresetBreadcrumbItem = BreadcrumbConfig | DefineComponent<any> | '_route'
BreadcrumbConfigType
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
key | string | - | 唯一标识 |
path | string | - | 跳转地址 |
label | string | - | 名称 |
AsyncTable
表格组件
Props
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
columns | Column[] | - | 表格列的配置描述(必须) |
dataSource | (filter: { page: number;size: number;sortField?: string;sortOrder?: 'ASC' | 'DESC';}) => PagedDataSource | Promise\ | - | 数据源(必须) |
rowsFieldName | string | rows | dataSource 返回数据字段 |
totolFieldName | string | total | dataSource 返回行数字段 |
pageNum | number | 1 | 页数 |
pageSize | number | 10 | 页大小 |
showSizeChanger | boolean | true | 页大小是否可改变 |
showPagination | 'auto' | boolean | auto | 显示分页 |
pageURI | boolean | false | 启用分页 URI 模式。例如: /users/1 /users?pageNoKey=1 |
pageNoKey | string | page | URI 模式下显示分页 current 的 key |
pageSizeKey | string | size | URI 模式下显示分页 size 的 key |
alert | {show:boolean; clear: (() => void) | true;} | boolean | false | 显示汇总(column 配置 needTotal) 例如:{ show: true, clear: Function | true } | true |
i18nKeyPrefix | string | components.async_table | 多语言 key 前缀 |
PagedDataSourceTypes
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
rows | any[] | - | 列表数据集合 |
total | number | - | 列表数据总条数 |
SearchForm
表格数据操作相关 Form 组件(包括搜索、筛选、批量操作、总数等)
Props
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
prefixCls | string | - | 组件样式名前缀 |
keywordPlaceholder | string | - | 关键字筛选输入框占位符 |
keywordName | string | keyword | 关键字名字,显示到 URI query 中的 key |
keywordTypeOptions | Array\<{ label: string; value: string | number; default?: true }> | - | 关键字类型下拉框选项 |
keywordTypeName | string | keywordType | 关键字类型名字,显示 URI query 中的 key |
statusName | string | status | 状态名字,显示到 URI query 中的 key |
statusOptions | StatusOption[] | - | 左上角状态搜索链接配置 |
keepStatusShown | boolean | false | 一直显示所有状态(statusOptions 中的配置会抵消),默认:count > 0 的时候才显示 |
bulkAcitonOptions | {value: string | number;label: string;}[] | - | 批量操作,如果没有选项则不显示 |
bulkApplying | boolean | - | apply 按纽 loading 状态 |
rowCount | number | - | dataSource 行数(显示在表格的右上角), 当 >0 时显示批量操作, 当 scopedSlots.filterRight 有设置时,右上角行数不显示 |
i18nKeyPrefix | string | components.search_form | 多语言 key 前缀 |
StatusOptionTypes
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
value | string | number | undefined | Record<string, string | number> | - | 状态值 |
label | string | - | 状态名称 |
count | number | - | 数量 |
tooltip | string | - | 气泡提示内容 |
keepStatusShown | boolean | false | 一直显示当前状态(option.keepStatusShown, prop.keepStatusShown, count > 0 任一条件满足即显示) |
AvatarDropdown
头像下拉菜单
Props
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
name | string | - | 显示名 |
src | string | - | 头像图片路径 |
avatarProps | Omit\<OmitVue\, 'src'> | - | 头像大小(AvatarProps 内容详见 antdv Avatar 组件) |
avatarColor | string | #fff | 当没有头像图片但有用户名(显示用户名第一个字母),显示的文字颜色 |
avatarBackgroundColor | string | #f67280 | 当没有头像图片但有用户名(显示用户名第一个字母),显示的背景色 |
popoverDisabled | boolean | false | 禁用 Popover 显示 |
prefixCls | string | - | 组件样式名前缀 |
i18nKeyPrefix | string | components.avatar_dropdown | 多语言 key 前缀 |
Breadcrumb
面包屑
Props
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
items | Array\<BreadcrumbItem | DefineComponent\> | - | 设置 null, 将会根据$route 变化生成,如需传自定义参数,初始值必须设置成数组 |
i18nKeyPrefix | string | components.breadcrumb | 多语言 key 前缀 |
BreadcrumbItemTypes
参数 | 类型 | 默认值 | 说明 |
---|---|---|---|
label | string | - | 名称 |
to | string | - | 跳转地址 |
isLink | boolean | - | 作为链接展示 |
0.3.19
4 months ago
0.3.18
4 months ago
0.3.9
9 months ago
0.3.17
9 months ago
0.3.16
9 months ago
0.3.15
9 months ago
0.3.14
9 months ago
0.3.13
9 months ago
0.3.12
9 months ago
0.3.11
9 months ago
0.3.10
9 months ago
0.3.5
10 months ago
0.3.8
9 months ago
0.3.7
9 months ago
0.3.2
10 months ago
0.3.1
10 months ago
0.3.4
10 months ago
0.3.3
10 months ago
0.3.0
11 months ago
0.2.9
11 months ago
0.2.8
11 months ago
0.2.7
11 months ago
0.2.6
11 months ago
0.2.5
11 months ago
0.2.4
11 months ago
0.2.4-alpha
11 months ago
0.2.3-alpha
11 months ago
0.2.2-alpha
11 months ago
0.2.1-alpha
11 months ago
0.2.0-alpha
11 months ago
0.1.0-alpha
11 months ago