Skip to content

Commit b0211f7

Browse files
TakioNTakioN
authored
Merge pull request #179 from blaybus-hackathon/fix/radio-button
Fix/radio button
2 parents e5cc598 + 1fb5bee commit b0211f7

File tree

4 files changed

+148
-161
lines changed

4 files changed

+148
-161
lines changed

‎src/components/Auth/SignUp/helper/HelperInfo.jsx‎

Lines changed: 18 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -65,8 +65,12 @@ export default function HelperInfo() {
6565

6666
<FormField label='성별' required className='mb-5'>
6767
<Radio cols={2} onValueChange={(value) => setHelperInfoField('gender', value)}>
68-
<RadioItem value={false}>남성</RadioItem>
69-
<RadioItem value={true}>여성</RadioItem>
68+
<RadioItem value={false} checked={signUpForm.helperInfo.gender === false}>
69+
남성
70+
</RadioItem>
71+
<RadioItem value={true} checked={signUpForm.helperInfo.gender === true}>
72+
여성
73+
</RadioItem>
7074
</Radio>
7175
{!isFirstCheck && !gender && (
7276
<p className='text-start text-sm text-[var(--required-red)] font-medium'>
@@ -117,8 +121,12 @@ export default function HelperInfo() {
117121

118122
<FormField label='차량소유여부' required className='mb-5'>
119123
<Radio cols={2} onValueChange={(value) => setHelperInfoField('carOwnYn', value)}>
120-
<RadioItem value={true}>예</RadioItem>
121-
<RadioItem value={false}>아니오</RadioItem>
124+
<RadioItem value={true} checked={signUpForm.helperInfo.carOwnYn === true}>
125+
예
126+
</RadioItem>
127+
<RadioItem value={false} checked={signUpForm.helperInfo.carOwnYn === false}>
128+
아니오
129+
</RadioItem>
122130
</Radio>
123131
{!isFirstCheck && !carOwnYn && (
124132
<p className='text-start text-sm text-[var(--required-red)] font-medium'>
@@ -129,8 +137,12 @@ export default function HelperInfo() {
129137

130138
<FormField label='치매교육 이수 여부' required className='mb-5'>
131139
<Radio cols={2} onValueChange={(value) => setHelperInfoField('eduYn', value)}>
132-
<RadioItem value={true}>예</RadioItem>
133-
<RadioItem value={false}>아니오</RadioItem>
140+
<RadioItem value={true} checked={signUpForm.helperInfo.eduYn === true}>
141+
예
142+
</RadioItem>
143+
<RadioItem value={false} checked={signUpForm.helperInfo.eduYn === false}>
144+
아니오
145+
</RadioItem>
134146
</Radio>
135147
{!isFirstCheck && !eduYn && (
136148
<p className='text-start text-sm text-[var(--required-red)] font-medium'>

‎src/components/ui/custom/multiRadio.jsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,15 +24,15 @@ const Radio = ({ className, children, onValueChange, cols, multiple = false, ...
2424
{...props}
2525
>
2626
{children.map((child, idx) => {
27-
let value = child.props.value || child.props.children;
27+
let value = child.props.value ?? child.props.children;
2828

2929
return child
3030
? React.cloneElement(child, {
3131
key: idx,
3232
onClick: () => {
3333
handleChecked(value);
3434
},
35-
checked: multiple ? checkedItems.includes(value) : checkedItems === value,
35+
// checked: multiple ? checkedItems.includes(value) : checkedItems === value,
3636
})
3737
: null;
3838
})}
@@ -41,7 +41,7 @@ const Radio = ({ className, children, onValueChange, cols, multiple = false, ...
4141
};
4242

4343
const RadioItem = ({ className, children, value, checked, ...props }) => {
44-
const radioValue = value || children;
44+
const radioValue = value ?? children;
4545
return (
4646
<button type='button' role='radio' value={radioValue} {...props}>
4747
<div

‎src/store/helper/useHelperAccoutStore.js‎

Lines changed: 56 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -1,86 +1,64 @@
11
import { create } from 'zustand';
2-
import { persist, devtools } from 'zustand/middleware';
2+
import { persist } from 'zustand/middleware';
33

4-
// const useHelperAccountStore = create(
5-
// persist((set) => ({
6-
// helper: {
7-
// id: 1,
8-
// userEmail: '[email protected]',
9-
// name: 'tempName',
10-
// phone: '010-0000-0000',
11-
// addressDetail: '서울특별시 강남구',
12-
// certificates: [],
13-
// carOwnYn: true,
14-
// eduYn: false,
15-
// wage: null,
16-
// wageState: null,
17-
// },
4+
const useHelperAccountStore = create((set) => ({
5+
helper: {
6+
id: 1,
7+
userEmail: '[email protected]',
8+
name: 'tempName',
9+
phone: '010-0000-0000',
10+
addressDetail: '서울특별시 강남구',
11+
img: null,
12+
helperWorkLocation: [],
13+
helperWorkTime: [],
14+
careLevel: 0,
15+
inmateState: 0,
16+
workType: 0,
17+
careGender: 0,
18+
serviceMeal: 0,
19+
serviceMobility: 0,
20+
serviceDaily: 0,
21+
certificates: [
22+
{
23+
certName: '',
24+
certNum: '',
25+
certDateIssue: null,
26+
certSerialNum: null,
27+
},
28+
],
29+
carOwnYn: true,
30+
eduYn: false,
31+
wage: null,
32+
wageState: null,
33+
introduce: '',
34+
careExperience: false,
35+
wageNegotiation: null,
36+
},
1837

19-
// setPart: (newPart) => set((state) => ({ helper: { ...state.helper, ...newPart } })),
20-
// setHelper: (newInfo) => set(() => ({ helper: newInfo })),
21-
// })),
22-
// );
38+
workTypeNames: [],
2339

24-
const useHelperAccountStore = create(
25-
devtools((set) => ({
26-
helper: {
27-
id: 1,
28-
userEmail: '[email protected]',
29-
name: 'tempName',
30-
phone: '010-0000-0000',
31-
addressDetail: '서울특별시 강남구',
32-
img: null,
33-
helperWorkLocation: [],
34-
helperWorkTime: [],
35-
careLevel: 0,
36-
inmateState: 0,
37-
workType: 0,
38-
careGender: 0,
39-
serviceMeal: 0,
40-
serviceMobility: 0,
41-
serviceDaily: 0,
42-
certificates: [
43-
{
44-
certName: '',
45-
certNum: '',
46-
certDateIssue: null,
47-
certSerialNum: null,
48-
},
49-
],
50-
carOwnYn: true,
51-
eduYn: false,
52-
wage: null,
53-
wageState: null,
54-
introduce: '',
55-
careExperience: false,
56-
wageNegotiation: null,
57-
},
40+
setPart: (newPart) => set((state) => ({ helper: { ...state.helper, ...newPart } })),
41+
setHelper: (newInfo) => set(() => ({ helper: newInfo })),
5842

59-
workTypeNames: [],
43+
addWorkTypeNames: (newNames) =>
44+
set((state) => ({ workTypeNames: [...state.workTypeNames, newNames] })),
45+
deleteWorkTypeName: (removingItem) =>
46+
set((state) => ({
47+
workTypeNames: state.workTypeNames.filter((item) => item !== removingItem),
48+
})),
49+
setWorkTypeNames: (newArr) => set({ workTypeNames: newArr }),
6050

61-
setPart: (newPart) => set((state) => ({ helper: { ...state.helper, ...newPart } })),
62-
setHelper: (newInfo) => set(() => ({ helper: newInfo })),
63-
64-
addWorkTypeNames: (newNames) =>
65-
set((state) => ({ workTypeNames: [...state.workTypeNames, newNames] })),
66-
deleteWorkTypeName: (removingItem) =>
67-
set((state) => ({
68-
workTypeNames: state.workTypeNames.filter((item) => item !== removingItem),
69-
})),
70-
setWorkTypeNames: (newArr) => set({ workTypeNames: newArr }),
71-
72-
addCertificate: (newItem) =>
73-
set((state) => ({
74-
helper: { ...state.helper, certificates: [...state.helper.certificates, newItem] },
75-
})),
76-
deleteCertificate: (deleted) =>
77-
set((state) => ({
78-
helper: {
79-
...state.helper,
80-
certificates: state.helper.certificates.filter((x) => x.certName !== deleted),
81-
},
82-
})),
83-
})),
84-
);
51+
addCertificate: (newItem) =>
52+
set((state) => ({
53+
helper: { ...state.helper, certificates: [...state.helper.certificates, newItem] },
54+
})),
55+
deleteCertificate: (deleted) =>
56+
set((state) => ({
57+
helper: {
58+
...state.helper,
59+
certificates: state.helper.certificates.filter((x) => x.certName !== deleted),
60+
},
61+
})),
62+
}));
8563

8664
export default useHelperAccountStore;

‎src/store/suho/useHelperLocationStore.js‎

Lines changed: 71 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -1,91 +1,88 @@
11
import { create } from 'zustand';
2-
import { devtools } from 'zustand/middleware';
32

4-
const useHelperLocationStore = create(
5-
devtools((set, get) => ({
6-
selectedDistricts: {},
3+
const useHelperLocationStore = create((set, get) => ({
4+
selectedDistricts: {},
75

8-
// 지역 설정
9-
setDistricts: (districts) => set({ selectedDistricts: districts }),
6+
// 지역 설정
7+
setDistricts: (districts) => set({ selectedDistricts: districts }),
108

11-
// 특정 도시의 구/군 추가
12-
addDistrict: (city, district, subDistrict) =>
13-
set((state) => {
14-
if (
15-
city in state.selectedDistricts &&
16-
district in state.selectedDistricts[city] &&
17-
subDistrict in state.selectedDistricts[city][district]
18-
) {
19-
return state;
20-
}
21-
return {
22-
selectedDistricts: {
23-
...state.selectedDistricts,
24-
[city]: {
25-
...state.selectedDistricts[city],
26-
[district]: [...(state.selectedDistricts[city]?.[district] || []), subDistrict],
27-
},
28-
},
29-
};
30-
}),
31-
32-
// 특정 도시의 구/군 제거
33-
removeDistrict: (city, district, subDistrict) =>
34-
set((state) => {
35-
const updatedDistricts = {
9+
// 특정 도시의 구/군 추가
10+
addDistrict: (city, district, subDistrict) =>
11+
set((state) => {
12+
if (
13+
city in state.selectedDistricts &&
14+
district in state.selectedDistricts[city] &&
15+
subDistrict in state.selectedDistricts[city][district]
16+
) {
17+
return state;
18+
}
19+
return {
20+
selectedDistricts: {
3621
...state.selectedDistricts,
3722
[city]: {
3823
...state.selectedDistricts[city],
39-
[district]:
40-
state.selectedDistricts[city]?.[district]?.filter((d) => d !== subDistrict) || [],
24+
[district]: [...(state.selectedDistricts[city]?.[district] || []), subDistrict],
4125
},
42-
};
26+
},
27+
};
28+
}),
29+
30+
// 특정 도시의 구/군 제거
31+
removeDistrict: (city, district, subDistrict) =>
32+
set((state) => {
33+
const updatedDistricts = {
34+
...state.selectedDistricts,
35+
[city]: {
36+
...state.selectedDistricts[city],
37+
[district]:
38+
state.selectedDistricts[city]?.[district]?.filter((d) => d !== subDistrict) || [],
39+
},
40+
};
4341

44-
// 만약 특정 구/군이 빈 배열이 되면 제거
45-
if (updatedDistricts[city][district].length === 0) {
46-
delete updatedDistricts[city][district];
47-
}
42+
// 만약 특정 구/군이 빈 배열이 되면 제거
43+
if (updatedDistricts[city][district].length === 0) {
44+
delete updatedDistricts[city][district];
45+
}
4846

49-
// 만약 특정 도시가 완전히 빈 객체가 되면 제거
50-
if (Object.keys(updatedDistricts[city]).length === 0) {
51-
delete updatedDistricts[city];
52-
}
47+
// 만약 특정 도시가 완전히 빈 객체가 되면 제거
48+
if (Object.keys(updatedDistricts[city]).length === 0) {
49+
delete updatedDistricts[city];
50+
}
5351

54-
return { selectedDistricts: updatedDistricts };
55-
}),
52+
return { selectedDistricts: updatedDistricts };
53+
}),
5654

57-
getTotalSelectedCount: () => {
58-
const { selectedDistricts } = get();
59-
return Object.values(selectedDistricts).reduce(
60-
(total, districts) =>
61-
total +
62-
Object.values(districts).reduce(
63-
(subTotal, subDistricts) => subTotal + subDistricts.length,
64-
0,
65-
),
66-
0,
67-
);
68-
},
55+
getTotalSelectedCount: () => {
56+
const { selectedDistricts } = get();
57+
return Object.values(selectedDistricts).reduce(
58+
(total, districts) =>
59+
total +
60+
Object.values(districts).reduce(
61+
(subTotal, subDistricts) => subTotal + subDistricts.length,
62+
0,
63+
),
64+
0,
65+
);
66+
},
6967

70-
// 초기화
71-
resetDistricts: () => set({ selectedDistricts: {} }),
68+
// 초기화
69+
resetDistricts: () => set({ selectedDistricts: {} }),
7270

73-
// ✅ 선택된 지역 정보를 텍스트로 변환하는 selector 함수 (스타일 수정됨)
74-
// getFormattedLocation: () => {
75-
// const selectedDistricts = get().selectedDistricts;
76-
// if (Object.keys(selectedDistricts).length === 0) {
77-
// return [];
78-
// }
71+
// ✅ 선택된 지역 정보를 텍스트로 변환하는 selector 함수 (스타일 수정됨)
72+
// getFormattedLocation: () => {
73+
// const selectedDistricts = get().selectedDistricts;
74+
// if (Object.keys(selectedDistricts).length === 0) {
75+
// return [];
76+
// }
7977

80-
// return Object.entries(selectedDistricts).flatMap(([city, districts]) => {
81-
// // flatMap 사용
82-
// return Object.entries(districts).map(([district, subDistricts]) => {
83-
// const subDistrictNames = subDistricts.join(", ");
84-
// return `${city} > ${district} (${subDistrictNames})`;
85-
// });
86-
// });
87-
// },
88-
})),
89-
);
78+
// return Object.entries(selectedDistricts).flatMap(([city, districts]) => {
79+
// // flatMap 사용
80+
// return Object.entries(districts).map(([district, subDistricts]) => {
81+
// const subDistrictNames = subDistricts.join(", ");
82+
// return `${city} > ${district} (${subDistrictNames})`;
83+
// });
84+
// });
85+
// },
86+
}));
9087

9188
export default useHelperLocationStore;

0 commit comments

Comments
 (0)