Commit a26e716f authored by JeongYeonwoo's avatar JeongYeonwoo
Browse files

dd

parent 9886e7d1
...@@ -85,7 +85,7 @@ function Chat(props) { ...@@ -85,7 +85,7 @@ function Chat(props) {
return ( return (
<> <>
<Container id="chat" style={{ overflow: 'auto', padding: '20px', border: "2px solid", height: "500px", margin: "1%", borderColor: "#BDBDBD", background: '' }}> <Container id="chat" style={{ overflow: 'auto', padding: '20px', border: "2px solid", height: "500px", margin: "1%", borderColor: "#BDBDBD", background: '' }}>
<Row class="d-flex justify-content-center" style={{ border: "2px solid", borderWidth: "medium", borderColor: "#FFD75F", height: "80px", margin: "1%" }}> <Row className="d-flex justify-content-center" style={{ border: "2px solid", borderWidth: "medium", borderColor: "#FFD75F", height: "80px", margin: "1%" }}>
<Col md="auto"> <Col md="auto">
<Button variant="light" onClick={props.handleChatc} >{`<`}</Button> <Button variant="light" onClick={props.handleChatc} >{`<`}</Button>
</Col> </Col>
......
...@@ -11,6 +11,7 @@ function OpenList(props) { ...@@ -11,6 +11,7 @@ function OpenList(props) {
async function getOpenList() { async function getOpenList() {
let res = await axios.get('/room/openlist') let res = await axios.get('/room/openlist')
console.log('getOpenlist', res.data)
setOpenlist(res.data) setOpenlist(res.data)
} }
......
...@@ -24,7 +24,7 @@ function Home() { ...@@ -24,7 +24,7 @@ function Home() {
const userName = sessionStorage.getItem('name') const userName = sessionStorage.getItem('name')
const [showModal, setShowModal] = useState(false); const [showModal, setShowModal] = useState(false);
const [showEnter, setEnter] = useState(false); const [showEnter, setShowEnter] = useState(false);
const [chat, setChat] = useState(false); const [chat, setChat] = useState(false);
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const [room, setRoom] = useState(INIT_ROOM) const [room, setRoom] = useState(INIT_ROOM)
...@@ -53,8 +53,8 @@ function Home() { ...@@ -53,8 +53,8 @@ function Home() {
const handleCloseModal = () => setShowModal(false); const handleCloseModal = () => setShowModal(false);
const handleShowModal = () => setShowModal(true); const handleShowModal = () => setShowModal(true);
const handleCloseEnter = () => setEnter(false); const handleCloseEnter = () => setShowEnter(false);
const handleShowEnter = () => setEnter(true); const handleShowEnter = () => setShowEnter(true);
const handleChato = () => setChat(true); const handleChato = () => setChat(true);
const handleChatc = () => setChat(false); const handleChatc = () => setChat(false);
...@@ -70,6 +70,7 @@ function Home() { ...@@ -70,6 +70,7 @@ function Home() {
console.log(roomInf.data) console.log(roomInf.data)
console.log(roomInf.data[0]) console.log(roomInf.data[0])
setRoom(roomInf.data[0]) setRoom(roomInf.data[0])
setOpen(true)
setShow(false) setShow(false)
} }
...@@ -130,34 +131,38 @@ function Home() { ...@@ -130,34 +131,38 @@ function Home() {
</Tabs> </Tabs>
</Col> </Col>
<Col style={{ padding: "0" }}> <Col style={{ padding: "0" }}>
{show ? <> <>
{chat ? <div style={{ position: "fixed", bottom: "20px", right: "30px" }}>
<Chat handleChatc={handleChatc} sendMsg={sendMsg} singleChat={singleChat} recievedMsg={recievedMsg} newUser={newUser} setSingleChat={setSingleChat} roomCode={roomCode} singleImg={singleImg} setSingleImg={setSingleImg} recievedImg={recievedImg} singleUser={singleUser} setSingleUser={setSingleUser} recievedUser={recievedUser} /> <Button variant="primary" onClick={handleShowModal} size="lg" block>생성</Button>
<Button variant="secondary" onClick={handleShowEnter} size="lg" block>참가</Button>
</div>
{(show || chat) ?
null
: <div style={{ position: "fixed", bottom: "20px", right: "30px" }}> : <div style={{ position: "fixed", bottom: "20px", right: "30px" }}>
<Button variant="primary" onClick={handleShowModal} size="lg" block>생성</Button> <Button variant="primary" onClick={handleShowModal} size="lg" block>생성</Button>
<Button variant="secondary" onClick={handleShowEnter} size="lg" block>참가</Button> <Button variant="secondary" onClick={handleShowEnter} size="lg" block>참가</Button>
</div>} </div>
</> : <> }
{open ? {chat ?
<div className="vh-90 flex-column align-items-center justify-content-center mt-2" variant="dark"> <Chat handleChatc={handleChatc} sendMsg={sendMsg} singleChat={singleChat} singleUser={singleUser} singleImg={singleImg} recievedMsg={recievedMsg} recievedUser={recievedUser} recievedImg={recievedImg} setSingleChat={setSingleChat} setSingleUser={setSingleUser} setSingleImg={setSingleImg} roomCode={roomCode} roomName={roomName} />
<div className="d-flex justify-content-center"> : null}
<div className="mt-5 p-5 shadow w-75"> {open ?
<h2 className="d-flex justify-content-center mb-3">현재 {room.roomName} 입니다.</h2> <div className="vh-90 flex-column align-items-center justify-content-center mt-2" variant="dark">
<h5> 관심분야 : {room.interest}</h5> <div className="d-flex justify-content-center">
<h5> 참여인원 : {room.member.length}</h5> <div className="mt-5 p-5 shadow w-75">
<h5 className="mb-3"> 방코드(방코드를 통해서도 참여할 있습니다.) : {room.roomId}</h5> <h2 className="d-flex justify-content-center mb-3">현재 {room.roomName} 입니다.</h2>
<Row className='justify-content-center'> <h5> 관심분야 : {room.interest}</h5>
<Button variant="outline-warning" size="sm" className="mr-4" onClick={enterButton}>뒤로가기</Button> <h5> 참여인원 : {room.member.length}</h5>
<Button variant="outline-warning" size="sm" className="ml-4" type='submit' onClick={attendListRoom}>참가</Button> <h5 className="mb-3"> 방코드(방코드를 통해서도 참여할 있습니다.) : {room.roomId}</h5>
</Row> <Row className='justify-content-center'>
</div> <Button variant="outline-warning" size="sm" className="mr-4" onClick={enterButton}>뒤로가기</Button>
<Button variant="outline-warning" size="sm" className="ml-4" type='submit' onClick={attendListRoom}>참가</Button>
</Row>
</div> </div>
</div> : </div>
<div style={{ position: "fixed", bottom: "20px", right: "30px" }}> </div>
<Button variant="primary" onClick={handleShowModal} size="lg" block>생성</Button> : null}
<Button variant="secondary" onClick={handleShowEnter} size="lg" block>참가</Button> </>
</div>}
</>}
</Col> </Col>
</Row> </Row>
<RoomMake showModal={showModal} handleCloseModal={handleCloseModal} /> <RoomMake showModal={showModal} handleCloseModal={handleCloseModal} />
......
...@@ -47,7 +47,7 @@ io.on("connection", (socket) => { // 기본 연결 ...@@ -47,7 +47,7 @@ io.on("connection", (socket) => { // 기본 연결
console.log('resChat확인', chat) console.log('resChat확인', chat)
socket.broadcast.to(data.roomInfo).emit('sendedMSG', data.sendInfo); // sender 제외 특정 방으로 socket.broadcast.to(data.roomInfo).emit('sendedMSG', data.sendInfo); // sender 제외 특정 방으로
console.log('broad cst실핼')
}); });
socket.on('disconnect', () => { socket.on('disconnect', () => {
......
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