Commit e7eecc9d authored by Choi Ga Young's avatar Choi Ga Young
Browse files

Merge remote-tracking branch 'origin/jiweon827' into young

parents 3e091bf2 9ce059d6
......@@ -106,7 +106,6 @@ function Chat(props) {
props.handleChatc()
}
useEffect(() => {
getProfile(userId)
}, [userId])
......@@ -127,8 +126,8 @@ function Chat(props) {
return (
<>
<Container id="chat" style={{ overflow: 'auto', padding: '20px', border: "2px solid", height: "500px", margin: "1%", borderColor: "#BDBDBD", background: '' }}>
<Row className="justify-content-center" style={{ border: "2px solid", borderWidth: "medium", borderColor: "#FFD75F", height: "80px" }}>
<Container id="chat" style={{ overflow: 'auto', padding: '20px', border: "2px solid", height: "500px", margin: "1%", borderColor: "9174ad", background: '' }}>
<Row className="d-flex justify-content-center" style={{ border: "2px solid", borderWidth: "medium", borderColor: "9174ad", height: "80px", margin:"1%" }}>
<Col md="auto">
<Button variant="light" onClick={handleClick} >{`<`}</Button>
</Col>
......@@ -150,7 +149,7 @@ function Chat(props) {
if (!(value.msg === '')) {
if (value.sender === "system") {
return (
<Row className='border' style={{ background: "#FFFAFA"}}>
<Row className='border' style={{ background: "#FFFAFA" }}>
{value.msg}
</Row>
)
......@@ -163,7 +162,7 @@ function Chat(props) {
<Col xs={8}>
<Row><strong>{value.sender}</strong></Row>
<Row className='d-flex flex-wrap-nowrap'>
<Row className='border border-dark' style={{ width: 'max-content', maxWidth: '300px', height: 'auto', paddingLeft: '15px', paddingRight: '15px', background: 'white', borderRadius: '5px', fontSize: 'x-large' }}>{value.msg}</Row>
<Row className='border border-dark' style={{ width: 'max-content', maxWidth: '300px', height: 'auto', paddingLeft: '15px', paddingRight: '15px', background: '#f1ebf7', borderRadius: '5px', fontSize: 'x-large' }}>{value.msg}</Row>
<Col className='ml-1'>{value.time}</Col>
</Row>
</Col>
......@@ -174,7 +173,7 @@ function Chat(props) {
<Row key={index} className='m-1 justify-content-end'>
<Row className='d-flex flex-wrap-nowrap' >
<Col className='mr-1'>{value.time}</Col>
<Row className='mr-2' name='msg' style={{ width: 'max-content', maxWidth: '300px', height: 'auto', paddingLeft: '15px', paddingRight: '15px', background: 'yellow', borderRadius: '3px', fontSize: 'x-large' }}>{value.msg}</Row>
<Row className='mr-2' name='msg' style={{ width: 'max-content', maxWidth: '300px', height: 'auto', paddingLeft: '15px', paddingRight: '15px', background: "#d6c8e3", borderRadius: '3px', fontSize: 'x-large' }}>{value.msg}</Row>
</Row>
</Row>
)
......
import React from 'react'
import { Navbar, Nav, Button } from 'react-bootstrap';
import { Navbar, Nav } from 'react-bootstrap';
import { handleLogout } from '../utils/auth';
......@@ -8,22 +8,27 @@ function Menu() {
const name = sessionStorage.getItem('name');
return (
<Navbar bg="dark" variant="dark">
<Navbar.Brand href="/home">YDK Messenger</Navbar.Brand>
<Navbar style={{ backgroundColor: "#61477a" }} variant="dark">
<div className="container-fluid">
<Navbar.Brand className="navbar-brand" href="/home">YDK Messenger</Navbar.Brand>
{name ?
<>
<div className='ml-1 mr-2' style={{ color: 'white' }}>{name} 환영합니다</div>
<Nav className="mr-auto">
<Nav className="nav navbar-nav mr-auto" style={{ color: 'white' }}>
<Nav.Item className="mt-2 mr-4">{name} 환영합니다</Nav.Item>
<Nav.Link href="/profile">Profile</Nav.Link>
<Nav.Link onClick={() => handleLogout()} href="/login">logout</Nav.Link>
</Nav>
<Button className="ml-auto" onClick={() => handleLogout()} variant="light">Logout</Button>
</>
: <Nav className="ml-auto">
<Nav.Link href='/login'>로그인</Nav.Link>
<Nav.Link href='/signup'>회원가입</Nav.Link>
</Nav>}
: <>
<Nav className="nav navbar-nav">
<Nav.Link href="/login">Login</Nav.Link>
<Nav.Link href="/signup">Signup</Nav.Link>
</Nav>
</>}
</div>
</Navbar>
)
}
export default Menu
......@@ -184,8 +184,8 @@ function Home() {
{(show || chat) ?
null
: <div style={{ position: "fixed", bottom: "20px", right: "30px" }}>
<Button variant="primary" onClick={handleShowModal} size="lg" block>생성</Button>
<Button variant="secondary" onClick={handleShowEnter} size="lg" block>참가</Button>
<Button style={{ borderColor: "#9174ad", backgroundColor: "#9174ad", color: 'white' }} onClick={handleShowModal} size="lg" block>생성</Button>
<Button style={{ borderColor: "#9174ad", backgroundColor: "#9174ad", color: 'white' }} onClick={handleShowEnter} size="lg" block>참가</Button>
</div>
}
{chat ?
......@@ -200,8 +200,8 @@ function Home() {
<h5> 참여인원 : {room.member.length}</h5>
<h5 className="mb-3"> 방코드(방코드를 통해서도 참여할 있습니다.) : {room.roomId}</h5>
<Row className='justify-content-center'>
<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>
<Button variant="outline" style={{ border: "3px solid", borderColor: "#b49dc9" }} size="sm" className="mr-4" onClick={enterButton}>뒤로가기</Button>
<Button variant="outline" style={{ border: "3px solid", borderColor: "#b49dc9" }} size="sm" className="ml-4" type='submit' onClick={attendListRoom}>참가</Button>
</Row>
</div>
</div>
......@@ -217,4 +217,3 @@ function Home() {
}
export default Home;
\ No newline at end of file
......@@ -91,11 +91,12 @@ function LogIn() {
<Button
disabled={disabled || loading}
type="submit"
variant="outline-success"
variant="outline"
size="lg"
className="mr-4"
style={{ border: "3px solid", borderColor: "#b49dc9", background: 'white', font: 'dark' }}
block>
{loading && <Spinner as='span' animation='border' size='sm' role='status' aria-hidden='true' />} {' '} 로그인
{loading && <Spinner as='span' animation='border' size='sm' role='status' aria-hidden='true' style={{ color: "#b49dc9" }} />} {' '} 로그
</Button>
{error && <Alert variant='danger'>
{error}
......
......@@ -113,7 +113,7 @@ function ProfilePage() {
</Col>
<Col xs={3}>
<Form className="d-flex" onSubmit={handleSubmitHidVis}>
<Button className="ml-3 d-flex justify-content-end" variant="outline-primary" size="sm" type='submit'>수정</Button>
<Button className="ml-3 d-flex justify-content-end" variant="outline" style={{ border: "3px solid", borderColor: "#b49dc9", background: 'white' }} size="sm" type='submit'>수정</Button>
</Form>
</Col>
</Row>
......@@ -123,9 +123,9 @@ function ProfilePage() {
</Row>
<Row className='m-3 justify-content-center'>
<Form onSubmit={handleSubmit}>
<Button variant="outline-success" size="sm" className="mr-4" type='submit'>저장</Button>
<Button variant="outline-success" size="sm" className="mr-4" type='submit' variant="outline" style={{ border: "3px solid", borderColor: "#9174ad", background: 'white' }}>저장</Button>
<Link to='/'>
<Button variant="outline-success" size="sm" className="ml-4" > 화면으로</Button>
<Button variant="outline-success" size="sm" className="ml-4" variant="outline" style={{ border: "3px solid", borderColor: "#9174ad", background: 'white' }}> 화면으로</Button>
</Link>
</Form>
</Row>
......
import React, { useState, useEffect } from 'react';
import axios from 'axios'
import { Button, Form, Container, Alert } from 'react-bootstrap';
import { Button, Form, Container, Alert, Spinner} from 'react-bootstrap';
import catchErrors from '../utils/catchErrors';
import { Redirect } from 'react-router-dom';
import Menu from '../Components/Menu';
......@@ -18,6 +18,7 @@ function SingUp() {
const [error, setError] = useState('')
const [disabled, setDisabled] = useState(true)
const [success, setSuccess] = useState(false)
const [loading, setLoading] = useState(false)
useEffect(() => {
const isUser = Object.values(user).every(el => Boolean(el))
......@@ -33,11 +34,14 @@ function SingUp() {
event.preventDefault();
try {
setLoading(true)
setError('')
await axios.post('/users/signup', user)
setSuccess(true)
} catch (error) {
catchErrors(error, setError)
} finally {
setLoading(false)
}
}
......@@ -115,10 +119,12 @@ function SingUp() {
<Button
disabled={disabled}
type='submit'
variant="outline-success"
variant="outline"
size="lg"
className="mr-4"
block>가입</Button>
style={{ border: "3px solid", borderColor: "#b49dc9", background: 'white', font: 'dark' }}
block>
{loading && <Spinner as='span' animation='border' size='sm' role='status' aria-hidden='true' style={{ color: "#b49dc9" }} />}가입</Button>
{error && <Alert variant='danger'>
{error}
</Alert>}
......
......@@ -10,7 +10,7 @@ export async function handleLogout() {
sessionStorage.clear();
await axios.get('/auth/logout')
//login페이지로 이동
window.location.href='/login'
// window.location.href='/login'
}
export function isAuthenticated() {
......
......@@ -25,7 +25,7 @@ const RoomSchema = new mongoose.Schema({
member: {
type: Array,
required: true,
}
},
}, {
timestamps: true
})
......
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