Skip to content

GitLab

Commit 3d26a428 authored by 우지원's avatar 우지원
Browse files

0716

parent 4cdee925
Hide whitespace changes
Inline Side-by-side
client/package.json
View file @ 3d26a428
...@@ -40,5 +40,6 @@ ...@@ -40,5 +40,6 @@
"last 1 firefox version", "last 1 firefox version",
"last 1 safari version" "last 1 safari version"
] ]
} },
"proxy": "http://localhost:8080"
} }
client/src/components/Home/AddRoom.js
View file @ 3d26a428
import { useEffect, useState } from "react";
import axios from 'axios'
const INIT_ROOM = {
roomName: '',
owner: '123456',
member: '123456',
profileimg: [],
}
const AddRoom = () => { const AddRoom = () => {
const [room, setRoom] = useState(INIT_ROOM)
const [error, setError] = useState("");
const [success, setSuccess] = useState(false)
const [disabled, setDisabled] = useState(true)
useEffect(() => {
setDisabled(
!(
room.name &&
room.owner &&
room.member &&
room.profileimg
)
);
}, [room]);
//LocalStorage에 user id를 저장할때 id를 owner, member에 저장하기
//const userId = localStorage.getItem('id')
// setRoom({...room, [owner]: userId})
// setRoom({...room, [member]: userId})
function handleChange(event) {
const { name, value } = event.target
setRoom({ ...room, [name]: value })
console.log(room)
}
async function handleSubmit(event) {
event.preventDefault()
try {
console.log('룸룸', room)
let res = await axios.post("/room/create", room)
const Id = res.data.id
alert(`방참여코드는 ${Id}입니다`)
setSuccess(true)
} catch (error) {
// catchErrors(error, setError);
} finally {
// setLoading(false);
}
}
if (success) {
console.log('success', success)
alert('룸생성이 완료되었습니다!')
//return <Redirect to='/' />
}
const { name, owner, member, profileimg } = room;
return ( return (
<div> <div>
<div className="mx-4 my-3 d-flex justify-content-between"> <div className="mx-4 my-3 d-flex justify-content-between">
...@@ -83,70 +143,83 @@ const AddRoom = () => { ...@@ -83,70 +143,83 @@ const AddRoom = () => {
</div> </div>
{/* 방참여하기 모달 */} {/* 방참여하기 모달 */}
<div className="modal" id="joinModal" tabIndex="-1" aria-hidden="true"> <div className="form" onSubmit={handleSubmit}>
<div className="modal-dialog"> <div className="modal" id="joinModal" tabIndex="-1" aria-hidden="true">
<div className="modal-content"> <div className="modal-dialog">
<div className="modal-header"> <div className="modal-content">
<div>방참여하기</div> <div className="modal-header">
<button <div>방참여하기</div>
type="button" <button
className="btn-close" type="button"
data-bs-dismiss="modal" className="btn-close"
aria-label="Close" data-bs-dismiss="modal"
></button> aria-label="Close"
</div> ></button>
<div className="modal-body">
<div className="input-group mb-3">
<input
type="text"
className="form-control"
placeholder="참여코드를 입력하세요"
aria-label="참여코드를 입력하세요"
aria-describedby="basic-addon1"
/>
</div> </div>
<div className="modal-footer"> <div className="modal-body">
<button type="submit" className="btn btn-primary"> <div className="input-group mb-3">
확인 <input
</button> type="text"
className="form-control"
placeholder="참여코드를 입력하세요"
aria-label="참여코드를 입력하세요"
aria-describedby="basic-addon1"
/>
</div>
<div className="modal-footer">
<button type="submit" className="btn btn-primary">
확인
</button>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
{/* 방생성하기 모달 */} {/* 방생성하기 모달 */}
<div className="modal" id="makeModal" tabIndex="-1" aria-hidden="true"> <div className="form" onSubmit={handleSubmit}>
<div className="modal-dialog"> <div className="modal" id="makeModal" tabIndex="-1" aria-hidden="true">
<div className="modal-content"> <div className="modal-dialog">
<div className="modal-header"> <div className="modal-content">
<div>방생성하기</div> <div className="modal-header">
<button <div>방생성하기</div>
type="button" <button
className="btn-close" type="button"
data-bs-dismiss="modal" className="btn-close"
aria-label="Close" data-bs-dismiss="modal"
></button> aria-label="Close"
</div> ></button>
<div className="modal-body">
<h6>방프로필사진</h6>
<div className="mb-4">
<input type="file" className="upload-hidden" />
</div> </div>
<h6>방이름</h6> <div className="modal-body">
<div className="input-group"> <h6>방프로필사진</h6>
<input <div className="mb-4">
type="text" <input
className="form-control" type="file"
placeholder="방이름을 입력해주세요" className="upload-hidden"
aria-label="방이름 입력해주세요" onChange={handleChange}
aria-describedby="basic-addon1" name="profileimg"
/> value={room.profileimg} />
</div> </div>
<div className="modal-footer"> <h6>방이름</h6>
<button type="submit" className="btn btn-primary"> <div className="input-group">
생성 <input
</button> type="text"
className="form-control"
placeholder="방이름을 입력해주세요"
aria-label="방이름 입력해주세요"
aria-describedby="basic-addon1"
onChange={handleChange}
name="name"
value={room.name}
/>
</div>
<div className="modal-footer">
<button type="submit" className="btn btn-primary">
생성
</button>
</div>
</div> </div>
</div> </div>
</div> </div>
......
controllers/room.controller.js
View file @ 3d26a428
import { Room } from "../models/index.js"; import { Room } from "../models/index.js";
//import { customAlphabet } from 'nanoid'
import config from "../config/app.config.js"; import config from "../config/app.config.js";
import isLength from 'validator/lib/isLength.js'
const login = async (req, res) => { //const nanoid = customAlphabet('1234567890abcdef', 10)
const roomJoin = async (req, res) => {
try { try {
console.log("login= ", req.body); console.log("login= ", req.body);
res.json("안녕"); res.json("안녕");
...@@ -11,6 +15,35 @@ const login = async (req, res) => { ...@@ -11,6 +15,35 @@ const login = async (req, res) => {
} }
}; };
const roomCreate = async (req, res) => {
const { name, owner, member, profileimg } = req.body;
const id = nanoid()
const Id = await Room.findOne({ id })
while (Id) {
id = nanoid()
Id = await Room.findOne({ id })
}
try {
if (!isLength(name, { min: 3, max: 20 })) {
return res.status(422).send('방이름은 3-20자여야 합니다.')
}
const newRoom = await new Room({
id,
name,
owner,
member,
profileimg,
}).save()
// console.log(newRoom)
res.json(newRoom)
} catch (error) {
console.log(error)
res.status(500).send('방생성 에러')
}
}
export default { export default {
login, roomJoin, roomCreate
}; };
models/room.model.js
View file @ 3d26a428
...@@ -17,6 +17,10 @@ const RoomModel = (sequelize) => { ...@@ -17,6 +17,10 @@ const RoomModel = (sequelize) => {
member: { member: {
type: DataTypes.ARRAY(DataTypes.INTEGER), type: DataTypes.ARRAY(DataTypes.INTEGER),
}, },
profileimg: {
type: DataTypes.STRING,
default: '3cd14b9bcb2007f324fcb82e0b566cce',
},
channel: { channel: {
type: DataTypes.ARRAY(DataTypes.JSON), type: DataTypes.ARRAY(DataTypes.JSON),
}, },
......
routes/room.route.js
View file @ 3d26a428
...@@ -3,6 +3,8 @@ import roomCrtl from "../controllers/room.controller.js"; ...@@ -3,6 +3,8 @@ import roomCrtl from "../controllers/room.controller.js";
const router = express.Router(); const router = express.Router();
router.route("/").get(roomCrtl.login); //router.route("/").get(roomCrtl.login);
router.route("/room/create")
.post(roomCrtl.roomCreate)
export default router; export default router;
\ No newline at end of file
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