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

빗물, 중수도 건축물 등록 및 form 수정

Browse Source
This commit is contained in:
jyha00
2025-07-10 13:36:25 +09:00
parent 46e5ef701d
commit a46fbf5a5d
5 changed files with 162 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/wr/app/ruseFcltMng/fcltReg/rswtReg/page.tsx
+12 -4
View File
@@ -45,7 +45,7 @@ export default function Home() {
useEffect(() => {
if (code.sggCd.length > 0) {
if( rswtRes?.length > 0){
if (rswtRes?.length > 0) {
const rswtData = tableData(rswtRes, { code })?.map(
(item: customRswtBdst) => {
let archArea =
@@ -62,12 +62,20 @@ export default function Home() {
);
setbdstTable(rswtData);
setRswtForm(rswtRes[selectVal ?? 0]);
}else{
} else {
setbdstTable([]);
setRswtForm({} as customRswtBdst);
}
}
}, [code, rswtRes, selectVal]);
// }, [code, rswtRes, selectVal]);
}, [code, rswtRes]);
useEffect(() => {
if (rswtRes && rswtRes.length > 0) {
setRswtForm(rswtRes[selectVal ?? 0]);
}
}, [rswtRes, selectVal]);
const cellClick: (val: number | undefined, headId: string) => void = (
val,
headId
@@ -75,7 +83,7 @@ export default function Home() {
if ((bdstTable ?? []).length > 0 && val !== undefined) {
{
setSelect(val);
setRswtForm(rswtRes[val]);
// setRswtForm(rswtRes[val]);
}
}
apps/wr/components/ui/form/fcltReg/bdstReg/bdstAdd.tsx
+143
View File
@@ -0,0 +1,143 @@
"use client";
import { useWrStore } from "@/app/store";
import { selectClass } from "@/app/store/ruseFcltMng/fcltReg/rainReg";
import { formH1Class } from "@/components/lib/class/comClass";
import { safeDate } from "@/components/lib/func/commom";
import { DatePicker, FormField, FormUi, SelectBox } from "@common/business_components";
import { Button, Checkbox, Input } from "@common/components";
import { useEffect, useState } from "react";
import { useFieldArray } from "react-hook-form";
export default function BdstAdd({ form, readonly }: { form: any; readonly?: boolean; }) {
const { code } = useWrStore((state) => {
return state;
});
const { fields, append, remove } = useFieldArray({
name: "chgBuilding",
control: form?.control, // Provide a fallback to avoid errors
});
const plusHist = () => {
append({
bdstNm: "",
daddr: "",
bdstUsgCd: "",
});
};
const [selectedIds, setSelectedIds] = useState<string[]>([]);
const toggleSelect = (id: string) => {
setSelectedIds((prev) =>
prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]
);
};
const removeSelected = () => {
const idxsToRemove = fields
.map((item, idx) => (selectedIds.includes(item.id) ? idx : -1))
.filter((index) => index > -1)
.sort((prevIndex, nextIndex) => nextIndex - prevIndex);
remove(idxsToRemove);
setSelectedIds([]);
};
return (
<>
<h1 className={formH1Class}>중축, 개축, 재축</h1>
{!readonly && (
<div className="flex justify-end gap-2 mt-4">
<Button type="button" className="" size={"sm"} onClick={plusHist}>
이력추가
</Button>
<Button
type="button"
className="!bg-red-500 text-white"
size={"sm"}
onClick={removeSelected}
>
삭제
</Button>
</div>
)}
{fields.map((field, index) => (
<div
key={field.id}
// className="grid grid-cols-[auto,1fr,1fr,1fr] gap-2 mt-4 items-center"
className={`grid ${
readonly ? "grid-cols-3" : "grid-cols-[auto,1fr,1fr,1fr]"
} gap-2 mt-4 items-center`}
>
{!readonly && (
<div className="col-span-1 flex justify-center mr-4">
<Checkbox
checked={selectedIds.includes(field.id)}
onCheckedChange={() => toggleSelect(field.id)}
/>
</div>
)}
<div className="">
<FormField
control={form.control}
name={`chgBuilding.${index}.bdstChgNm`}
render={({ field: f }) => (
<FormUi label="구분">
<SelectBox
selectClass={selectClass}
selectArray={code.chBuCd}
onSelectValue={(val) => f.onChange(val)}
value={f.value ?? code.chBuCd[0]?.val}
className={""}
label={""}
/>
</FormUi>
)}
/>
</div>
<div className="">
<FormField
control={form.control}
name={`chgBuilding.${index}.archChgPrmsnDt`}
render={({ field: f }) => (
<FormUi label="허가일">
<DatePicker
mode="single"
field={{
value: safeDate(f.value) || new Date(),
onChange: (date) => f.onChange(date),
}}
selectClass="w-full"
/>
</FormUi>
)}
/>
</div>
<div className="">
<FormField
control={form.control}
name={`chgBuilding.${index}.archChgArea`}
render={({ field: f }) => (
<FormUi label="면적">
<Input
placeholder="-"
type="text"
onChange={(e) => f.onChange(e.target.value)}
value={f.value || ''}
className={selectClass}
/>
</FormUi>
)}
/>
</div>
</div>
))}
<div className="border-b border-gray-300 my-4"> </div>
</>
)
}
apps/wr/components/ui/form/fcltReg/bdstReg/bdstReg.tsx
+1 -113
View File
@@ -28,28 +28,6 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
const [useCityCd, setUserCityCd] = useState<SelectDataType[]>([])
const [useSggCd, setUserSggCd] = useState<SelectDataType[]>([])
const { fields, append, remove } = useFieldArray({
name: "chgBuilding",
control: form?.control, // Provide a fallback to avoid errors
});
const plusHist = () => {
append({
bdstNm: "",
daddr: "",
bdstUsgCd: "",
});
};
const removeSelected = () => {
const idxsToRemove = fields
.map((item, idx) => (selectedIds.includes(item.id) ? idx : -1))
.filter((index) => index > -1)
.sort((prevIndex, nextIndex) => nextIndex - prevIndex);
remove(idxsToRemove);
setSelectedIds([]);
};
const [selectSgg, setSelectSgg] = useState<SelectDataType[] | undefined>();
const [objSearch, setObjSearch] = useState<objSearchType>({
sgg: "",
@@ -80,9 +58,6 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
}
},[form, userSiSggCd, code.cityCd, code.sggCd])
const getSelCity = (val: string) => {
const data = getCity(val, code.sggCd);
setSelectSgg(data);
@@ -110,13 +85,7 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
return () => subscription?.unsubscribe();
}, [form.form]);
const [selectedIds, setSelectedIds] = useState<string[]>([]);
const toggleSelect = (id: string) => {
setSelectedIds((prev) =>
prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]
);
};
useEffect(() =>{
@@ -296,88 +265,7 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
/>
</div>
</div>
<h1 className={formH1Class}>중축, 개축, 재축</h1>
<div className="flex justify-end gap-2 mt-4">
<Button type="button" className="" size={"sm"} onClick={plusHist}>
이력추가
</Button>
<Button
type="button"
className="!bg-red-500 text-white"
size={"sm"}
onClick={removeSelected}
>
삭제
</Button>
</div>
{fields.map((field, index) => (
<div
key={field.id}
className="grid grid-cols-[auto,1fr,1fr,1fr] gap-2 mt-4 items-center"
>
<div className="col-span-1 flex justify-center mr-4">
<Checkbox
checked={selectedIds.includes(field.id)}
onCheckedChange={() => toggleSelect(field.id)}
/>
</div>
<div className="">
<FormField
control={form.control}
name={`chgBuilding.${index}.bdstChgNm`}
render={({ field: f }) => (
<FormUi label="구분">
<SelectBox
selectClass={selectClass}
selectArray={code.chBuCd}
onSelectValue={(val) => f.onChange(val)}
value={f.value ?? code.chBuCd[0]?.val}
className={""}
label={""}
/>
</FormUi>
)}
/>
</div>
<div className="">
<FormField
control={form.control}
name={`chgBuilding.${index}.archChgPrmsnDt`}
render={({ field: f }) => (
<FormUi label="허가일">
<DatePicker
mode="single"
field={{
value: safeDate(f.value) || new Date(),
onChange: (date) => f.onChange(date),
}}
selectClass="w-full"
/>
</FormUi>
)}
/>
</div>
<div className="">
<FormField
control={form.control}
name={`chgBuilding.${index}.archChgArea`}
render={({ field: f }) => (
<FormUi label="면적">
<Input
placeholder="-"
type="text"
onChange={(e) => f.onChange}
value={f.value||''}
className={selectClass}
/>
</FormUi>
)}
/>
</div>
</div>
))}
<div className="border-b border-gray-300 my-4"> </div>
</>
</>
) : (
<></>
)}
apps/wr/components/ui/form/fcltReg/rainReg/rainRegForm.tsx
+2 -3
View File
@@ -20,6 +20,7 @@ import { useForm } from "react-hook-form";
import { z } from "zod";
import BdstReg from "../bdstReg/bdstReg";
import toast from "react-hot-toast";
import BdstAdd from "../bdstReg/bdstAdd";
export default function RainRegForm({
rainForm,
@@ -92,9 +93,6 @@ export default function RainRegForm({
})),
};
};
useEffect(()=>{
console.log("이즈모달", isModal)
}, [])
useEffect(() => {
if (grntchBdstCertYn === "N") {
@@ -601,6 +599,7 @@ export default function RainRegForm({
/>
</div>
</div>
<BdstAdd form={form} readonly={readonly}></BdstAdd>
</ScrollArea>
</form>
</Form>
apps/wr/components/ui/form/fcltReg/rswtrReg/rswtrRegForm.tsx
+4 -6
View File
@@ -9,8 +9,7 @@ import {
import { formH1Class, formH2Class } from "@/components/lib/class/comClass";
import {
formatCommaNumber,
handleCommaNumberChange,
handleMinusNumberChange,
handleMinusNumberChange
} from "@/components/lib/func/commom";
import {
DatePicker,
@@ -22,8 +21,9 @@ import {
import { Button, Input, ScrollArea } from "@common/components/ui";
import { zodResolver } from "@hookform/resolvers/zod";
import { useEffect, useState } from "react";
import { useForm, type UseFormReturn } from "react-hook-form";
import { useForm } from "react-hook-form";
import { z } from "zod";
import BdstAdd from "../bdstReg/bdstAdd";
import BdstReg from "../bdstReg/bdstReg";
export default function RswtrRegForm({
@@ -459,9 +459,6 @@ export default function RswtrRegForm({
}
}}
disabled={grntchBdstCertYn == "N" || grntchBdstCertYn == "D"}
/>
</FormUi>
)
@@ -488,6 +485,7 @@ export default function RswtrRegForm({
/>
</div>
</div>
<BdstAdd form={form} readonly={readonly}></BdstAdd>
</ScrollArea>
</form>
</Form>