Skip to content

GitLab

Commit 6a504a36 authored by Kim, Subin's avatar Kim, Subin
Browse files

Schedule client 및 server 완성

parent 411e53a3
Show whitespace changes
Inline Side-by-side
client/src/components/AdminScheduleItem.js
View file @ 6a504a36
......@@ -9,13 +9,13 @@ const AdminScheduleItem = ({ schedule, handleClick }) => {
<div className="col-11">
<div className="d-flex">
<h3 className="col-10 rows-cols-2">{schedule.title}</h3>
<div className="d-flex col-2 fs-5">
<div className={`d-flex col-2 fs-5 ${styles.cursor}`}>
<Link to={`/admin/edit/${schedule.id}`}><i className="bi bi-pencil-square text-dark me-2" data-bs-dismiss="modal"></i></Link>
<i className="bi bi-trash" onClick={() => handleClick(schedule.id)}></i>
</div>
</div>
<p className="text-start text-secondary mb-2">
{(schedule.start === schedule.end) ? schedule.start : schedule.start + "~" + schedule.end}
{(schedule.start === schedule.end) ? schedule.start : schedule.start + " ~ " + schedule.end}
</p>
<div className={`text-start ${styles.textBox}`}>{schedule.memo}</div>
</div>
......
client/src/components/Calendar/AdminMonthly.js
View file @ 6a504a36
......@@ -28,12 +28,12 @@ const AdminMonthly = () => {
}
})
// useEffect(() => {
// getAll()
// return () => {
// getAll()
// }
// }, [])
useEffect(() => {
getAll()
return () => {
getAll()
}
}, [dateShow.show])
useEffect(() => {
if (calenIconRef && calenIconRef.current) {
......@@ -60,6 +60,7 @@ const AdminMonthly = () => {
}, [changeDate])
useEffect(() => {
calendar.removeAllEvents()
calendar.addEventSource(scheduleList)
}, [scheduleList])
......@@ -75,7 +76,6 @@ const AdminMonthly = () => {
return (
<>
{console.log("list==", scheduleList)}
<div ref={calenIconRef} className="position-absolute" style={{ top: "7px", left: "7px" }}>
<CalendarBtn date={moment(initialDate).format('DD')} />
</div>
......@@ -128,7 +128,6 @@ const AdminMonthly = () => {
}}
timeZone="local"
events={scheduleList, { color: 'crimson' }}
eventLimit="3"
themeSystem='bootstrap'
height='78vh'
/>
......
client/src/components/Calendar/Monthly.js
View file @ 6a504a36
......@@ -14,7 +14,6 @@ import '@fortawesome/fontawesome-free/css/all.css';
const Monthly = () => {
const { user } = useAuth()
console.log("msds==",user)
const [initialDate, setInitialDate] = useState(moment().format('YYYY-MM-DD'))
const [changeDate, setChangeDate] = useState(moment().format('YYYY-MM-DD'))
const [show, setShow] = useState(false)
......@@ -56,15 +55,15 @@ const Monthly = () => {
}, [changeDate])
useEffect(() => {
calendar.removeAllEvents()
calendar.addEventSource(scheduleList)
}, [scheduleList])
async function getAll() {
try {
setError("")
console.log("home user",user)
const resList = await scheduleApi.getbyMonth(changeDate, user.id)
setScheduleList(resList)
const { KU, individual } = await scheduleApi.getbyMonth(changeDate, user.id)
setScheduleList([...KU, ...individual])
} catch (error) {
catchErrors(error, setError)
}
......@@ -72,7 +71,6 @@ const Monthly = () => {
return (
<>
{console.log("user scheduleList==",scheduleList)}
<div ref={calenIconRef} className="position-absolute" style={{ top: "9px", right: "8px" }}>
<CalendarBtn date={moment(initialDate).format('DD')} />
</div>
......
client/src/components/Form/ScheduleForm.js
View file @ 6a504a36
......@@ -49,7 +49,9 @@ const ScheduleForm = () => {
async function getOne(id) {
try {
setError("")
const resSchedule = await scheduleApi.getOne(id, user.id)
let resSchedule = null
if (user.role === "admin") resSchedule = await scheduleApi.getOne(id)
else resSchedule = await scheduleApi.getOne(id, user.id)
setSchedule({ ...schedule, ...resSchedule })
} catch (error) {
catchErrors(error, setError)
......@@ -72,11 +74,13 @@ const ScheduleForm = () => {
try {
setError("")
if (scheduleId) {
await scheduleApi.edit(scheduleId, schedule, user.id)
if (user.role === "admin") await scheduleApi.edit(scheduleId, schedule)
else await scheduleApi.edit(scheduleId, schedule, user.id)
alert('해당 일정이 성공적으로 수정되었습니다.')
}
else {
await scheduleApi.submit(schedule, user.id)
if (user.role === "admin") await scheduleApi.submit(schedule)
else await scheduleApi.submit(schedule, user.id)
alert('해당 일정이 성공적으로 등록되었습니다.')
}
setSuccess(true)
......@@ -101,7 +105,7 @@ const ScheduleForm = () => {
<input className={`form-control shadow-none ${styles.dateInput}`} type="date" name="startDate" value={schedule.startDate} aria-label="startDate" onChange={handleChange} />
</div>
<div className={"col-5 " + ((user.role === "admin" || schedule.allDay === "on") ? "d-none" : "d-block")}>
<input className={`form-control shadow-none ${styles.dateInput}`} type="time" name="startTime" aria-label="startTime" onChange={handleChange} />
<input className={`form-control shadow-none ${styles.dateInput}`} type="time" name="startTime" value={schedule.startTime} aria-label="startTime" onChange={handleChange} />
</div>
</div>
<div className={"d-flex " + (user.role === "admin" ? "mb-5" : "mb-3")}>
......@@ -116,11 +120,11 @@ const ScheduleForm = () => {
<div className={"d-flex justify-content-end form-check mb-4 " + (user.role === "admin" ? "d-none" : "d-block")}>
<input className={`form-check-input shadow-none ${styles.checkBox}`} type="checkbox" id="allDay" name="allDay" onChange={handleChange} checked={schedule.allDay === "on" ? true : false} />
<label className="form-check-label ms-2" htmlFor="allDay">하루 종일</label>
</div>52
</div>
<div className={"d-flex justify-content-between align-items-center mb-4 " + (user.role === "admin" ? "d-none" : "d-block")}>
<i className="col bi bi-geo-alt fs-3"></i>
<div className="col-10">
<input className={`form-control shadow-none rounded-0 px-1 ${styles.textInput}`} type="text" name="location" placeholder="장소" aria-label="location" onChange={handleChange} />
<input className={`form-control shadow-none rounded-0 px-1 ${styles.textInput}`} type="text" name="location" value={schedule.location} placeholder="장소" aria-label="location" onChange={handleChange} />
</div>
</div>
<div className="d-flex justify-content-between mb-5">
......
client/src/components/Schedule/KUSchedule.js
View file @ 6a504a36
......@@ -8,7 +8,7 @@ const KUSchedule = ({ schedule }) => {
</div>
<div className="card-body text-center pb-2">
{schedule.title.length > 12 ? <marquee className={`card-title fs-5 ${styles.flowText}`} loop="infinite">{schedule.title}</marquee> : <h5 className="card-title">{schedule.title}</h5>}
<p className="card-text text-secondary mb-1">{(schedule.start === schedule.end) ? schedule.start : schedule.start + "~" + schedule.end}</p>
<p className="card-text text-secondary mb-1">{(schedule.start === schedule.end) ? schedule.start : schedule.start + " ~ " + schedule.end}</p>
<p className="text-start mb-0">{schedule.memo}</p>
</div>
</div>
......
client/src/components/Schedule/ScheduleCarousel.js
View file @ 6a504a36
......@@ -11,16 +11,6 @@ const ScheduleCarousel = () => {
useEffect(() => {
getSchedule(date)
return () => {
getSchedule(date)
}
}, [])
useEffect(() => {
getSchedule(date)
return () => {
getSchedule(date)
}
}, [date])
async function getSchedule(date) {
......@@ -38,7 +28,7 @@ const ScheduleCarousel = () => {
<div className="carousel-inner">
{scheduleList.length !== 0 ?
scheduleList.map((schedule, idx) =>
<div className={"carousel-item" + (idx === 0 ? " active" : "")}>
<div key={idx} className={"carousel-item" + (idx === 0 ? " active" : "")}>
<KU key={idx} schedule={schedule} />
</div>) : null}
</div>
......
client/src/components/Schedule/ScheduleItem.js
View file @ 6a504a36
import { Link } from "react-router-dom";
import styles from "./schedule.module.scss";
const ScheduleItem = ({ schedule, handleClick }) => {
const ScheduleItem = ({ index, curDate, schedule, handleClick }) => {
return (
<div className="accordion-item border-bottom-0">
<button className={`d-flex flex-column align-items-start accordion-button collapsed bg-white shadow-none px-0 ${styles.activeBtn}`} type="button" data-bs-toggle="collapse" data-bs-target={schedule.id} aria-expanded="false" aria-controls={schedule.id}>
<h5 className={`accordion-header ${styles.title}`} id={"heading" + schedule.id}>{schedule.title}</h5>
<p className={`text-secondary mb-0 ${styles.time}`}>sadsadsdsadsadsaf</p>
<p className={`mb-0 ${styles.period}`}>2021.01.151 ~ 2021.09.35</p>
<button className={`d-flex flex-column align-items-start accordion-button collapsed bg-white shadow-none px-0 ${styles.activeBtn}`} type="button" data-bs-toggle="collapse" data-bs-target={"#collapse" + index} aria-expanded="false" aria-controls={"collapse" + index}>
<h5 className={`accordion-header ${styles.title}`} id={"heading" + index}>{schedule.title}</h5>
<p className={`text-secondary mb-0 ${styles.time}`}>
{(schedule.allDay) ? "하루 종일" : (curDate === schedule.startDate ? schedule.startTime + " ~" : (curDate === schedule.endDate ? "~ " + schedule.endTime : "하루 종일"))}
</p>
<p className={`mb-0 ${styles.period}`}>
{schedule.allDay ? schedule.startDate + " ~ " + schedule.endDate : schedule.startDate + " " + schedule.startTime + " ~ " + schedule.endDate + " " + schedule.endTime}
</p>
</button>
<div id={schedule.id} className="accordion-collapse collapse" aria-labelledby={"heading" + schedule.id} data-bs-parent="#scheduleList">
<div id={"collapse" + index} className="accordion-collapse collapse" aria-labelledby={"heading" + index} data-bs-parent="#scheduleList">
<div className={`accordion-body px-0 pt-2 pb-0 mb-3 ${styles.textBox}`}>
{schedule.location ? <div className="d-flex align-items-start">
<i className="col bi bi-geo-alt fs-5"></i>
......@@ -19,7 +22,7 @@ const ScheduleItem = ({ schedule, handleClick }) => {
{schedule.memo}
<div className="d-flex justify-content-end mt-3">
<Link className="btn btn-light btn-sm border-dark" to={`/schedule/edit/${schedule.id}`}>수정</Link>
<button type="button" className="btn btn-crimson btn-sm ms-2" onClick={handleClick}>삭제</button>
<button type="button" className="btn btn-crimson btn-sm ms-2" onClick={() => handleClick(schedule.id)}>삭제</button>
</div>
</div>
</div>
......
client/src/components/Schedule/ScheduleList.js
View file @ 6a504a36
......@@ -4,6 +4,7 @@ import Item from "./ScheduleItem";
import scheduleApi from "../../apis/schedule.api";
import { useAuth } from "../../utils/context";
import catchErrors from "../../utils/catchErrors";
import moment from 'moment';
import styles from "./schedule.module.scss";
const ScheduleList = () => {
......@@ -14,16 +15,6 @@ const ScheduleList = () => {
useEffect(() => {
getAll(date)
return () => {
getAll(date)
}
}, [])
useEffect(() => {
getAll(date)
return () => {
getAll(date)
}
}, [date])
async function getAll(date) {
......@@ -51,8 +42,8 @@ const ScheduleList = () => {
<div className={styles.list}>
<div className="accordion accordion-flush" id="scheduleList">
{scheduleList.length !== 0 ?
scheduleList.map((schedule, idx) => <Item key={idx} schedule={schedule} handleClick={delSchedule} />)
: <div className="text-center text-secondary">오늘 등록된 일정이 없습니다.</div>}
scheduleList.map((schedule, idx) => <Item key={idx} index={idx} curDate={moment(date).format("YY.MM.DD")} schedule={schedule} handleClick={delSchedule} />)
: <div className="text-center text-secondary mt-2">오늘 등록된 일정이 없습니다.</div>}
</div>
</div>
)
......
client/src/components/Schedule/schedule.module.scss
View file @ 6a504a36
......@@ -72,3 +72,7 @@
.flowText {
font-family: "Plex-Bold";
}
.cursor {
cursor: pointer;
}
\ No newline at end of file
client/src/utils/context.js
View file @ 6a504a36
......@@ -23,11 +23,11 @@ const AuthProvider = ({ children }) => {
console.log("context getUser")
const resUser = await authApi.getUser();
setUser({ ...user, ...resUser })
if (pathname === "/admin" && user.role !== "admin") {
if (resUser.role === "admin") history.push("/admin")
else if (pathname === "/admin" && resUser.role !== "admin") {
await logout()
return <ErrorPage />
} else if (user.role === "admin") history.push("/admin")
else history.push("/home")
} else history.push("/home")
} catch (error) {
catchErrorAuth(error, setError);
}
......@@ -43,6 +43,7 @@ const AuthProvider = ({ children }) => {
const user = await authApi.login(data);
localStorage.setItem("login", true)
setUser(user)
if (user.role === "admin") history.push("/admin")
return true;
} catch (error) {
catchErrors(error, setError);
......
server/config/db.config.js
View file @ 6a504a36
......@@ -4,6 +4,7 @@ const config = {
password: process.env.PG_PASSWORD || 'kuku0725',
database: process.env.PG_DATABASE || 'todayKUDB',
dialect: 'postgres',
timezone: '+09:00',
pool: {
max: 10,
min: 0,
......
server/controllers/schedule.controller.js
View file @ 6a504a36
......@@ -24,12 +24,12 @@ const findbyId = async (req, res, next) => {
findSchedule = await Schedule.findOne({ where: { [Op.and]: [{ id: id }, { userId: userId }] } })
if (!findSchedule) throw new Error("해당 일정을 찾지 못했습니다.")
else {
const { id, title, start, end, location, memo } = findSchedule
const { id, title, start, end, allDay, location, memo } = findSchedule
startDate = dateToString(start, "full")
endDate = dateToString(end, "full")
const startTime = dateToString(start, "time")
const endTime = dateToString(end, "time")
req.schedule = { id, title, startDate, endDate, startTime, endTime, location, memo }
req.schedule = { id, title, startDate, endDate, startTime, endTime, allDay: allDay ? "on" : "off", location, memo }
}
}
next()
......@@ -43,11 +43,20 @@ const findbyDate = async (req, res, next) => {
try {
if (req.date || req.month) {
let date = ""
let startDate = null
let endDate = null
let findList = null
let findKUList = null
let findIndividualList = null
if (req.date) {
// 날짜 기준
date = new Date(req.date)
startDate = new Date(req.date)
startDate.setHours(24, 0, 0, 0)
endDate = new Date(req.date)
endDate.setHours(0, 0, 0, 0)
if (req.userId === "ku") {
findList = await KU.findAll({
findKUList = await KU.findAll({
where: {
[Op.and]: [
{
......@@ -62,32 +71,43 @@ const findbyDate = async (req, res, next) => {
]
}, order: [['updatedAt', 'DESC']]
})
findList.forEach(schedule => {
schedule.dataValues.start = dateToString(schedule.start, "twoYear")
schedule.dataValues.end = dateToString(schedule.end, "twoYear")
findKUList.forEach(schedule => {
schedule.dataValues.start = dateToString(schedule.dataValues.start, "twoYear")
schedule.dataValues.end = dateToString(schedule.dataValues.end, "twoYear")
})
findList = findKUList
} else {
findList = await Schedule.findAll({
findIndividualList = await Schedule.findAll({
where: {
[Op.and]: [
{
start: {
[Op.lte]: date
[Op.lte]: startDate
}
}, {
end: {
[Op.gte]: date
[Op.gte]: endDate
}
}
]
}, order: [['updatedAt', 'DESC']]
})
findIndividualList.forEach(schedule => {
schedule.dataValues.startDate = dateToString(schedule.dataValues.start, "twoYear")
schedule.dataValues.endDate = dateToString(schedule.dataValues.end, "twoYear")
if (!schedule.dataValues.allDay) {
schedule.dataValues.startTime = dateToString(schedule.dataValues.start, "time")
schedule.dataValues.endTime = dateToString(schedule.dataValues.end, "time")
}
})
findList = findIndividualList
}
} else {
// 달 기준
date = new Date(req.month)
const year = dateToString(date, "year")
const month = dateToString(date, "month")
const findKUList = await KU.findAll({
findKUList = await KU.findAll({
where: {
[Op.or]: [
{
......@@ -105,22 +125,17 @@ const findbyDate = async (req, res, next) => {
}, attributes: ['id', 'title', 'start', 'end']
, order: [['start']]
})
if (req.userId === "ku") {
// console.log("list==",findList)
findKUList.forEach(schedule => {
// const find = findList.find(el => {
// if (el.dataValues.start <= schedule.dataValues.start) {
// if (el.dataValues.end >= schedule.dataValues.start) return el
// } else if (el.dataValues.start <= schedule.dataValues.end) return el
// })
// console.log("find==",find.dataValues)
if (dateToString(schedule.start, "full") !== dateToString(schedule.end, "full")) schedule.dataValues.end = schedule.dataValues.end.setDate(schedule.dataValues.end.getDate() + 1)
schedule.dataValues.end.setDate(schedule.dataValues.end.getDate() + 1)
schedule.dataValues.end = dateToString(schedule.dataValues.end, "full")
schedule.dataValues.start = dateToString(schedule.dataValues.start, "full")
schedule.dataValues.allDay = true
schedule.dataValues.className = 'text'
})
if (req.userId === "ku") {
findList = findKUList
} else {
const findIndividualList = await Schedule.findAll({
findIndividualList = await Schedule.findAll({
where: {
[Op.or]: [
{
......@@ -139,6 +154,13 @@ const findbyDate = async (req, res, next) => {
, order: [['start']]
})
console.log("개인 일정 찾기", findIndividualList)
findIndividualList.forEach(schedule => {
schedule.dataValues.end.setDate(schedule.dataValues.end.getDate() + 1)
schedule.dataValues.end = dateToString(schedule.dataValues.end, "full")
schedule.dataValues.start = dateToString(schedule.dataValues.start, "full")
schedule.dataValues.allDay = true
schedule.dataValues.className = 'text'
})
findList = { KU: findKUList, individual: findIndividualList }
}
}
......@@ -155,6 +177,7 @@ const create = async (req, res) => {
let newSchedule = null
let start = null
let end = null
let allDay_v = false
const userId = req.userId
if (userId === "ku") {
const { title, startDate, endDate, memo } = req.body
......@@ -166,11 +189,12 @@ const create = async (req, res) => {
if (allDay === "on") {
start = new Date(startDate)
end = new Date(endDate)
allDay_v = true
} else {
start = new Date(startDate + " " + startTime)
end = new Date(endDate + " " + endTime)
}
newSchedule = await Schedule.create({ title: title, start: start, end: end, location: location, memo: memo, userId: userId })
newSchedule = await Schedule.create({ title: title, start: start, end: end, allDay: allDay_v, location: location, memo: memo, userId: userId })
}
return res.json(newSchedule)
} catch (error) {
......@@ -183,6 +207,7 @@ const edit = async (req, res) => {
let updated = null
let start = null
let end = null
let allDay_v = false
const userId = req.userId
const { scheduleId } = req.query
if (userId === "ku") {
......@@ -195,11 +220,12 @@ const edit = async (req, res) => {
if (allDay === "on") {
start = new Date(startDate)
end = new Date(endDate)
allDay_v = true
} else {
start = new Date(startDate + " " + startTime)
end = new Date(endDate + " " + endTime)
}
updated = await Schedule.update({ title: title, start: start, end: end, location: location, memo: memo },
updated = await Schedule.update({ title: title, start: start, end: end, allDay: allDay_v, location: location, memo: memo },
{ where: { [Op.and]: [{ id: scheduleId }, { userId: userId }] } })
}
if (!updated) throw new Error("해당 일정의 일부 정보를 수정하는데 실패하였습니다.")
......@@ -214,6 +240,7 @@ const remove = async (req, res) => {
let deleted = null
const userId = req.userId
const { scheduleId } = req.query
console.log("scheduleId==",scheduleId)
if (userId === "ku") deleted = await KU.destroy({ where: { id: scheduleId } })
else deleted = await Schedule.destroy({ where: { [Op.and]: [{ id: scheduleId }, { userId: userId }] } })
if (!deleted) throw new Error("해당 일정을 삭제하는데 실패하였습니다.")
......@@ -267,9 +294,7 @@ function dateToString(dateObj, method) {
case "full":
return [year, (month > 9 ? "" : "0") + month, (date > 9 ? "" : "0") + date].join("-")
case "twoYear":
return [year_disit, (month > 9 ? "" : "0") + month, (date > 9 ? "" : "0") + date].join("-")
// case "dateTime":
// return [year, (month > 9 ? "" : "0") + month, (date > 9 ? "" : "0") + date, ].join("-")
return [year_disit, (month > 9 ? "" : "0") + month, (date > 9 ? "" : "0") + date].join(".")
case "time":
return [(hour > 9 ? "" : "0") + hour, (minute > 9 ? "" : "0") + minute].join(":")
case "year":
......
server/db/index.js
View file @ 6a504a36
......@@ -14,6 +14,7 @@ const sequelize = new Sequelize(
{
host: dbConfig.host,
dialect: dbConfig.dialect,
timezone: dbConfig.timezone,
pool: {
max: dbConfig.pool?.max,
min: dbConfig.pool?.min,
......
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