From d4e20debb5d385b74a9e16ef08866a6b51e73c68 Mon Sep 17 00:00:00 2001
From: "rnjsals0905@gmail.com" <rnjsals0905@ajou.ac.kr>
Date: Fri, 1 Dec 2023 15:56:33 +0900
Subject: [PATCH] =?UTF-8?q?[ADD]=20UserTimeInfo=20=ED=99=94=EB=A9=B4=20?=
=?UTF-8?q?=EA=B7=B8=EB=A6=AC=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../src/components/CalendarWeek2.jsx | 22 ++++----
.../src/components/HomeParticipateForm.js | 51 +++++++++++++++++--
.../src/components/MeetingInfoForm.js | 2 +-
react-whenMeet/src/routes/UserTimeInfo.js | 51 ++++++++++---------
4 files changed, 86 insertions(+), 40 deletions(-)
diff --git a/react-whenMeet/src/components/CalendarWeek2.jsx b/react-whenMeet/src/components/CalendarWeek2.jsx
index 7fd0474..401f77d 100644
--- a/react-whenMeet/src/components/CalendarWeek2.jsx
+++ b/react-whenMeet/src/components/CalendarWeek2.jsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react"
+import React, { useEffect, useState } from "react"
import '../styles/Calendar.css'
import MakeDay2 from "./MakeDay2";
import TableCell from "./TableCell";
@@ -67,7 +67,7 @@ function CaculateWeek({ nowYear, nowMonth, week, availableTimes, setAvailableTim
for(let j = 0; j < 7; j++){
const d = (week - 1) * 7 + j - firstDay+1;
- const newDate = new Date(nowYear, nowMonth-1, d);
+ const newDate = new Date(nowYear, nowMonth-1, d,9);
if(i===0){
let cn = "cella";
@@ -76,7 +76,6 @@ function CaculateWeek({ nowYear, nowMonth, week, availableTimes, setAvailableTim
weekArr.push(<td className={cn}>{newDate.getDate()}</td>);
}
- // console.log(newDate, startDate, endDate);
if(newDate < startDate || newDate > endDate){
forSelect.push(
<TableCell k={newDate - 0 + i} cn={"noDate"} newDate={newDate} i={i}/>
@@ -111,12 +110,11 @@ function CaculateWeek({ nowYear, nowMonth, week, availableTimes, setAvailableTim
function CalendarWeek2({ availableTimes, setAvailableTimes, isContain, startDate, endDate, startTime, endTime, today }){
const [currentDay, setCurrentDay] = useState(today);
-
// �쇱슂�� 0 �쒖옉
- const nowDay = currentDay.getDay();
- const nowDate = currentDay.getDate();
- const [nowMonth, setNowMonth] = useState(currentDay.getMonth() + 1); // zero-base
- const [nowYear, setNowYear] = useState(currentDay.getFullYear());
+ const nowDay = startDate.getDay();
+ const nowDate = startDate.getDate();
+ const [nowMonth, setNowMonth] = useState(startDate.getMonth() + 1); // zero-base
+ const [nowYear, setNowYear] = useState(startDate.getFullYear());
const getWeek = (date) => {
const currentDate = date.getDate();
@@ -125,7 +123,9 @@ function CalendarWeek2({ availableTimes, setAvailableTimes, isContain, startDate
return Math.ceil((currentDate + firstDay) / 7);
};
- const [nowWeek, setNowWeek] = useState(getWeek(today));
+
+ const [nowWeek, setNowWeek] = useState(getWeek(currentDay));
+
const firstDay = (new Date(nowYear, nowMonth - 1, 1)).getDay();
const lastDay = (new Date(nowYear, nowMonth, 0)).getDay();
@@ -155,7 +155,7 @@ function CalendarWeek2({ availableTimes, setAvailableTimes, isContain, startDate
setNowWeek(newWeek);
setNowMonth(newMonth);
setNowYear(newYear);
- setCurrentDay(new Date(nowYear, nowMonth - 1, 1*(nowWeek-1) + nowDay));
+ // setCurrentDay(new Date(nowYear, nowMonth - 1, 1*(nowWeek-1) + nowDay));
}
const nextWeek = () => {
let newWeek = nowWeek + 1;
@@ -172,7 +172,7 @@ function CalendarWeek2({ availableTimes, setAvailableTimes, isContain, startDate
setNowWeek(newWeek);
setNowMonth(newMonth);
setNowYear(newYear);
- setCurrentDay(new Date(nowYear, nowMonth - 1, nowDate));
+ // setCurrentDay(new Date(nowYear, nowMonth - 1, nowDate));
}
return(
diff --git a/react-whenMeet/src/components/HomeParticipateForm.js b/react-whenMeet/src/components/HomeParticipateForm.js
index 7a031d4..407b908 100644
--- a/react-whenMeet/src/components/HomeParticipateForm.js
+++ b/react-whenMeet/src/components/HomeParticipateForm.js
@@ -11,6 +11,7 @@ function HomeParticipateForm() {
const navigate = useNavigate();
const { id } = useParams();
+
const handleName = (event) => {
setName(event.target.value);
}
@@ -22,7 +23,7 @@ function HomeParticipateForm() {
}
const checkParticipantExistence = async()=>{
try{
- const response = await axios.get(`http://43.200.79.42:3000/meetings/${id}/participants/?name=${name}`);
+ const response = await axios.get(`http://localhost:3000/meetings/${id}/participants/?name=${name}`);
return false;
}
catch(err){
@@ -39,12 +40,44 @@ function HomeParticipateForm() {
let checkParticipant = await checkParticipantExistence();
if(checkParticipant){
try {
- const response = await axios.post(`http://43.200.79.42:3000/meetings/${id}/participants`, {
+ const response = await axios.post(`http://localhost:3000/meetings/${id}/participants`, {
name: name,
password: password,
email: email
});
- navigate('UserTimeInfo', { state: { id } });
+ try {
+ const response = await axios.post(`http://localhost:3000/meetings/${id}/entry`,{
+ name : name,
+ password : password
+ }, {
+ withCredentials: true
+ });
+
+ try{
+ const response = await axios.get(`http://localhost:3000/meetings/${id}/`);
+ navigate('UserTimeInfo', { state: { id:id, startDate: response.data.startDate, endDate:response.data.endDate }});
+ }
+ catch(e){
+ console.log(e);
+ }
+ }
+ catch (error) {
+ if (error.response) {
+ if (error.response.status === 401) {
+ alert('Password瑜� �섎せ �낅젰�섏��듬땲��');
+ } else if (error.response.status === 404) {
+ alert('�대떦�섎뒗 �대쫫�� 議댁옱�섏� �딆뒿�덈떎');
+ }
+ else if(error.response.status === 400){
+ alert("鍮꾨�踰덊샇瑜� �ㅼ젙�섏뀲�듬땲��. 鍮꾨�踰덊샇瑜� �낅젰�댁＜�몄슂")
+ }
+ else {
+ alert(`Unexpected status code: ${error.response.status}`);
+ }
+ } else {
+ console.error(error);
+ }
+ }
}
catch (error) {
console.error(error);
@@ -62,11 +95,19 @@ function HomeParticipateForm() {
}
else {
try {
- const response = await axios.post(`http://43.200.79.42:3000/meetings/${id}/entry`,{
+ const response = await axios.post(`http://localhost:3000/meetings/${id}/entry`,{
name : name,
password : password
+ }, {
+ withCredentials: true
});
- navigate('UserTimeInfo', { state: { id } });
+ try{
+ const response = await axios.get(`http://localhost:3000/meetings/${id}/`);
+ navigate('UserTimeInfo', { state: { id:id, startDate: response.data.startDate, endDate:response.data.endDate }});
+ }
+ catch(e){
+ console.log(e);
+ }
}
catch (error) {
if (error.response) {
diff --git a/react-whenMeet/src/components/MeetingInfoForm.js b/react-whenMeet/src/components/MeetingInfoForm.js
index ff5c86e..d1e88ab 100644
--- a/react-whenMeet/src/components/MeetingInfoForm.js
+++ b/react-whenMeet/src/components/MeetingInfoForm.js
@@ -58,7 +58,7 @@ function MeetingInfoForm() {
transformedPurpose = 'ETC';
}
try {
- const response = await axios.post("http://43.200.79.42:3000/meetings", {
+ const response = await axios.post("http://localhost:3000/meetings", {
title: title,
adminPassword: password,
purpose: transformedPurpose,
diff --git a/react-whenMeet/src/routes/UserTimeInfo.js b/react-whenMeet/src/routes/UserTimeInfo.js
index ce1fd93..172d8bd 100644
--- a/react-whenMeet/src/routes/UserTimeInfo.js
+++ b/react-whenMeet/src/routes/UserTimeInfo.js
@@ -3,7 +3,7 @@ import Button from "../components/Button";
import CalendarWeek2 from "../components/CalendarWeek2"
import "../styles/HomeMake.css"
import axios from "axios";
-import { useNavigate, useParams } from "react-router-dom";
+import { useLocation, useNavigate, useParams } from "react-router-dom";
function UserTimeInfo() {
const [state, setState] = useState(true);
@@ -11,34 +11,39 @@ function UserTimeInfo() {
const [availableTimes, setAvailableTimes] = useState([]);
const {id} = useParams();
+ const location = useLocation();
+
const [startTime, setStartTime] = useState(0);
- const [endTime, setEndTiem] = useState(10);
- const [today, setToday] = useState(new Date());
- const [startDate, setStartDate] = useState(new Date(2023,10,30));
- const [endDate, setEndDate] = useState(new Date(2023,11,2));
-
+ const [endTime, setEndTime] = useState(10);
+
+ const [today, setToday] = useState(new Date(location.state.startDate));
+ const [startDate, setStartDate] = useState(new Date(location.state.startDate));
+ const [endDate, setEndDate] = useState(new Date(location.state.endDate));
- const handleState = () => {
- setState((state) => !state);
+ const handleState1 = () => {
+ setState(true);
+ }
+ const handleState2 = () => {
+ setState(false);
}
const handleCalendar = (value) => {
console.log('Selected Date:', value);
};
- useEffect(() => {
- const fetchData = async () => {
- try {
- const response = await axios.get(`http://43.200.79.42:3000/meetings/${id}/`);
- console.log(response.data.title);
- } catch (error) {
- console.error(error);
- }
- };
- fetchData();
- }, [id]);
-
+ const fetchData = async () => {
+ try {
+ const response = await axios.get(`http://localhost:3000/meetings/${id}/`);
+ const nd = response.data.startDate.split("-");
+ setStartDate(new Date(nd[0]-0,nd[1]-1,nd[2]-0));
+ setToday(startDate);
+ const ed = response.data.endDate.split("-");
+ setEndDate(new Date(ed[0]-0,ed[1]-1,ed[2]-0));
+ } catch (error) {
+ console.error(error);
+ }
+ };
+
const handleAlert = () => {
- // let sat = [...availableTimes].sort();
const sat = [];
// state�� �곕씪�� 媛��ν븳 �쒓컙�� �좏깮�� 嫄곕씪硫� 洹몃깷 �섏뼱媛�怨�
// 遺덇��ν븳 �쒓컙�� �좏깮�� 嫄곕씪硫� �꾨� �좎쭨 踰붿쐞�� 留욎떠�� �ㅼ쭛�댁쨾�� �쒕떎.
@@ -100,12 +105,12 @@ function UserTimeInfo() {
<Button
type="button"
text="媛��ν븳 �쒓컙"
- onClick={handleState}
+ onClick={handleState1}
/>
<Button
type="button"
text="遺덇��ν븳 �쒓컙"
- onClick={handleState}
+ onClick={handleState2}
/>
<CalendarWeek2 state={state} startDate={startDate} endDate={endDate} startTime={startTime} endTime={endTime} today={today} availableTimes={availableTimes} setAvailableTimes={setAvailableTimes} isContain={isContain} />
<Button
--
GitLab