Skip to content

GitLab

Commit 0b1deeab authored by Jiwon Yoon's avatar Jiwon Yoon
Browse files

Merge branch 'kimpen'

parents ddddae5b f1ca9c13
Hide whitespace changes
Inline Side-by-side
client/src/apis/timetable.api.js
View file @ 0b1deeab
......@@ -11,8 +11,8 @@ const submit = async (sendData) => {
return data
}
const remove = async () => {
const { data } = await axios.delete(`${baseUrl}/api/timetable/`)
const remove = async (timeId) => {
const { data } = await axios.delete(`${baseUrl}/api/timetable/${timeId}`)
return data
}
......
client/src/components/Admin/TimeTable.js
View file @ 0b1deeab
import { useState, useEffect } from "react";
import moment from 'moment';
import Calender from "../Calender/Calender.js";
import HorizontalCalender from "../Calender/HorizontalCalender.js";
import timetableApi from "../../apis/timetable.api.js";
import catchErrors from "../../utils/catchErrors.js";
import styles from "./admin.module.scss";
const TimeTable = () => {
const [selectDate, setSelectDate] = useState(moment().format('YYYY-MM-DD'))
......@@ -23,10 +24,10 @@ const TimeTable = () => {
}
}
async function deleteTime() {
async function deleteTime(timeId) {
try {
setError("")
await timetableApi.remove()
await timetableApi.remove(timeId)
alert('해당 상영시간표 정보를 성공적으로 삭제하였습니다.')
getTimeTable(selectDate)
} catch (error) {
......@@ -35,24 +36,22 @@ const TimeTable = () => {
}
return (
<div className="col-12 col-lg-6">
{console.log("list==", timeList)}
<Calender selectDate={selectDate} setSelectDate={setSelectDate} />
<div className="col-12 col-lg-6 ms-lg-1 mb-5">
<HorizontalCalender selectDate={selectDate} setSelectDate={setSelectDate} />
{timeList.length !== 0 ?
timeList.map(el => <>
<h5>{el.theaterName} 관</h5>
{/* {arr = el.timetable.map(time => <div className="card">
<div className="card-body">{moment(time.start_time, 'hh:mm')} ~ {moment(time.end_time, 'hh:mm')}</div>
</div>
)
} */}
{/* {el.timetable.map(time => {
if (el.id === time.id) return <div className="card">
<div className="card-body">{moment(time.start_time, 'hh:mm')} ~ {moment(time.end_time, 'hh:mm')}</div>
</div>
})} */}
</>)
: <></>}
timeList.map(el => <div className="mt-4">
<h5 className="mb-0">{el.theaterName} 관 / <p className="d-inline fs-6 mb-0">{el.theatertype.theaterTypeName}</p></h5>
{el.timetable.map(time => <div className="d-inline-flex flex-column m-2">
<div className="d-flex justify-content-end">
<button type="button" className={`btn btn-dark btn-sm ${styles.customBtn}`} onClick={() => deleteTime(time.id)}>X</button>
</div>
<div className="card">
<div className="card-body py-1">{moment(time.start_time).format('HH:mm')} ~ {moment(time.end_time).format('HH:mm')}</div>
<div className="card-footer text-center py-1">{time.title}</div>
</div>
</div>)}
</div>)
: <p className="text-center mt-5 mb-0">서버에 저장되어 있는 상영시간표가 존재하지 않습니다.<br />아래의 양식을 작성해 새로운 상영시간표를 등록해주세요.</p>}
</div>
)
}
......
client/src/components/Admin/TimeTableEditForm.js
View file @ 0b1deeab
......@@ -75,7 +75,7 @@ const TimeTableEditForm = () => {
const { list } = showTimes
const isSelect = Object.values(selectInfo).every((el) => Boolean(el))
if (isSelect) {
const isTime = list.find(el => el.theaterTypeId === selectInfo.theater && (getDate(el.start) <= getDate(selectInfo.start) && getDate(selectInfo.start) <= getDate(el.end)) || (getDate(el.start) > getDate(selectInfo.start) && getDate(el.start) <= getDate(selectInfo.end)))
const isTime = list.find(el => (el.theaterTypeId === selectInfo.theater) && ((getDate(el.start) <= getDate(selectInfo.start) && getDate(selectInfo.start) <= getDate(el.end)) || (getDate(el.start) > getDate(selectInfo.start) && getDate(el.start) <= getDate(selectInfo.end))))
if (isTime) alert('이미 추가한 상영시간대입니다. 다른 시간대를 골라주시기 바랍니다.')
else {
const theater = theaterList.find(theater => theater.theatertypeId === selectInfo.theater)
......@@ -146,7 +146,8 @@ const TimeTableEditForm = () => {
}
return (
<form className="col-12 col-lg-6" onSubmit={handleSubmit}>
<form className="col-12 col-lg-6 me-lg-1" onSubmit={handleSubmit}>
<h5 className={`border-top border-dark border-2 pt-3 mb-3 ${styles.borderLg}`}>상영시간표 등록</h5>
<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) => {
......
client/src/components/Admin/admin.module.scss
View file @ 0b1deeab
......@@ -44,6 +44,12 @@
}
}
@media screen and (min-width: 992px) {
.borderLg {
border: 0 !important;
}
}
.selectInput {
& option[disabled] {
color: #000;
......
client/src/components/Calender/Calender.js → client/src/components/Calender/HorizontalCalender.js
View file @ 0b1deeab
......@@ -18,25 +18,24 @@ const Calender = ({ selectDate, setSelectDate }) => {
dateArr.push({ date: lastWeek.format('YYYY-MM-DD'), day: lastWeek.format('d') })
lastWeek.add(1, 'days')
}
console.log("arr=", dateArr)
console.log("same==", moment(oneDay).isSame('2021-08-07'))
const resultArr = dateArr.map(el => <div onClick={() => setSelectDate(el.date)}>
{moment(el.date).isSame(oneDay) || el.date.split('-')[2] === "01" ? <strong>{moment(el.date).format('YYYY.MM')}</strong> : ""}
<div>
<strong>{moment(el.date).format('DD')}</strong>
<em>{moment(el.date).isSame(oneDay) ? "오늘" : week[el.day]}</em>
const resultArr = dateArr.map(el => <div className="col-2 align-self-end text-center" onClick={() => setSelectDate(el.date)}>
{moment(el.date).isSame(oneDay) || el.date.split('-')[2] === "01" ? <strong className={styles.yearmonth}>{moment(el.date).format('YYYY.MM')}</strong> : ""}
<div className={"d-flex flex-column " + ((Number(el.day) === 0 || Number(el.day) === 6) ? ((Number(el.day) === 0) ? "text-danger" : "text-primary") : "")}>
<strong className={moment(el.date).isSame(oneDay) ? styles.selectDate : ""}>{moment(el.date).format('DD')}</strong>
<strong>{moment(el.date).isSame(oneDay) ? "오늘" : week[el.day]}</strong>
</div>
</div>)
setDateList(resultArr)
}
return (
<>
<>
{console.log("date==", selectDate)}
<div>
<i className="bi bi-chevron-left"></i>
{dateList.map(el => el)}
<i className="bi bi-chevron-right"></i>
<div className="d-flex position-relative border-bottom border-dark border-2 p-3">
<i className={`bi bi-calendar2 position-absolute top-0 ${styles.calender}`}></i>
<i className="col-1 bi bi-chevron-left align-self-center text-center"></i>
<div className={`d-flex col-10 ${styles.box}`}>{dateList.map(el => el)}</div>
<i className="col-1 bi bi-chevron-right align-self-center text-center"></i>
</div>
</>
)
......
client/src/components/Calender/calender.module.scss
View file @ 0b1deeab
.box {
overflow: hidden;
& .yearmonth {
position: relative;
top: 0;
width: 100%;
font-size: 10px;
}
& .selectDate {
background-color: #000;
color: #fff;
border-radius: 50%;
}
}
.calender {
right: 13px;
font-size: 1.5em;
}
\ No newline at end of file
server/controllers/timetable.controller.js
View file @ 0b1deeab
import { TimeTable, Theater } from "../db/index.js";
import { TimeTable, Theater, TheaterType } from "../db/index.js";
import moment from 'moment';
import sequelize from 'sequelize'
const { Op } = sequelize
......@@ -8,21 +8,18 @@ const getAll = async (req, res) => {
const { when } = req.query
const selectDate = new Date(when)
const theaterArr = []
// const timeTableArr = []
const findAll = await TimeTable.findAll({ where: { date: selectDate }, attributes: { exclude: ['createdAt', 'updatedAt'] }, order: [["theater", "ASC"], ["start_time", "ASC"]] })
findAll.forEach(element => {
if (!theaterArr.includes(element.theater)) theaterArr.push(element.theater)
})
const findTheater = await Theater.findAll({ where: { id: theaterArr }, attributes: { exclude: ['createdAt', 'updatedAt'] }, order: [['theaterName']] })
const findTheater = await Theater.findAll({ where: { id: theaterArr }, attributes: { exclude: ['createdAt', 'updatedAt'] }, include: [TheaterType], order: [['theaterName']] })
findTheater.forEach(el => {
const arr = findAll.filter(timetable => {
if (el.id === timetable.theater) return timetable.dataValues
})
el.dataValues.timetable = arr
// timeTableArr.push({ id: el.id, info: arr })
})
return res.json(findTheater)
// return res.json({findTheater, timeTableArr})
} catch (error) {
return res.status(500).send(error.message || "상영시간표 정보 가져오는 중 에러 발생")
}
......@@ -85,7 +82,7 @@ const getTime = (string, runtime = 0) => {
const remove = async (req, res) => {
try {
const { timeId } = req.params
const delNum = await TimeTable.destroy({ where: {} })
const delNum = await TimeTable.destroy({ where: { id: timeId } })
if (delNum) res.json(delNum)
else throw new Error("해당 정보를 서버에서 삭제하는데 실패했습니다.")
} catch (error) {
......
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