Merge remote-tracking branch 'origin/iipbs/sn/dev' into iipbs/sn/ii

This commit is contained in:
swcho
2025-05-23 15:29:34 +09:00
6 changed files with 184 additions and 142 deletions
@@ -10,9 +10,5 @@ export const searchData = async<T extends Record<string, any>>(url: string, para
}, {} as Record<string, string>)
);
const data = await getData(`${url}?${params.toString()}`);
if (data) {
console.log(data.content)
// TODO: data 들어오면 data 보여주게 작업필요 ~ !
data.content && console.log(data)
}
return data && data.content
}
@@ -1,3 +1,4 @@
export { getCookie, setCookie, removeCookie } from "./cookie";
export { handleUpload } from "./fileUploadUtil";
export * from "./fileDownload";
export * from './date'
+50 -48
View File
@@ -1,32 +1,34 @@
"use client"
import { FileUpload, SelectBox } from '@common/business_components/ui';
import { Button, Input } from '@common/components/ui';
import { SelectBox } from '@common/business_components/ui';
import { Button } from '@common/components/ui';
import React, { useState } from 'react'
import type { HttpResponse, Upload } from "tus-js-client";
import { FileUploader } from "@common/components";
import { handleUpload } from "@utils";
import { set } from 'react-hook-form';
const FileUploadForm = ({ title, onSubmit }: { title: string, onSubmit:(files:FileList, year:string, quarter:string) => void }) => {
const FileUploadForm = ({ title, onSubmit }: { title: string, onSubmit: (files: string, year: string, quarter: string, code:string, id:string) => void }) => {
const [atflCd, setAtflCd] = useState<string | null>(null);
const [atflId, setAtflId] = useState<string | null>(null);
const handleUploadResponse = (file: File) => async (res: HttpResponse) => {
const fileInfo = res.getHeader("X-File-Info");
if (!fileInfo) return;
const { atflCd, atflId } = JSON.parse(fileInfo) ?? {};
const orgnlFileNm = file.name;
console.log(atflCd, atflId, orgnlFileNm);
};
console.log('orgnlFileNm', orgnlFileNm, atflCd, atflId);
setAtflCd(atflCd);
setAtflId(atflId);
};
// 현재 년도부터 10년 전까지의 년도 옵션 생성
const yearOptions = Array.from({ length: 10 }, (_, i) => {
const year = new Date().getFullYear() - i;
return { text: `${year}년`, val: year.toString() };
});
const quater = [{text: '1분기', val: '1'}, {text: '2분기', val: '2'}, {text: '3분기', val: '3'}, {text: '4분기', val: '4'}]
const quater = [{ text: '1분기', val: '1' }, { text: '2분기', val: '2' }, { text: '3분기', val: '3' }, { text: '4분기', val: '4' }]
const [files, setFiles] = useState<FileList | null>(null);
const [selectedYear, setSelectedYear] = useState<string>(yearOptions[0]?.val || '');
const [selectedQuarter, setSelectedQuarter] = useState<string>(quater[0]?.val || '');
const [selectedQuarter, setSelectedQuarter] = useState<string>(quater[0]?.val || '');
const [upload, setUpload] = useState<Upload | null>(null);
return (
@@ -37,50 +39,48 @@ const FileUploadForm = ({ title, onSubmit }: { title: string, onSubmit:(files:Fi
<div className="card p-6">
<div className="grid grid-col-2 items-center space-x-4">
<div className='flex'>
<SelectBox
className="w-50 mr-3 ml-4"
selectClass="rounded-lg bg-white"
label="년도"
selectArray={yearOptions}
onSelectValue={(value: string | number) => setSelectedYear(String(value))}
/><SelectBox
className="w-50"
selectClass="rounded-lg bg-white"
label="분기"
selectArray={quater}
onSelectValue={(value: string | number) => setSelectedQuarter(String(value))}
/>
<div className='flex ml-5 items-center'>
<SelectBox
className="w-50 mr-3 ml-4"
selectClass="rounded-lg bg-white"
label="년도"
selectArray={yearOptions}
onSelectValue={(value: string | number) => setSelectedYear(String(value))}
/><SelectBox
className="w-50"
selectClass="rounded-lg bg-white"
label="분기"
selectArray={quater}
onSelectValue={(value: string | number) => setSelectedQuarter(String(value))}
/>
<div className='flex ml-5 items-center'>
<div className="w-[80px] mr-4">
<FileUploader
id="atflCd"
className="!h-auto !max-w-none flex-col !items-start"
accept=".jpeg,.jpg,.png"
onUpload={(e) => {
const selectedFiles = e.target.files;
if (!selectedFiles) return;
<FileUploader
id="atflCd"
className="!h-auto !max-w-none flex-col !items-start"
accept=".jpeg,.jpg,.png"
onUpload={(e) => {
const selectedFiles = e.target.files;
if (!selectedFiles) return;
const fileArray = Array.from(selectedFiles);
if(!fileArray){
setFiles(fileArray);
}
if (fileArray[0]) {
handleUpload(selectedFiles, {
handleUploadStart: setUpload,
handleSuccess: setUpload,
handleResponse: handleUploadResponse(fileArray[0]),
});
}
setFiles(selectedFiles);
if (selectedFiles[0]) {
handleUpload(selectedFiles, {
handleUploadStart: setUpload,
handleSuccess: setUpload,
handleResponse: handleUploadResponse(selectedFiles[0]),
});
}
}}
customPreview={<></>}
/>
}}
customPreview={<></>}
/>
</div>
<Button
className="px-4 py-2 bg-blue-600 text-white rounded-sm text-sm font-medium hover:bg-blue-700"
size="sm"
onClick={() => {
if (!files?.[0]) {
console.log(files?.[0]?.name)
if (!files) {
alert('파일을 선택해주세요.');
return;
}
@@ -89,9 +89,11 @@ const FileUploadForm = ({ title, onSubmit }: { title: string, onSubmit:(files:Fi
return;
}
if (!selectedQuarter) {
alert('분기기를 선택해주세요.');
alert('분기를 선택해주세요.');
return;
}
const fileNm = files?.[0]?.name || '';
onSubmit(fileNm, selectedYear, selectedQuarter, atflCd || '', atflId || '');
}}
>
등록
+94 -73
View File
@@ -1,16 +1,15 @@
'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 React, { useEffect, 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 { tableData } from '../oldPp/page'
import { searchData } from '@/components/lib/common/apiHelpers'
import { tableHeadlist } from '..'
import { handleDownload } from '@/components/lib/utils/fileDownload'
import { handleUpload } from '@/components/lib/utils/fileUploadUtil'
import { formatDate } from '@/components/lib/common/date'
import { formatDate } from '@/components/lib/utils/date'
import { postData } from '@/components/lib/api'
const Page = () => {
const [fromDate, setFromDate] = useState(new Date())
@@ -20,83 +19,105 @@ const Page = () => {
const [usr, setUsr] = useState('')
const [pjNm, setpjNm] = useState('')
const [fileNm, setFileNm] = useState('')
// TODO: 초기값 세팅필요
const [atflId, setAtflId] = useState('')
const [atflCd, setAtflCd] = useState('')
const [tableData, setTableData] = useState<any>([{}])
useEffect(() => {
const fetchData = async () => {
const data = await searchData('v1/sbmrgPrevnt', {
fromRegDt: formatDate(new Date()),
toRegDt: formatDate(new Date()),
page: '0',
size: '10'
})
setTableData(data)
}
fetchData()
}, [])
const isChckFile = () => {
if (fileNm === '' || fileNm === undefined) {
alert('파일을 선택해주세요')
}
// TODO: 추후 파일코드 동적으로 세팅
handleDownload('/attach-service/api/v1/download/6066b08c-2a55-438c-b8ff-2aed9739a0c6', fileNm)
handleDownload(`/attach-service/api/v1/download/${atflId}`, fileNm)
}
//TODO: 파일 업로드 처리
return (
<ContentLayout title='도시침수 예방사업'>
<SearchDiv>
<SearchFormLeft>
<div className='flex items-center gap-4'>
<div className='flex items-center gap-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) }} />
const registFile = async (fileNm: string, year: string, quater: string, cd: string, id: string) => {
const data = await postData('v1/sbmrgPrevnt', {
atflNm: fileNm,
mngYr: year,
mngQu: quater,
atflCd: cd,
atflId: id
})
if (data.ok) { setAtflId(data.atflId); setAtflCd(data.atflCd) }
}
return (
<ContentLayout title='도시침수 예방사업'>
<SearchDiv>
<SearchFormLeft>
<div className='flex items-center gap-4'>
<div className='flex items-center gap-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>
<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 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)}
/>
</SearchFormLeft>
<SearchFormRight>
<Button className="px-4 py-2 bg-blue-600 text-white rounded-sm text-sm font-medium hover:bg-blue-700" size="sm" onClick={() => { const data = searchData('v1/sbmrgPrevnt', { fromRegDt: formatDate(fromDate), fromMngYr: manageYear, toMngYr: mngQu, toRegDt: formatDate(toDate), atflNm: pjNm, rgtrNm: usr, page: '0', size: '10' }); setTableData(data)}} >조회</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={() => { }} >삭제</Button>
</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" size="sm" onClick={() => { searchData('v1/sbmrgPrevnt', { 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" onClick={() => { }} >삭제</Button>
</div>
</div>
<UiTable headName='' tableData={tableData} headlist={tableHeadlist} pageSize={10} total={10} 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>
)
<UiTable headName='' tableData={tableData} headlist={tableHeadlist} pageSize={10} total={10} 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={async (file, year, quater, cd, id) => {await registFile(file, year,quater, cd,id) }} />
</ListDiv>
</ContentLayout>
)
}
export default Page
+38 -16
View File
@@ -1,17 +1,15 @@
'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 React, { useEffect, 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': '홍길동' },]
import { formatDate } from '@/components/lib/utils/date'
import { postData } from '@/components/lib/api'
const Page = () => {
const [fromDate, setFromDate] = useState<Date>(new Date());
const [toDate, setToDate] = useState<Date>(new Date());
@@ -20,15 +18,39 @@ const Page = () => {
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
}
const [atflId, setAtflId] = useState('')
const [atflCd, setAtflCd] = useState('')
const [tableData, setTableData] = useState<any>([{}])
useEffect(() => {
const fetchData = async () => {
const data = await searchData('v1/dcrpPpl', {
fromRegDt: formatDate(new Date()),
toRegDt: formatDate(new Date()),
page: '0',
size: '10'
})
setTableData(data)
}
fetchData()
}, [])
const isChckFile = () => {
if (fileNm === '' || fileNm === undefined) {
alert('파일을 선택해주세요')
return false
}
handleDownload(`/sn/attach-service/api/v1/download/${atflId}}`, fileNm)
return true
}
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
})
if (data.ok) { setAtflId(data.atflId); setAtflCd(data.atflCd) }
}
return (
<ContentLayout title='노후 하수관로 정비사업'>
<SearchDiv>
@@ -77,7 +99,7 @@ const Page = () => {
</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>
<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={() => { const data = searchData('v1/dcrpPpl', { fromRegDt: formatDate(fromDate), fromMngYr: manageYear, toMngYr: mngQu, toRegDt: formatDate(toDate), atflNm: pjNm, rgtrNm: usr, page: '0', size: '10' }); setTableData(data) }}>조회</Button>
</SearchFormRight>
</SearchDiv>
<ListDiv className="mt-4">
@@ -93,7 +115,7 @@ const Page = () => {
}}></UiTable>
</ListDiv>
<ListDiv className="mt-4">
<FileUploadForm title='노후 하수관로 정비사업 주진현황 등록' onSubmit={() => { }} />
<FileUploadForm title='노후 하수관로 정비사업 주진현황 등록' onSubmit={async (file, year, quater, cd, id) => {await registFile(file, year,quater, cd,id)}} />
</ListDiv>
</ContentLayout>
)