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

108 lines
3.1 KiB
JavaScript

'use client'
import { useEffect, useState } 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'
export default function ArchiveTable({ clsCode }) {
const { getMessage } = useMessage()
// api 조회 관련
const { get } = useAxios()
const [search, setSearch] = useRecoilState(searchState)
const [boardList, setBoardList] = useState([])
// 목록 조회
useEffect(() => {
async function fetchData() {
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)
}
}
}
fetchData()
}, [search.searchValue, search.searchFlag])
// 상세 파일 목록 조회
const handleDetailFileListDown = async (noticeNo) => {
const url = `/api/board/detail`
const params = new URLSearchParams({
noticeNo: noticeNo,
})
const apiUrl = `${url}?${params.toString()}`
const resultData = await get({ url: apiUrl })
if (resultData) {
if (resultData.result.code === 200) {
const boardDetailFileList = resultData.data.listFile
if (boardDetailFileList && Array.isArray(boardDetailFileList)) {
boardDetailFileList.forEach((boardFile) => {
handleFileDown(boardFile)
})
}
} else {
alert(resultData.result.message)
}
}
}
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={() => handleDetailFileListDown(board.noticeNo)}></button>
</div>
</div>
))}
</div>
) : (
<div className="file-down-nodata">{getMessage('common.message.no.data')}</div>
)}
</>
)
}