Skip to content

Commit 60e21ac

Browse files
author
maharshi
committed
Profile section and header partitions
1 parent 31a0f0d commit 60e21ac

File tree

8 files changed

+728
-255
lines changed

8 files changed

+728
-255
lines changed

‎.idea/workspace.xml

Lines changed: 8 additions & 13 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎public/js/app.js

Lines changed: 448 additions & 131 deletions
Large diffs are not rendered by default.

‎resources/js/components/Dashboard/Dashboard.js

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import React ,{Component} from 'react';
2+
import SideMenu from "../Layout/SideMenu";
3+
import Navigation from "../Layout/TopNav";
4+
5+
class Dashboard extends Component{
6+
constructor(props) {
7+
super(props);
8+
}
9+
10+
render() {
11+
return (
12+
<div className="DashboardLayout" >
13+
<div id="app">
14+
<SideMenu/>
15+
<div id="main">
16+
<Navigation/>
17+
<div className="main-content container-fluid">
18+
<div className="page-title">
19+
<h3>Dashboard</h3>
20+
<p className="text-subtitle text-muted">A good dashboard to display your statistics</p>
21+
</div>
22+
<section className="section">
23+
24+
<div className="row mb-4">
25+
<div className="col-md-8">
26+
27+
28+
</div>
29+
30+
</div>
31+
</section>
32+
</div>
33+
</div>
34+
</div>
35+
</div>
36+
);
37+
}
38+
}
39+
40+
41+
export default Dashboard;

‎resources/js/components/Layout/App.js

Lines changed: 0 additions & 110 deletions
This file was deleted.

‎resources/js/components/Layout/Menu.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@ import React ,{Component} from 'react';
22
import { Switch } from "react-router-dom";
33
import { BrowserRouter as Router } from "react-router-dom";
44
import LoginModule from '../Login/Login';
5-
import AdminModule from '../Layout/App';
5+
import AdminModule from '../Dashboard/Dashboard';
6+
import UserProfile from '../User/Profile';
67
import PrivateRoute from '../RouteConfig/PrivateRoute';
78
import PublicRoute from '../RouteConfig/PublicRoute';
89
import LogoutModule from '../Layout/Logout/Index';
@@ -15,6 +16,7 @@ class Menu extends Component{
1516
<Switch>
1617
<PublicRoute restricted={true} path="/" component={LoginModule} exact />
1718
<PrivateRoute path="/dashboard" component={AdminModule} exact />
19+
<PrivateRoute path="/profile" component={UserProfile} exact />
1820
<PrivateRoute path="/logout" component={LogoutModule} exact />
1921
</Switch>
2022
</Router>

‎resources/js/components/Layout/SideMenu.js

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import React ,{Component} from 'react';
2+
import logo from '../../../../public/assets/images/logo.svg'
3+
const DashboardIcon = require('react-feather/dist/icons/home').default;
4+
import { Link } from "react-router-dom";
5+
6+
class SideMenu extends Component{
7+
constructor(props) {
8+
super(props);
9+
}
10+
11+
render() {
12+
return (
13+
<div className="SideMenuSection">
14+
<div id="sidebar" className='active'>
15+
<div className="sidebar-wrapper active">
16+
<div className="sidebar-header">
17+
<img src={logo} alt={"logo"}/>
18+
</div>
19+
<div className="sidebar-menu">
20+
<ul className="menu">
21+
22+
<li className="sidebar-item active ">
23+
<Link to="/dashboard" className='sidebar-link'>
24+
<DashboardIcon/>
25+
<span>Dashboard</span>
26+
</Link>
27+
</li>
28+
29+
</ul>
30+
</div>
31+
<button className="sidebar-toggler btn x"><i data-feather="x"/></button>
32+
</div>
33+
</div>
34+
</div>
35+
);
36+
}
37+
}
38+
39+
export default SideMenu;

‎resources/js/components/Layout/TopNav.js

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
import React ,{Component} from 'react';
2+
import { Link } from "react-router-dom";
3+
import * as LoginAction from "../Login/Container/LoginController";
4+
import {connect} from "react-redux";
5+
import avatar from '../../../../public/assets/images/avatar/avatar-s-1.png'
6+
import '../../../../public/assets/css/bootstrap.css';
7+
import '../../../../public/assets/vendors/perfect-scrollbar/perfect-scrollbar.css';
8+
import '../../../../public/assets/css/app.css';
9+
import '../../../../public/assets/vendors/perfect-scrollbar/perfect-scrollbar.min.js';
10+
import '../../../../public/assets/js/app.js';
11+
12+
const UserIcon = require('react-feather/dist/icons/user').default;
13+
const LogoutIcon = require('react-feather/dist/icons/log-out').default;
14+
15+
class TopNav extends Component{
16+
constructor(props) {
17+
super(props);
18+
}
19+
20+
componentDidMount(){
21+
let AuthToken = localStorage.getItem('token');
22+
this.props.checkAuthentication(AuthToken);
23+
return true;
24+
}
25+
26+
render() {
27+
return (
28+
<div className="NavigationSection">
29+
<nav className="navbar navbar-header navbar-expand navbar-light">
30+
<a className="sidebar-toggler" href="#"><span className="navbar-toggler-icon"/></a>
31+
<button className="btn navbar-toggler" type="button" data-toggle="collapse"
32+
data-target="#navbarSupportedContent"
33+
aria-controls="navbarSupportedContent" aria-expanded="false"
34+
aria-label="Toggle navigation">
35+
<span className="navbar-toggler-icon"/>
36+
</button>
37+
38+
<div className="collapse navbar-collapse" id="navbarSupportedContent">
39+
<ul className="navbar-nav d-flex align-items-center navbar-light ml-auto">
40+
41+
<li className="dropdown">
42+
<a href="#" data-toggle="dropdown"
43+
className="nav-link dropdown-toggle nav-link-lg nav-link-user">
44+
<div className="avatar mr-1">
45+
<img src={avatar} alt={'Admin'}/>
46+
</div>
47+
<div className="d-none d-md-block d-lg-inline-block">{this.props.username}</div>
48+
</a>
49+
<div className="dropdown-menu dropdown-menu-right">
50+
<Link to="/profile" className="dropdown-item">
51+
<UserIcon size={20}/> Profile
52+
</Link>
53+
<div className="dropdown-divider"/>
54+
<Link to="/logout" className="dropdown-item">
55+
<LogoutIcon size={20}/> Logout
56+
</Link>
57+
</div>
58+
</li>
59+
</ul>
60+
</div>
61+
</nav>
62+
</div>
63+
);
64+
}
65+
}
66+
67+
68+
const mapStateToProps = state => {
69+
return {
70+
username : state.LoginSection.username,
71+
}
72+
};
73+
74+
const mapDispatchToProps = dispatch => {
75+
return {
76+
checkAuthentication: (data) => dispatch(LoginAction.checkAuthentication(data))
77+
};
78+
};
79+
80+
export default connect(mapStateToProps,mapDispatchToProps)(TopNav);

0 commit comments

Comments
 (0)