- {/*
*/}
- {/* OSPRO */}
- {this.getLogoImage()}
- {/* adw w= 100, kit w = 100, nawakara w= 40 */}
- {/* PROJECT */}
-
- )
- }
-
dropDownMenu = () => {
const { dataAlert, totalAlert } = this.state
let dataAlertLength = dataAlert.length
@@ -282,57 +250,13 @@ class DefaultHeader extends Component {
return (
-
- {/**/}
- {this.getLogo()}
- {/**/}
-
-
- {this.getHeaderMenu()}
-
- {/* */}
- {/**/}
);
}
diff --git a/src/containers/DefaultLayout/DefaultLayout.js b/src/containers/DefaultLayout/DefaultLayout.js
index 5b1aea2..380d684 100644
--- a/src/containers/DefaultLayout/DefaultLayout.js
+++ b/src/containers/DefaultLayout/DefaultLayout.js
@@ -1,4 +1,4 @@
-import React, { Component, Suspense } from 'react';
+import React, { Component, Suspense, Divider } from 'react';
import { Redirect, Route, Switch } from 'react-router-dom';
import * as router from 'react-router-dom';
import { Container } from 'reactstrap';
@@ -6,16 +6,16 @@ import axios from 'axios';
import { ALERTUSER_SEARCH, ALERT_SEARCH, MENU_SEARCH, ROLEMENU_SEARCH, ALERTUSER_STATUSVIEW, ALERT_STATUSVIEW, MENU_MANAGEMENT, CONTROL_MONITORING_SEARCH } from '../../const/ApiConst';
import {
- AppAside,
- AppFooter,
- AppHeader,
- AppSidebar,
- AppSidebarFooter,
- AppSidebarForm,
- AppSidebarHeader,
- AppSidebarMinimizer,
- AppBreadcrumb2 as AppBreadcrumb,
- AppSidebarNav2 as AppSidebarNav,
+ AppAside,
+ AppFooter,
+ AppHeader,
+ AppSidebar,
+ AppSidebarFooter,
+ AppSidebarForm,
+ AppSidebarHeader,
+ AppSidebarMinimizer,
+ AppBreadcrumb2 as AppBreadcrumb,
+ AppSidebarNav2 as AppSidebarNav,
} from '@coreui/react';
import navigation from '../../_nav';
import routes from '../../routes';
@@ -27,261 +27,271 @@ const DefaultFooter = React.lazy(() => import('./DefaultFooter'));
const DefaultHeader = React.lazy(() => import('./DefaultHeader'));
let errorCount = 0;
const config = {
- headers:
- {
- Authorization: `Bearer ${token}`,
- "Content-type": `application/json`
- }
+ headers:
+ {
+ Authorization: `Bearer ${token}`,
+ "Content-type": `application/json`
+ }
};
class DefaultLayout extends Component {
- constructor(props) {
- super(props);
- this.state = {
- role_id: localStorage.getItem('role_id'),
- token: localStorage.getItem('token'),
- menu: { items: [] },
- routes2: routes,
- finalRoutes: [],
- breadrCrumbReady: false,
- }
- }
+ constructor(props) {
+ super(props);
+ this.state = {
+ role_id: localStorage.getItem('role_id'),
+ token: localStorage.getItem('token'),
+ menu: { items: [] },
+ routes2: routes,
+ finalRoutes: [],
+ breadrCrumbReady: false,
+ }
+ }
- async componentDidMount() {
- const menu = localStorage.getItem("menu_login")
- if (menu) this.setMenu(JSON.parse(menu))
- this.getAppBreadcrumb();
- if(!localStorage.getItem("token")){
- this.signOut();
- }
- }
+ async componentDidMount() {
+ const menu = localStorage.getItem("menu_login")
+ if (menu) this.setMenu(JSON.parse(menu))
+ this.getAppBreadcrumb();
+ if(!localStorage.getItem("token")){
+ this.signOut();
+ }
+ }
- componentDidUpdate(prevProps, prevState) {
- const menu = localStorage.getItem("menu_login")
- const { pathname } = this.props.location;
- if (this.state.token !== prevState.token) {
- this.setMenu(JSON.parse(menu))
- }
- if (this.state.role_id !== prevState.role_id) {
- this.setMenu(JSON.parse(menu))
- }
- if (this.state.menu !== prevState.menu) {
- this.setFinalRoutes()
- }
- }
+ componentDidUpdate(prevProps, prevState) {
+ const menu = localStorage.getItem("menu_login")
+ const { pathname } = this.props.location;
+ if (this.state.token !== prevState.token) {
+ this.setMenu(JSON.parse(menu))
+ }
+ if (this.state.role_id !== prevState.role_id) {
+ this.setMenu(JSON.parse(menu))
+ }
+ if (this.state.menu !== prevState.menu) {
+ this.setFinalRoutes()
+ }
+ }
- setFinalRoutes = () => {
- const { routes2 } = this.state;
- if (routes2) {
- const newRouter2 = routes2;
- this.state.routes2.map((val, index) => {
- let indexRes = this.state.menu.items.findIndex(x => x.url === val.path);
- if (indexRes >= 0) {
- let obj = newRouter2[index]
- obj['name'] = this.state.menu.items[indexRes].name
- newRouter2[index] = obj
- }
- })
- this.setState({ finalRoutes: newRouter2 }, () => {
- this.setState({ breadrCrumbReady: true })
- });
- }
- }
+ setFinalRoutes = () => {
+ const { routes2 } = this.state;
+ if (routes2) {
+ const newRouter2 = routes2;
+ this.state.routes2.map((val, index) => {
+ let indexRes = this.state.menu.items.findIndex(x => x.url === val.path);
+ if (indexRes >= 0) {
+ let obj = newRouter2[index]
+ obj['name'] = this.state.menu.items[indexRes].name
+ newRouter2[index] = obj
+ }
+ })
+ this.setState({ finalRoutes: newRouter2 }, () => {
+ this.setState({ breadrCrumbReady: true })
+ });
+ }
+ }
- loading = () =>
Loading...
+ loading = () =>
Loading...
- async signOut(e) {
- if (e) {
- e.preventDefault()
- }
- await localStorage.removeItem("role_id");
- await window.localStorage.clear();
- this.props.history.replace('/login')
- }
+ async signOut(e) {
+ if (e) {
+ e.preventDefault()
+ }
+ await localStorage.removeItem("role_id");
+ await window.localStorage.clear();
+ this.props.history.replace('/login')
+ }
- getDataMenu = async () => {
- errorCount++;
+ getDataMenu = async () => {
+ errorCount++;
- let url = MENU_MANAGEMENT(this.state.role_id)
- const result = await axios
- .get(url, config)
- .then(res => res)
- .catch((error) => error.response);
+ let url = MENU_MANAGEMENT(this.state.role_id)
+ const result = await axios
+ .get(url, config)
+ .then(res => res)
+ .catch((error) => error.response);
- if (result && result.data && result.data.code == 200) {
- window.localStorage.setItem('countErr', 0);
- let resData = result.data.data
- this.setMenu(resData)
- } else {
- if (errorCount < 4) {
- this.getDataMenu();
- } else {
- if (countErr) {
- await window.localStorage.setItem('countErr', countErr + 1);
- } else {
- await window.localStorage.setItem('countErr', 1);
- }
- if (countErr) {
- if (parseInt(countErr) > 2) {
- // this.signOut();
- } else {
- window.location.reload();
- }
- } else {
- window.location.reload();
- }
- }
- }
- }
+ if (result && result.data && result.data.code == 200) {
+ window.localStorage.setItem('countErr', 0);
+ let resData = result.data.data
+ this.setMenu(resData)
+ } else {
+ if (errorCount < 4) {
+ this.getDataMenu();
+ } else {
+ if (countErr) {
+ await window.localStorage.setItem('countErr', countErr + 1);
+ } else {
+ await window.localStorage.setItem('countErr', 1);
+ }
+ if (countErr) {
+ if (parseInt(countErr) > 2) {
+ // this.signOut();
+ } else {
+ window.location.reload();
+ }
+ } else {
+ window.location.reload();
+ }
+ }
+ }
+ }
- parseMenuChild = (data) => {
- const menu = data.map(res => {
- const obj = {
- name: res.name,
- url: res.url,
- icon: res.icon
- }
- if (res.children.length > 0) {
- obj.children = this.parseMenuChild(res.children)
- } else {
- delete obj.children
- }
+ parseMenuChild = (data) => {
+ const menu = data.map(res => {
+ const obj = {
+ name: res.name,
+ url: res.url,
+ icon: res.icon
+ }
+ if (res.children.length > 0) {
+ obj.children = this.parseMenuChild(res.children)
+ } else {
+ delete obj.children
+ }
- return obj
- })
+ return obj
+ })
- return menu
- }
+ return menu
+ }
- setMenu = data => {
- const menu = data.map(res => {
- const obj = {
- name: res.name,
- url: res.url,
- icon: res.icon
- }
- if (res.children.length > 0) {
- obj.children = this.parseMenuChild(res.children)
- } else {
- delete obj.children
- }
+ setMenu = data => {
+ const menu = data.map(res => {
+ const obj = {
+ name: res.name,
+ url: res.url,
+ icon: res.icon
+ }
+ if (res.children.length > 0) {
+ obj.children = this.parseMenuChild(res.children)
+ } else {
+ delete obj.children
+ }
- return obj
- })
+ return obj
+ })
- this.setState({ menu: { items: menu } }, () => {
- })
+ this.setState({ menu: { items: menu } }, () => {
+ })
- }
+ }
- checkLocation = () => {
- const { pathname } = this.props.location;
- let getIndex = this.getIndexMenu(pathname);
- if (getIndex < 0) {
- this.props.history.push("/403");
- }
- }
+ checkLocation = () => {
+ const { pathname } = this.props.location;
+ let getIndex = this.getIndexMenu(pathname);
+ if (getIndex < 0) {
+ this.props.history.push("/403");
+ }
+ }
- getIndexMenu = (url) => {
- let index = this.state.menu.items.findIndex(obj => obj.url === url);
- return index
- }
+ getIndexMenu = (url) => {
+ let index = this.state.menu.items.findIndex(obj => obj.url === url);
+ return index
+ }
- getMenu = () => {
- const { u_group } = this.state;
- if (u_group == 'kominfo') {
- }
- else {
- return
- }
- }
+ getMenu = () => {
+ const { u_group } = this.state;
+ if (u_group == 'kominfo') {
+ }
+ else {
+ return
+ }
+ }
- getAppBreadcrumb = () => {
- const { u_group } = this.state;
- if (u_group == 'kominfo') {
- routes.map((route, idx) => {
- if (route.path == '/dashboard-kominfo') {
- return
- }
- else {
- return
- }
- });
- }
- else {
- if (!window.location.href.includes("dashboard")){
- return
- }
- }
- }
+ getAppBreadcrumb = () => {
+ const { u_group } = this.state;
+ if (u_group == 'kominfo') {
+ routes.map((route, idx) => {
+ if (route.path == '/dashboard-kominfo') {
+ return
+ }
+ else {
+ return
+ }
+ });
+ }
+ else {
+ if (!window.location.href.includes("dashboard")){
+ return
+ }
+ }
+ }
- isKominfo = () => {
- let u_group = localStorage.getItem('u_group');
- if (u_group == 'kominfo') {
- return true;
- }
- else {
- return false;
- }
- }
+ isKominfo = () => {
+ let u_group = localStorage.getItem('u_group');
+ if (u_group == 'kominfo') {
+ return true;
+ }
+ else {
+ return false;
+ }
+ }
- render() {
- return (
-
-
-
-
-
-
-
- {this.getMenu()}
-
-
-
-
-
- {this.state.breadrCrumbReady ? this.getAppBreadcrumb() : null}
-
-
-
- {routes.map((route, idx) => {
- return route.component ? (
- (
-
- )} />
- ) : (null);
- })}
-
-
-
-
-
-
-
-
-
-
-
- {!this.isKominfo ?
- (
-
-
-
-
-
- ) : null
- }
-
- );
- }
+ render() {
+ return (
+
+
+
+ {/* */}
+
+
+
+
+ {this.getMenu()}
+
+
+
+ this.signOut(e)}>
+ Logout
+
+
+
+
+
+ {this.state.breadrCrumbReady ? this.getAppBreadcrumb() : null}
+
+
+
+ {routes.map((route, idx) => {
+ return route.component ? (
+ (
+
+ )} />
+ ) : (null);
+ })}
+
+
+
+
+
+
+
+
+
+
+
+ {!this.isKominfo ?
+ (
+
+
+
+
+
+ ) : null
+ }
+
+ );
+ }
}
export default DefaultLayout;
diff --git a/src/scss/_custom.scss b/src/scss/_custom.scss
index d1a6541..1a22ce2 100644
--- a/src/scss/_custom.scss
+++ b/src/scss/_custom.scss
@@ -26,6 +26,11 @@
background-color: #192a38 !important;
}
+.nav-item > .active {
+ background-color: #192a38 !important;
+}
+
+
.breadcrumb {
padding: 0.1rem 1rem;
margin-bottom: 1.25rem;