Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
bora-it
Commits
2ddaecff
Commit
2ddaecff
authored
Aug 07, 2021
by
권병윤
Browse files
0807
parent
7c53066a
Changes
10
Show whitespace changes
Inline
Side-by-side
client/src/apis/room.api.js
View file @
2ddaecff
...
...
@@ -25,6 +25,11 @@ const changename = async (payload) => {
return
data
;
}
const
roomApi
=
{
getRoom
,
exitRoom
,
create
,
join
,
changename
};
const
profileimg
=
async
(
formData
)
=>
{
const
{
data
}
=
await
axios
.
put
(
"
/api/room/profileimg
"
,
formData
);
return
data
;
};
const
roomApi
=
{
getRoom
,
exitRoom
,
create
,
join
,
changename
,
profileimg
};
export
default
roomApi
;
client/src/components/Home/CreateRoom.js
View file @
2ddaecff
...
...
@@ -22,6 +22,7 @@ const CreateRoom = () => {
function
handleChange
(
event
)
{
const
{
name
,
value
,
files
}
=
event
.
target
;
console
.
log
(
event
.
target
)
if
(
files
)
{
setRoom
({
...
room
,
[
name
]:
files
[
0
]
})
}
else
{
...
...
client/src/components/Room/Channelsettingchange.js
0 → 100644
View file @
2ddaecff
import
{
useParams
}
from
"
react-router
"
;
import
Createchannel
from
"
./Createchannel
"
;
import
Deletechannel
from
"
./Deletechannel
"
;
const
Channelsettingchange
=
(
props
)
=>
{
const
{
roomId
}
=
useParams
();
console
.
log
(
props
);
console
.
log
(
roomId
);
return
(
<
div
>
<
button
type
=
"
submit
"
data
-
bs
-
toggle
=
"
modal
"
data
-
bs
-
target
=
"
#changechannel
"
style
=
{{
weight
:
"
100px
"
,
height
:
"
60px
"
,
backgroundColor
:
"
#f5cfe3
"
,
borderRadius
:
"
5px
"
,
color
:
"
black
"
,
border
:
"
1px #f5cfe3
"
,
}}
>
채널
설정
변경
{
/* 방 설정 변경으로 바꾸기 */
}
<
/button
>
<
div
className
=
"
modal fade
"
id
=
"
changechannel
"
tabIndex
=
"
-1
"
aria
-
labelledby
=
"
changechannelsettingLabel
"
aria
-
hidden
=
"
true
"
>
<
div
className
=
"
modal-dialog
"
>
<
div
className
=
"
modal-content
"
>
<
div
className
=
"
modal-header
"
>
<
div
className
=
"
modal-title
"
id
=
"
changechannelsetting
"
>
채널
설정
변경
<
/div
>
{
/* <Createchannel />
<Deletechannel /> */
}
<
button
type
=
"
button
"
className
=
"
btn-close
"
data
-
bs
-
dismiss
=
"
modal
"
aria
-
label
=
"
Close
"
><
/button
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
);
};
export
default
Channelsettingchange
;
client/src/components/Room/Createchannel.js
0 → 100644
View file @
2ddaecff
/* 만들 채널의 이름을 입력받고(지금부터 "이름"이라 하자.), 그걸로 {"이름": []}의 형태로 체널을 만든다. 그후, 그 json파일을 현재 roomId의 channel에 추가한다. */
const
Createchannel
=
()
=>
{
return
(
<
div
>
<
/div
>
);
};
export
default
Createchannel
;
\ No newline at end of file
client/src/components/Room/Deletechannel.js
0 → 100644
View file @
2ddaecff
/* 삭제할 채널의 이름을 입력받아서 일치하는 채널이름이 있으면 삭제하고, 없으면 그런 이름의 채널이 존재하지 않는다고 알림창을 띄운다. */
const
Deletechannel
=
()
=>
{
return
(
<
div
>
<
/div
>
);
};
export
default
Deletechannel
;
\ No newline at end of file
client/src/components/Room/RightHamburger.js
View file @
2ddaecff
...
...
@@ -4,7 +4,8 @@ import ChannelSingle from "./ChannelSingle";
import
RoomApi
from
"
../../apis/room.api
"
;
import
catchErrors
from
"
../../context/catchError
"
;
import
KakaoShareButton
from
"
../KakaoShareButton
"
;
import
Roomnamechange
from
"
./Roomnamechange
"
;
import
Roomsettingchange
from
"
./Roomsettingchange
"
;
import
Channelsettingchange
from
"
./Channelsettingchange
"
;
const
INIT_ROOM
=
{
name
:
""
,
...
...
@@ -15,6 +16,7 @@ const INIT_CHANNEL = {
channelName
:
""
,
joinName
:
[],
};
const
RightHamburger
=
()
=>
{
const
[
channel
,
setChannel
]
=
useState
([
INIT_CHANNEL
]);
const
[
room
,
setRoom
]
=
useState
([
INIT_ROOM
]);
...
...
@@ -245,21 +247,8 @@ const RightHamburger = () => {
<
/div
>
<
div
className
=
"
row mb-3
"
>
<
div
className
=
"
d-flex justify-content-evenly
"
>
{
/* <button
type="submit"
data-bs-dismiss="modal"
style={{
weight: "100px",
height: "60px",
backgroundColor: "#f5cfe3",
borderRadius: "5px",
color: "black",
border: "1px #f5cfe3",
}}
>
채널 이름 변경
</button> */
}
<
Roomnamechange
/>
<
Roomsettingchange
/>
<
Channelsettingchange
channel
=
{
channel
}
/
>
<
/div
>
<
/div
>
<
/div
>
...
...
client/src/components/Room/Room
name
change.js
→
client/src/components/Room/Room
setting
change.js
View file @
2ddaecff
...
...
@@ -6,9 +6,10 @@ import catchErrors from "../../context/catchError";
const
INIT_Room
=
{
id
:
""
,
name
:
""
,
profileimg
:
""
,
};
const
Room
name
change
=
()
=>
{
const
Room
setting
change
=
()
=>
{
const
{
roomId
}
=
useParams
();
const
[
Room
,
setRoom
]
=
useState
(
INIT_Room
);
const
[
error
,
setError
]
=
useState
(
""
);
...
...
@@ -17,7 +18,7 @@ const Roomnamechange = () => {
async
function
getdata
(
Roomdata
)
{
try
{
const
data
=
await
RoomApi
.
getRoom
(
Roomdata
);
const
data
=
await
RoomApi
.
getRoom
(
[
Roomdata
]
);
setRoom
(
data
);
console
.
log
(
data
);
}
catch
(
error
)
{
...
...
@@ -31,10 +32,29 @@ const Roomnamechange = () => {
const
updateinfo
=
(
event
)
=>
{
const
{
name
,
value
}
=
event
.
target
;
setRoom
({
...
Room
,
[
name
]:
value
});
console
.
log
(
Room
);
};
const
handleChange
=
async
(
event
)
=>
{
const
{
files
}
=
event
.
target
;
console
.
log
(
"
files:
"
,
files
);
let
formData
=
new
FormData
();
formData
.
append
(
"
profileimg
"
,
files
[
0
]);
formData
.
append
(
"
id
"
,
roomId
);
try
{
const
res
=
await
RoomApi
.
profileimg
(
formData
);
// if (files) {
// setRoom({ ...Room, profileimg: res });
// } else {
// setRoom();
// }
}
catch
(
error
)
{
catchErrors
(
error
,
setError
);
}
};
const
changeinfo
=
async
(
event
)
=>
{
window
.
location
.
reload
();
// window.location.href = window.location.href;
const
req
=
await
RoomApi
.
changename
(
Room
);
};
...
...
@@ -53,7 +73,7 @@ const Roomnamechange = () => {
border
:
"
1px #f5cfe3
"
,
}}
>
방
이름
변경
방
설정
변경
{
/* 방 설정 변경으로 바꾸기 */
}
<
/button
>
<
div
...
...
@@ -66,6 +86,9 @@ const Roomnamechange = () => {
<
div
className
=
"
modal-dialog
"
>
<
div
className
=
"
modal-content
"
>
<
div
className
=
"
modal-header
"
>
<
div
className
=
"
modal-title
"
id
=
"
changeRoomsetting
"
>
방
설정
변경
<
/div
>
<
button
type
=
"
button
"
className
=
"
btn-close
"
...
...
@@ -75,9 +98,26 @@ const Roomnamechange = () => {
<
/div
>
<
div
className
=
"
modal-body d-flex justify-content-center
"
><
/div
>
<
div
className
=
"
row mb-3
"
>
<
div
className
=
"
d-flex justify-content-center
"
style
=
{{
margin
:
"
0px
"
}}
>
<
div
className
=
"
d-flex justify-content-center
"
style
=
{{
margin
:
"
0px
"
}}
>
<
input
type
=
"
file
"
className
=
"
upload-hidden
"
onChange
=
{
handleChange
}
accept
=
"
image/*
"
name
=
"
profileimg
"
/>
<
/div
>
<
div
className
=
"
d-flex justify-content-center
"
style
=
{{
margin
:
"
0px
"
}}
>
{
/* <Link to="/user/:id"> */
}
<
p
style
=
{{
marginTop
:
"
31px
"
,
marginBottom
:
"
0px
"
}}
>
방
이름
:
<
/p
>
<
p
style
=
{{
marginTop
:
"
31px
"
,
marginBottom
:
"
0px
"
}}
>
방
이름
:{
"
"
}
<
/p
>
<
input
onChange
=
{
updateinfo
}
name
=
"
name
"
...
...
@@ -95,7 +135,7 @@ const Roomnamechange = () => {
height
:
"
38px
"
,
width
:
"
130px
"
,
marginTop
:
"
0px
"
,
marginBottom
:
"
0px
"
marginBottom
:
"
0px
"
,
}}
/
>
<
/div
>
...
...
@@ -125,4 +165,4 @@ const Roomnamechange = () => {
);
};
export
default
Room
name
change
;
export
default
Room
setting
change
;
client/src/pages/InvitePage.js
View file @
2ddaecff
import
Header
from
"
../components/Header
"
;
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
"
;
const
INIT_PROFILE
=
{
id
:
""
,
roomNumber
:
""
};
// userapi로 유저정보 불러다가, 참여방 목록에 그 방아이디 추가하고, 방에도 그 유저 아이디 추가한 다음에 참가시키기.
const
InvitePage
=
()
=>
{
const
[
profile
,
setProfile
]
=
useState
([
INIT_PROFILE
]);
const
[
success
,
setSuccess
]
=
useState
(
false
);
const
[
error
,
setError
]
=
useState
(
""
);
const
usercheck
=
localStorage
.
getItem
(
"
user
"
);
const
{
roomId
}
=
useParams
();
async
function
getProfile
(
userID
)
{
try
{
const
data
=
await
userApi
.
getUser
(
userID
);
setProfile
(
data
);
}
catch
(
error
)
{
catchErrors
(
error
,
setError
);
}
}
async
function
joinroom
(
userId
,
roomId
)
{
try
{
// setLoading(true);
setError
(
""
);
const
data
=
await
roomApi
.
join
({
userId
:
userId
,
roomId
:
roomId
});
console
.
log
(
'
서버연결됬나요
'
,
data
)
setSuccess
(
true
);
}
catch
(
error
)
{
catchErrors
(
error
,
setError
);
}
finally
{
// setLoading(false);
}
}
useEffect
(()
=>
{
getProfile
(
usercheck
);
},
[]);
function
goInvitedroom
()
{
let
check1
=
null
;
let
check2
=
null
;
console
.
log
(
usercheck
);
if
(
usercheck
)
check1
=
window
.
confirm
(
"
카카오톡으로 전달된 초대코드를 사용해 참여해 주세요
"
)
joinroom
(
usercheck
,
roomId
);
if
(
success
)
check1
=
window
.
confirm
(
"
방 참여가 완료되었습니다.
"
)
if
(
check1
)
window
.
location
.
href
=
`/user/
${
usercheck
}
`
else
...
...
server/controllers/room.controller.js
View file @
2ddaecff
...
...
@@ -46,6 +46,21 @@ const joinRoom = async (req, res) => {
const
upLoadRoomImg
=
multer
({
dest
:
"
roomUploads/
"
});
const
roomImgUpload
=
upLoadRoomImg
.
fields
([{
name
:
"
profileimg
"
,
maxCount
:
1
}]);
const
update
=
async
(
req
,
res
)
=>
{
try
{
console
.
log
(
"
id:
"
,
req
.
body
.
id
);
const
id
=
req
.
body
.
id
;
//roomId
const
avatar
=
req
.
files
[
"
profileimg
"
][
0
];
//profileimg
const
img
=
avatar
.
filename
;
console
.
log
(
img
);
await
Room
.
update
({
profileimg
:
img
},
{
where
:
{
id
:
id
}
});
res
.
json
(
img
);
}
catch
(
error
)
{
console
.
log
(
error
);
res
.
status
(
500
).
send
(
"
이미지 업데이트 실패
"
);
}
};
const
createRoom
=
async
(
req
,
res
)
=>
{
const
{
userId
,
name
}
=
req
.
body
;
const
avatar
=
req
.
files
[
"
profileimg
"
][
0
];
...
...
@@ -133,5 +148,5 @@ const changename = async (req,res) => {
};
export
default
{
joinRoom
,
roomImgUpload
,
createRoom
,
getRoom
,
exitRoom
,
changename
joinRoom
,
roomImgUpload
,
update
,
createRoom
,
getRoom
,
exitRoom
,
changename
};
server/routes/room.route.js
View file @
2ddaecff
...
...
@@ -7,5 +7,6 @@ router.route("/exitRoom/:id/:roomId").delete(roomCrtl.exitRoom);
router
.
route
(
"
/create
"
).
post
(
roomCrtl
.
roomImgUpload
,
roomCrtl
.
createRoom
);
router
.
route
(
"
/join
"
).
put
(
roomCrtl
.
joinRoom
);
router
.
route
(
"
/changename
"
).
put
(
roomCrtl
.
changename
);
router
.
route
(
"
/profileimg
"
).
put
(
roomCrtl
.
roomImgUpload
,
roomCrtl
.
update
)
export
default
router
;
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment