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
eue
Commits
3a341f06
Commit
3a341f06
authored
Jul 28, 2021
by
KangMin An
Browse files
Merge branch 'who' into premaster
parents
7b6f5abb
d6e24f8b
Changes
16
Show whitespace changes
Inline
Side-by-side
client/src/App.css
View file @
3a341f06
...
@@ -2,12 +2,32 @@
...
@@ -2,12 +2,32 @@
body
{
body
{
font-family
:
"Noto Sans KR"
,
sans-serif
!important
;
font-family
:
"Noto Sans KR"
,
sans-serif
!important
;
width
:
100%
;
min-height
:
100vh
;
margin
:
0
;
display
:
flex
;
}
#root
{
width
:
100%
;
min-height
:
100%
;
}
#footer
{
position
:
relative
;
bottom
:
1em
;
padding-top
:
2em
;
}
.form-check-input
{
cursor
:
pointer
;
box-shadow
:
none
!important
;
}
}
.form-check-input
:checked
{
.form-check-input
:checked
{
background-color
:
#04AB70
!important
;
background-color
:
#04AB70
!important
;
}
border
:
none
;
}
#btnlink
{
#btnlink
{
color
:
white
!important
;
color
:
white
!important
;
...
@@ -56,7 +76,6 @@ body {
...
@@ -56,7 +76,6 @@ body {
width
:
50%
;
width
:
50%
;
height
:
6em
;
height
:
6em
;
object-fit
:
cover
;
object-fit
:
cover
;
}
}
#socialLink
{
#socialLink
{
...
@@ -70,6 +89,7 @@ body {
...
@@ -70,6 +89,7 @@ body {
width
:
fit-content
;
width
:
fit-content
;
}
}
@media
(
max-width
:
767.98px
)
{
@media
(
max-width
:
767.98px
)
{
body
{
body
{
padding
:
30px
;
padding
:
30px
;
...
@@ -99,15 +119,16 @@ body {
...
@@ -99,15 +119,16 @@ body {
padding-left
:
50px
;
padding-left
:
50px
;
padding-right
:
50px
;
padding-right
:
50px
;
margin
:
auto
;
margin
:
auto
;
}
}
.container-fluid
{
.container-fluid
{
max-width
:
1000px
!important
;
max-width
:
1000px
!important
;
min-height
:
90%
;
}
}
.container-fluid
.row
#stickyy
{
.container-fluid
.row
#stickyy
{
position
:
sticky
!important
;
position
:
sticky
!important
;
position
:
-webkit-sticky
;
top
:
40px
;
top
:
40px
;
width
:
fit-content
;
width
:
fit-content
;
height
:
fit-content
;
height
:
fit-content
;
...
...
client/src/App.js
View file @
3a341f06
...
@@ -7,6 +7,7 @@ import LoginPage from './pages/LoginPage';
...
@@ -7,6 +7,7 @@ import LoginPage from './pages/LoginPage';
import
LocalCodePage
from
'
./pages/LocalCodePage
'
;
import
LocalCodePage
from
'
./pages/LocalCodePage
'
;
import
PrivateRoute
from
'
./utils/PrivateRoutes
'
;
import
PrivateRoute
from
'
./utils/PrivateRoutes
'
;
import
PageNotFound
from
'
./components/PageNotFound
'
;
import
PageNotFound
from
'
./components/PageNotFound
'
;
import
Footer
from
'
./components/Footer
'
;
function
App
()
{
function
App
()
{
...
@@ -17,6 +18,7 @@ function App() {
...
@@ -17,6 +18,7 @@ function App() {
<
Route
exact
path
=
'
/
'
component
=
{
Home
}
/
>
<
Route
exact
path
=
'
/
'
component
=
{
Home
}
/
>
<
Route
path
=
'
/signup
'
component
=
{
SignupPage
}
/
>
<
Route
path
=
'
/signup
'
component
=
{
SignupPage
}
/
>
<
Route
path
=
'
/login
'
component
=
{
LoginPage
}
/
>
<
Route
path
=
'
/login
'
component
=
{
LoginPage
}
/
>
<
Route
path
=
'
/loc
'
component
=
{
LocalCodePage
}
/
>
<
PrivateRoute
path
=
'
/local_code
'
>
<
PrivateRoute
path
=
'
/local_code
'
>
<
LocalCodePage
/>
<
LocalCodePage
/>
...
@@ -24,6 +26,7 @@ function App() {
...
@@ -24,6 +26,7 @@ function App() {
<
Route
component
=
{
PageNotFound
}
/
>
<
Route
component
=
{
PageNotFound
}
/
>
<
/Switch
>
<
/Switch
>
<
Footer
/>
<
/Router
>
<
/Router
>
);
);
...
...
client/src/components/Donation.js
0 → 100644
View file @
3a341f06
import
React
,
{
useEffect
,
useState
}
from
'
react
'
import
{
Row
,
Card
,
Button
,
Col
,
Modal
,
}
from
'
react-bootstrap
'
;
import
{
CopyToClipboard
}
from
'
react-copy-to-clipboard
'
;
import
'
../App.css
'
function
Donation
()
{
const
cardstyled
=
{
margin
:
'
auto
'
,
padding
:
'
1em
'
,
display
:
'
flex
'
,
justifyContent
:
'
center
'
,
width
:
'
100%
'
,
borderWidth
:
'
3px
'
,
borderRadius
:
'
20px
'
,
borderColor
:
'
rgb(110, 189, 142)
'
,
color
:
'
#04AB70
'
}
const
btnstyled2
=
{
background
:
'
white
'
,
margin
:
'
1px
'
,
maxWidth
:
'
fit-content
'
,
borderWidth
:
'
2px
'
,
color
:
'
rgb(110, 189, 142)
'
,
borderColor
:
'
rgba(195, 195, 195, 0.753)
'
,
borderRadius
:
'
20px
'
,
}
const
[
donateShow
,
setDonateShow
]
=
useState
(
false
);
const
[
isCopyshow
,
setCopyShow
]
=
useState
(
false
);
const
HandleClose
=
()
=>
setDonateShow
(
false
);
function
clickAndTwoSec
()
{
return
new
Promise
((
resolve
)
=>
setTimeout
(
resolve
,
2000
))
}
useEffect
(()
=>
{
if
(
isCopyshow
)
{
clickAndTwoSec
().
then
(()
=>
{
setCopyShow
(
false
);
});
}
},
[
isCopyshow
]);
// isCopyshow 가 바뀔 때만 effect를 재실행한다.
const
handleClick
=
()
=>
setCopyShow
(
true
);
return
(
<
Row
className
=
'
text-center w-100 my-2
'
>
<
Card
style
=
{
cardstyled
}
>
<
Card
.
Title
>
<
p
>
서버비용
후원하기
<
/p
>
<
/Card.Title
>
<
Card
.
Subtitle
>
이용하시는데
불편함이
없도록
광고
없이
운영하고
있습니다
.
<
br
/>
서버비용
충당
후
후원금이
남을시
UNICEF
에
기부하겠습니다
.
<
/Card.Subtitle
>
<
Row
className
=
'
my-2 d-flex justify-content-center
'
>
<
Button
variant
=
'
light
'
style
=
{
btnstyled2
}
onClick
=
{()
=>
setDonateShow
(
true
)}
>
♥
후원하기
<
/Button
>
<
Modal
size
=
'
md
'
show
=
{
donateShow
}
onHide
=
{
HandleClose
}
style
=
{{
top
:
'
80px
'
,
left
:
'
1vw
'
}}
>
<
Modal
.
Header
className
=
'
d-flex justify-content-center
'
>
<
Modal
.
Title
>
♥
Thank
you
for
Donation
♥
<
/Modal.Title
>
<
/Modal.Header
>
<
Modal
.
Body
>
<
Col
className
=
'
d-flex justify-content-center text-center
'
style
=
{{
flexDirection
:
'
column
'
}}
>
<
Card
style
=
{{
color
:
'
rgb(109, 110, 109)
'
,
paddingTop
:
'
10px
'
}}
>
카카오뱅크
<
CopyToClipboard
text
=
{
'
박상호 3333-16-7299769
'
}
>
<
p
className
=
'
m-auto
'
style
=
{
btnstyled2
}
>
박상호
3333
-
16
-
7299769
<
Button
variant
=
'
light
'
disabled
=
{
isCopyshow
}
onClick
=
{
!
isCopyshow
?
handleClick
:
null
}
style
=
{{
background
:
'
lightgray
'
,
margin
:
'
5px
'
,
maxWidth
:
'
fit-content
'
,
borderWidth
:
'
2px
'
,
fontSize
:
'
14px
'
,
color
:
'
black
'
,
border
:
'
none
'
,
whiteSpace
:
'
nowrap
'
}}
>
{
isCopyshow
?
'
복사 성공!
'
:
'
복사
'
}
<
/Button
>
<
/p
>
<
/CopyToClipboard
>
<
/Card
>
<
/Col
>
<
/Modal.Body
>
<
Modal
.
Footer
>
<
Button
variant
=
'
light
'
style
=
{
btnstyled2
}
onClick
=
{
HandleClose
}
>
닫기
<
/Button
>
<
/Modal.Footer
>
<
/Modal
>
<
/Row
>
<
Row
className
=
'
d-flex justify-content-center flex-direction-column
'
style
=
{{
color
:
'
rgb(109, 110, 109)
'
,
flexDirection
:
'
column
'
,
fontSize
:
'
0.8em
'
}}
>
<
/Row
>
<
/Card
>
<
/Row
>
)
}
export
default
Donation
;
\ No newline at end of file
client/src/components/EueSuggest.js
View file @
3a341f06
...
@@ -14,6 +14,7 @@ function EueSuggest() {
...
@@ -14,6 +14,7 @@ function EueSuggest() {
borderColor
:
'
rgb(110, 189, 142)
'
,
borderColor
:
'
rgb(110, 189, 142)
'
,
color
:
'
#04AB70
'
color
:
'
#04AB70
'
}
}
const
airUsing
=
localStorage
.
getItem
(
'
using-aircondition
'
)
const
airUsing
=
localStorage
.
getItem
(
'
using-aircondition
'
)
...
...
client/src/components/Footer.js
View file @
3a341f06
import
React
,
{
useEffect
,
useState
}
from
'
react
'
import
React
from
'
react
'
import
{
Row
,
Card
,
Button
,
Col
,
Modal
,
}
from
'
react-bootstrap
'
;
import
{
CopyToClipboard
}
from
'
react-copy-to-clipboard
'
;
import
'
../App.css
'
import
'
../App.css
'
import
{
Container
,
Row
,
Col
}
from
'
react-bootstrap
'
;
function
Footer
()
{
const
cardstyled
=
{
margin
:
'
auto
'
,
padding
:
'
1em
'
,
display
:
'
flex
'
,
justifyContent
:
'
center
'
,
width
:
'
100%
'
,
borderWidth
:
'
3px
'
,
borderRadius
:
'
20px
'
,
borderColor
:
'
rgb(110, 189, 142)
'
,
color
:
'
#04AB70
'
}
const
btnstyled2
=
{
background
:
'
white
'
,
margin
:
'
1px
'
,
maxWidth
:
'
fit-content
'
,
borderWidth
:
'
2px
'
,
color
:
'
rgb(110, 189, 142)
'
,
borderColor
:
'
rgba(195, 195, 195, 0.753)
'
,
borderRadius
:
'
20px
'
,
}
const
[
donateShow
,
setDonateShow
]
=
useState
(
false
);
const
[
isCopyshow
,
setCopyShow
]
=
useState
(
false
);
const
HandleClose
=
()
=>
setDonateShow
(
false
);
function
clickAndTwoSec
()
{
return
new
Promise
((
resolve
)
=>
setTimeout
(
resolve
,
2000
))
}
useEffect
(()
=>
{
function
Footer
()
{
if
(
isCopyshow
)
{
clickAndTwoSec
().
then
(()
=>
{
setCopyShow
(
false
);
});
}
},
[
isCopyshow
]);
// isCopyshow 가 바뀔 때만 effect를 재실행한다.
const
handleClick
=
()
=>
setCopyShow
(
true
);
return
(
return
(
<
Row
className
=
'
text-center w-100 my-2
'
>
<
Container
className
=
'
m-auto d-flex justify-content-center
'
id
=
'
footer
'
>
<
Card
style
=
{
cardstyled
}
>
<
Row
className
=
'
m-auto d-flex justify-content-center text-center w-100
'
<
Card
.
Title
>
style
=
{{
fontSize
:
'
0.8em
'
}}
>
<
p
>
<
hr
/>
서버비용
후원하기
<
Col
style
=
{{
display
:
'
flex
'
,
color
:
'
gray
'
,
fontWeight
:
'
300
'
,
alignItems
:
'
center
'
,
justifyContent
:
'
center
'
}}
>
<
/p
>
<
/Card.Title
>
<
Card
.
Subtitle
>
이용하시는데
불편함이
없도록
광고
없이
운영하고
있습니다
.
<
br
/>
서버비용
충당
후
후원금이
남을시
UNICEF
에
기부하겠습니다
.
<
/Card.Subtitle
>
<
Row
className
=
'
my-2 d-flex justify-content-center
'
>
<
Button
variant
=
'
light
'
style
=
{
btnstyled2
}
onClick
=
{()
=>
setDonateShow
(
true
)}
>
♥
후원하기
<
/Button
>
<
Modal
size
=
'
md
'
show
=
{
donateShow
}
onHide
=
{
HandleClose
}
style
=
{{
top
:
'
80px
'
,
left
:
'
1vw
'
}}
>
<
Modal
.
Header
className
=
'
d-flex justify-content-center
'
>
<
Modal
.
Title
>
♥
Thank
you
for
Donation
♥
<
/Modal.Title
>
<
/Modal.Header
>
<
Modal
.
Body
>
<
Col
className
=
'
d-flex justify-content-center text-center
'
style
=
{{
flexDirection
:
'
column
'
}}
>
<
Card
style
=
{{
color
:
'
rgb(109, 110, 109)
'
,
paddingTop
:
'
10px
'
}}
>
카카오뱅크
<
CopyToClipboard
text
=
{
'
박상호 3333-16-7299769
'
}
>
<
p
className
=
'
m-auto
'
style
=
{
btnstyled2
}
>
박상호
3333
-
16
-
7299769
<
Button
variant
=
'
light
'
disabled
=
{
isCopyshow
}
onClick
=
{
!
isCopyshow
?
handleClick
:
null
}
style
=
{{
background
:
'
lightgray
'
,
margin
:
'
5px
'
,
maxWidth
:
'
fit-content
'
,
borderWidth
:
'
2px
'
,
fontSize
:
'
14px
'
,
color
:
'
black
'
,
border
:
'
none
'
,
whiteSpace
:
'
nowrap
'
}}
>
{
isCopyshow
?
'
복사 성공!
'
:
'
복사
'
}
<
/Button
>
<
/p
>
<
/CopyToClipboard
>
<
/Card
>
<
/Col
>
<
/Modal.Body
>
<
Modal
.
Footer
>
<
Button
variant
=
'
light
'
style
=
{
btnstyled2
}
onClick
=
{
HandleClose
}
>
닫기
<
/Button
>
<
/Modal.Footer
>
<
/Modal
>
<
/Row
>
<
Row
className
=
'
d-flex justify-content-center flex-direction-column
'
style
=
{{
color
:
'
rgb(109, 110, 109)
'
,
flexDirection
:
'
column
'
,
fontSize
:
'
0.8em
'
}}
>
<
Col
>
<
a
href
=
'
https://www.notion.so/EUE-047f1812c6c24096a528dfd3330c227d
'
style
=
{{
color
:
'
rgb(110, 189, 142)
'
}}
>
TEAM
EUE
<
/a> : 안강민, 박상호, 박예
은
<
/Col
>
<
Col
>
©
2021
TEAM
EUE
.
All
rights
reserved
©
2021
TEAM
EUE
.
All
rights
reserved
<
/Col
>
<
/Col
>
<
/Row
>
<
Col
>
<
a
href
=
'
https://www.notion.so/EUE-047f1812c6c24096a528dfd3330c227d
'
style
=
{{
color
:
'
#04AB70
'
,
textDecoration
:
'
none
'
,
fontWeight
:
'
300
'
}}
>
<
/Card
>
<
strong
>
TEAM
EUE
<
/strong
>
<
/a> <br /
>
안강민
,
박상호
,
박예은
<
/Col
>
<
/Row
>
<
/Row
>
<
/Container
>
)
)
}
}
...
...
client/src/components/LocCodeChange.js
View file @
3a341f06
...
@@ -22,9 +22,11 @@ function LocCodeChange() {
...
@@ -22,9 +22,11 @@ function LocCodeChange() {
const
inboxstyled
=
{
const
inboxstyled
=
{
display
:
'
flex
'
,
display
:
'
flex
'
,
flexDirection
:
'
column
'
,
flexDirection
:
'
column
'
,
maxWidth
:
'
80%
'
,
justifyContent
:
'
center
'
,
justifyContent
:
'
center
'
,
margin
:
'
auto
'
,
margin
:
'
auto
'
,
padding
:
'
10px
'
padding
:
'
0.5em
'
,
color
:
'
black
'
}
}
const
btnstyled2
=
{
const
btnstyled2
=
{
...
@@ -45,6 +47,7 @@ function LocCodeChange() {
...
@@ -45,6 +47,7 @@ function LocCodeChange() {
const
sggSelect
=
document
.
getElementById
(
'
select-sgg
'
)
const
sggSelect
=
document
.
getElementById
(
'
select-sgg
'
)
const
emdSelect
=
document
.
getElementById
(
'
select-emd
'
)
const
emdSelect
=
document
.
getElementById
(
'
select-emd
'
)
function
handleClickLoc
()
{
function
handleClickLoc
()
{
if
(
doeSelect
.
options
[
doeSelect
.
selectedIndex
].
text
!==
'
도
'
&&
sggSelect
.
options
[
sggSelect
.
selectedIndex
].
text
!==
'
시군구
'
&&
emdSelect
.
options
[
emdSelect
.
selectedIndex
].
text
!==
'
읍면동
'
)
{
if
(
doeSelect
.
options
[
doeSelect
.
selectedIndex
].
text
!==
'
도
'
&&
sggSelect
.
options
[
sggSelect
.
selectedIndex
].
text
!==
'
시군구
'
&&
emdSelect
.
options
[
emdSelect
.
selectedIndex
].
text
!==
'
읍면동
'
)
{
localStorage
.
setItem
(
'
code_doe
'
,
doeSelect
.
value
)
localStorage
.
setItem
(
'
code_doe
'
,
doeSelect
.
value
)
...
@@ -116,10 +119,10 @@ function LocCodeChange() {
...
@@ -116,10 +119,10 @@ function LocCodeChange() {
<
Row
className
=
'
text-center w-100 my-2
'
>
<
Row
className
=
'
text-center w-100 my-2
'
>
<
Card
style
=
{
cardstyled
}
>
<
Card
style
=
{
cardstyled
}
>
<
Card
.
Title
id
=
'
impactTitle
'
>
<
Card
.
Title
id
=
'
impactTitle
'
>
Local
Code
지역
코드
<
/Card.Title
>
<
/Card.Title
>
<
Card
.
Subtitle
style
=
{{
fontWeight
:
'
lighter
'
}}
>
<
Card
.
Subtitle
style
=
{{
fontWeight
:
'
lighter
'
}}
>
Please
select
a
your
region
본인의
지역을
선택해주세요
<
/Card.Subtitle
>
<
/Card.Subtitle
>
<
hr
/>
<
hr
/>
<
Card
.
Text
className
=
'
m-0
'
>
<
Card
.
Text
className
=
'
m-0
'
>
...
@@ -170,16 +173,14 @@ function LocCodeChange() {
...
@@ -170,16 +173,14 @@ function LocCodeChange() {
<
/Form.Group
>
<
/Form.Group
>
<
/Row
>
<
/Row
>
<
/Form
>
<
/Form
>
<
/Card.Text
>
<
Row
className
=
'
d-flex justify-content-center
'
>
<
Row
className
=
'
d-flex justify-content-center
'
>
<
Button
<
Button
variant
=
'
light
'
style
=
{
btnstyled2
}
onClick
=
{
handleClickLoc
}
>
variant
=
'
light
'
style
=
{
btnstyled2
}
onClick
=
{
handleClickLoc
}
>
확인
확인
<
/Button
>
<
/Button
>
<
/Row
>
<
/Row
>
<
/Card.Text
>
<
/Card
>
<
/Card
>
<
/Row
>
<
/Row
>
)
)
}
}
...
...
client/src/components/LoginComp.js
View file @
3a341f06
import
React
,
{
useState
}
from
'
react
'
;
import
React
,
{
useState
}
from
'
react
'
;
import
'
../App.css
'
import
'
../App.css
'
import
{
Form
,
Button
,
Row
,
Col
,
Card
,
Alert
}
from
'
react-bootstrap
'
;
import
{
Form
,
Button
,
Row
,
Col
,
Card
,
Alert
,
FloatingLabel
}
from
'
react-bootstrap
'
;
import
{
LoginWithKakao
}
from
'
../utils/Oauth
'
;
import
{
LoginWithKakao
}
from
'
../utils/Oauth
'
;
function
LoginComp
()
{
function
LoginComp
()
{
...
@@ -23,7 +23,8 @@ function LoginComp() {
...
@@ -23,7 +23,8 @@ function LoginComp() {
maxWidth
:
'
80%
'
,
maxWidth
:
'
80%
'
,
justifyContent
:
'
center
'
,
justifyContent
:
'
center
'
,
margin
:
'
auto
'
,
margin
:
'
auto
'
,
padding
:
'
10px
'
padding
:
'
0.5em
'
,
color
:
'
black
'
}
}
const
[
emailSentAlert
,
setEmailSentAlert
]
=
useState
(
false
)
const
[
emailSentAlert
,
setEmailSentAlert
]
=
useState
(
false
)
...
@@ -34,7 +35,7 @@ function LoginComp() {
...
@@ -34,7 +35,7 @@ function LoginComp() {
function
CheckEmailSend
()
{
function
CheckEmailSend
()
{
localStorage
.
setItem
(
'
login_email_Address
'
,
emailAddress
)
localStorage
.
setItem
(
'
login_email_Address
'
,
emailAddress
)
const
emailIs
=
localStorage
.
getItem
(
'
login_email_Address
'
).
split
(
'
@
'
)[
1
]
const
emailIs
=
localStorage
.
getItem
(
'
login_email_Address
'
).
split
(
'
@
'
)[
1
]
if
(
emailIs
)
{
if
(
emailIs
)
{
setAlertShow
(
true
)
setAlertShow
(
true
)
setEmailSentAlert
(
false
)
setEmailSentAlert
(
false
)
}
}
...
@@ -89,9 +90,13 @@ function LoginComp() {
...
@@ -89,9 +90,13 @@ function LoginComp() {
<
/Row
>
<
/Row
>
<
Form
style
=
{
inboxstyled
}
>
<
Form
style
=
{
inboxstyled
}
>
<
Form
.
Group
controlId
=
"
formBasicEmail
"
>
<
FloatingLabel
controlId
=
"
floatingInput
"
label
=
"
Email
"
>
<
Form
.
Control
type
=
"
email
"
placeholder
=
"
Email
"
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
type
=
"
email
"
placeholder
=
"
Email
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
/FloatingLabel
>
<
Button
variant
=
'
light
'
className
=
'
mt-3
'
id
=
'
formbtn
'
onClick
=
{
CheckEmailSend
}
>
<
Button
variant
=
'
light
'
className
=
'
mt-3
'
id
=
'
formbtn
'
onClick
=
{
CheckEmailSend
}
>
LOGIN
LOGIN
<
/Button
>
<
/Button
>
...
...
client/src/components/MainLayer.js
View file @
3a341f06
...
@@ -4,6 +4,7 @@ import { Link } from 'react-router-dom';
...
@@ -4,6 +4,7 @@ import { Link } from 'react-router-dom';
import
'
../App.css
'
import
'
../App.css
'
import
UserInfo
from
'
./UserInfo
'
;
import
UserInfo
from
'
./UserInfo
'
;
import
{
kakaoLogout
}
from
'
../utils/Oauth
'
;
import
{
kakaoLogout
}
from
'
../utils/Oauth
'
;
import
axios
from
'
axios
'
;
function
MainLayer
()
{
function
MainLayer
()
{
...
@@ -13,10 +14,8 @@ function MainLayer() {
...
@@ -13,10 +14,8 @@ function MainLayer() {
color
:
'
rgba(195, 195, 195, 0.753)
'
,
color
:
'
rgba(195, 195, 195, 0.753)
'
,
borderRadius
:
'
20px
'
,
borderRadius
:
'
20px
'
,
borderWidth
:
'
3px
'
,
borderWidth
:
'
3px
'
,
marginBottom
:
'
1em
'
,
width
:
'
100%
'
,
width
:
'
100%
'
,
backgroundSize
:
'
contain
'
,
backgroundSize
:
'
contain
'
,
margin
:
'
auto
'
,
textDecorationColor
:
'
none
'
textDecorationColor
:
'
none
'
}
}
...
@@ -45,21 +44,17 @@ function MainLayer() {
...
@@ -45,21 +44,17 @@ function MainLayer() {
useEffect
(()
=>
{
useEffect
(()
=>
{
const
airUsingLocal
=
localStorage
.
getItem
(
'
using-aircondition
'
)
const
airUsingLocal
=
localStorage
.
getItem
(
'
using-aircondition
'
)
if
(
airUsingLocal
===
'
true
'
)
{
if
(
airUsingLocal
===
'
true
'
)
{
console
.
log
(
'
!!
'
,
airUsing
);
console
.
log
(
airUsingLocal
);
return
setAirUsing
(
true
)
return
setAirUsing
(
true
)
}
}
else
{
else
{
console
.
log
(
'
%%
'
,
airUsing
);
console
.
log
(
airUsingLocal
);
return
setAirUsing
(
false
)
return
setAirUsing
(
false
)
}
}
});
});
return
(
return
(
<
Col
>
<
Col
>
<
Row
className
=
'
d-flex align-items-center m-auto w-100
'
>
<
Row
className
=
'
d-flex align-items-center m-auto w-100
p-0
'
>
<
Link
to
=
'
/
'
className
=
'
m-auto
'
>
<
Link
to
=
'
/
'
className
=
'
p-0
m-auto
'
>
<
Image
src
=
'
/images/EUE11.jpg
'
alt
=
'
EUE
'
style
=
{
boxstyled
}
/
>
<
Image
src
=
'
/images/EUE11.jpg
'
alt
=
'
EUE
'
style
=
{
boxstyled
}
/
>
<
/Link
>
<
/Link
>
<
/Row
>
<
/Row
>
...
@@ -73,7 +68,7 @@ function MainLayer() {
...
@@ -73,7 +68,7 @@ function MainLayer() {
key
=
'
checkbox
'
className
=
"
d-flex justify-content-center w-100
"
style
=
{{
flexDirection
:
'
row-reverse
'
}}
>
key
=
'
checkbox
'
className
=
"
d-flex justify-content-center w-100
"
style
=
{{
flexDirection
:
'
row-reverse
'
}}
>
<
Form
.
Check
<
Form
.
Check
type
=
'
switch
'
type
=
'
switch
'
id
=
'
aircondition
-checkbox
'
id
=
'
aircondition
er
'
label
=
'
에어컨 사용중
'
label
=
'
에어컨 사용중
'
onChange
=
{
aircondiCheck
}
onChange
=
{
aircondiCheck
}
checked
=
{
airUsing
}
checked
=
{
airUsing
}
...
...
client/src/components/NicknameChange.js
0 → 100644
View file @
3a341f06
import
React
,
{
useEffect
}
from
'
react
'
import
{
Row
,
Card
,
Col
,
Form
,
Button
,
FloatingLabel
}
from
'
react-bootstrap
'
;
function
NicknameChange
()
{
const
cardstyled
=
{
margin
:
'
auto
'
,
padding
:
'
1em
'
,
display
:
'
flex
'
,
justifyContent
:
'
center
'
,
width
:
'
100%
'
,
borderWidth
:
'
3px
'
,
borderRadius
:
'
20px
'
,
borderColor
:
'
rgb(110, 189, 142)
'
,
color
:
'
#04AB70
'
}
const
inboxstyled
=
{
display
:
'
flex
'
,
flexDirection
:
'
column
'
,
maxWidth
:
'
80%
'
,
justifyContent
:
'
center
'
,
margin
:
'
auto
'
,
padding
:
'
0.5em
'
,
color
:
'
black
'
}
const
exNick
=
localStorage
.
getItem
(
'
nickname
'
)
console
.
log
(
exNick
)
function
handleChange
({
target
:
{
value
}
})
{
localStorage
.
setItem
(
'
nickname
'
,
value
)
}
function
handleSubmit
(
event
)
{
event
.
preventDefault
();
window
.
location
.
reload
();
};
return
(
<
Row
className
=
'
text-center w-100 my-2
'
>
<
Card
style
=
{
cardstyled
}
>
<
Card
.
Title
id
=
'
impactTitle
'
>
닉네임
변경
<
/Card.Title
>
<
Card
.
Subtitle
style
=
{{
fontWeight
:
'
lighter
'
}}
>
새로운
닉네임으로
변경해보세요
<
/Card.Subtitle
>
<
hr
/>
<
Card
.
Text
className
=
'
m-0
'
>
<
Form
style
=
{
inboxstyled
}
onSubmit
=
{
handleSubmit
}
>
<
FloatingLabel
controlId
=
"
floatingInput
"
label
=
"
Nickname
"
>
<
Form
.
Control
type
=
"
text
"
placeholder
=
"
닉네임 변경
"
id
=
'
nickname
'
onChange
=
{
handleChange
}
/
>
<
/FloatingLabel
>
<
Button
variant
=
'
light
'
className
=
'
mt-3
'
id
=
'
formbtn
'
type
=
'
submit
'
>
변
경
<
/Button
>
<
/Form
>
<
/Card.Text
>
<
/Card
>
<
/Row
>
)
}
export
default
NicknameChange
;
\ No newline at end of file
client/src/components/SignupComp.js
View file @
3a341f06
import
React
,
{
useState
}
from
'
react
'
import
React
,
{
useState
}
from
'
react
'
import
'
../App.css
'
import
'
../App.css
'
import
{
Form
,
Button
,
Row
,
Col
,
Card
,
Alert
}
from
'
react-bootstrap
'
;
import
{
Form
,
Button
,
Row
,
Col
,
Card
,
Alert
,
FloatingLabel
}
from
'
react-bootstrap
'
;
import
{
LoginWithKakao
}
from
'
../utils/Oauth
'
;
import
{
LoginWithKakao
}
from
'
../utils/Oauth
'
;
function
SignupComp
()
{
function
SignupComp
()
{
...
@@ -23,7 +23,8 @@ function SignupComp() {
...
@@ -23,7 +23,8 @@ function SignupComp() {
maxWidth
:
'
80%
'
,
maxWidth
:
'
80%
'
,
justifyContent
:
'
center
'
,
justifyContent
:
'
center
'
,
margin
:
'
auto
'
,
margin
:
'
auto
'
,
padding
:
'
1rem
'
padding
:
'
0.5em
'
,
color
:
'
black
'
}
}
const
initValues
=
{
const
initValues
=
{
...
@@ -125,10 +126,12 @@ function SignupComp() {
...
@@ -125,10 +126,12 @@ function SignupComp() {
}
}
<
/Row
>
<
/Row
>
<
Form
style
=
{
inboxstyled
}
<
Form
style
=
{
inboxstyled
}
onSubmit
=
{
handleSubmit
}
>
onSubmit
=
{
handleSubmit
}
>
<
FloatingLabel
<
Form
.
Group
controlId
=
"
username
"
>
controlId
=
"
floatingInput
"
<
Row
className
=
'
m-auto mb-1 d-flex justify-content-center
'
>
label
=
"
Name
"
className
=
'
mb-3
'
>
<
Form
.
Control
<
Form
.
Control
type
=
"
text
"
type
=
"
text
"
name
=
"
name
"
name
=
"
name
"
...
@@ -137,11 +140,11 @@ function SignupComp() {
...
@@ -137,11 +140,11 @@ function SignupComp() {
onChange
=
{
handleChange
}
onChange
=
{
handleChange
}
required
required
/>
/>
<
/Row
>
<
/FloatingLabel
>
<
Row
>
<
FloatingLabel
<
p
><
/p
>
controlId
=
"
floatingInput
"
<
/Row
>
label
=
"
Email Address
"
<
Row
className
=
'
m-auto d-flex justify-content-center
'
>
>
<
Form
.
Control
<
Form
.
Control
type
=
"
email
"
type
=
"
email
"
name
=
"
email
"
name
=
"
email
"
...
@@ -150,10 +153,9 @@ function SignupComp() {
...
@@ -150,10 +153,9 @@ function SignupComp() {
onChange
=
{
handleChange
}
onChange
=
{
handleChange
}
required
required
/>
/>
<
/Row
>
<
/FloatingLabel
>
<
/Form.Group
>
<
Button
variant
=
'
light
'
className
=
'
mt-3
'
id
=
'
formbtn
'
onClick
=
{
CheckUserExist
}
>
<
Button
variant
=
'
light
'
className
=
'
mt-3
'
id
=
'
formbtn
'
type
=
'
submit
'
onClick
=
{
CheckUserExist
}
>
{
/* type="submit" */
}
{
/* type="submit" */
}
Sign
Up
Sign
Up
<
/Button
>
<
/Button
>
...
...
client/src/components/UserInfo.js
View file @
3a341f06
...
@@ -40,7 +40,6 @@ function UserInfo() {
...
@@ -40,7 +40,6 @@ function UserInfo() {
}
}
return
(
return
(
<
Row
>
<
Col
className
=
'
text-center pt-3 pb-2 px-0
'
>
<
Col
className
=
'
text-center pt-3 pb-2 px-0
'
>
<
Card
style
=
{
cardstyled
}
id
=
'
localName
'
>
<
Card
style
=
{
cardstyled
}
id
=
'
localName
'
>
<
Card
.
Title
>
<
Card
.
Title
>
...
@@ -95,7 +94,6 @@ function UserInfo() {
...
@@ -95,7 +94,6 @@ function UserInfo() {
}
}
<
/Card
>
<
/Card
>
<
/Col
>
<
/Col
>
<
/Row
>
)
)
}
}
export
default
UserInfo
;
export
default
UserInfo
;
\ No newline at end of file
client/src/pages/Home.js
View file @
3a341f06
...
@@ -6,7 +6,7 @@ import '../App.css'
...
@@ -6,7 +6,7 @@ import '../App.css'
import
EueSuggest
from
'
../components/EueSuggest
'
;
import
EueSuggest
from
'
../components/EueSuggest
'
;
import
ChartLine
from
'
../components/ChartLine
'
;
import
ChartLine
from
'
../components/ChartLine
'
;
import
ChartDoughnut
from
'
../components/ChartDoughnut
'
;
import
ChartDoughnut
from
'
../components/ChartDoughnut
'
;
import
Footer
from
'
.
/.
./components/
Footer
'
;
import
Donation
from
'
../components/
Donation
'
;
import
axios
from
'
axios
'
;
import
axios
from
'
axios
'
;
...
@@ -32,16 +32,14 @@ function Home() {
...
@@ -32,16 +32,14 @@ function Home() {
padding
:
'
0
'
padding
:
'
0
'
}
}
axios
({
const
getusername
=
axios
.
get
(
`/api/user`
)
method
:
'
get
'
,
console
.
log
(
getusername
)
url
:
'
localhost:4500/loccode/doe
'
}).
then
((
res
)
=>
{
console
.
log
(
res
)
})
return
(
return
(
<
Container
fluid
className
=
'
m-auto d-flex justify-content-center position-relative
'
>
<
Container
className
=
'
m-auto d-flex position-relative
'
style
=
{{
flexDirection
:
'
column
'
}}
fluid
>
<
Row
className
=
'
d-flex
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
...
@@ -54,11 +52,11 @@ function Home() {
...
@@ -54,11 +52,11 @@ function Home() {
<
EueSuggest
/>
<
EueSuggest
/>
<
ChartLine
/>
<
ChartLine
/>
<
ChartDoughnut
/>
<
ChartDoughnut
/>
<
Footer
/>
<
Donation
/>
<
/Col
>
<
/Col
>
<
/Row
>
<
/Row
>
<
/Row
>
<
/Container
>
<
/Container
>
);
);
}
}
...
...
client/src/pages/LocalCodePage.js
View file @
3a341f06
...
@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
...
@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
import
MainLayer
from
'
../components/MainLayer
'
;
import
MainLayer
from
'
../components/MainLayer
'
;
import
'
../App.css
'
import
'
../App.css
'
import
LocCodeChange
from
'
../components/LocCodeChange
'
;
import
LocCodeChange
from
'
../components/LocCodeChange
'
;
import
NicknameChange
from
'
../components/NicknameChange
'
;
function
SignupPage
()
{
function
SignupPage
()
{
const
constyled
=
{
const
constyled
=
{
...
@@ -28,7 +29,9 @@ function SignupPage() {
...
@@ -28,7 +29,9 @@ function SignupPage() {
return
(
return
(
<
Container
fluid
className
=
'
m-auto d-flex justify-content-center position-relative
'
>
<
Container
className
=
'
m-auto d-flex position-relative
'
style
=
{{
flexDirection
:
'
column
'
}}
fluid
>
<
Row
className
=
'
d-flex
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
...
@@ -37,11 +40,12 @@ function SignupPage() {
...
@@ -37,11 +40,12 @@ function SignupPage() {
<
/Col
>
<
/Col
>
<
Col
md
=
{
6
}
style
=
{
col2sty
}
>
<
Col
md
=
{
6
}
style
=
{
col2sty
}
>
<
NicknameChange
/>
<
LocCodeChange
/>
<
LocCodeChange
/>
<
/Col
>
<
/Col
>
<
/Row
>
<
/Row
>
<
/Row
>
<
/Container
>
<
/Container
>
);
);
}
}
...
...
client/src/pages/LoginPage.js
View file @
3a341f06
...
@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
...
@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
import
MainLayer
from
'
../components/MainLayer
'
;
import
MainLayer
from
'
../components/MainLayer
'
;
import
'
../App.css
'
import
'
../App.css
'
import
LoginComp
from
'
../components/LoginComp
'
;
import
LoginComp
from
'
../components/LoginComp
'
;
import
Footer
from
'
./../components/Footer
'
;
function
SignupPage
()
{
function
SignupPage
()
{
const
constyled
=
{
const
constyled
=
{
...
@@ -28,7 +29,9 @@ function SignupPage() {
...
@@ -28,7 +29,9 @@ function SignupPage() {
return
(
return
(
<
Container
fluid
className
=
'
m-auto d-flex justify-content-center position-relative
'
>
<
Container
className
=
'
m-auto d-flex position-relative
'
style
=
{{
flexDirection
:
'
column
'
}}
fluid
>
<
Row
className
=
'
d-flex
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
...
@@ -37,10 +40,10 @@ function SignupPage() {
...
@@ -37,10 +40,10 @@ function SignupPage() {
<
/Col
>
<
/Col
>
<
Col
md
=
{
6
}
style
=
{
col2sty
}
>
<
Col
md
=
{
6
}
style
=
{
col2sty
}
>
<
LoginComp
/>
<
LoginComp
/>
<
/Col
>
<
/Col
>
<
/Row
>
<
/Row
>
<
/Row
>
<
/Container
>
<
/Container
>
);
);
...
...
client/src/pages/SignupPage.js
View file @
3a341f06
...
@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
...
@@ -3,6 +3,7 @@ import { Container, Row, Col } from 'react-bootstrap';
import
MainLayer
from
'
../components/MainLayer
'
;
import
MainLayer
from
'
../components/MainLayer
'
;
import
'
../App.css
'
import
'
../App.css
'
import
SignupComp
from
'
../components/SignupComp
'
;
import
SignupComp
from
'
../components/SignupComp
'
;
import
Footer
from
'
./../components/Footer
'
;
function
SignupPage
()
{
function
SignupPage
()
{
const
constyled
=
{
const
constyled
=
{
...
@@ -28,7 +29,9 @@ function SignupPage() {
...
@@ -28,7 +29,9 @@ function SignupPage() {
return
(
return
(
<
Container
fluid
className
=
'
m-auto d-flex justify-content-center position-relative
'
>
<
Container
className
=
'
m-auto d-flex position-relative
'
style
=
{{
flexDirection
:
'
column
'
}}
fluid
>
<
Row
className
=
'
d-flex
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Row
style
=
{
constyled
}
className
=
'
m-auto
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Col
xs
=
{
12
}
md
=
{
6
}
className
=
'
d-flex justify-content-center
'
id
=
'
stickyy
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
<
Row
style
=
{
col1sty
}
className
=
'
m-auto
'
>
...
@@ -40,6 +43,7 @@ function SignupPage() {
...
@@ -40,6 +43,7 @@ function SignupPage() {
<
SignupComp
/>
<
SignupComp
/>
<
/Col
>
<
/Col
>
<
/Row
>
<
/Row
>
<
/Row
>
<
/Container
>
<
/Container
>
);
);
...
...
client/src/routes.js
View file @
3a341f06
...
@@ -4,3 +4,11 @@ export const routes = {
...
@@ -4,3 +4,11 @@ export const routes = {
login
:
'
login
'
,
login
:
'
login
'
,
localcode
:
'
/local_code
'
,
localcode
:
'
/local_code
'
,
}
}
// post, put { body }
// email :
// nick_name :
// using_aircon :
// created_at :
// loc_code
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