Skip to content

Commit f4eda2a

Browse files
noeyoesnoeyoes
authored
[DEVELOP] v1.0.7
2 parents 0b4104d + 5315c9c commit f4eda2a

4 files changed

Lines changed: 437 additions & 171 deletions

File tree

‎app/merchant/signup/business/components/AddressSearchModal.tsx‎

Lines changed: 96 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,9 @@ interface AddressSearchModalProps {
1919
}
2020

2121
export default function AddressSearchModal({
22-
onClose,
23-
onSelect,
24-
}: AddressSearchModalProps) {
22+
onClose,
23+
onSelect,
24+
}: AddressSearchModalProps) {
2525
const [scriptLoaded, setScriptLoaded] = useState(false);
2626
const [searchingAddress, setSearchingAddress] = useState(false);
2727
const [addressKeyword, setAddressKeyword] = useState("");
@@ -56,27 +56,27 @@ export default function AddressSearchModal({
5656
}
5757

5858
geocoder.addressSearch(
59-
addressKeyword,
60-
(geoResult: any, geoStatus: any) => {
61-
setSearchingAddress(false);
62-
if (geoStatus === (window as any).kakao.maps.services.Status.OK) {
63-
setAddressResults((prev) => {
64-
const combined = [...prev];
65-
geoResult.forEach((item: any) => {
66-
if (!prev.some((p) => p.address_name === item.address_name)) {
67-
combined.push({
68-
...item,
69-
place_name: item.building_name || item.address_name,
70-
address_name: item.address_name,
71-
road_address_name:
72-
item.road_address?.address_name || item.address_name,
73-
});
74-
}
59+
addressKeyword,
60+
(geoResult: any, geoStatus: any) => {
61+
setSearchingAddress(false);
62+
if (geoStatus === (window as any).kakao.maps.services.Status.OK) {
63+
setAddressResults((prev) => {
64+
const combined = [...prev];
65+
geoResult.forEach((item: any) => {
66+
if (!prev.some((p) => p.address_name === item.address_name)) {
67+
combined.push({
68+
...item,
69+
place_name: item.building_name || item.address_name,
70+
address_name: item.address_name,
71+
road_address_name:
72+
item.road_address?.address_name || item.address_name,
73+
});
74+
}
75+
});
76+
return combined;
7577
});
76-
return combined;
77-
});
78+
}
7879
}
79-
}
8080
);
8181
});
8282
};
@@ -87,13 +87,13 @@ export default function AddressSearchModal({
8787
const lng = item.x;
8888
const zip = item.road_address?.zone_no || item.address?.b_code || "";
8989
const sido =
90-
item.road_address?.region_1depth_name ||
91-
item.address?.region_1depth_name ||
92-
"";
90+
item.road_address?.region_1depth_name ||
91+
item.address?.region_1depth_name ||
92+
"";
9393
const sigungu =
94-
item.road_address?.region_2depth_name ||
95-
item.address?.region_2depth_name ||
96-
"";
94+
item.road_address?.region_2depth_name ||
95+
item.address?.region_2depth_name ||
96+
"";
9797

9898
onSelect({
9999
businessAddress: address,
@@ -107,76 +107,76 @@ export default function AddressSearchModal({
107107
};
108108

109109
return (
110-
<div className="fixed inset-0 bg-black/50 z-50 flex flex-col">
111-
<div className="bg-white p-4 flex items-center">
112-
<Button variant="ghost" size="icon" className="mr-2" onClick={onClose}>
113-
<X className="h-5 w-5 text-black" />
114-
</Button>
115-
<h3 className="text-lg font-medium text-black">주소 검색</h3>
116-
</div>
117-
118-
<div className="flex-1 bg-[#F5F5F5] p-4 overflow-y-auto">
119-
<div className="bg-white rounded-xl p-4 mb-4">
120-
<div className="flex gap-2">
121-
<Input
122-
data-cy="address-search-keyword-input"
123-
value={addressKeyword}
124-
onChange={(e) => setAddressKeyword(e.target.value)}
125-
placeholder="도로명, 지번, 건물명으로 검색"
126-
onKeyDown={(e) => e.key === "Enter" && searchAddress()}
127-
/>
128-
<Button
129-
data-cy="address-search-button"
130-
type="button"
131-
onClick={searchAddress}
132-
disabled={searchingAddress || !addressKeyword.trim()}
133-
className="h-12 px-4"
134-
>
135-
{searchingAddress ? (
136-
<RefreshCw className="h-4 w-4 mr-2 animate-spin" />
137-
) : (
138-
<Search className="h-4 w-4 mr-2" />
139-
)}
140-
검색
141-
</Button>
142-
</div>
110+
<div className="fixed inset-0 bg-black/50 z-50 flex flex-col">
111+
<div className="bg-white p-4 flex items-center">
112+
<Button variant="ghost" size="icon" className="mr-2" onClick={onClose}>
113+
<X className="h-5 w-5 text-black" />
114+
</Button>
115+
<h3 className="text-lg font-medium text-black">주소 검색</h3>
143116
</div>
144117

145-
{addressResults.length > 0 && (
146-
<div className="bg-white rounded-xl overflow-hidden">
147-
<ul className="divide-y divide-gray-200">
148-
{addressResults.map((item, index) => (
149-
<li
150-
key={index}
151-
data-cy="address-result-item"
152-
className="p-4 hover:bg-gray-100 cursor-pointer"
153-
onClick={() => handleSelect(item)}
154-
>
155-
<div className="flex items-start">
156-
<Building className="h-5 w-5 text-gray-400 mt-0.5 mr-2" />
157-
<div>
158-
<p className="text-sm font-medium text-gray-800">
159-
{item.place_name !== item.address_name
160-
? item.place_name
161-
: "주소"}
162-
</p>
163-
<p className="text-xs text-gray-600">
164-
{item.road_address_name || item.address_name}
165-
</p>
166-
{item.road_address_name &&
167-
item.road_address_name !== item.address_name && (
168-
<p className="text-xs text-gray-400">
169-
{item.address_name}
170-
</p>
171-
)}
172-
</div>
173-
</div>
174-
</li>
175-
))}
176-
</ul>
118+
<div className="flex-1 bg-[#F5F5F5] p-4 overflow-y-auto">
119+
<div className="bg-white rounded-xl p-4 mb-4">
120+
<div className="flex gap-2">
121+
<Input
122+
data-cy="address-search-keyword-input"
123+
value={addressKeyword}
124+
onChange={(e) => setAddressKeyword(e.target.value)}
125+
placeholder="도로명, 지번, 건물명으로 검색"
126+
onKeyDown={(e) => e.key === "Enter" && searchAddress()}
127+
/>
128+
<Button
129+
data-cy="address-search-button"
130+
type="button"
131+
onClick={searchAddress}
132+
disabled={searchingAddress || !addressKeyword.trim()}
133+
className="h-12 px-4"
134+
>
135+
{searchingAddress ? (
136+
<RefreshCw className="h-4 w-4 mr-2 animate-spin" />
137+
) : (
138+
<Search className="h-4 w-4 mr-2" />
139+
)}
140+
검색
141+
</Button>
142+
</div>
177143
</div>
178-
)}
144+
145+
{addressResults.length > 0 && (
146+
<div className="bg-white rounded-xl overflow-hidden">
147+
<ul className="divide-y divide-gray-200">
148+
{addressResults.map((item, index) => (
149+
<li
150+
key={index}
151+
data-cy="address-result-item"
152+
className="p-4 hover:bg-gray-100 cursor-pointer"
153+
onClick={() => handleSelect(item)}
154+
>
155+
<div className="flex items-start">
156+
<Building className="h-5 w-5 text-gray-400 mt-0.5 mr-2" />
157+
<div>
158+
<p className="text-sm font-medium text-gray-800">
159+
{item.place_name !== item.address_name
160+
? item.place_name
161+
: "주소"}
162+
</p>
163+
<p className="text-xs text-gray-600">
164+
{item.road_address_name || item.address_name}
165+
</p>
166+
{item.road_address_name &&
167+
item.road_address_name !== item.address_name && (
168+
<p className="text-xs text-gray-400">
169+
{item.address_name}
170+
</p>
171+
)}
172+
</div>
173+
</div>
174+
</li>
175+
))}
176+
</ul>
177+
</div>
178+
)}
179+
</div>
179180
</div>
180-
</div>
181181
);
182-
}
182+
}

‎app/merchant/signup/business/components/BusinessHeader.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
"use client"
22

3-
import { useRouter } from "next/navigation"
43
import { Button } from "@/components/ui/button"
54
import { Store } from "lucide-react"
65
import { motion } from "framer-motion"

0 commit comments

Comments
 (0)