Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
reservation-service
Commits
9063cd71
Commit
9063cd71
authored
Nov 04, 2020
by
CHAERIN KIM
Browse files
room drop down, 수빈병합, 예약중복 체크수정, 예진 글쓰기textarea+엔터
parent
dbfe342d
Changes
7
Hide whitespace changes
Inline
Side-by-side
server/client/src/Components/Schedule.js
View file @
9063cd71
...
@@ -3,53 +3,20 @@ import Calendar from '@toast-ui/react-calendar';
...
@@ -3,53 +3,20 @@ import Calendar from '@toast-ui/react-calendar';
import
"
tui-calendar/dist/tui-calendar.css
"
;
import
"
tui-calendar/dist/tui-calendar.css
"
;
import
"
tui-date-picker/dist/tui-date-picker.css
"
;
import
"
tui-date-picker/dist/tui-date-picker.css
"
;
import
"
tui-time-picker/dist/tui-time-picker.css
"
;
import
"
tui-time-picker/dist/tui-time-picker.css
"
;
import
moment
from
'
moment
'
;
import
axios
from
'
axios
'
;
import
axios
from
'
axios
'
;
function
Cal
(
props
)
{
function
Cal
(
props
)
{
const
calendarRef
=
useRef
();
const
calendarRef
=
useRef
(
null
);
const
[
reserve
,
setReserve
]
=
useState
([]);
const
[
reserve
,
setReserve
]
=
useState
([]);
// const [day, setDay] = useState(props.calledday);
const
[
period
,
setPeriod
]
=
useState
();
const
[
day
,
setDay
]
=
useState
(
props
.
day
);
const
[
myTheme
,
setMyTheme
]
=
useState
({
const
[
myTheme
,
setMyTheme
]
=
useState
({
'
common.dayname.color
'
:
'
#333
'
,
'
common.dayname.color
'
:
'
#333
'
,
'
common.today.color
'
:
'
#333
'
,
'
common.today.color
'
:
'
#333
'
,
// 'common.creationGuide.color': 'white',
'
common.creationGuide.backgroundColor
'
:
'
gray
'
,
'
common.creationGuide.backgroundColor
'
:
'
gray
'
,
// Theme object to extends default dark theme.
});
});
const
yj
=
[
{
id
:
'
a
'
,
calendarId
:
'
Subject
'
,
category
:
'
time
'
,
start
:
'
2020-10-27T11:00:00
'
,
end
:
'
2020-10-27T12:00:00
'
,
},
{
id
:
'
b
'
,
calendarId
:
'
Subject
'
,
category
:
'
time
'
,
start
:
'
2020-10-28T10:00:00
'
,
end
:
'
2020-10-28T11:00:00
'
,
},
{
id
:
'
3
'
,
calendarId
:
'
Subject
'
,
category
:
'
time
'
,
start
:
'
2020-10-29T11:00:00
'
,
end
:
'
2020-10-29T15:00:00
'
,
}
]
function
getReserve
(
room
)
{
function
getReserve
(
room
)
{
console
.
log
(
"
room
"
,
room
)
// setReserve({
// id: room,
// calendarId: 'Subject',
// category: 'time',
// })
axios
.
get
(
`/reserves/room/
${
room
}
`
,
{
axios
.
get
(
`/reserves/room/
${
room
}
`
,
{
headers
:
{
authorization
:
localStorage
.
getItem
(
'
token
'
)
},
headers
:
{
authorization
:
localStorage
.
getItem
(
'
token
'
)
},
})
})
...
@@ -61,56 +28,68 @@ function Cal(props) {
...
@@ -61,56 +28,68 @@ function Cal(props) {
calendarId
:
'
Subject
'
,
calendarId
:
'
Subject
'
,
category
:
'
time
'
,
category
:
'
time
'
,
}))
}))
console
.
log
(
"
room list
"
,
res
.
data
);
setReserve
(
reserves
);
setReserve
(
reserves
);
// console.log("room list",res.data);
})
})
.
catch
(
err
=>
{
.
catch
(
err
=>
{
alert
(
err
.
error
)
alert
(
err
.
error
)
});
});
}
}
useEffect
(()
=>
{
function
getDataAction
(
target
)
{
// const cal = calendarRef.current.getInstance();
return
target
.
dataset
?
target
.
dataset
.
action
:
target
.
getAttribute
(
'
data-action
'
);
// cal.setDate(new Date(day));
}
// cal.changeView('week', false);
// cal.today(new Date(day));
// calendar.on('clickSchedule', function (event) {
function
onClickNavi
(
e
)
{
// const schedule = event.schedule;
const
cal
=
calendarRef
.
current
.
getInstance
();
const
action
=
getDataAction
(
e
.
target
);
// if (lastClickSchedule) {
switch
(
action
)
{
// calendar.updateSchedule(lastClickSchedule.id, lastClickSchedule.calendarId, {
case
'
move-prev
'
:
// isFocused: false,
cal
.
prev
();
// });
break
;
// }
case
'
move-next
'
:
// calendar.updateSchedule(schedule.id, schedule.calendarId, {
cal
.
next
();
// isFocused: true,
break
;
// });
case
'
move-today
'
:
cal
.
today
();
break
;
default
:
return
;
}
// lastClickSchedule = schedule
;
setRenderRangeText
()
;
// // open detail view
}
// return (console.log(isFocused))
function
setRenderRangeText
()
{
// });
const
cal
=
calendarRef
.
current
.
getInstance
();
let
html
=
[];
html
.
push
(
moment
(
cal
.
getDateRangeStart
().
getTime
()).
format
(
'
YYYY.MM.DD
'
));
html
.
push
(
'
~
'
);
html
.
push
(
moment
(
cal
.
getDateRangeEnd
().
getTime
()).
format
(
'
MM.DD
'
));
setPeriod
(
html
.
join
(
''
))
}
// setReserve([
useEffect
(()
=>
{
// {
setRenderRangeText
();
// id: '3',
// calendarId: 'Subject',
// category: 'time',
// start: '2020-10-29T11:00:00',
// end: '2020-10-29T15:00:00',
// }
// ])
getReserve
(
props
.
room
);
getReserve
(
props
.
room
);
},
[
day
])
},
[
props
.
room
])
return
(
return
(
<
div
>
{
<
div
>
console
.
log
(
"
reserve
"
,
reserve
)}
<
div
id
=
"
menu
"
>
<
span
id
=
"
menu-navi
"
onClick
=
{(
e
)
=>
onClickNavi
(
e
)}
>
<
button
type
=
"
button
"
className
=
"
btn btn-default btn-sm move-today
"
data
-
action
=
"
move-today
"
>
Today
<
/button
>
<
button
type
=
"
button
"
className
=
"
btn btn-default btn-sm move-day
"
data
-
action
=
"
move-prev
"
>
<
i
class
=
"
calendar-icon ic-arrow-line-left
"
data
-
action
=
"
move-prev
"
><
/i
>
<
/button
>
<
button
type
=
"
button
"
className
=
"
btn btn-default btn-sm move-day
"
data
-
action
=
"
move-next
"
>
<
i
className
=
"
calendar-icon ic-arrow-line-right
"
data
-
action
=
"
move-next
"
><
/i
>
<
/button
>
<
/span
>
<
span
id
=
"
renderRange
"
className
=
"
render-range
"
style
=
{{
height
:
"
5em
"
}}
>
{
period
}
<
/span
>
<
/div
>
<
Calendar
<
Calendar
ref
=
{
calendarRef
}
height
=
"
100%
"
height
=
"
100%
"
calendars
=
{[
calendars
=
{[
{
{
...
@@ -120,46 +99,11 @@ function Cal(props) {
...
@@ -120,46 +99,11 @@ function Cal(props) {
isReadOnly
:
'
true
'
isReadOnly
:
'
true
'
}
}
]}
]}
view
=
"
week
"
view
=
"
week
"
disableDblClick
=
{
false
}
disableDblClick
=
{
false
}
disableClick
=
{
true
}
disableClick
=
{
true
}
isReadOnly
=
{
false
}
isReadOnly
=
{
true
}
// template={
schedules
=
{
reserve
}
// popupIsAllDay=function {
// return display: "none"
// }
// }
schedules
=
{
reserve
// reserve.map(item=>({id: item._id,
// start: item.start,
// end: item.end,
// calendarId: 'Subject',
// category: 'time',}))
// [
// {
// id: 'a',
// calendarId: 'Subject',
// category: 'time',
// start: '2020-10-27T11:00:00',
// end: '2020-10-27T12:00:00',
// },
// {
// id: 'b',
// calendarId: 'Subject',
// category: 'time',
// start: '2020-10-28T10:00:00',
// end: '2020-10-28T11:00:00',
// },
// {
// id: '3',
// calendarId: 'Subject',
// category: 'time',
// start: '2020-10-29T11:00:00',
// end: '2020-10-29T15:00:00',
// }
// ]
}
scheduleView
=
{[
'
time
'
]}
scheduleView
=
{[
'
time
'
]}
taskView
=
{
false
}
taskView
=
{
false
}
theme
=
{
myTheme
}
theme
=
{
myTheme
}
...
...
server/client/src/Pages/ApplyPage.js
View file @
9063cd71
...
@@ -2,9 +2,9 @@ import React, { useState, useEffect } from 'react';
...
@@ -2,9 +2,9 @@ import React, { useState, useEffect } from 'react';
import
{
Formik
,
Field
,
ErrorMessage
,
FieldArray
}
from
'
formik
'
;
import
{
Formik
,
Field
,
ErrorMessage
,
FieldArray
}
from
'
formik
'
;
import
Menu
from
'
../Components/Menu
'
;
import
Menu
from
'
../Components/Menu
'
;
import
axios
from
'
axios
'
;
import
axios
from
'
axios
'
;
import
'
bootstrap/dist/css/bootstrap.css
'
;
import
*
as
Yup
from
'
yup
'
;
import
*
as
Yup
from
'
yup
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
{
Col
,
Container
,
Row
}
from
'
react-bootstrap
'
;
function
Apply
(
props
)
{
function
Apply
(
props
)
{
const
[
state
,
setState
]
=
useState
();
const
[
state
,
setState
]
=
useState
();
...
@@ -41,7 +41,6 @@ function Apply(props) {
...
@@ -41,7 +41,6 @@ function Apply(props) {
<
option
value
=
"
2
"
>
2
시간
<
/option
>
<
option
value
=
"
2
"
>
2
시간
<
/option
>
<
option
value
=
"
3
"
>
3
시간
<
/option
>
<
option
value
=
"
3
"
>
3
시간
<
/option
>
<
/Field>
)
<
/Field>
)
}
}
function
getUser
()
{
function
getUser
()
{
...
@@ -63,137 +62,134 @@ function Apply(props) {
...
@@ -63,137 +62,134 @@ function Apply(props) {
return
(
return
(
<
div
>
<
div
>
<
Menu
/>
<
Menu
/>
<
Formik
<
Container
fluid
>
initialValues
=
{{
<
Row
className
=
"
justify-content-center
"
>
_id
:
`
${
props
.
match
.
params
.
id
}
`
,
<
Col
md
=
{
5
}
>
date
:
''
,
<
Formik
starttime
:
''
,
initialValues
=
{{
usetime
:
''
,
_id
:
`
${
props
.
match
.
params
.
id
}
`
,
room
:
''
,
date
:
''
,
reason
:
''
,
starttime
:
''
,
students
:
[
usetime
:
''
,
{
room
:
''
,
member
:
''
,
reason
:
''
,
},
students
:
[
],
{
}}
member
:
''
,
validationSchema
=
{
Yup
.
object
({
},
date
:
Yup
.
string
()
],
.
required
(
'
날짜를 입력해주세요.
'
),
}}
room
:
Yup
.
string
()
validationSchema
=
{
Yup
.
object
({
.
required
(
'
강의실 번호를 입력해주세요.
'
),
date
:
Yup
.
string
()
reason
:
Yup
.
string
()
.
required
(
'
날짜를 입력해주세요.
'
),
.
required
(
'
대관목적을 입력해주세요.
'
),
reason
:
Yup
.
string
()
})}
.
required
(
'
대관목적을 입력해주세요.
'
),
onSubmit
=
{(
values
,
{
setSubmitting
})
=>
{
})}
console
.
log
(
values
)
onSubmit
=
{(
values
,
{
setSubmitting
})
=>
{
axios
({
console
.
log
(
values
)
method
:
'
post
'
,
axios
({
url
:
'
/reserves
'
,
method
:
'
post
'
,
data
:
values
url
:
'
/reserves
'
,
}).
then
(
res
=>
{
data
:
values
if
(
res
.
status
===
404
)
{
}).
then
(
res
=>
{
alert
(
res
.
data
.
error
)
if
(
res
.
status
===
404
)
{
return
window
.
location
.
reload
();
alert
(
res
.
data
.
error
)
}
return
window
.
location
.
reload
();
alert
(
"
신청이 완료되었습니다!
"
);
}
setState
(
true
);
alert
(
"
신청이 완료되었습니다!
"
);
console
.
log
(
"
res.data
"
,
res
.
data
)
setState
(
true
);
})
console
.
log
(
"
res.data
"
,
res
.
data
)
.
catch
(
err
=>
{
})
alert
(
err
.
error
)
.
catch
(
err
=>
{
});
alert
(
err
.
error
)
});
setTimeout
(()
=>
{
setSubmitting
(
false
);
},
400
);
// finish the cycle in handler
}}
>
{({
errors
,
touched
,
values
,
handleSubmit
,
getFieldProps
,
isSubmitting
,
})
=>
(
<
form
onSubmit
=
{
handleSubmit
}
className
=
"
d-flex flex-column
"
>
<
h3
className
=
"
form-group font-weight-bold
"
>
<
label
className
=
"
pr-2
"
>
대표자
:
<
/label>{user.name
}
<
/h3
>
<
div
className
=
"
form-group
"
>
<
div
className
=
{
touched
.
date
&&
errors
.
date
?
"
text-danger
"
:
""
}
>
신청날짜
<
/div
>
<
input
className
=
{(
touched
.
date
&&
errors
.
date
?
'
form-control is-invalid
'
:
"
form-control
"
)}
type
=
"
text
"
name
=
"
date
"
{...
getFieldProps
(
'
date
'
)}
placeholder
=
"
yyyy-mm-dd
"
/>
<
/div
>
<
div
className
=
"
form-group mb-4
"
>
<
label
>
이용시작시간
<
/label
>
<
div
>
<
Field
as
=
"
select
"
name
=
"
starttime
"
>
<
option
value
=
""
>
이용시작시간
<
/option
>
<
option
value
=
"
9
"
>
9
시
<
/option
>
<
option
value
=
"
10
"
>
10
시
<
/option
>
<
option
value
=
"
11
"
>
11
시
<
/option
>
<
option
value
=
"
12
"
>
12
시
<
/option
>
<
option
value
=
"
13
"
>
13
시
<
/option
>
<
option
value
=
"
14
"
>
14
시
<
/option
>
<
option
value
=
"
15
"
>
15
시
<
/option
>
<
option
value
=
"
16
"
>
16
시
<
/option
>
<
option
value
=
"
17
"
>
17
시
<
/option
>
<
option
value
=
"
18
"
>
18
시
<
/option
>
<
option
value
=
"
19
"
>
19
시
<
/option
>
<
option
value
=
"
20
"
>
20
시
<
/option
>
<
option
value
=
"
21
"
>
21
시
<
/option
>
<
/Field
>
<
/div
>
<
/div
>
setTimeout
(()
=>
{
<
div
className
=
"
form-group mb-4
"
>
setSubmitting
(
false
);
<
label
>
이용시간
<
/label
>
},
400
);
// finish the cycle in handler
}}
>
{({
errors
,
touched
,
values
,
handleSubmit
,
getFieldProps
,
isSubmitting
,
})
=>
(
<
div
className
=
"
row justify-content-center align-items-center
"
>
<
form
onSubmit
=
{
handleSubmit
}
className
=
"
col-sm-3
"
>
<
div
className
=
"
form-group mb-4
"
>
<
label
>
대표자
<
/label
>
<
div
>
{
user
.
name
}
<
/div
>
<
/div
>
<
div
className
=
"
form-group mb-4
"
>
<
label
>
신청날짜
<
/label
>
<
input
className
=
{(
touched
.
date
&&
errors
.
date
?
'
form-control is-invalid
'
:
"
form-control
"
)}
type
=
"
text
"
name
=
"
date
"
{...
getFieldProps
(
'
date
'
)}
placeholder
=
"
yyyy-mm-dd
"
/>
{
touched
.
date
&&
errors
.
date
?
(
<
div
className
=
"
invalid-feedback text-left
"
>
{
errors
.
date
}
<
/div
>
)
:
null
}
<
/div
>
<
div
className
=
"
form-group mb-4
"
>
<
label
>
이용시작시간
<
/label
>
<
Field
as
=
"
select
"
name
=
"
starttime
"
>
<
option
value
=
""
>
이용시작시간
<
/option
>
<
option
value
=
"
9
"
>
9
시
<
/option
>
<
option
value
=
"
10
"
>
10
시
<
/option
>
<
option
value
=
"
11
"
>
11
시
<
/option
>
<
option
value
=
"
12
"
>
12
시
<
/option
>
<
option
value
=
"
13
"
>
13
시
<
/option
>
<
option
value
=
"
14
"
>
14
시
<
/option
>
<
option
value
=
"
15
"
>
15
시
<
/option
>
<
option
value
=
"
16
"
>
16
시
<
/option
>
<
option
value
=
"
17
"
>
17
시
<
/option
>
<
option
value
=
"
18
"
>
18
시
<
/option
>
<
option
value
=
"
19
"
>
19
시
<
/option
>
<
option
value
=
"
20
"
>
20
시
<
/option
>
<
option
value
=
"
21
"
>
21
시
<
/option
>
<
/Field
>
<
/div
>
<
div
className
=
"
form-group mb-4
"
>
<
label
>
이용시간
<
/label
>
{
time
(
values
.
starttime
)}
<
/div
>
<
div
className
=
"
form-group mb-4
"
>
<
label
>
강의실
<
/label
>
<
input
className
=
{(
touched
.
room
&&
errors
.
room
?
'
form-control is-invalid
'
:
"
form-control
"
)}
type
=
"
text
"
name
=
"
room
"
{...
getFieldProps
(
'
room
'
)}
placeholder
=
"
bn-nnn
"
/>
{
touched
.
room
&&
errors
.
room
?
(
<
div
className
=
"
invalid-feedback text-left
"
>
{
errors
.
room
}
<
/div
>
)
:
null
}
<
/div
>
<
div
className
=
"
form-group mb-4
"
>
<
label
>
대관목적
<
/label
>
<
input
className
=
{(
touched
.
reason
&&
errors
.
reason
?
'
form-control is-invalid
'
:
"
form-control
"
)}
type
=
"
text
"
name
=
"
reason
"
{...
getFieldProps
(
'
reason
'
)}
placeholder
=
"
대관목적을 입력해 주세요.
"
/>
{
touched
.
reason
&&
errors
.
reason
?
(
<
div
className
=
"
invalid-feedback text-left
"
>
{
errors
.
reason
}
<
/div
>
)
:
null
}
<
/div
>
<
div
className
=
"
form-group mb-4
"
>
<
FieldArray
name
=
"
students
"
>
{({
insert
,
remove
,
push
})
=>
(
<
div
>
<
div
>
<
label
>
이용자
<
/label
>
{
time
(
values
.
starttime
)}
{
<
/div
>
values
.
students
.
map
((
student
,
index
)
=>
(
<
/div
>
<
div
className
=
"
row
"
key
=
{
index
}
>
<
div
className
=
"
col
"
>
<
div
className
=
"
form-group mb-4
"
>
<
div
className
=
{
touched
.
room
&&
errors
.
room
?
"
text-danger
"
:
""
}
>
강의실
<
/div
>
<
Field
as
=
"
select
"
name
=
"
room
"
>
<
option
value
=
""
>
강의실을
선택하세요
<
/option
>
<
option
value
=
"
9-116
"
>
9
-
116
<
/option
>
<
option
value
=
"
7-234
"
>
7
-
234
<
/option
>
<
option
value
=
"
25-101
"
>
25
-
101
<
/option
>
<
/Field
>
<
/div
>
<
div
className
=
"
form-group mb-4
"
>
<
div
className
=
{
touched
.
reason
&&
errors
.
reason
?
"
text-danger
"
:
""
}
>
대관
목적
<
/div
>
<
input
className
=
{(
touched
.
reason
&&
errors
.
reason
?
'
form-control is-invalid
'
:
"
form-control
"
)}
type
=
"
text
"
name
=
"
reason
"
{...
getFieldProps
(
'
reason
'
)}
placeholder
=
"
대관목적을 입력해 주세요.
"
/>
<
/div
>
<
div
className
=
"
form-group mb-4
"
>
<
FieldArray
name
=
"
students
"
>
{({
insert
,
remove
,
push
})
=>
(
<
div
>
<
div
className
=
{
touched
.
date
&&
errors
.
date
?
"
text-danger
"
:
""
}
>
이용자
<
/div
>
{
values
.
students
.
map
((
student
,
index
)
=>
(
<
Row
key
=
{
index
}
>
<
Field
<
Field
name
=
{
`students.
${
index
}
.member`
}
name
=
{
`students.
${
index
}
.member`
}
placeholder
=
"
이용자 성함을 입력하세요.
"
placeholder
=
"
이용자 성함을 입력하세요.
"
...
@@ -208,32 +204,29 @@ function Apply(props) {
...
@@ -208,32 +204,29 @@ function Apply(props) {
type
=
"
button
"
type
=
"
button
"
className
=
"
secondary
"
className
=
"
secondary
"
onClick
=
{()
=>
remove
(
index
)}
onClick
=
{()
=>
remove
(
index
)}
>
>
X
<
/button
>
X
<
/Row
>
<
/button
>
))}
<
/div
>
<
button
<
/div
>
type
=
"
button
"
))}
className
=
"
btn btn-primary
"
<
button
onClick
=
{()
=>
push
({
member
:
''
})}
type
=
"
button
"
>
추가
<
/button
>
className
=
"
btn btn-primary
"
<
/div
>
onClick
=
{()
=>
push
({
member
:
''
})}
)}
>
<
/FieldArray
>
추가
<
/div
>
<
/button
>
<
button
type
=
"
submit
"
className
=
"
btn btn-dark
"
disabled
=
{
isSubmitting
}
>
<
/div
>
신청하기
)}
<
/button
>
<
/FieldArray
>
<
/form
>
<
/div
>
)}
<
button
type
=
"
submit
"
className
=
"
btn btn-dark
"
disabled
=
{
isSubmitting
}
>
<
/Formik
>
신청하기
<
/Col
>
<
/button
>
<
/Row
>
<
/form
>
<
/Container
>
<
/div
>
)}
<
/Formik
>
<
/div
>
<
/div
>
)
)
}
}
export
default
Apply
export
default
Apply
\ No newline at end of file
server/client/src/Pages/ChangePage.js
View file @
9063cd71
...
@@ -4,7 +4,7 @@ import * as Yup from 'yup';
...
@@ -4,7 +4,7 @@ import * as Yup from 'yup';
import
axios
from
'
axios
'
;
import
axios
from
'
axios
'
;
import
Menu
from
'
../Components/Menu
'
;
import
Menu
from
'
../Components/Menu
'
;
import
{
Link
,
Redirect
}
from
'
react-router-dom
'
;
import
{
Link
,
Redirect
}
from
'
react-router-dom
'
;
import
{
Container
,
Button
,
Col
}
from
'
react-bootstrap
'
;
import
{
Container
,
Button
,
Navbar
,
Col
}
from
'
react-bootstrap
'
;
import
styled
from
'
styled-components
'
;
import
styled
from
'
styled-components
'
;
const
Check
=
styled
.
div
`
const
Check
=
styled
.
div
`
...
@@ -30,7 +30,13 @@ function Change(props) {
...
@@ -30,7 +30,13 @@ function Change(props) {
// console.log(props)
// console.log(props)
return
(
return
(
<
div
className
=
""
>
<
div
className
=
""
>
<
Menu
/>
{(
localStorage
.
getItem
(
"
token
"
)
!==
null
)
?
(
<
Menu
/>
)
:
(
<
Menu
expand
=
"
md
"
variant
=
"
dark
"
>
<
Navbar
.
Brand
>
회원가입
<
/Navbar.Brand
>
<
/Menu
>
)}
<
Container
fluid
className
=
"
p-0 vh-90
"
>
<
Container
fluid
className
=
"
p-0 vh-90
"
>
<
Check
className
=
"
row justify-content-center m-0
"
>
<
Check
className
=
"
row justify-content-center m-0
"
>
<
Col
md
=
{
4
}
className
=
"
pt-5
"
>
<
Col
md
=
{
4
}
className
=
"
pt-5
"
>
...
...
server/client/src/Pages/HomePage.js
View file @
9063cd71
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
React
,
{
useState
,
useEffect
}
from
'
react
'
;
import
Menu
from
'
../Components/Menu
'
;
import
Menu
from
'
../Components/Menu
'
;
import
Schedule
from
'
../Components/Schedule
'
;
import
Schedule
from
'
../Components/Schedule
'
;
import
styled
from
'
styled-components
'
;
import
Tabs
from
'
react-bootstrap/Tabs
'
;
import
moment
from
'
moment
'
;
import
Tab
from
'
react-bootstrap/Tab
'
;
import
"
moment/locale/ko
"
;
moment
.
locale
(
"
ko
"
,
{
week
:
{
dow
:
1
}
});
const
Drop
=
styled
.
div
`
& button {
border solid 1px;
}
`
const
Tab
=
styled
.
ul
`
& a, a:hover, a:active {
color: black;
}
`
function
Home
()
{
function
Home
()
{
const
[
show
,
setShow
]
=
useState
(
false
);
const
[
key
,
setKey
]
=
useState
(
'
9-116
'
);
const
[
weeks
,
setWeeks
]
=
useState
([]);
const
[
days
,
setDays
]
=
useState
([]);
const
[
sendDate
,
setSendDate
]
=
useState
(
null
);
useEffect
(()
=>
{
Dateform
();
},
[]);
function
Dateform
()
{
let
today
=
moment
();
let
weeks
=
[];
let
dates
=
[];
let
sendDates
=
[];
for
(
let
i
=
0
;
i
<
6
;
i
++
)
{
if
(
i
!==
0
)
{
today
.
add
(
7
,
'
d
'
);
}
let
date
=
{
start
:
null
,
end
:
null
};
date
.
start
=
today
.
startOf
(
'
week
'
).
format
(
"
MMM Do
"
);
date
.
end
=
today
.
endOf
(
'
week
'
).
weekday
(
4
).
format
(
"
MMM Do
"
);
dates
.
push
(
date
);
const
week
=
date
.
start
+
"
~
"
+
date
.
end
;
weeks
.
push
(
week
);
let
sendDate
=
today
.
startOf
(
'
week
'
).
format
(
"
YYYY-MM-DD
"
);
sendDates
.
push
(
sendDate
);
};
setWeeks
([...
weeks
])
setDays
([...
sendDates
])
};
function
choose
(
e
,
index
)
{
setShow
(
true
)
setSendDate
(
days
[
index
])
}
return
(
return
(
<
div
>
<
div
>
...
@@ -75,38 +19,17 @@ function Home() {
...
@@ -75,38 +19,17 @@ function Home() {
<
li
>
주말
:
이용
불가
<
/li
>
<
li
>
주말
:
이용
불가
<
/li
>
<
/ul
>
<
/ul
>
<
/p
>
<
/p
>
<
Drop
className
=
"
row dropdown mt-1 mb-2
"
>
<
Tabs
defaultActiveKey
=
"
9-116
"
id
=
"
uncontrolled-tab-example
"
onSelect
=
{(
k
)
=>
setKey
(
k
)}
>
<
button
className
=
"
btn btn-lg dropdown-toggle mx-auto col-5
"
type
=
"
button
"
id
=
"
dropdownMenuButton
"
data
-
toggle
=
"
dropdown
"
aria
-
haspopup
=
"
true
"
aria
-
expanded
=
"
false
"
>
<
Tab
eventKey
=
"
9-116
"
title
=
"
9-116
"
>
기간을
선택해주십시오
.
<
Schedule
room
=
{
key
}
/
>
<
/button
>
<
/Tab
>
<
div
className
=
"
dropdown-menu col-5
"
aria
-
labelledby
=
"
dropdownMenuButton
"
>
<
Tab
eventKey
=
"
7-234
"
title
=
"
7-234
"
>
{
weeks
.
map
((
week
,
index
)
=>
(
<
Schedule
room
=
{
key
}
/
>
<
a
className
=
"
dropdown-item
"
id
=
{
index
}
onClick
=
{(
e
)
=>
choose
(
e
,
index
)}
>
{
week
}
<
/a
>
<
/Tab
>
))}
<
Tab
eventKey
=
"
25-101
"
title
=
"
25-101
"
>
<
/div
>
<
Schedule
room
=
{
key
}
/
>
<
/Drop
>
<
/Tab
>
<
Tab
className
=
"
nav nav-tabs nav-justified mt-4
"
id
=
"
myTab
"
role
=
"
tablist
"
style
=
{
show
?
{}
:
{
display
:
"
none
"
}}
>
<
/Tabs
>
<
li
className
=
"
nav-item
"
>
<
a
className
=
"
nav-link active
"
id
=
"
7-tab
"
data
-
toggle
=
"
tab
"
href
=
"
#tab-7
"
role
=
"
tab
"
aria
-
controls
=
"
7
"
aria
-
selected
=
"
true
"
>
7
-
223
<
/a
>
<
/li
>
<
li
className
=
"
nav-item
"
>
<
a
className
=
"
nav-link
"
id
=
"
9-tab
"
data
-
toggle
=
"
tab
"
href
=
"
#tab-9
"
role
=
"
tab
"
aria
-
controls
=
"
9
"
aria
-
selected
=
"
false
"
>
9
-
116
<
/a
>
<
/li
>
<
li
className
=
"
nav-item
"
>
<
a
className
=
"
nav-link
"
id
=
"
25-tab
"
data
-
toggle
=
"
tab
"
href
=
"
#tab-25
"
role
=
"
tab
"
aria
-
controls
=
"
25
"
aria
-
selected
=
"
false
"
>
25
-
307
<
/a
>
<
/li
>
<
/Tab
>
<
div
className
=
"
tab-content row justify-content-center
"
id
=
"
myTabContent
"
style
=
{
show
?
{}
:
{
display
:
"
none
"
}}
>
<
div
className
=
"
tab-pane fade show active col-md-11 col-12
"
id
=
"
tab-7
"
role
=
"
tabpanel
"
aria
-
labelledby
=
"
7-tab
"
>
<
Schedule
day
=
{
sendDate
}
/
>
<
/div
>
<
div
className
=
"
tab-pane fade col-md-11 col-12
"
id
=
"
tab-9
"
role
=
"
tabpanel
"
aria
-
labelledby
=
"
9-tab
"
>
<
Schedule
day
=
{
sendDate
}
/
>
<
/div
>
<
div
className
=
"
tab-pane fade col-md-11 col-12
"
id
=
"
tab-25
"
role
=
"
tabpanel
"
aria
-
labelledby
=
"
25-tab
"
>
<
Schedule
day
=
{
sendDate
}
/
>
<
/div
>
<
/div
>
<
h3
>
유의사항
<
/h3
>
<
h3
>
유의사항
<
/h3
>
<
p
>
<
p
>
<
ul
>
<
ul
>
...
...
server/client/src/Pages/NoticePage.js
View file @
9063cd71
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
React
,
{
useState
,
useEffect
}
from
'
react
'
;
import
Menu
from
'
../Components/Menu
'
;
import
Menu
from
'
../Components/Menu
'
;
import
axios
from
'
axios
'
;
import
axios
from
'
axios
'
;
import
{
Link
}
from
'
react-router-dom
'
;
import
{
Link
}
from
'
react-router-dom
'
;
import
{
Container
,
Row
,
Col
,
Card
,
Navbar
,
Accordion
,
Button
}
from
'
react-bootstrap
'
;
import
{
Container
,
Row
,
Col
,
Card
,
Accordion
,
Button
}
from
'
react-bootstrap
'
;
function
Notice
()
{
function
Notice
()
{
const
[
show
,
setShow
]
=
useState
(
false
);
const
[
notices
,
setNotices
]
=
useState
([]);
const
[
notices
,
setNotices
]
=
useState
([]);
const
[
user
,
setUser
]
=
useState
({
role
:
""
})
useEffect
(()
=>
{
useEffect
(()
=>
{
acheck
();
getNotice
();
getNotice
();
},
[]);
},
[]);
function
acheck
()
{
axios
.
get
(
`/users/
${
localStorage
.
getItem
(
'
_id
'
)}
`
)
.
then
(
res
=>
{
if
(
res
.
data
.
role
==
"
admin
"
)
{
setUser
(
res
.
data
)
}
}).
catch
(
err
=>
{
alert
(
err
.
error
)
});
}
function
dateForm
(
day
)
{
function
dateForm
(
day
)
{
const
post_day
=
new
Date
(
day
);
const
post_day
=
new
Date
(
day
);
let
year
=
post_day
.
getFullYear
();
let
year
=
post_day
.
getFullYear
();
...
@@ -36,27 +50,27 @@ function Notice() {
...
@@ -36,27 +50,27 @@ function Notice() {
alert
(
err
.
error
)
alert
(
err
.
error
)
});
});
}
}
return
(
return
(
<
div
>
<
div
>
{(
localStorage
.
getItem
(
"
token
"
)
!==
null
)
?
(
<
Menu
/>
<
Menu
/>
)
:
(
<
Menu
expand
=
"
md
"
variant
=
"
dark
"
>
<
Navbar
.
Brand
>
회원가입
<
/Navbar.Brand
>
<
/Menu
>
)}
<
Container
fluid
>
<
Container
fluid
>
<
Row
className
=
"
justify-content-center vw-100 vh-90
"
>
<
Row
className
=
"
justify-content-center vw-100 vh-90
"
>
<
Col
md
=
{
7
}
>
<
Col
md
=
{
7
}
>
<
h2
className
=
"
p-3 border-bottom
"
>
공지사항
<
Link
to
=
"
/write
"
>
글
작성
<
/Link></
h2
>
<
div
className
=
"
px-3 pt-3 mb-3 border-bottom d-flex justify-content-between align-items-end
"
>
<
h2
>
공지사항
<
/h2
>
{
user
.
role
===
"
admin
"
?
(
<
Link
to
=
"
/write
"
>
글
작성
<
/Link>
)
: null
}
<
/div
>
<
Accordion
>
<
Accordion
>
{
notices
.
map
((
notice
,
index
)
=>
{
notices
.
map
((
notice
,
index
)
=>
<
Card
>
<
Card
>
<
Card
.
Header
>
<
Card
.
Header
className
=
"
d-flex justify-content-between
"
>
<
Accordion
.
Toggle
as
=
{
Button
}
variant
=
"
link
"
eventKey
=
{
index
+
1
}
>
{
notice
.
notice_title
}
<
span
className
=
"
text-right
"
>
{
dateForm
(
notice
.
post_date
)}
<
/span></
Accordion
.
Toggle
>
<
Accordion
.
Toggle
as
=
{
Button
}
variant
=
"
link
"
eventKey
=
{
index
+
1
}
className
=
{
"
d-inline-block
"
+
(
show
?
"
text-wrap
"
:
"
text-truncate
"
)}
onClick
=
{()
=>
setShow
(
!
show
)}
>
{
notice
.
notice_title
}
<
/Accordion.Toggle
>
<
span
className
=
"
d-flex align-items-center
"
style
=
{{
width
:
"
50%
"
}}
>
{
dateForm
(
notice
.
post_date
)}
<
/span
>
<
/Card.Header
>
<
/Card.Header
>
<
Accordion
.
Collapse
eventKey
=
{
index
+
1
}
>
<
Accordion
.
Collapse
eventKey
=
{
index
+
1
}
>
<
Card
.
Body
>
{
notice
.
notice_content
}
<
/Card.Body
>
<
Card
.
Body
>
<
pre
>
{
notice
.
notice_content
}
<
/
pre></
Card
.
Body
>
<
/Accordion.Collapse
>
<
/Accordion.Collapse
>
<
/Card>
)
}
<
/Card>
)
}
<
/Accordion
>
<
/Accordion
>
...
...
server/client/src/Pages/WritePage.js
View file @
9063cd71
...
@@ -67,11 +67,8 @@ function Write() {
...
@@ -67,11 +67,8 @@ function Write() {
<
div
className
=
"
form-group
"
>
<
div
className
=
"
form-group
"
>
{
/* mb-4 */
}
{
/* mb-4 */
}
<
div
className
=
{
touched
.
name
&&
errors
.
name
?
"
text-danger
"
:
""
}
>
내용
<
/div
>
<
div
className
=
{
touched
.
name
&&
errors
.
name
?
"
text-danger
"
:
""
}
>
내용
<
/div
>
<
input
className
=
{(
touched
.
name
&&
errors
.
name
?
'
form-control is-invalid
'
:
"
form-control
"
)}
<
Field
as
=
"
textarea
"
rows
=
{
8
}
cols
=
{
175
}
type
=
"
text
"
{...
getFieldProps
(
'
content
'
)}
/
>
content
=
"
content
"
{...
getFieldProps
(
'
content
'
)}
placeholder
=
"
내용
"
/>
<
/div
>
<
/div
>
<
button
type
=
"
submit
"
className
=
"
btn btn-dark
"
disabled
=
{
isSubmitting
}
>
공지
등록
<
/button
>
<
button
type
=
"
submit
"
className
=
"
btn btn-dark
"
disabled
=
{
isSubmitting
}
>
공지
등록
<
/button
>
<
/form
>
<
/form
>
...
...
server/routes/reserves.js
View file @
9063cd71
...
@@ -38,8 +38,8 @@ router.post('/', function (req, res, next) {
...
@@ -38,8 +38,8 @@ router.post('/', function (req, res, next) {
const
strt
=
new
Date
(
reserve
.
start
)
const
strt
=
new
Date
(
reserve
.
start
)
const
endt
=
new
Date
(
reserve
.
end
)
const
endt
=
new
Date
(
reserve
.
end
)
const
reserveArr
=
reserves
.
map
(
item
=>
(
const
reserveArr
=
reserves
.
map
(
item
=>
(
(
strt
>=
new
Date
(
item
.
start
)
&&
strt
<
=
new
Date
(
item
.
end
))
||
(
strt
>=
new
Date
(
item
.
start
)
&&
strt
<
new
Date
(
item
.
end
))
||
(
endt
>
=
new
Date
(
item
.
start
)
&&
endt
<=
new
Date
(
item
.
end
))
?
(
endt
>
new
Date
(
item
.
start
)
&&
endt
<=
new
Date
(
item
.
end
))
?
"
item
"
:
"
item
"
:
null
null
))
))
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment