InvitePage.js 4 KB
Newer Older
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
1
import Header from "../components/Header";
권병윤's avatar
0807    
권병윤 committed
2
3
4
5
6
import { useState, useEffect } from "react";
import { useParams } from "react-router";
import roomApi from "../apis/room.api";
import userApi from "../apis/user.api";
import catchErrors from "../context/catchError";
권병윤's avatar
0806    
권병윤 committed
7

권병윤's avatar
0807    
권병윤 committed
8
9
const INIT_PROFILE = {
  id: "",
10
  roomNumber: "",
권병윤's avatar
0807    
권병윤 committed
11
12
13
};

// userapi로 유저정보 불러다가, 참여방 목록에 그 방아이디 추가하고, 방에도 그 유저 아이디 추가한 다음에 참가시키기.
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
14
const InvitePage = () => {
권병윤's avatar
0807    
권병윤 committed
15
  const [profile, setProfile] = useState([INIT_PROFILE]);
16
  const [error, setError] = useState("");
이재연's avatar
이재연 committed
17
  const usercheck = sessionStorage.getItem("user");
18
  const { roomId } = useParams();
권병윤's avatar
0807    
권병윤 committed
19
20
21
22
23
24
25
26
27
28

  async function getProfile(userID) {
    try {
      const data = await userApi.getUser(userID);
      setProfile(data);
    } catch (error) {
      catchErrors(error, setError);
    }
  }

29
  async function joinroom(userId, roomId) {
권병윤's avatar
0807    
권병윤 committed
30
    try {
31
32
33
34
      // setLoading(true);
      setError("");
      const data = await roomApi.join({ userId: userId, roomId: roomId });
      console.log("서버연결됬나요", data);
권병윤's avatar
0807    
권병윤 committed
35
    } catch (error) {
36
      catchErrors(error, setError);
권병윤's avatar
0807    
권병윤 committed
37
    } finally {
38
      // setLoading(false);
권병윤's avatar
0807    
권병윤 committed
39
    }
40
  }
권병윤's avatar
0807    
권병윤 committed
41
42
43
  useEffect(() => {
    getProfile(usercheck);
  }, []);
권병윤's avatar
0806    
권병윤 committed
44
45

  function goInvitedroom() {
46
47
48
49
50
51
    let check = null;
    if (usercheck === null) check = false;
    else check = true;

    if (check === true) {
      joinroom(usercheck, roomId);
우지원's avatar
우지원 committed
52
      alert("방 참여가 완료되었습니다.");
권병윤's avatar
0806    
권병윤 committed
53
      window.location.href=`/user/${usercheck}`
54
    } else {
우지원's avatar
우지원 committed
55
      alert("로그인이 필요합니다.");
56
57
      window.location.href = `/`;
    }
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
58
59
  }

권병윤's avatar
0806    
권병윤 committed
60
  function invitereject() {
61
62
63
64
65
    let check = null;
    if (usercheck === null) check = false;
    else check = true;

    if (check === true) {
우지원's avatar
우지원 committed
66
      alert("유저 페이지로 이동합니다.");
67
68
      window.location.href = `/user/${usercheck}`;
    } else {
우지원's avatar
우지원 committed
69
      alert("로그인이 필요합니다.");
70
71
      window.location.href = `/`;
    }
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
72
73
74
75
76
77
78
79
80
  }

  return (
    <div>
      {/*페이지 전체*/}
      <Header />
      <div className="d-flex justify-content-evenly">
        {/* 위 사진,이름 */}
        <div
81
82
83
84
85
86
87
88
89
        // style={{
        //   width: "100%",
        //   height: "140px",
        //   textAlign: "center",
        //   border: "3px",
        //   borderStyle: "none solid solid",
        //   borderColor: "red",
        //   fontSize: "12px",
        // }}
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
90
        >
권병윤's avatar
0806    
권병윤 committed
91
          {/* 방 부분
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
92
93
94
          <p style={{ marginBottom: "0px", fontSize: "16px" }}>초대받은 방</p>
          <img style={{ width: "90px", height: "90px" }}></img>
          <p style={{ marginBottom: "0px", fontSize: "16px" }}>
권병윤's avatar
0806    
권병윤 committed
95
96
            방 id: ${roomid}
          </p> */}
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
97
98
99
100
        </div>
      </div>

      <div
101
102
103
104
105
106
107
108
      // style={{
      //   width: "80%",
      //   height: "200px",
      //   textAlign: "center",
      //   fontSize: "18px",
      //   marginLeft: "10%",
      //   marginRight: "10%",
      // }}
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
109
110
      >
        {/* 아래 텍스트 */}
111
112
113
114
115
116
117
118
        <p
          align="center"
          style={{
            fontSize: "30px",
            marginTop: "120px",
            marginBottom: "80px",
          }}
        >
권병윤's avatar
0806    
권병윤 committed
119
          축하합니다! 친구가 당신을
120
          <br />
권병윤's avatar
0806    
권병윤 committed
121
          화상회의에 초대했습니다.
122
123
          <br />
          <br />
권병윤's avatar
0806    
권병윤 committed
124
          <b>초대를 수락하시겠습니까?</b>
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
125
126
127
128
129
        </p>
      </div>

      <div className="d-flex justify-content-evenly">
        {/* 수락, 거절 버튼 */}
130
        {console.log(profile.roomNumber)}
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
131
132
133
134
135
        <button
          type="submit"
          className="col-2 p-1 btn btn-primary"
          data-bs-dismiss="modal"
          style={{ width: "120px" }}
권병윤's avatar
0806    
권병윤 committed
136
          onClick={goInvitedroom}
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
137
138
139
140
141
142
143
144
        >
          수락
        </button>
        <button
          type="submit"
          className="col-2 p-1 btn btn-primary"
          data-bs-dismiss="modal"
          style={{ width: "120px" }}
권병윤's avatar
0806    
권병윤 committed
145
          onClick={invitereject}
Kim, Chaerin's avatar
merge19    
Kim, Chaerin committed
146
147
148
149
150
151
152
153
154
        >
          거절
        </button>
      </div>
    </div>
  );
};

export default InvitePage;