This commit is contained in:
changkyu choi 2025-01-07 13:31:52 +09:00
commit 145113bc71
3 changed files with 59 additions and 48 deletions

View File

@ -11,11 +11,13 @@ import { useRouter } from 'next/navigation'
import { globalLocaleStore } from '@/store/localeAtom'
import { queryStringFormatter } from '@/util/common-utils'
import MainSkeleton from '../ui/MainSkeleton'
import { SessionContext } from '@/app/SessionProvider'
import { useMainContentsController } from '@/hooks/main/useMainContentsController'
import { QcastContext } from '@/app/QcastProvider'
import { useSwal } from '@/hooks/useSwal'
export default function MainContents() {
const { swalFire } = useSwal()
const { getMessage } = useMessage()
const router = useRouter()
const globalLocaleState = useRecoilValue(globalLocaleStore)
@ -125,62 +127,50 @@ export default function MainContents() {
)}
</ProductItem>
<ProductItem num={2} name={getMessage('main.content.notice')}>
<div className="notice-box">
{recentNoticeList.length > 0 ? (
<>
<div className="notice-day pre">{dayjs(recentNoticeList[0]?.regDt).format('YYYY.MM.DD')}</div>
<div className="notice-title">{recentNoticeList[0]?.title}</div>
<div
className="notice-contents"
dangerouslySetInnerHTML={{ __html: recentNoticeList[0]?.contents ? recentNoticeList[0].contents.replaceAll('\n', '<br/>') : '' }}
></div>
</>
) : (
<MainSkeleton count={5} />
)}
</div>
{recentNoticeList.length > 0 ? (
<div className="notice-box">
<div className="notice-day pre">{dayjs(recentNoticeList[0]?.regDt).format('YYYY.MM.DD')}</div>
<div className="notice-title">{recentNoticeList[0]?.title}</div>
<div
className="notice-contents"
dangerouslySetInnerHTML={{ __html: recentNoticeList[0]?.contents ? recentNoticeList[0].contents.replaceAll('\n', '<br/>') : '' }}
></div>
</div>
) : (
<div className="recently-no-data">
<h3>{getMessage('main.content.noBusiness')}</h3>
</div>
)}
</ProductItem>
</div>
<div className="main-product-list">
<ProductItem num={3} name={getMessage('main.faq')}>
<ul className="faq-list">
{recentFaqList.length > 0 ? (
<>
{recentFaqList.map((row) => {
return (
<li key={row.rowNumber} className="faq-item">
<div className="faq-item-inner">
<div className="faq-num pre">FAQ {row.totCnt - row.rowNumber}</div>
<div className="faq-title pre">{row.title}</div>
<div className="faq-day pre">{dayjs(row.regDt).format('YYYY.MM.DD')}</div>
</div>
</li>
)
})}
</>
) : (
<MainSkeleton count={2} />
)}
</ul>
{recentFaqList.length > 0 ? (
<ul className="faq-list">
{recentFaqList.map((row) => {
return (
<li key={row.rowNumber} className="faq-item">
<div className="faq-item-inner">
<div className="faq-num pre">FAQ {row.totCnt - row.rowNumber}</div>
<div className="faq-title pre">{row.title}</div>
<div className="faq-day pre">{dayjs(row.regDt).format('YYYY.MM.DD')}</div>
</div>
</li>
)
})}
</ul>
) : (
<div className="recently-no-data">
<h3>{getMessage('main.content.noBusiness')}</h3>
</div>
)}
</ProductItem>
<ProductItem num={4} name={'Data Download'}>
<div className="data-download-wrap">
<button
className="data-down"
type="button"
onClick={() => {
return alert(getMessage('main.content.alert.noFile'))
}}
>
<button className="data-down" type="button" onClick={() => swalFire({ text: getMessage('main.content.alert.noFile'), type: 'alert' })}>
<span>{getMessage('main.content.download1')}</span>
</button>
<button
className="data-down"
type="button"
onClick={() => {
return alert(getMessage('main.content.alert.noFile'))
}}
>
<button className="data-down" type="button" onClick={() => swalFire({ text: getMessage('main.content.alert.noFile'), type: 'alert' })}>
<span>{getMessage('main.content.download2')}</span>
</button>
</div>

View File

@ -207,6 +207,7 @@ header{
.select-box{
min-width: 165px;
margin-right: 8px;
height: 30px;
>div{
width: 100%;
}

View File

@ -155,6 +155,7 @@
.product-item-content{
margin-top: 30px;
overflow: hidden;
height: 100%;
.recently-list{
.recently-item{
border: 1px solid #F2F2F2;
@ -208,6 +209,25 @@
}
}
}
.recently-no-data{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
h3{
font-size: 16px;
color: #101010;
font-weight: 600;
margin-bottom: 5px;
}
p{
font-size: 12px;
color: #666;
font-weight: 400;
margin-bottom: 10px;
}
}
.notice-box{
height: 100%;
overflow-y: auto;