diff --git a/Project/frontend/src/App.tsx b/Project/frontend/src/App.tsx index e77ab0a..eb0d311 100644 --- a/Project/frontend/src/App.tsx +++ b/Project/frontend/src/App.tsx @@ -4,6 +4,7 @@ import { Layout } from '@/components/layout'; import { Dashboard, Todo, Kuntae, Jobreport, Project, Login, CommonCodePage, ItemsPage, UserListPage, MonthlyWorkPage, MailFormPage, UserAuthPage, Note } from '@/pages'; import { PatchList } from '@/pages/PatchList'; import { MailList } from '@/pages/MailList'; +import { Customs } from '@/pages/Customs'; import { comms } from '@/communication'; import { UserInfo } from '@/types'; import { Loader2 } from 'lucide-react'; @@ -90,6 +91,7 @@ export default function App() { } /> } /> } /> + } /> } /> } /> } /> diff --git a/Project/frontend/src/components/layout/Header.tsx b/Project/frontend/src/components/layout/Header.tsx index 0829356..9e66aad 100644 --- a/Project/frontend/src/components/layout/Header.tsx +++ b/Project/frontend/src/components/layout/Header.tsx @@ -19,6 +19,7 @@ import { Shield, List, AlertTriangle, + Building, Star, } from 'lucide-react'; import { clsx } from 'clsx'; @@ -96,6 +97,7 @@ const dropdownMenus: DropdownMenuConfig[] = [ items: [ { type: 'link', path: '/common', icon: Code, label: '공용코드' }, { type: 'link', path: '/items', icon: Package, label: '품목정보' }, + { type: 'link', path: '/customs', icon: Building, label: '업체정보' }, { type: 'submenu', icon: Users, diff --git a/Project/frontend/src/pages/Customs.tsx b/Project/frontend/src/pages/Customs.tsx new file mode 100644 index 0000000..dd9e6c3 --- /dev/null +++ b/Project/frontend/src/pages/Customs.tsx @@ -0,0 +1,137 @@ +import { useState, useEffect } from 'react'; +import { Building, Search, RefreshCw } from 'lucide-react'; + +// 임시 타입 정의 (실제 타입은 백엔드에 맞게 수정 필요) +interface CustomItem { + idx: number; + ccode: string; + cname: string; + gubun: string; + addr: string; + tel: string; + fax: string; + email: string; + ceo: string; + busino: string; + uptae: string; + jongmok: string; +} + +export function Customs() { + const [customsList, setCustomsList] = useState([]); + const [loading, setLoading] = useState(false); + const [searchKey, setSearchKey] = useState(''); + + useEffect(() => { + loadData(); + }, []); + + const loadData = async () => { + setLoading(true); + try { + // TODO: 실제 API 호출로 변경 필요 + // const response = await comms.getCustomsList(searchKey); + // if (response.Success && response.Data) { + // setCustomsList(response.Data); + // } + + // 임시 데이터 + console.log('업체정보 조회 (구현 필요):', { searchKey }); + alert('업체정보 API가 아직 구현되지 않았습니다.'); + setCustomsList([]); + } catch (error) { + console.error('업체정보 로드 오류:', error); + alert('데이터를 불러오는 중 오류가 발생했습니다.'); + } finally { + setLoading(false); + } + }; + + const handleSearch = () => { + loadData(); + }; + + return ( +
+ {/* 검색 필터 */} +
+
+
+ + setSearchKey(e.target.value)} + onKeyDown={(e) => e.key === 'Enter' && handleSearch()} + placeholder="업체명, 사업자번호, 대표자 등" + className="flex-1 h-10 bg-white/20 border border-white/30 rounded-lg px-3 text-white placeholder-white/50 focus:outline-none focus:ring-2 focus:ring-primary-400" + /> +
+ + +
+
+ + {/* 업체 목록 */} +
+
+

+ + 업체 정보 +

+ {customsList.length}건 +
+ +
+ {loading ? ( +
+
+ + 데이터를 불러오는 중... +
+
+ ) : customsList.length === 0 ? ( +
+ +

조회된 데이터가 없습니다.

+

업체정보 API 구현이 필요합니다.

+
+ ) : ( + customsList.map((item) => ( +
+
+
+

{item.cname}

+
+
대표: {item.ceo}
+
사업자: {item.busino}
+
업태: {item.uptae}
+
+
+
+
{item.tel}
+
{item.email}
+
+
+
+ )) + )} +
+
+
+ ); +}