Files
frontend/apps/sn/app/oper/oldPp/page.tsx
T

102 lines
5.8 KiB
TypeScript

'use client'
import { SearchDiv, SearchFormLeft, SearchFormRight, UiTable } from '@common/business_components/ui'
import { Button, DatePicker, Input, Label } from '@common/components/ui'
import React, { useState } from 'react'
import FileUploadForm from '../../components/ui/fileUploadForm'
import ListDiv from '@common/business_components/ui/list_div'
import ContentLayout from '@/components/ui/contentLayout'
import { tableHeadlist } from '..'
import { handleDownload } from '@/components/lib/utils/fileDownload'
import { searchData } from '@/components/lib/common/apiHelpers'
import { formatDate } from '@/components/lib/common/date'
// TODO: 임시 id
export const tableData = [{ 'no': '1', 'fileNm': '2023년 노후하수관로 정비사업', 'mngYr': '2023', 'mngQu': '1', 'registDt': '2023-10-01', 'registUsr': '홍길동' },]
const Page = () => {
const [fromDate, setFromDate] = useState<Date>(new Date());
const [toDate, setToDate] = useState<Date>(new Date());
const [manageYear, setManageYear] = useState('')
const [mngQu, setMngQu] = useState('')
const [usr, setUsr] = useState('')
const [pjNm, setpjNm] = useState('')
const [fileNm, setFileNm] = useState('')
const isChckFile = () => {
if (fileNm === '' || fileNm === undefined) {
alert('파일을 선택해주세요')
return false
}
// TODO: 추후 파일코드 동적으로 세팅
handleDownload('/sn/attach-service/api/v1/download/6066b08c-2a55-438c-b8ff-2aed9739a0c6', fileNm)
return true
}
return (
<ContentLayout title='노후 하수관로 정비사업'>
<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'>
<Label className="w-20 text-xl text-gray-600">관리년도</Label>
<Input
className='w-[100px]'
value={manageYear}
onChange={(e) => setManageYear(e.target.value)}
/>
<span>~</span>
<Input
className='w-[100px]'
value={mngQu}
onChange={(e) => setMngQu(e.target.value)}
/>
</div>
<div className='flex items-center'>
<Label className="w-20 text-xl text-gray-600">등록자</Label>
<Input
className='w-[100px]'
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]'
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={() => { searchData('v1/dcrpPpl', { fromRegDt: formatDate(fromDate), fromMngYr: manageYear, toMngYr: mngQu, toRegDt: formatDate(toDate), atflNm: pjNm, rgtrNm: usr, page: '0', size: '10' }) }}>조회</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" >삭제</Button>
</div>
</div>
<UiTable headName='' tableData={tableData} headlist={tableHeadlist} pageSize={10} total={20} children={undefined} cellClick={(index) => { if (index != null) { const fileName = tableData[index]?.fileNm ?? ""; setFileNm(fileName) } }} onPageChange={function (page: number): void {
throw new Error('Function not implemented.')
}}></UiTable>
</ListDiv>
<ListDiv className="mt-4">
<FileUploadForm title='노후 하수관로 정비사업 주진현황 등록' onSubmit={() => { }} />
</ListDiv>
</ContentLayout>
)
}
export default Page