Commit e29ed04b authored by Jiwon Yoon's avatar Jiwon Yoon
Browse files

timetable icon, reservation 버그

parent c3eb32a7
...@@ -69,7 +69,7 @@ const TimeTable = ({ ticketInfo = { movieId: 0 }, setTicketInfo }) => { ...@@ -69,7 +69,7 @@ const TimeTable = ({ ticketInfo = { movieId: 0 }, setTicketInfo }) => {
if (ticketInfo) if (ticketInfo)
return <div className="d-inline-flex m-2"> return <div className="d-inline-flex m-2">
<div className={`card text-dark ${styles.cursor}`} onClick={() => handleClick(time)}> <div className={`card text-dark ${styles.cursor}`} onClick={() => handleClick(time)}>
<div className="card-body py-1">{moment(time.start_time).format('HH:mm')} ~ {moment(time.end_time).format('HH:mm')}</div> <div className="card-body py-1"><img src={`${time.partTime==="morning"?'/images/sun.svg': time.partTime==="night"?'/images/moon.svg' :'...'} `} style={{width:'20px'}} alt=""/>{moment(time.start_time).format('HH:mm')} ~ {moment(time.end_time).format('HH:mm')}</div>
<div className="card-footer text-center py-1">{time.theater.rows * time.theater.columns - time.reservations} / {time.theater.rows * time.theater.columns}</div> <div className="card-footer text-center py-1">{time.theater.rows * time.theater.columns - time.reservations} / {time.theater.rows * time.theater.columns}</div>
</div> </div>
</div> </div>
......
import { useState, useEffect } from "react" const BoxOffice = ({ TMDB_TopRated_Data }) => {
const BoxOffice = ({TMDB_TopRated_Data}) => {
return ( return (
<div className="container text-center my-3"> <div className="container text-center my-3">
{/* <div id="carouselExampleControls" className="carousel slide" data-bs-ride="carousel"> {console.log(TMDB_TopRated_Data)}
<div id="carouselExampleControls" className="carousel slide" data-bs-ride="carousel">
<div className="carousel-inner"> <div className="carousel-inner">
{TMDB_TopRated_Data.length>0 {TMDB_TopRated_Data.length > 0
? ?
TMDB_TopRated_Data.map((movie, index) => { TMDB_TopRated_Data.map((movie, index) => {
<div className={`carousel-item ${index === 0 ? "active" : ""}`}> <div className={`carousel-item ${index === 0 ? " active" : ""}`}>
{console.log(movie.poster_path)} {console.log(movie.poster_path)}
<img src={`https://image.tmdb.org/t/p/original${movie.poster_path}`} className="d-block w-100" alt="Movie Poster"/> <img src={`https://image.tmdb.org/t/p/original${movie.poster_path}`} className="d-block w-100" alt="Movie Poster" />
</div> </div>
}) })
: :
...@@ -29,7 +28,7 @@ const BoxOffice = ({TMDB_TopRated_Data}) => { ...@@ -29,7 +28,7 @@ const BoxOffice = ({TMDB_TopRated_Data}) => {
<span className="carousel-control-next-icon" aria-hidden="true"></span> <span className="carousel-control-next-icon" aria-hidden="true"></span>
<span className="visually-hidden">Next</span> <span className="visually-hidden">Next</span>
</button> </button>
</div> */} </div>
</div> </div>
) )
......
...@@ -24,23 +24,22 @@ const Collection = ({ TMDB_TopRated_Data }) => { ...@@ -24,23 +24,22 @@ const Collection = ({ TMDB_TopRated_Data }) => {
<> <>
<h2 className="fw-bold text-white text-center my-5">Movie Collection</h2> <h2 className="fw-bold text-white text-center my-5">Movie Collection</h2>
<div className="d-flex justify-content-sm-center" style={{ marginBottom: "8rem" }}> <div className="d-flex justify-content-sm-center" style={{ marginBottom: "8rem" }}>
<div className="col-md-8"> <div className="col-sm-8">
{videoUrls.length > 0 {videoUrls.length > 0
? ?
<div className=""> <div className="ratio ratio-16x9">
<div className="ratio ratio-16x9"> <iframe src={`https://www.youtube.com/embed/${videoUrls[0].key}`} title="YouTube video" allowFullScreen></iframe>
<iframe src={`https://www.youtube.com/embed/${videoUrls[0].key}`} title="YouTube video" allowFullScreen></iframe>
</div>
</div> </div>
: <div className="text-center">예고편 정보가 존재하지 않습니다.</div>} : <div className="text-center">예고편 정보가 존재하지 않습니다.</div>}
</div> </div>
{TMDB_TopRated_Data.length > 0 <div className="col-sm-3">
? {TMDB_TopRated_Data.length > 0
<img src={`https://image.tmdb.org/t/p/original${TMDB_TopRated_Data[0].poster_path}`} className="col-md-3 bg-black" /> ?
: <img src={`https://image.tmdb.org/t/p/original${TMDB_TopRated_Data[0].poster_path}`} className="img-fluid bg-black" />
<div className="col-md-3"></div> :
} <div></div>
}
</div>
</div> </div>
</> </>
) )
......
export { default } from './Movie'
...@@ -42,7 +42,7 @@ const TicketingSeatPage = ({ location }) => { ...@@ -42,7 +42,7 @@ const TicketingSeatPage = ({ location }) => {
try { try {
setError("") setError("")
const response = await axios.post('/api/theater/getInfo', { const response = await axios.post('/api/theater/getInfo', {
theaterId: ticketInfo.selectedTheater theaterId: ticketInfo.theaterId
}) })
setTheaterInfo(response.data) setTheaterInfo(response.data)
const response2 = await reservationApi.findReservedSeats(ticketInfo.timetableId); const response2 = await reservationApi.findReservedSeats(ticketInfo.timetableId);
...@@ -158,10 +158,10 @@ const TicketingSeatPage = ({ location }) => { ...@@ -158,10 +158,10 @@ const TicketingSeatPage = ({ location }) => {
</div> </div>
</div> </div>
<div className="row justify-content-center border p-5 "> <div className="row justify-content-center border p-5 ">
<div className="col-sm-8"> <div className="col-md-8">
<SeatTable count={count} setSelectedSeats={setSelectedSeats} selectedSeats={selectedSeats} theaterInfo={theaterInfo} reservedSeats={reservedSeats} /> <SeatTable count={count} setSelectedSeats={setSelectedSeats} selectedSeats={selectedSeats} theaterInfo={theaterInfo} reservedSeats={reservedSeats} />
</div> </div>
<div className="col-sm-4 mt-5"> <div className="col-md-4 mt-5">
<div> <div>
<button className={styles.on} style={{ height: '1rem', width: '1rem' }} disabled></button> <button className={styles.on} style={{ height: '1rem', width: '1rem' }} disabled></button>
<span> 선택됨</span> <span> 선택됨</span>
......
...@@ -51,7 +51,7 @@ const findOneReservation = async (req, res, next) => { ...@@ -51,7 +51,7 @@ const findOneReservation = async (req, res, next) => {
} }
const saveReservation = async (req, res) => { const saveReservation = async (req, res) => {
try { try {
const { movieId, selectedTheater, timetableId, payment, user, userType, totalFee } = req.body const { movieId, theaterId, timetableId, payment, user, userType, totalFee } = req.body
const rows = req.body.selectedSeats.map(el => el.split('-')[0]) const rows = req.body.selectedSeats.map(el => el.split('-')[0])
const cols = req.body.selectedSeats.map(el => el.split('-')[1]) const cols = req.body.selectedSeats.map(el => el.split('-')[1])
for (let index = 0; index < rows.length; index++) { for (let index = 0; index < rows.length; index++) {
...@@ -62,7 +62,7 @@ const saveReservation = async (req, res) => { ...@@ -62,7 +62,7 @@ const saveReservation = async (req, res) => {
row: rows[index], row: rows[index],
col: cols[index], col: cols[index],
timetableId: timetableId, timetableId: timetableId,
theaterId: selectedTheater, theaterId: theaterId,
payment: payment, payment: payment,
totalFee: totalFee, totalFee: totalFee,
}) })
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment