qcast-front/src/components/community/ArchiveTable.jsx

90 lines
2.7 KiB
JavaScript

'use client'
import { useEffect, useState, useContext } from 'react'
import { useRecoilState } from 'recoil'
import { useAxios } from '@/hooks/useAxios'
import { searchState } from '@/store/boardAtom'
import { useMessage } from '@/hooks/useMessage'
import { handleFileDown } from '@/util/board-utils'
import { QcastContext } from '@/app/QcastProvider'
export default function ArchiveTable({ clsCode }) {
// global 로딩바
const { setIsGlobalLoading } = useContext(QcastContext)
const { getMessage } = useMessage()
// api 조회 관련
const { get } = useAxios()
const [search, setSearch] = useRecoilState(searchState)
const [boardList, setBoardList] = useState([])
// 목록 조회
useEffect(() => {
async function fetchData() {
setIsGlobalLoading(true)
const url = `/api/board/list`
const params = new URLSearchParams({
schNoticeTpCd: 'QC',
schNoticeClsCd: clsCode,
schTitle: search.searchValue ? search.searchValue : '',
})
const apiUrl = `${url}?${params.toString()}`
const resultData = await get({ url: apiUrl })
if (resultData) {
if (resultData.result.code === 200) {
setBoardList(resultData.data)
if (resultData.data.length > 0) {
setSearch({ ...search, totalCount: resultData.data[0].totCnt })
} else {
setSearch({ ...search, totalCount: 0 })
}
} else {
alert(resultData.result.message)
}
}
setIsGlobalLoading(false)
}
fetchData()
}, [search.searchValue, search.searchFlag])
return (
<>
{boardList.length > 0 ? (
<div className="file-down-list">
{boardList?.map((board) => (
<div key={board.noticeNo} className="file-down-item">
<div className="file-item-info">
<div className="item-num">
{/* 번호 */}
{board.rowNumber}
</div>
<div className="item-name">
{/* 제목 */}
{board.title}
</div>
<div className="item-date">
{/* 등록일 */}
{getMessage('board.sub.updDt')} : {board.uptDt ? board.uptDt : board.regDt}
</div>
</div>
<div className="file-down-box">
{/* 첨부파일 */}
<button type="button" className="file-down-btn" onClick={() => handleFileDown(board.noticeNo, 'Y')}></button>
</div>
</div>
))}
</div>
) : (
<div className="file-down-nodata">{getMessage('common.message.no.data')}</div>
)}
</>
)
}