GlobalLoading 수정
This commit is contained in:
parent
297f1f563b
commit
16708b3ef3
11
src/app/GlobalLoadingProvider.js
Normal file
11
src/app/GlobalLoadingProvider.js
Normal file
@ -0,0 +1,11 @@
|
||||
'use client'
|
||||
|
||||
import { useContext } from 'react'
|
||||
import { QcastContext } from './QcastProvider'
|
||||
import GlobalSpinner from '@/components/common/spinner/GlobalSpinner'
|
||||
|
||||
export default function GlobalLoadingProvider({ children }) {
|
||||
const { isGlobalLoading } = useContext(QcastContext)
|
||||
|
||||
return <QcastContext.Provider>{isGlobalLoading && <GlobalSpinner />}</QcastContext.Provider>
|
||||
}
|
||||
@ -6,7 +6,6 @@ import { useCommonCode } from '@/hooks/common/useCommonCode'
|
||||
import ServerError from './error'
|
||||
|
||||
import '@/styles/common.scss'
|
||||
import GlobalSpinner from '@/components/common/spinner/GlobalSpinner'
|
||||
|
||||
export const QcastContext = createContext({
|
||||
qcastState: {},
|
||||
@ -17,7 +16,7 @@ export const QcastContext = createContext({
|
||||
|
||||
export const QcastProvider = ({ children }) => {
|
||||
const [planSave, setPlanSave] = useState(false)
|
||||
const [isGlobalLoading, setIsGlobalLoading] = useState(false)
|
||||
const [isGlobalLoading, setIsGlobalLoading] = useState(true)
|
||||
const { commonCode, findCommonCode } = useCommonCode()
|
||||
|
||||
const [qcastState, setQcastState] = useState({
|
||||
@ -35,11 +34,6 @@ export const QcastProvider = ({ children }) => {
|
||||
|
||||
return (
|
||||
<>
|
||||
{isGlobalLoading && (
|
||||
<div className="fixed inset-0 bg-white z-50 flex items-center justify-center">
|
||||
<GlobalSpinner />
|
||||
</div>
|
||||
)}
|
||||
<QcastContext.Provider value={{ qcastState, setQcastState, isGlobalLoading, setIsGlobalLoading }}>
|
||||
<ErrorBoundary fallback={<ServerError />}>{children}</ErrorBoundary>
|
||||
</QcastContext.Provider>
|
||||
|
||||
@ -8,15 +8,13 @@ import SessionProvider from './SessionProvider'
|
||||
import GlobalDataProvider from './GlobalDataProvider'
|
||||
import Header from '@/components/header/Header'
|
||||
import QModal from '@/components/common/modal/QModal'
|
||||
import Dimmed from '@/components/ui/Dimmed'
|
||||
import PopupManager from '@/components/common/popupManager/PopupManager'
|
||||
|
||||
import './globals.css'
|
||||
import '../styles/style.scss'
|
||||
import '../styles/contents.scss'
|
||||
import Footer from '@/components/footer/Footer'
|
||||
import { Suspense } from 'react'
|
||||
import GlobalSpinner from '@/components/common/spinner/GlobalSpinner'
|
||||
import GlobalLoadingProvider from './GlobalLoadingProvider'
|
||||
|
||||
export const metadata = {
|
||||
title: 'Create Next App',
|
||||
@ -70,10 +68,10 @@ export default async function RootLayout({ children }) {
|
||||
<QcastProvider>{children}</QcastProvider>
|
||||
) : (
|
||||
<QcastProvider>
|
||||
<GlobalLoadingProvider />
|
||||
<div className="wrap">
|
||||
<Header userSession={sessionProps} />
|
||||
<div className="content">
|
||||
<Dimmed />
|
||||
<SessionProvider useSession={sessionProps}>{children}</SessionProvider>
|
||||
</div>
|
||||
<Footer />
|
||||
|
||||
@ -221,7 +221,7 @@ export default function Header(props) {
|
||||
|
||||
return (
|
||||
<>
|
||||
{!isGlobalLoading && !(pathName.includes('login') || pathName.includes('join') || sessionState.pwdInitYn === 'N') && (
|
||||
{!(pathName.includes('login') || pathName.includes('join') || sessionState.pwdInitYn === 'N') && (
|
||||
<header className={isDimmed}>
|
||||
<div className="header-inner">
|
||||
<div className="header-right">
|
||||
|
||||
@ -66,87 +66,85 @@ export default function StuffSubHeader({ type }) {
|
||||
}
|
||||
|
||||
return (
|
||||
!isGlobalLoading && (
|
||||
<>
|
||||
<div className="sub-header">
|
||||
<div className="sub-header-inner">
|
||||
{type === 'list' && (
|
||||
<>
|
||||
<Link href={'#'}>
|
||||
<h1 className="sub-header-title">{getMessage('header.menus.management')}</h1>
|
||||
</Link>
|
||||
<ul className="sub-header-location">
|
||||
<li className="location-item">
|
||||
<span className="home">
|
||||
<Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
|
||||
</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management')}</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management.stuffList')}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)}
|
||||
{type === 'temp' && (
|
||||
<>
|
||||
<ul className="sub-header-title-wrap">
|
||||
<li className="title-item">
|
||||
<Link className="sub-header-title" href={'#'}>
|
||||
{getMessage('stuff.temp.subTitle')}
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<ul className="sub-header-location">
|
||||
<li className="location-item">
|
||||
<span className="home">
|
||||
<Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
|
||||
</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management')}</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management.newStuff')}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)}
|
||||
{type === 'detail' && (
|
||||
<>
|
||||
<ul className="sub-header-title-wrap">
|
||||
<li className="title-item">
|
||||
<Link className="sub-header-title" href={'#'}>
|
||||
{getMessage('stuff.temp.subTitle')}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="title-item" style={{ display: buttonStyle }}>
|
||||
<a className="sub-header-title" onClick={moveFloorPlan}>
|
||||
<span className="icon drawing"></span>
|
||||
{getMessage('stuff.temp.subTitle2')}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul className="sub-header-location">
|
||||
<li className="location-item">
|
||||
<span className="home">
|
||||
<Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
|
||||
</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management')}</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management.detail')}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<>
|
||||
<div className="sub-header">
|
||||
<div className="sub-header-inner">
|
||||
{type === 'list' && (
|
||||
<>
|
||||
<Link href={'#'}>
|
||||
<h1 className="sub-header-title">{getMessage('header.menus.management')}</h1>
|
||||
</Link>
|
||||
<ul className="sub-header-location">
|
||||
<li className="location-item">
|
||||
<span className="home">
|
||||
<Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
|
||||
</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management')}</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management.stuffList')}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)}
|
||||
{type === 'temp' && (
|
||||
<>
|
||||
<ul className="sub-header-title-wrap">
|
||||
<li className="title-item">
|
||||
<Link className="sub-header-title" href={'#'}>
|
||||
{getMessage('stuff.temp.subTitle')}
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<ul className="sub-header-location">
|
||||
<li className="location-item">
|
||||
<span className="home">
|
||||
<Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
|
||||
</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management')}</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management.newStuff')}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)}
|
||||
{type === 'detail' && (
|
||||
<>
|
||||
<ul className="sub-header-title-wrap">
|
||||
<li className="title-item">
|
||||
<Link className="sub-header-title" href={'#'}>
|
||||
{getMessage('stuff.temp.subTitle')}
|
||||
</Link>
|
||||
</li>
|
||||
<li className="title-item" style={{ display: buttonStyle }}>
|
||||
<a className="sub-header-title" onClick={moveFloorPlan}>
|
||||
<span className="icon drawing"></span>
|
||||
{getMessage('stuff.temp.subTitle2')}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul className="sub-header-location">
|
||||
<li className="location-item">
|
||||
<span className="home">
|
||||
<Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
|
||||
</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management')}</span>
|
||||
</li>
|
||||
<li className="location-item">
|
||||
<span>{getMessage('header.menus.management.detail')}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user