qcast-front/src/components/management/StuffSubHeader.jsx
2024-11-19 13:54:18 +09:00

118 lines
4.1 KiB
JavaScript

'use client'
import { useEffect } from 'react'
import Link from 'next/link'
import Image from 'next/image'
import { useMessage } from '@/hooks/useMessage'
import { useRouter, useSearchParams } from 'next/navigation'
import { floorPlanObjectState } from '@/store/floorPlanObjectAtom'
import { useSetRecoilState } from 'recoil'
import { queryStringFormatter } from '@/util/common-utils'
export default function StuffSubHeader({ type }) {
const { getMessage } = useMessage()
const router = useRouter()
const setFloorPlanObjectNo = useSetRecoilState(floorPlanObjectState)
useEffect(() => {
window.scrollTo(0, 0)
}, [])
const searchParams = useSearchParams()
const objectNo = searchParams.get('objectNo') //url에서 물건번호 꺼내서 바로 set
// url에 물건번호로 도면작성화면으로 이동
const moveFloorPlan = () => {
setFloorPlanObjectNo({ floorPlanObjectNo: objectNo })
const param = {
pid: '1',
}
const url = `/floor-plan?${queryStringFormatter(param)}`
router.push(url)
}
return (
<>
<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">
<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>
</>
)
}