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

주소검색 input 박스 관련 수정

Browse Source
This commit is contained in:
leedj312
2025-08-26 15:52:18 +09:00
parent 94833e54d3
commit fa8e41909a
2 changed files with 66 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/wr/components/ui/form/fcltReg/bdstReg/bdstReg.tsx
+66 -48
View File
@@ -9,6 +9,8 @@ import {
SelectBox,
type SelectDataType,
} from "@common/business_components";
import SearchInputAddress from "@common/business_components/ui/search_input_address";
import type { addressType } from "@common/business_components/ui/search_input_address/findAddress";
import { Input } from "@common/components";
import { useEffect, useState } from "react";
@@ -16,49 +18,47 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
const { code } = useWrStore((state) => {
return state;
});
const { userSiSggCd } = code;
const [useCityCd, setUserCityCd] = useState<SelectDataType[]>([]);
const [useSggCd, setUserSggCd] = useState<SelectDataType[]>([]);
const { userSiSggCd } = code
const [useCityCd, setUserCityCd] = useState<SelectDataType[]>([])
const [useSggCd, setUserSggCd] = useState<SelectDataType[]>([])
// const [selectSgg, setSelectSgg] = useState<SelectDataType[] | undefined>();
// const [objSearch, setObjSearch] = useState<objSearchType>({
// sgg: "",
// city: "",
// });
useEffect(() => {
if (userSiSggCd.length === 2 && code.cityCd.length > 0) {
const city = code.cityCd.filter((item) => item.val === userSiSggCd)
const sgg = code.sggCd.filter((item) => item.val.slice(0, 2) === userSiSggCd)
sgg.unshift({ text: '전체', val: '0' })
setUserCityCd(city) // Fix: Ensure city is of type SelectDataType[]
setUserSggCd(sgg)
const city = code.cityCd.filter((item) => item.val === userSiSggCd);
const sgg = code.sggCd.filter(
(item) => item.val.slice(0, 2) === userSiSggCd
);
sgg.unshift({ text: "전체", val: "0" });
setUserCityCd(city); // Fix: Ensure city is of type SelectDataType[]
setUserSggCd(sgg);
if (city[0]?.val) {
// 여기 중요
queueMicrotask(() => {
form.setValue("ctpvCd", Number(city[0]?.val), { shouldDirty: true, shouldTouch: true, shouldValidate: true });
form.setValue("ctpvCd", Number(city[0]?.val), {
shouldDirty: true,
shouldTouch: true,
shouldValidate: true,
});
});
}
} else if (userSiSggCd.length === 5 && code.cityCd.length > 0 && code.sggCd.length > 0) {
const city = code.cityCd.filter((item) => item.val === userSiSggCd.slice(0, 2))
const sgg = code.sggCd.filter((item) => item.val === userSiSggCd)
setUserSggCd(sgg)
setUserCityCd(city)
form.setValue('ctpvCd', Number(city[0]?.val))
form.setValue('sggCd', Number(sgg[0]?.val))
} else if (
userSiSggCd.length === 5 &&
code.cityCd.length > 0 &&
code.sggCd.length > 0
) {
const city = code.cityCd.filter(
(item) => item.val === userSiSggCd.slice(0, 2)
);
const sgg = code.sggCd.filter((item) => item.val === userSiSggCd);
setUserSggCd(sgg);
setUserCityCd(city);
form.setValue("ctpvCd", Number(city[0]?.val));
form.setValue("sggCd", Number(sgg[0]?.val));
}
}, [form, userSiSggCd, code.cityCd, code.sggCd])
}, [form, userSiSggCd, code.cityCd, code.sggCd]);
// useEffect(() => {
// const city = form.getValues("ctpvCd");
// const sgg = form.getValues("sggCd");
// setObjSearch({ city: city, sgg: sgg });
// }, [selectSgg]);
useEffect(() => {
const subscription = form.form?.watch((value: any) => {
console.log("vale", value);
@@ -67,15 +67,16 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
return () => subscription?.unsubscribe();
}, [form.form]);
useEffect(() => {
console.log('form.formState ', form.watch("archArea"))
}, [form.formState])
console.log("form.formState ", form.watch("archArea"));
}, [form.formState]);
return (
<>
<h1 className={formH1Class}> {type !== "HTB" ? "건축물 기본 정보" : '시설 기본 정보'}</h1>
<h1 className={formH1Class}>
{" "}
{type !== "HTB" ? "건축물 기본 정보" : "시설 기본 정보"}
</h1>
<div className="grid grid-cols-6 gap-2 mt-4">
<div className="col-span-3">
<FormField
@@ -91,7 +92,11 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
onSelectValue={(val) => {
field.onChange(Number(val));
}}
value={typeof field.value !== "undefined" ? field.value : useCityCd[0]?.val}
value={
typeof field.value !== "undefined"
? field.value
: useCityCd[0]?.val
}
/>
</FormUi>
)}
@@ -124,15 +129,19 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
control={form.control}
name="bdstNm"
render={({ field }) => (
<FormUi label={type !== "HTB" ? "건축물명" : '시설명'}>
<FormUi label={type !== "HTB" ? "건축물명" : "시설명"}>
<Input
className={selectClass}
placeholder={type !== "HTB" ? "건축물 명 입력하세요" : '시설명 입력하세요'}
placeholder={
type !== "HTB"
? "건축물 명 입력하세요"
: "시설명 입력하세요"
}
type="text"
onChange={(e) => {
field.onChange(e.target.value)
field.onChange(e.target.value);
}}
value={field.value || ''}
value={field.value || ""}
maxLength={txtSize}
/>
</FormUi>
@@ -144,8 +153,8 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
control={form.control}
name="daddr"
render={({ field }) => (
<FormUi label={type !== "HTB" ? "건축물 주소" : '시설 주소'} >
<Input
<FormUi label={type !== "HTB" ? "건축물 주소" : "시설 주소"}>
{/* <Input
className={selectClass}
placeholder="위치를 입력해주세요"
type="search"
@@ -154,7 +163,16 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
}}
value={field.value || ''}
maxLength={50}
/>
/> */}
<div>
<SearchInputAddress
initValue={undefined}
setRtnData={(rtnData: addressType) => {
console.log("rtnData", rtnData);
field.onChange(rtnData.roadAddrPart1);
}}
></SearchInputAddress>
</div>
</FormUi>
)}
/>
@@ -165,7 +183,7 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
control={form.control}
name="frstArchPrmsnDt"
render={({ field }) => (
<FormUi label={type !== "HTB" ? "최초건축허가일" : '준공년도'} >
<FormUi label={type !== "HTB" ? "최초건축허가일" : "준공년도"}>
<DatePicker
mode={"single"}
field={{
@@ -174,7 +192,7 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
}}
// modifiers={{
// disabled: { after: new Date() }
// }}
// }}
selectClass={"w-full"}
></DatePicker>
</FormUi>
@@ -218,9 +236,9 @@ export default function BdstReg({ form, type }: { form: any; type?: string }) {
placeholder="면적을 입력하세요"
type="text"
onChange={(e) => {
field.onChange(e.target.value)
field.onChange(e.target.value);
}}
value={field.value || ''}
value={field.value || ""}
maxLength={numSize}
/>
</FormUi>
apps/wr/components/ui/form/fcltReg/rainReg/rainRegForm.tsx
-1
View File
@@ -135,7 +135,6 @@ export default function RainRegForm({
toast.error("시도/시군구 코드를 선택해야합니다.");
return;
}
const handleConfirm = async () => {
rainBdstReg(values, data);
if (setIsModal) setIsModal(false);