From 6ba21bf69fb070b5ac1be7d6bca8b790e9f46fbc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?junh=5Feee=28=EC=9D=B4=EC=A4=80=ED=9D=AC=29?= Date: Mon, 29 Jul 2024 13:49:53 +0900 Subject: [PATCH] =?UTF-8?q?flyTo=20=EA=B3=84=EC=A0=95=20=EC=A0=84=EC=9A=A9?= =?UTF-8?q?=20=EC=9E=91=EC=97=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/@core/layouts/HorizontalLayout.js | 162 +++++++++++------- .../menu/vertical-menu/VerticalMenuHeader.js | 7 +- .../layouts/components/navbar/NavbarUser.js | 3 +- src/components/dashboard/DashboardMenu.js | 4 +- src/views/control/main/ControlMain.js | 26 +-- 5 files changed, 123 insertions(+), 79 deletions(-) diff --git a/src/@core/layouts/HorizontalLayout.js b/src/@core/layouts/HorizontalLayout.js index be51ca1..4d7a7be 100644 --- a/src/@core/layouts/HorizontalLayout.js +++ b/src/@core/layouts/HorizontalLayout.js @@ -1,123 +1,129 @@ // ** React Imports -import { useState, useEffect } from 'react' -import { Link } from 'react-router-dom' +import { useState, useEffect } from 'react'; +import { Link } from 'react-router-dom'; // ** Store & Actions -import { useSelector, useDispatch } from 'react-redux' -import { handleMenuHidden, handleContentWidth } from '@store/actions/layout' +import { useSelector, useDispatch } from 'react-redux'; +import { handleMenuHidden, handleContentWidth } from '@store/actions/layout'; // ** Third Party Components -import classnames from 'classnames' -import { ArrowUp } from 'react-feather' -import ScrollToTop from 'react-scroll-up' -import { Navbar, NavItem, Button } from 'reactstrap' +import classnames from 'classnames'; +import { ArrowUp } from 'react-feather'; +import ScrollToTop from 'react-scroll-up'; +import { Navbar, NavItem, Button } from 'reactstrap'; // ** Configs -import themeConfig from '@configs/themeConfig' +import themeConfig from '@configs/themeConfig'; // ** Custom Components -import Customizer from '@components/customizer' -import NavbarComponent from './components/navbar' -import FooterComponent from './components/footer' -import MenuComponent from './components/menu/horizontal-menu' +import Customizer from '@components/customizer'; +import NavbarComponent from './components/navbar'; +import FooterComponent from './components/footer'; +import MenuComponent from './components/menu/horizontal-menu'; // ** Custom Hooks -import { useRTL } from '@hooks/useRTL' -import { useSkin } from '@hooks/useSkin' -import { useNavbarType } from '@hooks/useNavbarType' -import { useFooterType } from '@hooks/useFooterType' -import { useNavbarColor } from '@hooks/useNavbarColor' +import { useRTL } from '@hooks/useRTL'; +import { useSkin } from '@hooks/useSkin'; +import { useNavbarType } from '@hooks/useNavbarType'; +import { useFooterType } from '@hooks/useFooterType'; +import { useNavbarColor } from '@hooks/useNavbarColor'; // ** Styles -import '@styles/base/core/menu/menu-types/horizontal-menu.scss' +import '@styles/base/core/menu/menu-types/horizontal-menu.scss'; const HorizontalLayout = props => { // ** Props - const { children, navbar, footer, menu, currentActiveItem, routerProps } = props + const { children, navbar, footer, menu, currentActiveItem, routerProps } = + props; // ** Hooks - const [skin, setSkin] = useSkin() - const [isRtl, setIsRtl] = useRTL() - const [navbarType, setNavbarType] = useNavbarType() - const [footerType, setFooterType] = useFooterType() - const [navbarColor, setNavbarColor] = useNavbarColor() + const [skin, setSkin] = useSkin(); + const [isRtl, setIsRtl] = useRTL(); + const [navbarType, setNavbarType] = useNavbarType(); + const [footerType, setFooterType] = useFooterType(); + const [navbarColor, setNavbarColor] = useNavbarColor(); // ** States - const [isMounted, setIsMounted] = useState(false) - const [navbarScrolled, setNavbarScrolled] = useState(false) + const [isMounted, setIsMounted] = useState(false); + const [navbarScrolled, setNavbarScrolled] = useState(false); // ** Store Vars - const dispatch = useDispatch() - const layoutStore = useSelector(state => state.layout) + const dispatch = useDispatch(); + const layoutStore = useSelector(state => state.layout); + const { user } = useSelector(state => state.authState); // ** Vars - const contentWidth = layoutStore.contentWidth - const isHidden = layoutStore.menuHidden + const contentWidth = layoutStore.contentWidth; + const isHidden = layoutStore.menuHidden; // ** Handles Content Width - const setContentWidth = val => dispatch(handleContentWidth(val)) + const setContentWidth = val => dispatch(handleContentWidth(val)); // ** Handles Content Width - const setIsHidden = val => dispatch(handleMenuHidden(val)) + const setIsHidden = val => dispatch(handleMenuHidden(val)); // ** UseEffect Cleanup const cleanup = () => { - setIsMounted(false) - setNavbarScrolled(false) - } + setIsMounted(false); + setNavbarScrolled(false); + }; //** ComponentDidMount useEffect(() => { - setIsMounted(true) + setIsMounted(true); window.addEventListener('scroll', function () { if (window.pageYOffset > 65 && navbarScrolled === false) { - setNavbarScrolled(true) + setNavbarScrolled(true); } if (window.pageYOffset < 65) { - setNavbarScrolled(false) + setNavbarScrolled(false); } - }) - return () => cleanup() - }, []) + }); + return () => cleanup(); + }, []); // ** Vars const footerClasses = { static: 'footer-static', sticky: 'footer-fixed', hidden: 'footer-hidden' - } + }; const navbarWrapperClasses = { floating: 'navbar-floating', sticky: 'navbar-sticky', static: 'navbar-static' - } + }; const navbarClasses = { floating: 'floating-nav', sticky: 'fixed-top' - } + }; - const bgColorCondition = navbarColor !== '' && navbarColor !== 'light' && navbarColor !== 'white' + const bgColorCondition = + navbarColor !== '' && navbarColor !== 'light' && navbarColor !== 'white'; if (!isMounted) { - return null + return null; } return (
{!navbar && (
@@ -127,7 +133,9 @@ const HorizontalLayout = props => { logo -

{themeConfig.app.appName}

+

+ {user?.cstmrSno === 27 ? 'FLYTO' : themeConfig.app.appName} +

@@ -145,12 +153,24 @@ const HorizontalLayout = props => { expand='sm' light={skin !== 'dark'} dark={skin === 'dark' || bgColorCondition} - className={classnames(`header-navbar navbar-horizontal navbar-shadow menu-border`, { - [navbarClasses[navbarType]]: navbarType !== 'static', - 'floating-nav': (!navbarClasses[navbarType] && navbarType !== 'static') || navbarType === 'floating' - })} + className={classnames( + `header-navbar navbar-horizontal navbar-shadow menu-border`, + { + [navbarClasses[navbarType]]: navbarType !== 'static', + 'floating-nav': + (!navbarClasses[navbarType] && navbarType !== 'static') || + navbarType === 'floating' + } + )} > - {menu ? menu : } + {menu ? ( + menu + ) : ( + + )}
) : null} @@ -180,11 +200,21 @@ const HorizontalLayout = props => { /> ) : null}
- {footer ? footer : } + {footer ? ( + footer + ) : ( + + )}
{themeConfig.layout.scrollTop === true ? ( @@ -197,6 +227,6 @@ const HorizontalLayout = props => {
) : null} - ) -} -export default HorizontalLayout + ); +}; +export default HorizontalLayout; diff --git a/src/@core/layouts/components/menu/vertical-menu/VerticalMenuHeader.js b/src/@core/layouts/components/menu/vertical-menu/VerticalMenuHeader.js index 75bb481..5b35872 100644 --- a/src/@core/layouts/components/menu/vertical-menu/VerticalMenuHeader.js +++ b/src/@core/layouts/components/menu/vertical-menu/VerticalMenuHeader.js @@ -1,6 +1,7 @@ // ** React Imports import { useEffect } from 'react'; import { NavLink } from 'react-router-dom'; +import { useSelector } from 'react-redux'; // ** Third Party Components import { Disc, X, Circle } from 'react-feather'; @@ -18,6 +19,8 @@ const VerticalMenuHeader = props => { menuHover } = props; + const { user } = useSelector(state => state.authState); + // ** Reset open group useEffect(() => { if (!menuHover && menuCollapsed) setGroupOpen([]); @@ -54,7 +57,9 @@ const VerticalMenuHeader = props => { logo -

{themeConfig.app.appName}

+

+ {user?.cstmrSno === 27 ? 'FLYTO' : themeConfig.app.appName} +

  • diff --git a/src/@core/layouts/components/navbar/NavbarUser.js b/src/@core/layouts/components/navbar/NavbarUser.js index 1b9454f..5706c0f 100644 --- a/src/@core/layouts/components/navbar/NavbarUser.js +++ b/src/@core/layouts/components/navbar/NavbarUser.js @@ -13,6 +13,7 @@ const NavbarUser = props => { const dispatch = useDispatch(); const { topMenuCd } = useSelector(state => state.menuState); + const { user } = useSelector(state => state.authState); // ** Function to toggle Theme (Light/Dark) const ThemeToggler = () => { @@ -100,7 +101,7 @@ const NavbarUser = props => { // toggle('2') // }} > - 드론 관제 시스템 + {user?.cstmrSno === 27 ? 'UAM 관제 시스템' : '드론 관제 시스템'} diff --git a/src/components/dashboard/DashboardMenu.js b/src/components/dashboard/DashboardMenu.js index bb815f8..0ce44e3 100644 --- a/src/components/dashboard/DashboardMenu.js +++ b/src/components/dashboard/DashboardMenu.js @@ -1,12 +1,14 @@ import { Card, Col, Row } from 'reactstrap'; +import { useSelector } from 'react-redux'; export const DashboardMenu = props => { + const { user } = useSelector(state => state.authState); return ( window.open('/control', '_blank')}> - 드론 관제 시스템 + {user?.cstmrSno === 27 ? 'UAM 관제 시스템' : '드론 관제 시스템'} diff --git a/src/views/control/main/ControlMain.js b/src/views/control/main/ControlMain.js index 5879cd2..92a9eed 100644 --- a/src/views/control/main/ControlMain.js +++ b/src/views/control/main/ControlMain.js @@ -168,7 +168,7 @@ const ControlMain = () => {

    - PAL + {user?.cstmrSno === 27 ? 'FLYTO' : 'PAL'}

      @@ -210,15 +210,21 @@ const ControlMain = () => {
      • */} -
    • - -
      • -
    • - -
      • -
    • - -
      • + {user?.cstmrSno === 27 ? ( + <> + ) : ( + <> +
    • + +
      • +
    • + +
      • +
    • + +
      • + + )}