Merge remote-tracking branch 'origin/jaeyeoniiiiii' into seoyeon2

client/src/App.js

@@ -16,7 +16,19 @@ function App() {
         <Route exact path="/user" component={HomeUserPage} />
         <Route path="/profile/:id/update" component={InfoUpdatePage} />
         <Route path="/profile/:id" component={ProfilePage} />
-        <Route path="/room/:roomId/:channelId" component={RoomPage} />
+        <Route path="/room/:roomId/:channelId" component={RoomPage}>
+        {/* <Switch>
+          <Route path={"/room/:roomId/meeting"}>
+            <></>
+          </Route>
+          <Route path={"/room/:roomId/normal"}>
+            <></>
+          </Route>
+          <Route path={"/room/:roomId/notice"}>
+            <></>
+          </Route>
+        </Switch> */}
+        </Route>
         <Route path="/room/Invite" component={InvitePage} />
       </Switch>
       {/* </AuthProvider> */}

client/src/apis/user.api.js

 import axios from "axios";
 
 const getUser = async (id) => {
-  // console.log('id222:',id.userID)
   const { data } = await axios.get(`/api/getUser/${id}`);
   return data;
 };

client/src/components/Home/CreateRoom.js

 import { useEffect, useState } from "react";
-import { Redirect } from "react-router-dom";
+import { Redirect, useParams } from "react-router-dom";
 import roomApi from "../../apis/room.api";
 import catchErrors from "../../context/catchError";
 
@@ -45,7 +45,7 @@ const CreateRoom = () => {
     if (success) {
         console.log('success', success)
         alert('룸생성이 완료되었습니다!')
-        return <Redirect to='/user' />
+        return <Redirect to="/user"/>
     }
 
     const { name, owner, member, profileimg } = room;

client/src/components/Home/RoomSingle.js

@@ -8,15 +8,13 @@ const RoomSingle = () => {
   const [room, setRoom] = useState([])
   const id = localStorage.getItem('user');
   const channelId = 1
-  const A = []
 
   // async function getJoinRoom(Id) {
   //   try {
-  //     console.log('id:',id)
-  //     const User = await userApi.getUser({id: Id})
-  //     console.log('User1:',User)
-  //     console.log('User2:',User.roomNumber)
-  //     const RoomNumArr = User.roomNumber
+  //     const user = await userApi.getUser({id: Id})
+  //     console.log('User1:',user)
+  //     console.log('User2:',user.roomNumber)
+  //     const RoomNumArr = user.roomNumber
   //     console.log('setRoomNum:',RoomNumArr)
   //     const Room = await roomApi.getRoom(RoomNumArr)
   //   } catch (error) {

client/src/components/Room/ChannelSingle.js

+import { Link, Route, Switch, useParams } from "react-router-dom";
+
 const ChannelSingle = () => {
+  const { roomId } = useParams();
   return (
-    <div className="overflow-auto" style={{ height: '610px' }}>
+    <div className="overflow-auto" style={{ height: "610px" }}>
       <div className="mb-3">
-        <div className="m-3 p-1 row" style={{ backgroundColor: '#E0CEE8' }}>
+        <div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}>
+          <Link to={`${roomId}/meeting`}>
             <img
               className="col-auto mt-2"
               src="/fullSpeaker.png"
               width="25px"
               height="25px"
             />
-          <h5 className="col mt-2">회의</h5>
-        </div>
-        <ul className="mx-5" style={{ color: '#76D079' }}>
-          <li>
-            <p style={{ color: 'black' }}>CHERRY</p>
-          </li>
-          <li>
-            <p style={{ color: 'black' }}>JAEYEON</p>
-          </li>
-          <li>
-            <p style={{ color: 'black' }}>SEOYEON</p>
-          </li>
-          <li>
-            <p style={{ color: 'black' }}>JIWEON</p>
-          </li>
-          <li>
-            <p style={{ color: 'black' }}>BYOUNGYUN</p>
-          </li>
-        </ul>
-      </div>
-
-      <div className="mb-3">
-        <div className="m-3 p-1 row" style={{ backgroundColor: '#E0CEE8' }}>
-          <img
-            className="col-auto mt-2"
-            src="/emptySpeaker.png"
-            width="25px"
-            height="25px"
-          />
-          <h5 className="col mt-2">사담</h5>
+            <h5 className="col mt-2" style={{ color: "black" }}>
+              회의
+            </h5>
+          </Link>
         </div>
-        <ul className="mx-5" style={{ color: '#76D079' }}>
+        <ul className="mx-5" style={{ color: "#76D079" }}>
           <li>
-            <p style={{ color: 'black' }}>CHERRY</p>
+            <p style={{ color: "black" }}>CHERRY</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>JAEYEON</p>
+            <p style={{ color: "black" }}>JAEYEON</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>SEOYEON</p>
+            <p style={{ color: "black" }}>SEOYEON</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>JIWEON</p>
+            <p style={{ color: "black" }}>JIWEON</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>BYOUNGYUN</p>
+            <p style={{ color: "black" }}>BYOUNGYUN</p>
           </li>
         </ul>
       </div>
 
       <div className="mb-3">
-        <div className="m-3 p-1 row" style={{ backgroundColor: '#E0CEE8' }}>
+        <div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}>
           <img
             className="col-auto mt-2"
             src="/emptySpeaker.png"
             width="25px"
             height="25px"
           />
-          <h5 className="col mt-2">일반</h5>
+          <Link to={`${roomId}/normal`}>
+            <h5 className="col mt-2" style={{ color: "black" }}>
+              일반
+            </h5>
+          </Link>
         </div>
-        <ul className="mx-5" style={{ color: '#76D079' }}>
+        <ul className="mx-5" style={{ color: "#76D079" }}>
           <li>
-            <p style={{ color: 'black' }}>CHERRY</p>
+            <p style={{ color: "black" }}>CHERRY</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>JAEYEON</p>
+            <p style={{ color: "black" }}>JAEYEON</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>SEOYEON</p>
+            <p style={{ color: "black" }}>SEOYEON</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>JIWEON</p>
+            <p style={{ color: "black" }}>JIWEON</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>BYOUNGYUN</p>
+            <p style={{ color: "black" }}>BYOUNGYUN</p>
           </li>
         </ul>
       </div>
 
       <div className="mb-3">
-        <div className="m-3 p-1 row" style={{ backgroundColor: '#E0CEE8' }}>
+        <div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}>
           <img
             className="col-auto mt-2"
             src="/emptySpeaker.png"
             width="25px"
             height="25px"
           />
-          <h5 className="col mt-2">공지</h5>
+          <Link to={`${roomId}/notice`}>
+            <h5 className="col mt-2" style={{ color: "black" }}>
+              공지
+            </h5>
+          </Link>
         </div>
-        <ul className="mx-5" style={{ color: '#76D079' }}>
+        <ul className="mx-5" style={{ color: "#76D079" }}>
           <li>
-            <p style={{ color: 'black' }}>CHERRY</p>
+            <p style={{ color: "black" }}>CHERRY</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>JAEYEON</p>
+            <p style={{ color: "black" }}>JAEYEON</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>SEOYEON</p>
+            <p style={{ color: "black" }}>SEOYEON</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>JIWEON</p>
+            <p style={{ color: "black" }}>JIWEON</p>
           </li>
           <li>
-            <p style={{ color: 'black' }}>BYOUNGYUN</p>
+            <p style={{ color: "black" }}>BYOUNGYUN</p>
           </li>
         </ul>
       </div>
     </div>
-  )
-}
+  );
+};
 
-export default ChannelSingle
+export default ChannelSingle;

client/src/components/SignUp.js

@@ -3,7 +3,6 @@ import { useEffect, useState } from "react";
 import { Redirect } from "react-router-dom";
 import userApi from "../apis/user.api";
 import catchErrors from "../context/catchError";
-
 const INIT_USER = {
   name: "",
   email: "",
@@ -17,7 +16,6 @@ const Signup = () => {
   const [error, setError] = useState("");
   const [disabled, setDisabled] = useState(false);
   const [success, setSuccess] = useState(false);
-  const [loading, setLoading] = useState(false);
 
   useEffect(() => {
     setDisabled(
@@ -33,30 +31,38 @@ const Signup = () => {
   function handleChange(event) {
     const { name, value } = event.target;
     setUser({ ...user, [name]: value });
-    // console.log(user);
   }
 
   async function handleSubmit() {
     console.log('회원가입')
     try {
-      const data = await userApi.signup(user)
-      setLoading(true);
-      setError("");
-      // const success = await login(user.email, user.password);
-      console.log(data);
+      const data = await userApi.signup(user);
+      console.log(data)
       setSuccess(true);
+      setError("");
     } catch (error) {
       catchErrors(error, setError);
     } finally {
-      setLoading(false);
+      // setLoading(false);
+    }
+  }
+  function checkPassword(event) {
+    const p1 = user.password;
+    const p2 = user.checkpw;
+    if (p1 !== p2) {
+      event.preventDefault();
+      alert("비밀번호가 일치하지 않습니다.");
+      return false;
+    } else {
+      setSuccess(true);
+      return true;
     }
   }
   if (success) {
-    alert('회원가입 되었습니다.')
-    return <Redirect to="/" />;
+    alert("회원가입 되었습니다.");
+    <Redirect to="/" />;
   }
 
-
   const { name, id, password, checkpw, phone } = user;
   return (
     <div className="modal-content">
@@ -137,7 +143,12 @@ const Signup = () => {
         </div>
         {console.log(disabled)}
         <div className="modal-footer">
-          <button type="submit" className="btn btn-primary" disabled={disabled}>
+          <button
+            type="submit"
+            className="btn btn-primary"
+            onClick={checkPassword}
+            disabled={disabled}
+          >
             회원가입
           </button>
         </div>

models/user.model.js

 import bcrypt from "bcryptjs";
 import { DataTypes } from "sequelize";
-// import img from 'bora_it\client\public\user.png'
 
 const UserModel = (sequelize) => {
   const User = sequelize.define(
@@ -19,6 +18,9 @@ const UserModel = (sequelize) => {
       password: {
         type: DataTypes.STRING,
       },
+      checkpw:{
+        type: DataTypes.STRING,
+      },
       phone: {
         type: DataTypes.STRING,
       },