mirror of
https://repository.entgra.net/community/device-mgt-core.git
synced 2025-10-06 02:01:45 +00:00
Remove notification sidebar from the Devicemgt react app
This commit is contained in:
parent
69bbd8d512
commit
cadb55f256
@ -1,172 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright (c) 2020, Entgra (pvt) Ltd. (http://entgra.io) All Rights Reserved.
|
|
||||||
*
|
|
||||||
* Entgra (pvt) Ltd. licenses this file to you under the Apache License,
|
|
||||||
* Version 2.0 (the "License"); you may not use this file except
|
|
||||||
* in compliance with the License.
|
|
||||||
* You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing,
|
|
||||||
* software distributed under the License is distributed on an
|
|
||||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
||||||
* KIND, either express or implied. See the License for the
|
|
||||||
* specific language governing permissions and limitations
|
|
||||||
* under the License.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import React from 'react';
|
|
||||||
import { Drawer, message, notification, Card, Button } from 'antd';
|
|
||||||
import { withConfigContext } from '../../../../components/ConfigContext';
|
|
||||||
import axios from 'axios';
|
|
||||||
import { Link } from 'react-router-dom';
|
|
||||||
|
|
||||||
// eslint-disable-next-line no-unused-vars
|
|
||||||
let config = null;
|
|
||||||
|
|
||||||
class NotificationsDrawer extends React.Component {
|
|
||||||
routes;
|
|
||||||
|
|
||||||
constructor(props) {
|
|
||||||
super(props);
|
|
||||||
this.routes = props.routes;
|
|
||||||
config = this.props.context;
|
|
||||||
this.state = {
|
|
||||||
visible: false,
|
|
||||||
data: [],
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
showDrawer = () => {
|
|
||||||
this.setState({
|
|
||||||
visible: true,
|
|
||||||
});
|
|
||||||
this.fetchNotifications();
|
|
||||||
};
|
|
||||||
|
|
||||||
onClose = () => {
|
|
||||||
this.setState({
|
|
||||||
visible: false,
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
fetchNotifications = () => {
|
|
||||||
const config = this.props.context;
|
|
||||||
axios
|
|
||||||
.get(
|
|
||||||
window.location.origin +
|
|
||||||
config.serverConfig.invoker.uri +
|
|
||||||
config.serverConfig.invoker.deviceMgt +
|
|
||||||
'/notifications',
|
|
||||||
)
|
|
||||||
.then(res => {
|
|
||||||
if (res.status === 200) {
|
|
||||||
this.setState({ data: res.data.data.notifications });
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
if (error.hasOwnProperty('response') && error.response.status === 401) {
|
|
||||||
// todo display a popop with error
|
|
||||||
message.error('You are not logged in');
|
|
||||||
window.location.href = window.location.origin + '/entgra/login';
|
|
||||||
} else {
|
|
||||||
notification.error({
|
|
||||||
message: 'There was a problem',
|
|
||||||
duration: 0,
|
|
||||||
description:
|
|
||||||
'Error occurred while trying to load notifications list.',
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
clearNotifications = () => {
|
|
||||||
const config = this.props.context;
|
|
||||||
axios
|
|
||||||
.put(
|
|
||||||
window.location.origin +
|
|
||||||
config.serverConfig.invoker.uri +
|
|
||||||
config.serverConfig.invoker.deviceMgt +
|
|
||||||
'/notifications/clear-all',
|
|
||||||
{ 'Content-Type': 'application/json; charset=utf-8' },
|
|
||||||
)
|
|
||||||
.then(res => {
|
|
||||||
if (res.status === 200) {
|
|
||||||
notification.success({
|
|
||||||
message: 'Done',
|
|
||||||
duration: 0,
|
|
||||||
description: 'All notifications are cleared.',
|
|
||||||
});
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
if (error.hasOwnProperty('response') && error.response.status === 401) {
|
|
||||||
// todo display a popop with error
|
|
||||||
message.error('You are not logged in');
|
|
||||||
window.location.href = window.location.origin + '/entgra/login';
|
|
||||||
} else {
|
|
||||||
notification.error({
|
|
||||||
message: 'There was a problem',
|
|
||||||
duration: 0,
|
|
||||||
description: 'Error occurred while trying to clear notifications.',
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.setState({
|
|
||||||
visible: false,
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
render() {
|
|
||||||
const { data } = this.state;
|
|
||||||
const notificationItemList = data.map(data => (
|
|
||||||
<Card
|
|
||||||
key={data.id}
|
|
||||||
bordered={true}
|
|
||||||
hoverable={true}
|
|
||||||
style={{ width: 350 }}
|
|
||||||
>
|
|
||||||
<h3>{data.deviceType + ':' + data.deviceName}t</h3>
|
|
||||||
<p>{data.description}</p>
|
|
||||||
</Card>
|
|
||||||
));
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<div onClick={this.showDrawer}>
|
|
||||||
<div>
|
|
||||||
<span>Notifications</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Drawer
|
|
||||||
title="Notifications"
|
|
||||||
placement="right"
|
|
||||||
closable={false}
|
|
||||||
onClose={this.onClose}
|
|
||||||
visible={this.state.visible}
|
|
||||||
width={400}
|
|
||||||
>
|
|
||||||
<Link to="/entgra/notifications">
|
|
||||||
<Button
|
|
||||||
type="primary"
|
|
||||||
style={{ marginRight: 10, marginBottom: 10 }}
|
|
||||||
onClick={this.onClose}
|
|
||||||
>
|
|
||||||
Show All Notifications
|
|
||||||
</Button>
|
|
||||||
</Link>
|
|
||||||
<Button
|
|
||||||
type="primary"
|
|
||||||
style={{ marginRight: 10, marginBottom: 10 }}
|
|
||||||
onClick={this.clearNotifications}
|
|
||||||
>
|
|
||||||
Clear All Notifications
|
|
||||||
</Button>
|
|
||||||
{notificationItemList}
|
|
||||||
</Drawer>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export default withConfigContext(NotificationsDrawer);
|
|
||||||
@ -23,7 +23,6 @@ import RouteWithSubRoutes from '../../components/RouteWithSubRoutes';
|
|||||||
import { Redirect } from 'react-router';
|
import { Redirect } from 'react-router';
|
||||||
import './styles.css';
|
import './styles.css';
|
||||||
import { withConfigContext } from '../../components/ConfigContext';
|
import { withConfigContext } from '../../components/ConfigContext';
|
||||||
import NotificationsDrawer from './components/NotificationsDrawer';
|
|
||||||
import Logout from './components/Logout';
|
import Logout from './components/Logout';
|
||||||
|
|
||||||
const { Header, Content, Footer } = Layout;
|
const { Header, Content, Footer } = Layout;
|
||||||
@ -179,7 +178,9 @@ class Home extends React.Component {
|
|||||||
</Menu.Item>
|
</Menu.Item>
|
||||||
</SubMenu>
|
</SubMenu>
|
||||||
<Menu.Item className="profile" key="Notifications">
|
<Menu.Item className="profile" key="Notifications">
|
||||||
<NotificationsDrawer />
|
<Link to="/entgra/notifications">
|
||||||
|
<span>Notifications</span>
|
||||||
|
</Link>
|
||||||
</Menu.Item>
|
</Menu.Item>
|
||||||
<SubMenu
|
<SubMenu
|
||||||
className="profile"
|
className="profile"
|
||||||
|
|||||||
@ -183,8 +183,7 @@ class NotificationsTable extends React.Component {
|
|||||||
// position: "top",
|
// position: "top",
|
||||||
total: data.count,
|
total: data.count,
|
||||||
showTotal: (total, range) =>
|
showTotal: (total, range) =>
|
||||||
`showing ${range[0]}-${range[1]} of ${total} devices`,
|
`showing ${range[0]}-${range[1]} of ${total} notifications`,
|
||||||
// showQuickJumper: true
|
|
||||||
}}
|
}}
|
||||||
loading={loading}
|
loading={loading}
|
||||||
onChange={this.handleTableChange}
|
onChange={this.handleTableChange}
|
||||||
|
|||||||
@ -32,16 +32,9 @@ import { Link } from 'react-router-dom';
|
|||||||
|
|
||||||
import NotificationsTable from './Components/NotificationsTable';
|
import NotificationsTable from './Components/NotificationsTable';
|
||||||
|
|
||||||
// eslint-disable-next-line no-unused-vars
|
|
||||||
let config = null;
|
|
||||||
|
|
||||||
class Notifications extends React.Component {
|
class Notifications extends React.Component {
|
||||||
routes;
|
|
||||||
|
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
this.routes = props.routes;
|
|
||||||
config = this.props.context;
|
|
||||||
this.state = {
|
this.state = {
|
||||||
visible: false,
|
visible: false,
|
||||||
data: [],
|
data: [],
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user