Merge remote-tracking branch 'origin/iipbs/sn/dev' into iipbs/sn/ii
This commit is contained in:
@@ -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'
|
||||
|
||||
@@ -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 || '');
|
||||
}}
|
||||
>
|
||||
등록
|
||||
|
||||
@@ -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
|
||||
@@ -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>
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user