Commit 89b3d2ee authored by jim's avatar jim Committed by 陈帅

NoticeIcon add hideClear props

parent 02f06240
...@@ -14,6 +14,7 @@ export interface INoticeIconTabProps { ...@@ -14,6 +14,7 @@ export interface INoticeIconTabProps {
emptyText?: React.ReactNode; emptyText?: React.ReactNode;
emptyImage?: string; emptyImage?: string;
style?: React.CSSProperties; style?: React.CSSProperties;
hideClear?: boolean;
} }
export default class NoticeIconTab extends React.Component<INoticeIconTabProps, any> {} export default class NoticeIconTab extends React.Component<INoticeIconTabProps, any> {}
...@@ -11,6 +11,7 @@ export default function NoticeList({ ...@@ -11,6 +11,7 @@ export default function NoticeList({
locale, locale,
emptyText, emptyText,
emptyImage, emptyImage,
hideClear,
}) { }) {
if (data.length === 0) { if (data.length === 0) {
return ( return (
...@@ -51,10 +52,12 @@ export default function NoticeList({ ...@@ -51,10 +52,12 @@ export default function NoticeList({
); );
})} })}
</List> </List>
<div className={styles.clear} onClick={onClear}> {hideClear ? null : (
{locale.clear} <div className={styles.clear} onClick={onClear}>
{title} {locale.clear}
</div> {title}
</div>
)}
</div> </div>
); );
} }
---
title: NoticeIcon
subtitle: Notification Menu
cols: 1
order: 9
---
用在导航工具栏上,作为整个产品统一的通知中心。
## API
参数 | 说明 | 类型 | 默认值
----|------|-----|------
count | Total number of messages | number | -
loading | Popup card loading status | boolean | false
onClear | Click to clear button the callback | function(tabTitle) | -
onItemClick | Click on the list item's callback | function(item, tabProps) | -
onTabChange | Switching callbacks for tabs | function(tabTitle) | -
popupAlign | Popup card location configuration | Object [alignConfig](https://github.com/yiminghe/dom-align#alignconfig-object-details) | -
onPopupVisibleChange | Popup Card Showing or Hiding Callbacks | function(visible) | -
popupVisible | Popup card display state | boolean | -
locale | Default message text | Object | `{ emptyText: '暂无数据', clear: '清空' }`
### NoticeIcon.Tab
参数 | 说明 | 类型 | 默认值
----|------|-----|------
title | header for message Tab | string | -
list | List data, format refer to the following table | Array | `[]`
hideClear | Clear button display status | boolean | false
emptyText | message text when list is empty | ReactNode | -
emptyImage | image when list is empty | string | -
### Tab data
参数 | 说明 | 类型 | 默认值
----|------|-----|------
avatar | avatar img url | string | -
title | title | ReactNode | -
description | description info | ReactNode | -
datetime | Timestamps | ReactNode | -
extra |Additional information in the upper right corner of the list item | ReactNode | -
--- ---
title: title: NoticeIcon
en-US: NoticeIcon
zh-CN: NoticeIcon
subtitle: 通知菜单 subtitle: 通知菜单
cols: 1 cols: 1
order: 9 order: 9
...@@ -29,9 +27,11 @@ locale | 默认文案 | Object | `{ emptyText: '暂无数据', clear: '清空' } ...@@ -29,9 +27,11 @@ locale | 默认文案 | Object | `{ emptyText: '暂无数据', clear: '清空' }
----|------|-----|------ ----|------|-----|------
title | 消息分类的页签标题 | string | - title | 消息分类的页签标题 | string | -
list | 列表数据,格式参照下表 | Array | `[]` list | 列表数据,格式参照下表 | Array | `[]`
hideClear | 是否显示清空按钮 | boolean | false
emptyText | 针对每个 Tab 定制空数据文案 | ReactNode | - emptyText | 针对每个 Tab 定制空数据文案 | ReactNode | -
emptyImage | 针对每个 Tab 定制空数据图片 | string | - emptyImage | 针对每个 Tab 定制空数据图片 | string | -
### Tab data ### Tab data
参数 | 说明 | 类型 | 默认值 参数 | 说明 | 类型 | 默认值
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment