haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-14 14:21:23 +00:00
Code Issues Releases Wiki Activity

[user notifications] rewrote it with react (#4486)

Browse Source 
* [user notifications] rewrote it with react

* rewrote 'user notifications' page with react
* cleaned up the related files & code
* fixed 'popup notices'

* [seafile-js] updated the version
This commit is contained in:
llj
2020-03-24 15:24:47 +08:00
committed by GitHub
parent ac9e9b9ea4
commit 24b3b516bd
14 changed files with 287 additions and 253 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/components/common/notice-item.js
View File

@@ -7,7 +7,7 @@ import { Utils } from '../../utils/utils';
const propTypes = {
noticeItem: PropTypes.object.isRequired,
onNoticeItemClick: PropTypes.func.isRequired,
onNoticeItemClick: PropTypes.func
};
const MSG_TYPE_ADD_USER_TO_GROUP = 'add_user_to_group';
@@ -206,7 +206,19 @@ class NoticeItem extends React.Component {
return '';
}
return (
return this.props.tr ? (
<tr className={noticeItem.seen ? 'read' : 'unread font-weight-bold'}>
<td className="text-center">
<img src={avatar_url} width="32" height="32" className="avatar" alt="" />
</td>
<td className="pr-8">
<p className="m-0" dangerouslySetInnerHTML={{__html: notice}}></p>
</td>
<td>
{moment(noticeItem.time).fromNow()}
</td>
</tr>
) : (
<li onClick={this.onNoticeItemClick} className={noticeItem.seen ? 'read' : 'unread'}>
<div className="notice-item">
<div className="main-info">

7
frontend/src/components/common/notification.js
View File

@@ -19,7 +19,8 @@ class Notification extends React.Component {
});
}
onClick = () => {
onClick = (e) => {
e.preventDefault();
if (this.state.showNotice) {
seafileAPI.updateNotifications();
this.setState({
@@ -35,7 +36,7 @@ class Notification extends React.Component {
loadNotices = () => {
let page = 1;
let perPage = 5;
seafileAPI.listPopupNotices(page, perPage).then(res => {
seafileAPI.listNotifications(page, perPage).then(res => {
let noticeList = res.data.notification_list;
this.setState({noticeList: noticeList});
});
@@ -61,7 +62,7 @@ class Notification extends React.Component {
return (
<div id="notifications">
<a href="#" onClick={this.onClick} className="no-deco" id="notice-icon" title="Notifications" aria-label={gettext('Notifications')}>
<a href="#" onClick={this.onClick} className="no-deco" id="notice-icon" title={gettext('Notifications')} aria-label={gettext('Notifications')}>
<span className="sf2-icon-bell"></span>
<span className={`num ${this.state.unseenCount ? '' : 'hide'}`}>{this.state.unseenCount}</span>
</a>