빗물/중수도/온배수 스크롤 사이즈 재조정

apps/wr/components/ui/form/fcltReg/htdflReg/htdflRegForm.tsx

@@ -16,7 +16,7 @@ import {
   hdtflZod,
   type customHtdflBdst,
 } from "@/app/store/ruseFcltMng/fcltReg/htdflReg";
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import BdstReg from "../bdstReg/bdstReg";
 import {
   formatCommaNumber,
@@ -89,6 +89,16 @@ export default function HtdflRegForm({
       })),
     };
   };
+  const [divStyle, setDivStyle] = useState("h-[53vh]");
+  useEffect(()=>{
+    if(isModal===true){
+      setDivStyle("h-[53vh] max-h-[37vh]")
+    }else if(readonly===true){
+      setDivStyle("h-[62vh]")
+    }else{
+      setDivStyle("h-[53vh]")
+    }
+  },[isModal,readonly]);
 
   useEffect(() => {
     console.log("form errors:", form.formState.errors);
@@ -154,7 +164,7 @@ export default function HtdflRegForm({
               )}
             </div>
           </div>
-          <ScrollArea className={readonly ? "h-[62vh]" : "h-[53vh]"}>
+          <ScrollArea className={divStyle}>
             {isModal && htdflForm != undefined ? (
               <BdstReg form={form} type="HTB" />
             ) : (

apps/wr/components/ui/form/fcltReg/rainReg/rainRegForm.tsx

@@ -49,6 +49,17 @@ export default function RainRegForm({
     "reuseBuilding.0.rainyObj.filtrTrtmfctYn",
   ]);
 
+  const [divStyle, setDivStyle] = useState("h-[53vh]");
+  useEffect(()=>{
+    if(isModal===true){
+      setDivStyle("h-[53vh] max-h-[37vh]")
+    }else if(readonly===true){
+      setDivStyle("h-[62vh]")
+    }else{
+      setDivStyle("h-[53vh]")
+    }
+  },[isModal,readonly]);
+
   const cleanRainData = (raw: any): z.infer<typeof rainZod> => {
     const buildings =
       raw?.reuseBuilding && raw.reuseBuilding.length > 0
@@ -164,7 +175,7 @@ export default function RainRegForm({
               )}
             </div>
           </div>
-          <ScrollArea className={readonly ? "h-[62vh]" : "h-[53vh]"}>
+          <ScrollArea className={divStyle}>
           {isModal && rainForm != undefined ? <BdstReg form={form} /> : <></>}
           {isModal ? (
             <h1 className="pl-3 text-xl col-span-10 mt-4">

apps/wr/components/ui/form/fcltReg/rswtrReg/rswtrRegForm.tsx

@@ -21,7 +21,7 @@ import {
 } from "@common/business_components/ui";
 import { Button, Input, ScrollArea } from "@common/components/ui";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { useForm, type UseFormReturn } from "react-hook-form";
 import { z } from "zod";
 import BdstReg from "../bdstReg/bdstReg";
@@ -40,7 +40,16 @@ export default function RswtrRegForm({
   const { rswt, code, rswtBdstUpdate, rswtBdstReg } = useWrStore(
     (state) => state
   );
-
+  const [divStyle, setDivStyle] = useState("h-[53vh]");
+  useEffect(()=>{
+    if(isModal===true){
+      setDivStyle("h-[53vh] max-h-[37vh]")
+    }else if(readonly===true){
+      setDivStyle("h-[62vh]")
+    }else{
+      setDivStyle("h-[53vh]")
+    }
+  },[isModal,readonly]);
  // const defaultValues: z.infer<typeof rswtZod> = rswtZod.parse({});
 
   const form = useForm<z.infer<typeof rswtZod>>({
@@ -151,7 +160,7 @@ export default function RswtrRegForm({
               )}
             </div>
           </div>
-          <ScrollArea className={readonly ? "h-[60vh]" : "h-[53vh]"}>
+          <ScrollArea className={divStyle}>
             {isModal && rswtForm != undefined ? <BdstReg form={form} /> : <></>}
             {isModal ? (
               <h1 className="pl-3 text-xl col-span-10  mt-4 ">