ONAANDALL/frontend
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(sn): CS 기준 UI 통일 및 지도 팝업 표준화

Browse Source
This commit is contained in:
mind-one001
2026-08-20 14:57:20 +09:00
parent c9e3ff0d91
commit 0cbbc3b934
167 changed files with 21191 additions and 14161 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/sn/app/(map-layout)/map/components/InputSection.tsx
+46 -17
View File
@@ -1,49 +1,78 @@
import { Table, TableHeader, TableRow, TableHead, TableBody, TableCell } from "@common/components/ui";
import {
Table,
TableHeader,
TableRow,
TableHead,
TableBody,
TableCell,
} from "@common/components/ui";
import React from "react";
interface InputSectionProps {
title: string;
data: { year: string; type: string, bizInfoNm: string, bizType: string }[];
data: { year: string; type: string; bizInfoNm: string; bizType: string }[];
sectionKey: string;
onInputChange: (section: string, index: number, field: string, value: string) => void;
onInputChange: (
section: string,
index: number,
field: string,
value: string,
) => void;
}
const InputSection: React.FC<InputSectionProps> = ({ title, data, sectionKey, onInputChange }) => {
const InputSection: React.FC<InputSectionProps> = ({
title,
data,
sectionKey,
onInputChange,
}) => {
return (
<div>
{/* 섹션 제목 */}
<div className="card-header">
<h3 className="text-2xl mx-3 font-medium text-label whitespace-nowrap">{title}</h3>
<h3 className="mx-3 whitespace-nowrap text-2xl font-medium text-label">
{title}
</h3>
</div>
{/* 테이블 */}
<div className="card !m-[1.2rem] !p-0r">
<div className="card !p-0r !m-[1.2rem]">
<Table variant="secondary" className="w-full">
<TableHeader>
<TableRow>
<TableHead className="border border-gray-300 px-2 py-2 text-sm w-auto whitespace-nowrap">구분</TableHead>
<TableHead className="border border-gray-300 px-2 py-2 text-sm w-[80px] whitespace-nowrap">진단연도</TableHead>
<TableHead className="border border-gray-300 px-2 py-2 text-sm w-auto whitespace-nowrap">사업명</TableHead>
<TableHead className="border border-gray-300 px-2 py-2 text-sm w-auto whitespace-nowrap">유형</TableHead>
<TableHead className="w-auto whitespace-nowrap border border-border px-2 py-2 text-sm">
구분
</TableHead>
<TableHead className="w-[80px] whitespace-nowrap border border-border px-2 py-2 text-sm">
진단연도
</TableHead>
<TableHead className="w-auto whitespace-nowrap border border-border px-2 py-2 text-sm">
사업명
</TableHead>
<TableHead className="w-auto whitespace-nowrap border border-border px-2 py-2 text-sm">
유형
</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{data.map((row, index) => (
<TableRow key={index}>
<TableCell className="border border-gray-300 px-2 py-2 text-sm text-center leading-normal w-auto whitespace-nowrap">
<TableCell className="w-auto whitespace-nowrap border border-border px-2 py-2 text-center text-sm leading-normal">
{row.type}
</TableCell>
<TableCell className="border border-gray-300 px-2 py-2 text-sm w-[80px] whitespace-nowrap">
<TableCell className="w-[80px] whitespace-nowrap border border-border px-2 py-2 text-sm">
<input
type="text"
value={row.year}
onChange={(e) => onInputChange(sectionKey, index, "year", e.target.value)}
className="w-full text-xl border-radius-0 px-3 py-2 text-base text-center leading-normal"
onChange={(e) =>
onInputChange(sectionKey, index, "year", e.target.value)
}
className="border-radius-0 w-full px-3 py-2 text-center text-base text-xl leading-normal"
/>
</TableCell>
<TableCell className="border border-gray-300 px-2 py-2 text-sm text-center leading-normal w-auto">
<TableCell className="w-auto border border-border px-2 py-2 text-center text-sm leading-normal">
{row.bizInfoNm}
</TableCell>
<TableCell className="border border-gray-300 px-2 py-2 text-sm text-center leading-normal w-auto whitespace-nowrap">
<TableCell className="w-auto whitespace-nowrap border border-border px-2 py-2 text-center text-sm leading-normal">
{row.bizType}
</TableCell>
</TableRow>
@@ -55,4 +84,4 @@ const InputSection: React.FC<InputSectionProps> = ({ title, data, sectionKey, on
);
};
export default InputSection;
export default InputSection;