From e4119e0e3bf501d98812a41164b2adf6efd8aabb Mon Sep 17 00:00:00 2001 From: ksbin1025 Date: Wed, 3 Nov 2021 05:04:19 +0900 Subject: [PATCH] =?UTF-8?q?KUSchedule=20=EB=93=B1=EB=A1=9D,=EC=88=98?= =?UTF-8?q?=EC=A0=95,=EC=82=AD=EC=A0=9C=20=EA=B8=B0=EB=8A=A5=20=EC=99=84?= =?UTF-8?q?=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/App.js | 2 +- client/src/apis/schedule.api.js | 36 ++++++- client/src/components/AdminScheduleItem.js | 23 ++-- client/src/components/Buttons/BtnGroup.js | 4 +- client/src/components/Form/ScheduleForm.js | 42 +++++--- client/src/components/Modal/ScheduleModal.js | 36 ++++++- server/controllers/ku.controller.js | 107 ++++++++++++++++++- server/models/ku.model.js | 3 +- server/models/schedule.model.js | 6 +- server/routes/schedule.route.js | 1 + 10 files changed, 223 insertions(+), 37 deletions(-) diff --git a/client/src/App.js b/client/src/App.js index d7dead8..948b7f6 100644 --- a/client/src/App.js +++ b/client/src/App.js @@ -30,7 +30,7 @@ function App() { - + {/* */} diff --git a/client/src/apis/schedule.api.js b/client/src/apis/schedule.api.js index b516e7c..655cdb5 100644 --- a/client/src/apis/schedule.api.js +++ b/client/src/apis/schedule.api.js @@ -1,13 +1,43 @@ import axios from "axios"; import baseUrl from "../utils/baseUrl.js"; -const submit = async (sendData) => { - const { data } = await axios.post(`${baseUrl}/`, sendData); +const getOne = async (id, userId = "ku") => { + const { data } = await axios.get(`${baseUrl}/api/schedule/${userId}?scheduleId=${id}`); + return data +} + +const getbyMonth = async (date, userId = "ku") => { + const { data } = await axios.get(`${baseUrl}/api/schedule/${userId}?date=${date}`); + return data +} + +const getbyDate = async (date, userId = "ku") => { + const { data } = await axios.get(`${baseUrl}/api/schedule/${userId}?date=${date}`); + return data +} + +const submit = async (schedule, userId = "ku") => { + const { data } = await axios.post(`${baseUrl}/api/schedule/${userId}`, schedule); + return data +} + +const edit = async (id, schedule, userId = "ku") => { + const { data } = await axios.put(`${baseUrl}/api/schedule/${userId}?scheduleId=${id}`, schedule); + return data +} + +const remove = async (id, userId = "ku") => { + const { data } = await axios.delete(`${baseUrl}/api/schedule/${userId}?scheduleId=${id}`); return data } const scheduleApi = { - submit + getOne, + getbyMonth, + getbyDate, + submit, + edit, + remove } export default scheduleApi \ No newline at end of file diff --git a/client/src/components/AdminScheduleItem.js b/client/src/components/AdminScheduleItem.js index 561babf..87cb0ae 100644 --- a/client/src/components/AdminScheduleItem.js +++ b/client/src/components/AdminScheduleItem.js @@ -1,20 +1,23 @@ import { Link } from "react-router-dom"; import styles from "./Schedule/schedule.module.scss"; -const AdminScheduleItem = ({}) => { +const AdminScheduleItem = ({ schedule, handleClick }) => { + return (
- -
-
-

sadsad

-
- - + +
+
+

{schedule.title}

+
+ + handleClick(schedule.id)}>
-

2020~353543135

-
sadsds adsdsadsdsad sdsadsdsadsdsadsdsadsdsadsdsadsdsadsd
+

+ {(schedule.start === schedule.end) ? schedule.start : schedule.start + "~" + schedule.end} +

+
{schedule.memo}
) diff --git a/client/src/components/Buttons/BtnGroup.js b/client/src/components/Buttons/BtnGroup.js index 8c2cbe9..29fd12d 100644 --- a/client/src/components/Buttons/BtnGroup.js +++ b/client/src/components/Buttons/BtnGroup.js @@ -1,13 +1,13 @@ import { useHistory } from "react-router-dom"; import styles from "./buttons.module.scss"; -const BtnGroup = ({ disabled, handleSubmit }) => { +const BtnGroup = ({ text, disabled, handleSubmit }) => { const history = useHistory(); return (
- +
) } diff --git a/client/src/components/Form/ScheduleForm.js b/client/src/components/Form/ScheduleForm.js index bbed623..cec09dd 100644 --- a/client/src/components/Form/ScheduleForm.js +++ b/client/src/components/Form/ScheduleForm.js @@ -1,12 +1,11 @@ import { useState, useEffect } from "react"; -import { Redirect, useLocation } from "react-router-dom"; +import { Redirect, useParams } from "react-router-dom"; import BtnGroup from "../Buttons/BtnGroup.js"; -import scheduleApi from "../../apis/schedule.api.js"; +import scheduleApi from "../../apis/schedule.api"; import catchErrors from "../../utils/catchErrors.js"; import styles from "./form.module.scss"; const ScheduleForm = () => { - const location = useLocation() const [schedule, setSchedule] = useState({ title: "", startDate: "", @@ -20,6 +19,11 @@ const ScheduleForm = () => { const [disabled, setDisabled] = useState(true) const [success, setSuccess] = useState(false) const [error, setError] = useState("") + const { scheduleId } = useParams() + + useEffect(() => { + if (scheduleId) getOne(scheduleId) + }, []) useEffect(() => { let isMounted = true; @@ -40,6 +44,16 @@ const ScheduleForm = () => { }; }, [schedule]) + async function getOne(id) { + try { + setError("") + const resSchedule = await scheduleApi.getOne(id) + setSchedule({ ...schedule, ...resSchedule }) + } catch (error) { + catchErrors(error, setError) + } + } + function handleChange(e) { const { name, value } = e.target if (name === "allDay") { @@ -55,8 +69,14 @@ const ScheduleForm = () => { e.preventDefault() try { setError("") - if (schedule.allDay === "on") setSchedule({ ...schedule, startTime: '00:00', endTime: '23:59' }) - await scheduleApi.submit() + if (scheduleId) { + await scheduleApi.edit(scheduleId, schedule) + alert('해당 일정이 성공적으로 수정되었습니다.') + } + else { + await scheduleApi.submit(schedule) + alert('해당 일정이 성공적으로 등록되었습니다.') + } setSuccess(true) } catch (error) { catchErrors(error, setError) @@ -64,20 +84,18 @@ const ScheduleForm = () => { } if (success) { - alert('해당 일정이 성공적으로 등록되었습니다.') return } return ( -
- {console.log("data==",)} +
- +
- +
@@ -105,10 +123,10 @@ const ScheduleForm = () => {
- +
- + ) } diff --git a/client/src/components/Modal/ScheduleModal.js b/client/src/components/Modal/ScheduleModal.js index a39e254..112d82a 100644 --- a/client/src/components/Modal/ScheduleModal.js +++ b/client/src/components/Modal/ScheduleModal.js @@ -1,8 +1,39 @@ +import { useState, useEffect } from "react"; import Item from "../AdminScheduleItem.js"; +import scheduleApi from "../../apis/schedule.api"; +import catchErrors from "../../utils/catchErrors.js"; import moment from 'moment'; import styles from "./modal.module.scss"; const ScheduleModal = ({ dateShow, setDateShow }) => { + const [scheduleList, setScheduleList] = useState([]) + const [error, setError] = useState("") + + useEffect(() => { + if (dateShow.show) getSchedule() + }, [dateShow]) + + async function getSchedule() { + try { + setError("") + const resList = await scheduleApi.getbyDate(dateShow.date) + setScheduleList(resList) + } catch (error) { + catchErrors(error, setError) + } + } + + async function delSchedule(id) { + try { + setError("") + await scheduleApi.remove(id) + alert("해당 일정을 삭제했습니다.") + getSchedule() + } catch (error) { + catchErrors(error, setError) + } + } + return ( <> {dateShow.show ?
: null} @@ -14,8 +45,9 @@ const ScheduleModal = ({ dateShow, setDateShow }) => {
- -

선택한 날짜에 일정이 없습니다.

+ {scheduleList.length !== 0 ? + scheduleList.map((schedule, idx) => ) + :

선택한 날짜에 일정이 없습니다.

}
diff --git a/server/controllers/ku.controller.js b/server/controllers/ku.controller.js index 7ac6b81..20d41cc 100644 --- a/server/controllers/ku.controller.js +++ b/server/controllers/ku.controller.js @@ -1,8 +1,66 @@ import { KU } from "../db/index.js"; +import sequelize from 'sequelize'; -const create = async (req, res) => { +const { Op } = sequelize + +const findbyId = async (req, res, next) => { + try { + const id = req.scheduleId + if (id) { + const findSchedule = await KU.findOne({ where: { id: id } }) + if (!findSchedule) throw new Error("해당 일정을 찾지 못했습니다.") + else { + const { title, start, end, memo } = findSchedule + const startDate = dateToString(start, "full") + const endDate = dateToString(end, "full") + req.schedule = { title, startDate: startDate, endDate: endDate, memo } + } + next() + } else next() + } catch (error) { + return res.status(500).send(error.message || "일정 가져오는 중 에러 발생") + } +} + +const findbyDate = async (req, res, next) => { try { + if (req.date) { + const date = new Date(req.date) + const findList = await KU.findAll({ + where: { + [Op.and]: [ + { + start: { + [Op.lte]: date + } + }, { + end: { + [Op.gte]: date + } + } + ] + }, + order: [['updatedAt', 'DESC']] + }) + findList.forEach(schedule => { + schedule.dataValues.start = dateToString(schedule.start, "twoYear") + schedule.dataValues.end = dateToString(schedule.end, "twoYear") + }) + req.scheduleList = findList + next() + } else next() + } catch (error) { + return res.status(500).send(error.message || "일정 가져오는 중 에러 발생") + } +} +const create = async (req, res) => { + try { + const { title, startDate, endDate, memo } = req.body + const start = new Date(startDate) + const end = new Date(endDate) + const newSchedule = await KU.create({ title: title, start: start, end: end, memo: memo }) + return res.json(newSchedule) } catch (error) { return res.status(500).send(error.message || "일정 등록 중 에러 발생") } @@ -10,7 +68,11 @@ const create = async (req, res) => { const edit = async (req, res) => { try { - + const { scheduleId } = req.query + const { title, startDate, endDate, memo } = req.body + const updated = await KU.update({ title: title, start: startDate, end: endDate, memo: memo }, { where: { id: scheduleId } }) + if (!updated) throw new Error("해당 일정의 일부 정보를 수정하는데 실패하였습니다.") + else return res.send(200) } catch (error) { return res.status(500).send(error.message || "일정 수정 중 에러 발생") } @@ -18,14 +80,51 @@ const edit = async (req, res) => { const remove = async (req, res) => { try { - + const { scheduleId } = req.query + const deleted = await KU.destroy({ where: { id: scheduleId } }) + if (!deleted) throw new Error("해당 일정을 삭제하는데 실패하였습니다.") + else return res.send(200) } catch (error) { return res.status(500).send(error.message || "일정 삭제 중 에러 발생") } } +const querySeparation = async (req, res, next) => { + try { + const { scheduleId, date } = req.query + req.scheduleId = scheduleId + req.date = date + next() + } catch (error) { + return res.status(500).send(error.message || "일정 가져오는 중 에러 발생") + } +} + +const send = async (req, res) => { + try { + const result = req.schedule || req.scheduleList + return res.json(result) + } catch (error) { + return res.status(500).send(error.message || "일정 가져오는 중 에러 발생") + } +} + +function dateToString(dateObj, method) { + const year = dateObj.getFullYear() + const year_disit = String(year).substring(2, 4) + const month = dateObj.getMonth() + 1 + const date = dateObj.getDate() + + if (method === "full") return [year, (month > 9 ? "" : "0") + month, (date > 9 ? "" : "0") + date].join("-") + else if (method === "twoYear") return [year_disit, (month > 9 ? "" : "0") + month, (date > 9 ? "" : "0") + date].join("-") +} + export default { + findbyId, + findbyDate, create, edit, - remove + remove, + querySeparation, + send } \ No newline at end of file diff --git a/server/models/ku.model.js b/server/models/ku.model.js index d9a7093..49ed535 100644 --- a/server/models/ku.model.js +++ b/server/models/ku.model.js @@ -23,7 +23,8 @@ const KUModel = (sequelize) => { type: DataTypes.DATE }, memo: { - type: DataTypes.TEXT + type: DataTypes.TEXT, + defaultValue: "" } }, { diff --git a/server/models/schedule.model.js b/server/models/schedule.model.js index 7fea6c0..91362df 100644 --- a/server/models/schedule.model.js +++ b/server/models/schedule.model.js @@ -23,10 +23,12 @@ const ScheduleModel = (sequelize) => { type: DataTypes.DATE }, location: { - type:DataTypes.STRING + type:DataTypes.STRING, + defaultValue: "" }, memo: { - type: DataTypes.TEXT + type: DataTypes.TEXT, + defaultValue: "" } }, { diff --git a/server/routes/schedule.route.js b/server/routes/schedule.route.js index 8dedeaa..b260299 100644 --- a/server/routes/schedule.route.js +++ b/server/routes/schedule.route.js @@ -6,6 +6,7 @@ const router = express.Router(); router .route("/ku") + .get(kuCtrl.querySeparation, kuCtrl.findbyId, kuCtrl.findbyDate, kuCtrl.send) .post(kuCtrl.create) .put(kuCtrl.edit) .delete(kuCtrl.remove) -- GitLab