From ca48e9827f49e499dd4b888c118eb464ed3168d7 Mon Sep 17 00:00:00 2001 From: farhantock Date: Tue, 30 Jan 2024 12:50:55 +0700 Subject: [PATCH] update get custom image --- src/App.js | 28 +-------- src/containers/DefaultLayout/DefaultHeader.js | 49 ++++++++++----- src/containers/DefaultLayout/DefaultLayout.js | 61 +++++++++++++++++-- src/views/Pages/Login/Login.js | 1 - 4 files changed, 91 insertions(+), 48 deletions(-) diff --git a/src/App.js b/src/App.js index f46e383..7698196 100644 --- a/src/App.js +++ b/src/App.js @@ -11,29 +11,10 @@ const loading = () =>
Loading. const DefaultLayout = React.lazy(() => import('./containers/DefaultLayout')); const Login = React.lazy(() => import('./views/Pages/Login')); -const Register = React.lazy(() => import('./views/Pages/Register')); -const Page403 = React.lazy(() => import('./views/Pages/Page403')); -const Page404 = React.lazy(() => import('./views/Pages/Page404')); -const Page500 = React.lazy(() => import('./views/Pages/Page500')); + const SiopasMap = React.lazy(() => import('./views/Map')); class App extends Component { - componentDidMount() { - - try { - const storedData = localStorage.getItem('configApp'); - if (storedData !== null) { - const data = JSON.parse(storedData); - const htmlTitle = data.html_title || 'OSPRO'; - document.title = htmlTitle; - } else { - document.title = 'OSPRO'; - } - } catch (error) { - document.title = 'OSPRO'; - } - } - render() { return ( @@ -42,14 +23,7 @@ class App extends Component { } /> - {/* } /> */} - } /> - } /> - } /> - } /> } /> - {/* } />*/} - {/* } />*/} } /> diff --git a/src/containers/DefaultLayout/DefaultHeader.js b/src/containers/DefaultLayout/DefaultHeader.js index 697af47..b04fb21 100644 --- a/src/containers/DefaultLayout/DefaultHeader.js +++ b/src/containers/DefaultLayout/DefaultHeader.js @@ -3,23 +3,17 @@ import { NavLink } from 'react-router-dom'; import { Badge, Nav, NavItem } from 'reactstrap'; import PropTypes from 'prop-types'; import { Menu, Dropdown } from 'antd' -import { ALERTUSER_SEARCH, ALERT_SEARCH, ALERTUSER_STATUSVIEW, ALERT_STATUSVIEW, APP_MODE } from '../../const/ApiConst'; +import { ALERTUSER_SEARCH, ALERT_SEARCH, ALERTUSER_STATUSVIEW, ALERT_STATUSVIEW, APP_MODE, BASE_SIMPRO_LUMEN_IMAGE } from '../../const/ApiConst'; import { AppAsideToggler, AppNavbarBrand, AppSidebarToggler } from '@coreui/react'; import logo_ospro from '../../assets/img/OSPRO.png' import axios from 'axios'; import './Default.css' -const token = window.localStorage.getItem('token'); + const propTypes = { children: PropTypes.node, }; -const config = { - headers: - { - Authorization: `Bearer ${token}`, - "Content-type": `application/json` - } -}; + const defaultProps = {}; @@ -42,8 +36,32 @@ class DefaultHeader extends Component { componentDidMount() { this.getHeaderMenu(); + const token = window.localStorage.getItem('token'); + const role = window.localStorage.getItem('role_name'); + + if (role !== 'Super Admin') { + this.setState({ + configApp: JSON.parse(window.localStorage.getItem('configApp')), + }); + } + this.setState({ + config: { + headers: { + Authorization: `Bearer ${token}`, + 'Content-type': `application/json`, + }, + }, + }); } + getLogoHeaderContent = () => { + const { configApp } = this.state; + const logoHeaderContent = configApp && configApp.logo_header ? configApp.logo_header.content : null; + return logoHeaderContent + ? `${BASE_SIMPRO_LUMEN_IMAGE}/${logoHeaderContent}` + : logo_ospro; + }; + componentDidUpdate(prevProps, prevState) { if (this.state.listReadNotif !== prevState.listReadNotif) { if (this.state.listReadNotif.length > 0) { @@ -107,7 +125,7 @@ class DefaultHeader extends Component { } const result = await axios - .post(url, payload, config) + .post(url, payload, this.state.config) .then(res => res) .catch((error) => error.response); if (result && result.data && result.data.code == 200) { @@ -178,14 +196,14 @@ class DefaultHeader extends Component { if (parseInt(localStorage.getItem('role_id')) === 1) { data.map((val, index) => { let url = ALERT_STATUSVIEW(val) - promises.push(axios.put(url, payload, config) + promises.push(axios.put(url, payload, this.state.config) .then(res => result.push(res))); }); } else { data.map((val, index) => { let url = ALERTUSER_STATUSVIEW(val) - promises.push(axios.put(url, payload, config) + promises.push(axios.put(url, payload, this.state.config) .then(res => result.push(res))) }); } @@ -199,11 +217,14 @@ class DefaultHeader extends Component { getLogo = () => { return (
- +
) } - + // logo_ospro getHeaderMenu = () => { const { fullname, u_group } = this.state; if (u_group == 'kominfo') { diff --git a/src/containers/DefaultLayout/DefaultLayout.js b/src/containers/DefaultLayout/DefaultLayout.js index b822298..30e608b 100644 --- a/src/containers/DefaultLayout/DefaultLayout.js +++ b/src/containers/DefaultLayout/DefaultLayout.js @@ -3,7 +3,7 @@ import { Redirect, Route, Switch, withRouter } from 'react-router-dom'; import * as router from 'react-router-dom'; import { Button, Container, UncontrolledDropdown, DropdownItem, DropdownMenu, DropdownToggle, Nav, NavItem } from 'reactstrap'; 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 { BASE_SIMPRO_LUMEN_IMAGE, MENU_MANAGEMENT } from '../../const/ApiConst'; import { handleChangeLng } from "../../utils/LangUtils"; import { AppAside, @@ -63,8 +63,6 @@ class DefaultLayout extends Component { company_id: company_id }; } - - async componentDidMount() { const menu = localStorage.getItem("menu_login") if (menu) this.setMenu(JSON.parse(menu)) @@ -72,6 +70,53 @@ class DefaultLayout extends Component { if (!localStorage.getItem("token")) { this.signOut(); } + window.myData = "Data dari komponen React"; + try { + const storedData = localStorage.getItem('configApp'); + if (storedData !== null) { + const data = JSON.parse(storedData); + + const faviconContent = data && data.favicon_image ? `${BASE_SIMPRO_LUMEN_IMAGE}/${data.favicon_image.content}` : null; + + const htmlTitle = data.html_title || 'OSPRO'; + document.title = htmlTitle; + + if (faviconContent) { + this.setFavicon(faviconContent); + } + } else { + document.title = 'OSPRO'; + } + } catch (error) { + document.title = 'OSPRO'; + } + + } + setFavicon = (faviconContent) => { + const existingFavicon = document.querySelector("link[rel='icon']"); + if (existingFavicon) { + document.head.removeChild(existingFavicon); + } + + const faviconElement = document.createElement('link'); + faviconElement.rel = 'icon'; + const fileExtension = faviconContent ? faviconContent.split('.').pop().toLowerCase() : ''; + switch (fileExtension) { + case 'svg': + faviconElement.type = 'image/svg+xml'; + break; + case 'ico': + faviconElement.type = 'image/x-icon'; + break; + default: + faviconElement.type = 'image/png'; + } + console.log('faviconElement.type', faviconElement.type); + console.log('faviconContent', faviconContent); + faviconElement.href = faviconContent || `${process.env.PUBLIC_URL}/OSPRO.ico`; + + + document.head.appendChild(faviconElement); } componentDidUpdate(prevProps, prevState) { @@ -120,6 +165,7 @@ class DefaultLayout extends Component { await localStorage.removeItem("role_id"); await localStorage.removeItem("company_id"); document.getElementById('title').innerText = 'OSPRO'; + this.setFavicon(`${process.env.PUBLIC_URL}/OSPRO.ico`); await window.localStorage.clear(); this.props.history.replace('/login') } @@ -269,9 +315,12 @@ class DefaultLayout extends Component { return (
- {/* - - */} + {!window.location.href.includes("false-header") && ( + + + + ) + }
{!window.location.href.includes("dashboard-project") || renderSidebar ? ( diff --git a/src/views/Pages/Login/Login.js b/src/views/Pages/Login/Login.js index 47c8e9d..aab6055 100644 --- a/src/views/Pages/Login/Login.js +++ b/src/views/Pages/Login/Login.js @@ -64,7 +64,6 @@ class Login extends Component { if (storedData !== null) { const data = JSON.parse(storedData); const htmlTitle = data.html_title || 'OSPRO'; - console.log('htmlTitle', htmlTitle); document.getElementById('title').innerText = htmlTitle; } else { document.title = 'OSPRO';