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

sn: 분석화면

Browse Source
This commit is contained in:
mind-one005
2026-03-18 16:15:25 +09:00
parent 0b46ba36dc
commit cb8743ea39
2 changed files with 27 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/sn/app/(map-layout)/map/components/popupComponent/chart/infilChart.tsx
+6 -6
View File
@@ -150,7 +150,7 @@ const InfilChart = ({ pplMngNo = '' }: ModalOpenProp) => {
};
const renderInfoInput = (label: string, value?: string | number | null) => (
<div className="grid grid-cols-[125px_minmax(0,1fr)] items-center gap-3">
<div className="grid grid-cols-[minmax(0,32%)_minmax(0,68%)] items-center gap-3">
<Label className="w-auto text-[14px] font-semibold text-[#5c6470] whitespace-nowrap">{label}</Label>
<Input
className="h-[42px] rounded-[5px] border border-[#d7dde5] bg-white px-3 text-xl md:text-xl text-[#2b3440]"
@@ -171,7 +171,7 @@ const InfilChart = ({ pplMngNo = '' }: ModalOpenProp) => {
<div className="text-[18px] font-semibold text-[#111827]" />
</div>
<div className="grid min-h-[68vh] grid-cols-[440px_minmax(0,1fr)] gap-5">
<div className="grid min-h-[68vh] grid-cols-[minmax(0,38%)_minmax(0,62%)] gap-5">
<section className="relative rounded-[12px] border border-[#b1b1b1] bg-white p-5">
<h3 className="mb-6 text-[20px] font-extrabold tracking-[-0.02em] text-black">
침입수 분석 선택 조건
@@ -179,7 +179,7 @@ const InfilChart = ({ pplMngNo = '' }: ModalOpenProp) => {
<div className="rounded-[6px] border border-[#d9dde3] bg-[#eff1f4] px-4 py-6">
<div className="space-y-3">
<div className="grid grid-cols-[125px_minmax(0,1fr)] items-center gap-3">
<div className="grid grid-cols-[minmax(0,32%)_minmax(0,68%)] items-center gap-3">
<Label className="w-auto text-[14px] font-semibold text-[#5c6470] whitespace-nowrap">
상수사용월:
</Label>
@@ -193,7 +193,7 @@ const InfilChart = ({ pplMngNo = '' }: ModalOpenProp) => {
/>
</div>
<div className="grid grid-cols-[125px_minmax(0,1fr)] items-center gap-3">
<div className="grid grid-cols-[minmax(0,32%)_minmax(0,68%)] items-center gap-3">
<Label className="w-auto text-[14px] font-semibold text-[#5c6470] whitespace-nowrap">
분석정보:
</Label>
@@ -283,8 +283,8 @@ const InfilChart = ({ pplMngNo = '' }: ModalOpenProp) => {
bodyClass={`
w-[78vw]
max-w-none
min-h-[74vh]
max-h-none
min-w-[1000px]
min-h-[72vh]
overflow-visible
z-[50]
`}
apps/sn/app/(map-layout)/map/components/popupComponent/chart/rdiiChart.tsx
+21 -21
View File
@@ -174,7 +174,7 @@ const RdiiChart = ({ pplMngNo = '' }: ModalOpenProp) => {
};
const renderInfoInput = (label: string, value?: string | number | null) => (
<div className="grid grid-cols-[125px_minmax(0,1fr)] items-center gap-3">
<div className="grid grid-cols-[minmax(0,32%)_minmax(0,68%)] items-center gap-3">
<Label className="w-auto whitespace-nowrap text-[14px] font-semibold text-[#5c6470]">
{label}
</Label>
@@ -193,7 +193,7 @@ const RdiiChart = ({ pplMngNo = '' }: ModalOpenProp) => {
<div className="text-[18px] font-semibold text-[#111827]" />
</div>
<div className="grid min-h-[68vh] grid-cols-[440px_minmax(0,1fr)] gap-5">
<div className="grid min-h-[68vh] grid-cols-[minmax(0,36%)_minmax(0,64%)] gap-5">
<section className="relative rounded-[12px] border border-[#b1b1b1] bg-white p-5">
<h3 className="mb-6 text-[20px] font-extrabold tracking-[-0.02em] text-black">
강우유입수분석 선택 조건
@@ -201,7 +201,7 @@ const RdiiChart = ({ pplMngNo = '' }: ModalOpenProp) => {
<div className="rounded-[6px] border border-[#d9dde3] bg-[#eff1f4] px-4 py-6">
<div className="space-y-3">
<div className="grid grid-cols-[125px_minmax(0,1fr)] items-center gap-3">
<div className="grid grid-cols-[minmax(0,32%)_minmax(0,68%)] items-center gap-3">
<Label className="w-auto whitespace-nowrap text-[14px] font-semibold text-[#5c6470]">
상수사용월:
</Label>
@@ -215,7 +215,7 @@ const RdiiChart = ({ pplMngNo = '' }: ModalOpenProp) => {
/>
</div>
<div className="grid grid-cols-[125px_minmax(0,1fr)] items-center gap-3">
<div className="grid grid-cols-[minmax(0,32%)_minmax(0,68%)] items-center gap-3">
<Label className="w-auto whitespace-nowrap text-[14px] font-semibold text-[#5c6470]">
분석정보:
</Label>
@@ -253,19 +253,19 @@ const RdiiChart = ({ pplMngNo = '' }: ModalOpenProp) => {
강우유입수분석 결과
</h3>
<div className="mb-6 grid grid-cols-2 gap-5">
<div className="mb-6 flex gap-5">
{/* 좌측 카드 */}
<div className="flex min-h-[98px] items-center justify-between rounded-[16px] border border-[#5fa3ea] bg-white px-6 py-4">
<div className="text-[16px] font-bold text-[#ef4444]">
상수사용량 적용연월
</div>
<div className="text-[24px] font-extrabold leading-none text-[#111]">
{aplcnYm ? moment(aplcnYm, 'YYYYMM').format('YYYY-MM') : '-'}
</div>
<div className="flex min-h-[98px] min-w-0 basis-2/5 grow shrink-[1.4] items-center justify-between rounded-[16px] border border-[#5fa3ea] bg-white px-6 py-4">
<div className="text-[16px] font-bold text-[#ef4444]">
상수사용량 적용연월
</div>
<div className="text-[24px] font-extrabold leading-none text-[#111]">
{aplcnYm ? moment(aplcnYm, 'YYYYMM').format('YYYY-MM') : '-'}
</div>
</div>
{/* 우측 카드 */}
<div className="flex min-h-[98px] min-w-0 items-center gap-5 rounded-[16px] border border-[#5fa3ea] bg-white px-6 py-4">
<div className="flex min-h-[98px] min-w-0 basis-3/5 grow shrink items-center gap-5 rounded-[16px] border border-[#5fa3ea] bg-white px-6 py-4">
{/* 좌측: 제목 (세로 가운데 정렬) */}
<div className="flex min-w-0 basis-[32%] items-center">
<div className="text-[16px] font-bold text-[#ef4444] break-keep">
@@ -276,10 +276,10 @@ const RdiiChart = ({ pplMngNo = '' }: ModalOpenProp) => {
{/* 우측: 지표 영역 */}
<div className="flex min-w-0 basis-[68%] flex-col gap-[2px]">
<div className="flex min-w-0 items-center gap-3">
<div className="min-w-0 basis-[42%] text-right text-[15px] text-[#555]">
<div className="min-w-0 basis-[48%] text-right text-[15px] text-[#555]">
평균RDII
</div>
<div className="min-w-0 basis-[38%] text-right text-[18px] font-extrabold text-[#111] tabular-nums">
<div className="min-w-0 basis-[32%] text-right text-[18px] font-extrabold text-[#111] tabular-nums">
{rdiiQty}
</div>
<div className="min-w-0 basis-[20%] text-left text-[14px] text-[#111]">
@@ -288,10 +288,10 @@ const RdiiChart = ({ pplMngNo = '' }: ModalOpenProp) => {
</div>
<div className="flex min-w-0 items-center gap-3">
<div className="min-w-0 basis-[42%] text-right text-[15px] text-[#555]">
<div className="min-w-0 basis-[48%] text-right text-[15px] text-[#555]">
적용 강우량
</div>
<div className="min-w-0 basis-[38%] text-right text-[18px] font-extrabold text-[#111] tabular-nums">
<div className="min-w-0 basis-[32%] text-right text-[18px] font-extrabold text-[#111] tabular-nums">
{rainTotal}
</div>
<div className="min-w-0 basis-[20%] text-left text-[14px] text-[#111]">
@@ -300,10 +300,10 @@ const RdiiChart = ({ pplMngNo = '' }: ModalOpenProp) => {
</div>
<div className="flex min-w-0 items-center gap-3">
<div className="min-w-0 basis-[42%] text-right text-[15px] text-[#555]">
<div className="min-w-0 basis-[48%] text-right text-[15px] text-[#555]">
강우량 대비 RDII
</div>
<div className="min-w-0 basis-[38%] text-right text-[18px] font-extrabold text-[#111] tabular-nums">
<div className="min-w-0 basis-[32%] text-right text-[18px] font-extrabold text-[#111] tabular-nums">
{totalVolume}
</div>
<div className="min-w-0 basis-[20%] text-left text-[14px] text-[#111]">
@@ -343,8 +343,8 @@ const RdiiChart = ({ pplMngNo = '' }: ModalOpenProp) => {
bodyClass={`
w-[78vw]
max-w-none
min-h-[74vh]
max-h-none
min-w-[1100px]
min-h-[72vh]
overflow-visible
z-[50]
`}