161 lines
7.0 KiB
TypeScript
161 lines
7.0 KiB
TypeScript
'use client'
|
|
import { SearchDiv, SearchFormLeft, SearchFormRight, SelectBox, UiTable } from '@common/business_components/ui'
|
|
import { Button, DatePicker, Input, Label } from '@common/components/ui'
|
|
import React, { useEffect, useState } from 'react'
|
|
import OperFileUploadForm from '../../../components/ui/operFileUploadForm'
|
|
import ListDiv from '@common/business_components/ui/list_div'
|
|
import ContentLayout from '@/components/ui/contentLayout'
|
|
import { tableHeadlistOldPp } from '..'
|
|
import { searchData } from '@/components/lib/common/apiHelpers'
|
|
import { formatDate, yearOptions, handleDownload } from '@/components/lib/utils'
|
|
import { deleteData, postData } from '@/components/lib/api'
|
|
const Page = () => {
|
|
const [fromDate, setFromDate] = useState<Date>(() => { const date = new Date(); date.setDate(date.getDate() - 7); return date });
|
|
const [toDate, setToDate] = useState<Date>(new Date());
|
|
const [manageYear, setManageYear] = useState(yearOptions[0]?.val || '');
|
|
const [mngQu, setMngQu] = useState(yearOptions[0]?.val || '');
|
|
const [usr, setUsr] = useState('')
|
|
const [pjNm, setpjNm] = useState('')
|
|
const [fileNm, setFileNm] = useState('')
|
|
const [atflId, setAtflId] = useState('')
|
|
const [dcrpPplMtncBizSn, setDcrpPplMtncBizSn] = useState('')
|
|
const [tableData, setTableData] = useState<any>([{}])
|
|
const [curPage, setCurPage] = useState(1)
|
|
const [totalData, setTotalData] = useState(0) //총 데이터 수
|
|
const [isLoading, setIsLoading] = useState(true) //로딩 상태
|
|
// 데이터 조회
|
|
const fetchData = async () => {
|
|
setIsLoading(true)
|
|
try {
|
|
const { data, total } = await searchData('v1/dcrpPpl', {
|
|
fromRegDt: formatDate(fromDate),
|
|
fromMngYr: manageYear,
|
|
toMngYr: mngQu,
|
|
toRegDt: formatDate(toDate),
|
|
dcrpPplMtncBizNm: pjNm,
|
|
rgtrNm: usr,
|
|
page: curPage - 1,
|
|
size: '10'
|
|
})
|
|
setTableData(data)
|
|
setTotalData(total)
|
|
console.log(data, total)
|
|
} catch (error) {
|
|
console.error('Error fetching data:', error)
|
|
} finally { setIsLoading(false) }
|
|
}
|
|
useEffect(() => {
|
|
setCurPage(1)
|
|
fetchData()
|
|
}, [])
|
|
// 파일 다운로드
|
|
const isChckFile = () => {
|
|
if (fileNm === '' || fileNm === undefined) {
|
|
alert('파일을 선택해주세요')
|
|
return false
|
|
}
|
|
handleDownload(`/attach-service/api/v1/download/${atflId}`, fileNm)
|
|
return true
|
|
}
|
|
// 파일 삭제
|
|
const isDeleteFile = async () => {
|
|
if (dcrpPplMtncBizSn === '' || dcrpPplMtncBizSn === undefined) {
|
|
alert('삭제할 파일을 선택해주세요')
|
|
return false
|
|
}
|
|
const data = await deleteData(`/attach-service/api/v1/atfl/attachments/${atflId}`)
|
|
if (data) {
|
|
const delData = await deleteData(`v1/dcrpPpl/${dcrpPplMtncBizSn}`)
|
|
if (delData.status == 200) {
|
|
alert('삭제되었습니다.')
|
|
fetchData()
|
|
} else {
|
|
alert('삭제에 실패했습니다.')
|
|
}
|
|
}
|
|
}
|
|
// 파일 등록
|
|
const registFile = async (fileNm: string, year: string, quater: string, cd: string, id: string) => {
|
|
const data = await postData('v1/dcrpPpl', {
|
|
atflNm: fileNm,
|
|
mngYr: year,
|
|
mngQu: quater,
|
|
atflCd: cd,
|
|
atflId: id,
|
|
dcrpPplMtncBizNm: fileNm
|
|
})
|
|
if (data) { alert('파일이 등록되었습니다.'); fetchData() }
|
|
}
|
|
return (
|
|
<>
|
|
<SearchDiv>
|
|
<SearchFormLeft>
|
|
<div className='flex items-center gap-4'>
|
|
<div className='flex items-center space-x-2'>
|
|
<Label className="w-20 text-xl text-gray-600">등록기간</Label>
|
|
<DatePicker mode={'single'}
|
|
selected={fromDate}
|
|
onSelect={(date: Date | undefined) => { if (date) setFromDate(date) }} />
|
|
<span>~</span>
|
|
<DatePicker mode={'single'}
|
|
selected={toDate}
|
|
onSelect={(date: Date | undefined) => { if (date) setToDate(date) }} />
|
|
<div className='flex items-center gap-2'>
|
|
<Label className="w-20 text-xl text-gray-600">관리년도</Label>
|
|
<SelectBox
|
|
className="w-[90px] mr-3 ml-4"
|
|
selectClass="rounded-lg bg-white"
|
|
label=""
|
|
selectArray={yearOptions}
|
|
onSelectValue={(value: string | number) => setManageYear(String(value))}
|
|
/>
|
|
<span>~</span>
|
|
<SelectBox
|
|
className="w-[90px] mr-3 ml-4"
|
|
selectClass="rounded-lg bg-white"
|
|
label=""
|
|
selectArray={yearOptions}
|
|
onSelectValue={(value: string | number) => setMngQu(String(value))}
|
|
/>
|
|
</div>
|
|
<div className='flex items-center'>
|
|
<Label className="w-20 text-xl text-gray-600">등록자</Label>
|
|
<Input
|
|
className='w-[100px] !text-2xl'
|
|
value={usr}
|
|
onChange={(e) => setUsr(e.target.value)}
|
|
/>
|
|
</div>
|
|
<div className='flex items-center'>
|
|
<Label className="w-20 text-xl text-gray-600">파일명</Label>
|
|
<Input
|
|
className='w-[100px] !text-2xl'
|
|
value={pjNm}
|
|
onChange={(e) => { setpjNm(e.target.value) }}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</SearchFormLeft>
|
|
<SearchFormRight>
|
|
<Button className="px-4 py-2 bg-blue-600 text-white rounded-sm text-sm font-medium hover:bg-blue-700 mr-2" size="sm" onClick={async () => { await fetchData() }}>조회</Button>
|
|
</SearchFormRight>
|
|
</SearchDiv>
|
|
<ListDiv className="mt-4">
|
|
<div className="card-header flex items-center justify-between">
|
|
<h3 className="text-2xl font-medium">사업정보 등록현황</h3>
|
|
<div>
|
|
<Button className="px-4 py-2 !mr-[1.2rem] bg-blue-600 text-white rounded-sm text-sm font-medium hover:bg-blue-700" size="sm" onClick={isChckFile}>파일 다운로드</Button>
|
|
<Button className="px-4 py-2 bg-blue-600 text-white rounded-sm text-sm font-medium hover:bg-blue-700 !mr-[1.2rem]" size="sm" onClick={isDeleteFile}>삭제</Button>
|
|
</div>
|
|
</div>
|
|
<UiTable headName='' tableData={tableData} headlist={tableHeadlistOldPp} pageSize={10} total={totalData} children={undefined} cellClick={(index) => { if (index != null) { const fileName = tableData[index]?.dcrpPplMtncBizNm ?? ""; setFileNm(fileName); const id = tableData[index]?.atflId ?? ''; setAtflId(id); setDcrpPplMtncBizSn(tableData[index]?.dcrpPplMtncBizSn) } }} onPageChange={async (page: number) => { setCurPage(page); await fetchData() }}></UiTable>
|
|
</ListDiv>
|
|
<ListDiv className="mt-4">
|
|
<OperFileUploadForm title='노후 하수관로 정비사업 주진현황 등록' onSubmit={async (file, year, quater, cd, id) => { await registFile(file, year, quater, cd, id) }} />
|
|
</ListDiv>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default Page |