@@ -8,7 +8,6 @@ import PlaceReservationTable2 from '@/components/place/place.reservation.table2'
88import DeleteConfirmModal from '@/components/common/delete.confirm.modal' ;
99import { useRouter } from 'next/router' ;
1010
11-
1211const userTypeOptions = [
1312 { key : 'STUDENT' , text : '학생' , value : 'STUDENT' } ,
1413 { key : 'RC_STUDENT' , text : 'RC 학부생' , value : 'RC_STUDENT' } ,
@@ -26,11 +25,7 @@ const userStatusOptions = [
2625 { key : 'BANNED' , text : 'BANNED' , value : 'BANNED' } ,
2726] ;
2827
29- const UserDetailPage = ( {
30- user,
31- placeReservations,
32- equipReservations,
33- } ) => {
28+ const UserDetailPage = ( { user, placeReservations, equipReservations } ) => {
3429 const [ deleteModalOpen , setDeleteModalOpen ] = useState ( false ) ;
3530
3631 const [ email , setEmail ] = useState ( user . email ) ;
@@ -65,104 +60,109 @@ const UserDetailPage = ({
6560 < LayoutWithAuth >
6661 < h2 > 유저 세부 정보</ h2 >
6762
68- < div style = { { marginBottom : '1rem' } } >
63+ < div style = { { marginBottom : '1rem' } } >
6964 < Button onClick = { ( ) => window . history . back ( ) } > 뒤로가기</ Button >
7065 </ div >
7166
72- < Tab panes = { [
73- {
74- menuItem : '유저 정보' ,
75- render : ( ) => (
76- < Tab . Pane >
77- < h3 > 유저 정보</ h3 >
78-
79- < Form >
80- < Form . Field >
81- < label > UUID</ label >
82- < p > { user . uuid } </ p >
83- </ Form . Field >
84- < Form . Input
85- required
86- label = { 'email' }
87- value = { email }
88- onChange = { ( e ) => setEmail ( e . target . value ) }
89- />
90- < Form . Input
91- required
92- label = { '이름' }
93- value = { name }
94- onChange = { ( e ) => setName ( e . target . value ) }
95- />
96- < Form . Select
97- required
98- label = { '유저 타입' }
99- placeholder = "유저 타입을 선택하세요."
100- value = { userType }
101- options = { userTypeOptions }
102- onChange = { ( e , { value } ) => setUserType ( value ) }
103- />
104- < Form . Select
105- required
106- label = { '유저 상태' }
107- placeholder = "유저 상태를 선택하세요."
108- value = { userStatus }
109- options = { userStatusOptions }
110- onChange = { ( e , { value } ) => setUserStatus ( value ) }
111- />
112- < Form . Group style = { { display : 'flex' } } >
113- < Form . Field style = { { flex : 1 } } >
114- < label > 생성일</ label >
115- < p > { user . createdAt } </ p >
116- </ Form . Field >
117- < Form . Field style = { { flex : 1 } } >
118- < label > 마지막 로그인</ label >
119- < p > { user . lastLoginAt } </ p >
67+ < Tab
68+ panes = { [
69+ {
70+ menuItem : '유저 정보' ,
71+ render : ( ) => (
72+ < Tab . Pane >
73+ < h3 > 유저 정보</ h3 >
74+
75+ < Form >
76+ < Form . Field >
77+ < label > UUID</ label >
78+ < p > { user . uuid } </ p >
12079 </ Form . Field >
121- </ Form . Group >
122- < Form . Group >
123- < Form . Button type = "submit" onClick = { handleSubmit } >
124- 수정
125- </ Form . Button >
126- < DeleteConfirmModal
127- open = { deleteModalOpen }
128- target = { `${ name } (${ email } )` }
129- deleteURI = { `user/${ user . uuid } ` }
130- trigger = {
131- < Button negative onClick = { ( ) => setDeleteModalOpen ( true ) } >
132- 삭제
133- </ Button >
134- }
80+ < Form . Input
81+ required
82+ label = { 'email' }
83+ value = { email }
84+ onChange = { ( e ) => setEmail ( e . target . value ) }
13585 />
136- </ Form . Group >
137- </ Form >
138- </ Tab . Pane >
139- ) ,
140- } ,
141- {
142- menuItem : `장소 예약 목록 (${ placeReservations . length } 개)` ,
143- render : ( ) => (
144- < Tab . Pane >
145- < h3 > 장소 예약 목록 ({ placeReservations . length } 개)</ h3 >
146- < PlaceReservationTable2
147- reservations = { placeReservations }
148- startIdx = { 1 }
149- />
150- </ Tab . Pane >
151- ) ,
152- } ,
153- {
154- menuItem : `장비 예약 목록 (${ equipReservations . length } 개)` ,
155- render : ( ) => (
156- < Tab . Pane >
157- < h3 > 장비 예약 목록 ({ equipReservations . length } 개)</ h3 >
158- < EquipmentReservationTable2
159- reservations = { equipReservations }
160- startIdx = { 1 }
161- />
162- </ Tab . Pane >
163- ) ,
164- }
165- ] } />
86+ < Form . Input
87+ required
88+ label = { '이름' }
89+ value = { name }
90+ onChange = { ( e ) => setName ( e . target . value ) }
91+ />
92+ < Form . Select
93+ required
94+ label = { '유저 타입' }
95+ placeholder = "유저 타입을 선택하세요."
96+ value = { userType }
97+ options = { userTypeOptions }
98+ onChange = { ( e , { value } ) => setUserType ( value ) }
99+ />
100+ < Form . Select
101+ required
102+ label = { '유저 상태' }
103+ placeholder = "유저 상태를 선택하세요."
104+ value = { userStatus }
105+ options = { userStatusOptions }
106+ onChange = { ( e , { value } ) => setUserStatus ( value ) }
107+ />
108+ < Form . Group style = { { display : 'flex' } } >
109+ < Form . Field style = { { flex : 1 } } >
110+ < label > 생성일</ label >
111+ < p > { user . createdAt } </ p >
112+ </ Form . Field >
113+ < Form . Field style = { { flex : 1 } } >
114+ < label > 마지막 로그인</ label >
115+ < p > { user . lastLoginAt } </ p >
116+ </ Form . Field >
117+ </ Form . Group >
118+ < Form . Group >
119+ < Form . Button type = "submit" onClick = { handleSubmit } >
120+ 수정
121+ </ Form . Button >
122+ < DeleteConfirmModal
123+ open = { deleteModalOpen }
124+ target = { `${ name } (${ email } )` }
125+ deleteURI = { `user/${ user . uuid } ` }
126+ trigger = {
127+ < Button
128+ negative
129+ onClick = { ( ) => setDeleteModalOpen ( true ) }
130+ >
131+ 삭제
132+ </ Button >
133+ }
134+ />
135+ </ Form . Group >
136+ </ Form >
137+ </ Tab . Pane >
138+ ) ,
139+ } ,
140+ {
141+ menuItem : `장소 예약 목록 (${ placeReservations . length } 개)` ,
142+ render : ( ) => (
143+ < Tab . Pane >
144+ < h3 > 장소 예약 목록 ({ placeReservations . length } 개)</ h3 >
145+ < PlaceReservationTable2
146+ reservations = { placeReservations }
147+ startIdx = { 1 }
148+ />
149+ </ Tab . Pane >
150+ ) ,
151+ } ,
152+ {
153+ menuItem : `장비 예약 목록 (${ equipReservations . length } 개)` ,
154+ render : ( ) => (
155+ < Tab . Pane >
156+ < h3 > 장비 예약 목록 ({ equipReservations . length } 개)</ h3 >
157+ < EquipmentReservationTable2
158+ reservations = { equipReservations }
159+ startIdx = { 1 }
160+ />
161+ </ Tab . Pane >
162+ ) ,
163+ } ,
164+ ] }
165+ />
166166 </ LayoutWithAuth >
167167 ) ;
168168} ;
@@ -177,17 +177,17 @@ export async function getServerSideProps(ctx) {
177177
178178 const res2 = await PoPoAxios . get ( `reservation-place/user/admin/${ uuid } ` , {
179179 withCredentials : true ,
180- } )
180+ } ) ;
181181
182182 const res3 = await PoPoAxios . get ( `reservation-equip/user/admin/${ uuid } ` , {
183183 withCredentials : true ,
184- } )
184+ } ) ;
185185
186186 return {
187187 props : {
188188 user : res1 . data ,
189189 placeReservations : res2 . data ,
190190 equipReservations : res3 . data ,
191191 } ,
192- }
192+ } ;
193193}
0 commit comments