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
butter-studio
Commits
eba5b165
Commit
eba5b165
authored
Aug 02, 2021
by
Kim, Subin
Browse files
client - TimeTableEdit 컴포넌트 완성 (css 미완)
parent
72bd94dc
Changes
2
Hide whitespace changes
Inline
Side-by-side
client/src/components/Admin/TimeTableEdit.js
View file @
eba5b165
...
...
@@ -4,11 +4,11 @@ import TimeTable from "./TimeTable";
const
TimeTableEdit
=
()
=>
{
return
(
<>
<
h2
className
=
"
border-bottom border-2 text-center pb-2 me-2
"
>
현재
상영시간표
정보
<
/h2
>
<
div
>
<
TimeTableEditForm
/>
<
TimeTable
/>
<
/div
>
<
h2
className
=
"
border-bottom border-2 text-center pb-2 me-2
"
>
현재
상영시간표
정보
<
/h2
>
<
div
>
<
TimeTableEditForm
/>
<
TimeTable
/>
<
/div
>
<
/
>
)
}
...
...
client/src/components/Admin/TimeTableEditForm.js
View file @
eba5b165
import
{
useState
,
useEffect
}
from
"
react
"
;
import
movieApi
from
"
../../apis/movie.api.js
"
;
import
theaterApi
from
"
../../apis/theater.api.js
"
;
import
timetableApi
from
"
../../apis/timetable.api.js
"
;
import
catchErrors
from
"
../../utils/catchErrors.js
"
;
import
styles
from
"
./admin.module.scss
"
;
const
INIT_MOVIE
=
{
movieId
:
0
,
title
:
""
,
release_date
:
""
,
end_date
:
""
,
theater
:
[],
times
:
[]
const
INIT_INFO
=
{
theater
:
0
,
start
:
""
,
end
:
""
}
const
TimeTableEditForm
=
()
=>
{
...
...
@@ -18,9 +16,9 @@ const TimeTableEditForm = () => {
const
[
theaterList
,
setTheaterList
]
=
useState
([])
const
[
selectId
,
setSelectId
]
=
useState
(
0
)
const
[
selectMovie
,
setSelectMovie
]
=
useState
({})
const
[
selectInfo
,
setSelectInfo
]
=
useState
({
theater
:
0
,
start
:
""
,
end
:
""
})
const
[
info
,
setInfo
]
=
useState
({
end_date
:
""
})
const
[
selectInfo
,
setSelectInfo
]
=
useState
(
INIT_INFO
)
const
[
showTimes
,
setShowTimes
]
=
useState
({
list
:
[]
})
const
[
sendInfo
,
setSendInfo
]
=
useState
(
INIT_MOVIE
)
const
[
error
,
setError
]
=
useState
(
""
)
useEffect
(()
=>
{
...
...
@@ -28,6 +26,11 @@ const TimeTableEditForm = () => {
getTheater
()
},
[])
useEffect
(()
=>
{
setSelectInfo
({
...
selectInfo
,
...
INIT_INFO
})
setShowTimes
({
list
:
[]
})
},
[
selectId
])
async
function
getMoviesfromDB
()
{
try
{
setError
(
""
)
...
...
@@ -48,17 +51,23 @@ const TimeTableEditForm = () => {
}
}
function
getDate
(
string
)
{
const
arr
=
string
.
split
(
'
:
'
)
const
date
=
new
Date
(
0
,
0
,
0
,
Number
(
arr
[
0
]),
Number
(
arr
[
1
]))
return
date
}
function
addRunTime
(
start
,
runTime
)
{
const
startArr
=
start
.
split
(
'
:
'
)
const
add
=
Number
(
startArr
[
1
])
+
runTime
let
hours
=
Number
(
startArr
[
0
])
+
Math
.
floor
(
add
/
60
)
if
(
hours
<=
9
)
hours
=
'
0
'
+
hours
if
(
hours
/
24
>
0
)
hours
=
'
0
'
+
hours
%
24
if
(
Math
.
floor
(
hours
/
24
)
>
0
)
hours
=
'
0
'
+
hours
%
24
else
if
(
hours
<=
9
)
hours
=
'
0
'
+
hours
let
mins
=
add
%
60
if
(
mins
<=
9
)
mins
=
'
0
'
+
mins
setSelectInfo
({
...
selectInfo
,
"
start
"
:
start
,
"
end
"
:
hours
+
'
:
'
+
mins
})
}
...
...
@@ -66,23 +75,27 @@ const TimeTableEditForm = () => {
const
{
list
}
=
showTimes
const
isSelect
=
Object
.
values
(
selectInfo
).
every
((
el
)
=>
Boolean
(
el
))
if
(
isSelect
)
{
const
theater
=
theaterList
.
find
(
theater
=>
theater
.
theatertypeId
===
selectInfo
.
theater
)
if
(
theater
)
{
const
myTime
=
{
theaterTypeId
:
selectInfo
.
theater
,
theaterName
:
theater
.
theaterName
+
'
관 /
'
+
theater
.
theatertype
.
theaterTypeName
,
start
:
selectInfo
.
start
,
end
:
selectInfo
.
end
}
setShowTimes
({
list
:
list
.
concat
(
myTime
)
})
}
else
alert
(
'
선택한 상영관을 찾지 못했습니다. 다시 시도하길 바랍니다.
'
)
const
isTime
=
list
.
find
(
el
=>
el
.
theaterTypeId
===
selectInfo
.
theater
&&
(
getDate
(
el
.
start
)
<=
getDate
(
selectInfo
.
end
)
&&
getDate
(
el
.
end
)
>=
getDate
(
selectInfo
.
start
)))
if
(
isTime
)
alert
(
'
이미 추가한 상영시간대입니다. 다른 시간대를 골라주시기 바랍니다.
'
)
else
{
const
theater
=
theaterList
.
find
(
theater
=>
theater
.
theatertypeId
===
selectInfo
.
theater
)
if
(
theater
)
{
const
myTime
=
{
theaterTypeId
:
selectInfo
.
theater
,
theaterName
:
theater
.
theaterName
+
'
관 /
'
+
theater
.
theatertype
.
theaterTypeName
,
start
:
selectInfo
.
start
,
end
:
selectInfo
.
end
}
setShowTimes
({
list
:
list
.
concat
(
myTime
)
})
}
else
alert
(
'
선택한 상영관을 찾지 못했습니다. 다시 시도하길 바랍니다.
'
)
}
}
else
alert
(
'
추가할 데이터의 갯수가 부족합니다. 모든 항목을 입력해주시길 바랍니다.
'
)
setSelectInfo
({
...
selectInfo
,
theater
:
0
,
start
:
""
,
end
:
""
})
setSelectInfo
({
...
selectInfo
,
...
INIT_INFO
})
}
function
delData
(
index
)
{
let
{
list
}
=
showTimes
list
=
list
.
splice
(
index
,
1
)
list
.
splice
(
index
,
1
)
setShowTimes
({
list
:
list
})
}
...
...
@@ -94,9 +107,9 @@ const TimeTableEditForm = () => {
setSelectId
(
value
)
const
res
=
await
movieApi
.
getMovieInfofromTM
(
value
)
setSelectMovie
({
...
res
})
set
Send
Info
({
...
sendInfo
,
movieId
:
value
,
title
:
res
.
title
,
release_date
:
res
.
release_date
,
end_date
:
""
})
setInfo
({
...
info
,
end_date
:
""
})
}
else
if
(
name
===
"
end_date
"
)
{
set
Send
Info
({
...
sendI
nfo
,
[
name
]:
value
})
setInfo
({
...
i
nfo
,
[
name
]:
value
})
}
else
if
(
name
===
"
theater
"
)
{
setSelectInfo
({
...
selectInfo
,
[
name
]:
Number
(
value
)
})
}
else
if
(
name
===
"
start
"
)
{
...
...
@@ -105,13 +118,25 @@ const TimeTableEditForm = () => {
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
}
async
function
handleSubmit
(
e
)
{
e
.
preventDefault
()
const
timeArr
=
[]
try
{
setError
(
""
)
showTimes
.
list
.
map
(
time
=>
{
timeArr
.
push
({
theater
:
time
.
theaterTypeId
,
start
:
time
.
start
,
end
:
time
.
end
})
})
const
sendData
=
{
movieId
:
selectMovie
.
id
,
title
:
selectMovie
.
title
,
release_date
:
selectMovie
.
release_date
,
runtime
:
selectMovie
.
runtime
,
theater
:
timeArr
,
date
:
info
.
end_date
}
await
timetableApi
.
submit
(
sendData
)
alert
(
"
해당 상영시간표 정보 등록이 성공적으로 완료되었습니다.
"
)
window
.
location
.
reload
()
}
catch
(
error
)
{
...
...
@@ -121,7 +146,6 @@ const TimeTableEditForm = () => {
return
(
<
form
onSubmit
=
{
handleSubmit
}
>
{
console
.
log
(
"
select==
"
,
showTimes
)}
<
select
className
=
{
`form-select mb-3
${
styles
.
shadowNone
}
${
styles
.
selectInput
}
`
}
id
=
"
movieId
"
name
=
"
movieId
"
value
=
{
selectId
}
onChange
=
{
handleChange
}
aria
-
label
=
"
select movie
"
defaultValue
=
"
0
"
>
{
movieList
.
length
!==
0
?
movieList
.
map
((
movie
,
index
)
=>
{
...
...
@@ -139,7 +163,7 @@ const TimeTableEditForm = () => {
<
/div
>
<
div
className
=
"
col-md-6 mb-3
"
>
<
label
htmlFor
=
"
end_date
"
className
=
"
form-label
"
>
상영종료일
<
/label
>
<
input
type
=
"
date
"
className
=
{
`form-control
${
styles
.
shadowNone
}
`
}
id
=
"
end_date
"
name
=
"
end_date
"
value
=
{
sendI
nfo
.
end_date
}
min
=
{
se
ndInfo
.
release_date
}
onChange
=
{
handleChange
}
/
>
<
input
type
=
"
date
"
className
=
{
`form-control
${
styles
.
shadowNone
}
`
}
id
=
"
end_date
"
name
=
"
end_date
"
value
=
{
i
nfo
.
end_date
}
min
=
{
se
lectMovie
.
release_date
}
onChange
=
{
handleChange
}
/
>
<
/div
>
<
p
>
시간대
설정
<
/p
>
<
ul
className
=
"
list-group list-group-flush
"
>
...
...
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