Skip to content
This repository has been archived by the owner on May 8, 2024. It is now read-only.

feat: create show #40

Merged
merged 6 commits into from
May 7, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
129 changes: 129 additions & 0 deletions src/pages/MovieManage/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,9 @@ const MovieRow: React.FC<{
const [show, setShow] = useState(false)
const handleClose = () => setShow(false)
const handleShow = () => setShow(true)
const [isShowing, setIsShowing] = useState(false)
const handleIsClose = () => setIsShowing(false)
const handleIsShowing = () => setIsShowing(true)
const [movieTitle, setMovieTitle] = useState(movie.title)
const [cast, setCast] = useState(movie.cast)
const [category, setCategory] = useState(movie.category)
Expand All @@ -28,6 +31,35 @@ const MovieRow: React.FC<{
const [trailerPicture, setTrailerPicture] = useState(movie.trailer_picture)
const [trailerVideo, setTrailerVideo] = useState(movie.trailer_video)
const [error, setError] = useState('')
const [startTime, setStartTime] = useState('2024-03-14T18:27')
const [endTime, setEndTime] = useState('2024-03-14T18:27')
const [adultPrice, setAdultPrice] = useState(10)
const [childPrice, setChildPrice] = useState(5)
const [seniorPrice, setSeniorPrice] = useState(6)
const [bookingFee, setBookingFee] = useState(2)
const [location, setLocation] = useState('UGA Cinema')
const { run: showCreate } = useRequest(
async () =>
Backend.show.v1ShowsCreate({
start_time: new Date(startTime).toISOString(),
end_time: new Date(endTime).toISOString(),
adult_ticket_price: adultPrice,
child_ticket_price: childPrice,
senior_ticket_price: seniorPrice,
theater_location: location,
booking_fee: bookingFee,
movie_id: movie.id
}),
{
manual: true,
onSuccess: () => {
handleIsClose()
},
onError: err => {
setError((err as ErrorResponse).error.msg)
}
}
)
const { run: update } = useRequest(
async () => {
Backend.movie.v1MoviesUpdate(movie.id, {
Expand Down Expand Up @@ -147,6 +179,103 @@ const MovieRow: React.FC<{
onChange={e => setShowTime(e.target.value)}
/>
</Form.Group>

<Form.Group className='mb-3'>
<Form.Label>Edit Movie Showings</Form.Label>
<div>
<Button variant='primary' onClick={handleIsShowing}>
Create show
</Button>
</div>
<Modal show={isShowing} onHide={handleIsClose}>
<Modal.Header closeButton>
<Modal.Title>Create Show</Modal.Title>
</Modal.Header>
<Modal.Body>
<Form.Group className='mb-3'>
<Form.Label>Start Time</Form.Label>
<Form.Control
type='datetime-local'
placeholder='Start Time'
defaultValue='2024-03-14T18:27'
onChange={e => {
setStartTime(e.target.value)
}}
/>
</Form.Group>
<Form.Group className='mb-3'>
<Form.Label>End Time</Form.Label>
<Form.Control
type='datetime-local'
placeholder='End Time'
defaultValue='2024-03-14T18:27'
onChange={e => {
setEndTime(e.target.value)
}}
/>
</Form.Group>
<Form.Group className='mb-3'>
<Form.Label>Adult Ticket Price</Form.Label>
<Form.Control
type='number'
placeholder='Price'
defaultValue={10}
onChange={e => {
setAdultPrice(Number.parseFloat(e.target.value))
}}
/>
</Form.Group>
<Form.Group className='mb-3'>
<Form.Label>Child Ticket Price</Form.Label>
<Form.Control
type='number'
placeholder='Price'
defaultValue={5}
onChange={e => {
setChildPrice(Number.parseFloat(e.target.value))
}}
/>
</Form.Group>
<Form.Group className='mb-3'>
<Form.Label>Senior Ticket Price</Form.Label>
<Form.Control
type='number'
placeholder='Price'
defaultValue={6}
onChange={e => {
setSeniorPrice(Number.parseFloat(e.target.value))
}}
/>
</Form.Group>
<Form.Group className='mb-3'>
<Form.Label>Booking Fee</Form.Label>
<Form.Control
type='number'
placeholder='Fee'
defaultValue={2}
onChange={e => {
setBookingFee(Number.parseFloat(e.target.value))
}}
/>
</Form.Group>
<Form.Group className='mb-3'>
<Form.Label>Theater Location</Form.Label>
<Form.Control
type='text'
placeholder='Location'
defaultValue='UGA Cinema'
onChange={e => {
setLocation(e.target.value)
}}
/>
</Form.Group>
<Button variant='primary' onClick={showCreate}>
Create Show
</Button>
</Modal.Body>
</Modal>
</Form.Group>

<Form.Group className='mb-3'>
<Form.Label>Synopsis</Form.Label>
<Form.Control
Expand Down
96 changes: 61 additions & 35 deletions src/pages/MovieSelect/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@ import { useRequest } from 'ahooks'
import type { SchemaShow, SchemaMovie } from 'client'
import PageContainer from 'components/PageContainer'
import { useState } from 'react'
import Button from 'react-bootstrap/Button'
import Card from 'react-bootstrap/Card'
import { Button, Card, Table, Row, Col } from 'react-bootstrap'
import { useNavigate, useParams } from 'react-router-dom'
import Backend from 'utils/service'

Expand Down Expand Up @@ -49,49 +48,76 @@ const Index: React.FC = () => {
</div>

<div className='d-flex flex-wrap justify-content-around'>
{loadingMovie ? null : (
<Card style={{ width: '18rem' }}>
<Card.Img
variant='top'
src={movie.trailer_picture}
alt={`${movie.title} poster`}
/>
<Card.Body>
<Card.Title>{movie.title}</Card.Title>
<Card.Text>
<strong>Director:</strong> {movie.director}
</Card.Text>
<div>
{loadingShows
? null
: shows.map((show, index) => (
<Button
key={index}
variant='primary'
className='mx-1 my-1'
onClick={() =>
navigate(`/movie/${movieId}/seat?show=${show.id}`)
}
>
{`${new Date(show.start_time).toLocaleDateString(
<Row>
<Col>
{loadingMovie ? null : (
<Card style={{ width: '18rem' }}>
<Card.Img
variant='top'
src={movie.trailer_picture}
alt={`${movie.title} poster`}
/>
<Card.Body>
<Card.Title>{movie.title}</Card.Title>
<Card.Text>
<strong>Director:</strong> {movie.director}
</Card.Text>
</Card.Body>
</Card>
)}
</Col>
<Col>
{loadingShows ? null : (
<Table hover>
<thead>
<tr>
<th>Date</th>
<th>Time</th>
<th>Location</th>
<th>Action</th>
</tr>
</thead>
<tbody>
{shows.map((show, index) => (
<tr key={index}>
<td>
{new Date(show.start_time).toLocaleDateString(
undefined,
{
year: 'numeric',
month: 'short',
day: 'numeric'
}
)}, ${new Date(show.start_time).toLocaleTimeString(
)}
</td>
<td>
{new Date(show.start_time).toLocaleTimeString(
undefined,
{
hour: '2-digit',
minute: '2-digit'
}
)} - ${show.theater_location}`}
</Button>
))}
</div>
</Card.Body>
</Card>
)}
)}
</td>
<td>{show.theater_location}</td>
<td>
<Button
variant='primary'
disabled={new Date(show.start_time) < new Date()}
onClick={() =>
navigate(`/movie/${movieId}/seat?show=${show.id}`)
}
>
Book
</Button>
</td>
</tr>
))}
</tbody>
</Table>
)}
</Col>
</Row>
</div>
</PageContainer>
)
Expand Down
Loading