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
shopping-mall
Commits
df51efcd
Commit
df51efcd
authored
Jan 13, 2021
by
이재연
Browse files
Merge remote-tracking branch 'origin/ourMaster' into jaeyeon
parents
98bc3e3a
e7e1d3d1
Changes
27
Show whitespace changes
Inline
Side-by-side
.gitignore
deleted
100644 → 0
View file @
98bc3e3a
node_modules
\ No newline at end of file
client/public/i
mg
/asd.jpg
→
client/public/i
con
/asd.jpg
View file @
df51efcd
File moved
client/
src
/cart.svg
→
client/
public/icon
/cart.svg
View file @
df51efcd
File moved
client/
src
/footprint.svg
→
client/
public/icon
/footprint.svg
View file @
df51efcd
File moved
client/
src
/logo.svg
→
client/
public/icon
/logo.svg
View file @
df51efcd
File moved
client/
src
/option.svg
→
client/
public/icon
/option.svg
View file @
df51efcd
File moved
client/public/i
mg
/payment_icon_yellow_medium.png
→
client/public/i
con
/payment_icon_yellow_medium.png
View file @
df51efcd
File moved
client/public/i
mg
/payment_icon_yellow_small.png
→
client/public/i
con
/payment_icon_yellow_small.png
View file @
df51efcd
File moved
client/
src
/search.svg
→
client/
public/icon
/search.svg
View file @
df51efcd
File moved
client/src/App.js
View file @
df51efcd
...
@@ -15,10 +15,6 @@ import SubNav from './Components/SubNav';
...
@@ -15,10 +15,6 @@ import SubNav from './Components/SubNav';
function
App
()
{
function
App
()
{
// const [user,setUser]=useState(null);
// const authenticated =user !=null;
// const login =({id, password}) => setUser(signIn({id,password}));
// const logout=()=>setUser(null);
return
(
return
(
...
@@ -42,7 +38,6 @@ function App() {
...
@@ -42,7 +38,6 @@ function App() {
<
/Switch
>
<
/Switch
>
<
/Router
>
<
/Router
>
<
/div
>
<
/div
>
)
)
...
...
client/src/Components/Card.js
View file @
df51efcd
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
function
C
ard
()
{
function
c
ard
(
props
)
{
const
[
card
,
setCard
]
=
useState
([...
props
])
return
(
return
(
<
div
><
/div
>
<
Card
className
=
"
mt-5
"
>
<
Card
.
Img
varient
=
"
top
"
src
=
{}
style
=
{{
objectFit
:
"
contain
"
,
height
:
"
22rem
"
}}
><
/Card.Img
>
<
Card
.
Body
>
<
Card
.
Title
><
/Card.Title
>
<
Card
.
Text
><
/Card.Text
>
<
Card
.
Text
><
/Card.Text
>
<
/Card.Body
>
<
/Card
>
)
)
}
}
export
default
Card
export
default
card
\ No newline at end of file
\ No newline at end of file
client/src/Components/MainNav.js
View file @
df51efcd
import
React
from
'
react
'
;
import
React
from
'
react
'
;
import
{
Navbar
,
Nav
}
from
'
react-bootstrap
'
;
import
{
Navbar
,
Nav
}
from
'
react-bootstrap
'
;
import
logo
from
'
../footprint.svg
'
;
import
cart
from
'
../cart.svg
'
;
import
option
from
'
../option.svg
'
;
import
{
handleLogout
,
isAuthenticated
}
from
'
../utils/auth
'
import
{
handleLogout
,
isAuthenticated
}
from
'
../utils/auth
'
function
MainNav
()
{
function
MainNav
()
{
...
@@ -11,7 +8,7 @@ function MainNav() {
...
@@ -11,7 +8,7 @@ function MainNav() {
return
(
return
(
<
Navbar
sticky
=
"
top
"
style
=
{{
background
:
"
#CDC5C2
"
}}
>
<
Navbar
sticky
=
"
top
"
style
=
{{
background
:
"
#CDC5C2
"
}}
>
<
Navbar
.
Brand
href
=
"
/home
"
className
=
"
text-light
"
>
<
Navbar
.
Brand
href
=
"
/home
"
className
=
"
text-light
"
>
<
img
alt
=
"
로고
"
src
=
{
logo
}
width
=
"
24
"
height
=
"
24
"
/>
<
img
alt
=
"
로고
"
src
=
"
icon/footprint.svg
"
width
=
"
24
"
height
=
"
24
"
/>
{
'
'
}
KU
#
{
'
'
}
KU
#
<
/Navbar.Brand
>
<
/Navbar.Brand
>
<
Nav
>
<
Nav
>
...
@@ -23,10 +20,10 @@ function MainNav() {
...
@@ -23,10 +20,10 @@ function MainNav() {
<
/
>
<
/
>
)}
)}
<
Nav
.
Link
href
=
"
/shoppingcart
"
>
<
Nav
.
Link
href
=
"
/shoppingcart
"
>
<
img
alt
=
"
카트
"
src
=
{
cart
}
width
=
"
30
"
height
=
"
30
"
/>
<
img
alt
=
"
카트
"
src
=
"
icon/cart.svg
"
width
=
"
30
"
height
=
"
30
"
/>
<
/Nav.Link
>
<
/Nav.Link
>
<
Nav
.
Link
href
=
"
/admin
"
>
<
Nav
.
Link
href
=
"
/admin
"
>
<
img
alt
=
"
관리자
"
src
=
{
option
}
width
=
"
30
"
height
=
"
30
"
/>
<
img
alt
=
"
관리자
"
src
=
"
icon/
option
.svg
"
width
=
"
30
"
height
=
"
30
"
/>
<
/Nav.Link
>
<
/Nav.Link
>
<
/Nav
>
<
/Nav
>
<
/Navbar
>
<
/Navbar
>
...
...
client/src/Pages/Admin.js
View file @
df51efcd
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
Pagination
from
'
../Components/Pagination
'
;
import
Pagination
from
'
../Components/Pagination
'
;
import
search
from
'
../search.svg
'
;
import
{
Row
,
Form
,
FormControl
,
Button
,
Card
,
Container
}
from
'
react-bootstrap
'
;
import
{
Row
,
Form
,
FormControl
,
Button
,
Card
,
Container
}
from
'
react-bootstrap
'
;
function
Admin
()
{
function
Admin
()
{
...
@@ -33,7 +32,7 @@ function Admin() {
...
@@ -33,7 +32,7 @@ function Admin() {
<
Row
as
=
{
Form
}
onSubmit
=
{
handleSubmit
}
className
=
"
justify-content-end mx-0 my-5
"
>
<
Row
as
=
{
Form
}
onSubmit
=
{
handleSubmit
}
className
=
"
justify-content-end mx-0 my-5
"
>
<
FormControl
type
=
"
text
"
placeholder
=
"
Search
"
style
=
{{
width
:
"
13rem
"
}}
/
>
<
FormControl
type
=
"
text
"
placeholder
=
"
Search
"
style
=
{{
width
:
"
13rem
"
}}
/
>
<
Button
type
=
"
submit
"
className
=
"
px-2
"
>
<
Button
type
=
"
submit
"
className
=
"
px-2
"
>
<
img
src
=
{
search
}
width
=
"
20
"
height
=
"
20
"
/>
<
img
src
=
"
icon/
search
.svg
"
width
=
"
20
"
height
=
"
20
"
/>
<
/Button
>
<
/Button
>
<
Button
sm
=
{
2
}
xs
=
{
6
}
type
=
"
button
"
href
=
"
/regist
"
className
=
"
ml-1
"
>
상품
등록
<
/Button
>
<
Button
sm
=
{
2
}
xs
=
{
6
}
type
=
"
button
"
href
=
"
/regist
"
className
=
"
ml-1
"
>
상품
등록
<
/Button
>
<
/Row
>
<
/Row
>
...
...
client/src/Pages/Home.js
View file @
df51efcd
...
@@ -10,42 +10,42 @@ function Home() {
...
@@ -10,42 +10,42 @@ function Home() {
<
h2
style
=
{{
marginRight
:
"
5rem
"
,
marginLeft
:
"
3rem
"
,
marginBottom
:
"
2rem
"
}}
><
u
>
Best
<
/u></
h2
>
<
h2
style
=
{{
marginRight
:
"
5rem
"
,
marginLeft
:
"
3rem
"
,
marginBottom
:
"
2rem
"
}}
><
u
>
Best
<
/u></
h2
>
<
Row
className
=
"
justify-content-center mx-0
"
>
<
Row
className
=
"
justify-content-center mx-0
"
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
...
@@ -57,42 +57,42 @@ function Home() {
...
@@ -57,42 +57,42 @@ function Home() {
<
h2
style
=
{{
marginRight
:
"
5rem
"
,
marginLeft
:
"
3rem
"
,
marginBottom
:
"
2rem
"
,
marginTop
:
"
2rem
"
}}
><
u
>
New
Arrival
<
/u></
h2
>
<
h2
style
=
{{
marginRight
:
"
5rem
"
,
marginLeft
:
"
3rem
"
,
marginBottom
:
"
2rem
"
,
marginTop
:
"
2rem
"
}}
><
u
>
New
Arrival
<
/u></
h2
>
<
Row
className
=
"
justify-content-center mx-0
"
>
<
Row
className
=
"
justify-content-center mx-0
"
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
/Card.Body
>
<
/Card.Body
>
<
/Card
>
<
/Card
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
className
=
"
mx-1 my-2
"
style
=
{{
width
:
'
18rem
'
}}
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
/>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
/>
<
Card
.
Body
>
<
Card
.
Body
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Title
className
=
"
font-weight-bold
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
가격
<
/Card.Text
>
...
...
client/src/Pages/Payment.js
View file @
df51efcd
...
@@ -254,7 +254,7 @@ function Payment() {
...
@@ -254,7 +254,7 @@ function Payment() {
<
h5
className
=
"
font-weight-bold py-3 border-top border-bottom text-center
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
결제수단
<
/h5
>
<
h5
className
=
"
font-weight-bold py-3 border-top border-bottom text-center
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
결제수단
<
/h5
>
<
div
className
=
"
text-center mt-5
"
>
<
div
className
=
"
text-center mt-5
"
>
<
Button
variant
=
"
success
"
className
=
"
align-top
"
onClick
=
{
handleClick
}
>
무통장입금
<
/Button
>
<
Button
variant
=
"
success
"
className
=
"
align-top
"
onClick
=
{
handleClick
}
>
무통장입금
<
/Button
>
<
input
type
=
"
image
"
alt
=
"
카카오페이결제
"
src
=
"
i
mg
/payment_icon_yellow_small.png
"
onClick
=
{
kakaopay
}
/
>
<
input
type
=
"
image
"
alt
=
"
카카오페이결제
"
src
=
"
i
con
/payment_icon_yellow_small.png
"
onClick
=
{
kakaopay
}
/
>
<
/div
>
<
/div
>
{
paymentWay
}
{
paymentWay
}
<
/div
>
<
/div
>
...
...
client/src/Pages/Product.js
View file @
df51efcd
...
@@ -4,10 +4,23 @@ import { Row, Col, Form, Card, Button } from 'react-bootstrap';
...
@@ -4,10 +4,23 @@ import { Row, Col, Form, Card, Button } from 'react-bootstrap';
import
catchErrors
from
'
../utils/catchErrors
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
function
Product
()
{
function
Product
()
{
const
[
product
,
setProduct
]
=
useState
()
const
[
select
,
setSelect
]
=
useState
({
color
:
""
,
size
:
""
})
const
[
select
,
setSelect
]
=
useState
({
color
:
""
,
size
:
""
})
const
[
cart
,
setCart
]
=
useState
()
const
[
cart
,
setCart
]
=
useState
()
const
[
error
,
setError
]
=
useState
(
''
)
const
[
error
,
setError
]
=
useState
(
''
)
async
function
getProduct
(
user
){
console
.
log
(
user
)
try
{
const
response
=
await
axios
.
get
(
'
/api/product/productone
'
)
setProduct
(
response
.
data
)
console
.
log
(
response
.
data
)
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
}
function
handleClick
(
e
)
{
function
handleClick
(
e
)
{
const
box
=
e
.
target
.
parentNode
.
parentNode
const
box
=
e
.
target
.
parentNode
.
parentNode
box
.
style
.
display
=
"
none
"
box
.
style
.
display
=
"
none
"
...
@@ -73,10 +86,12 @@ function Product() {
...
@@ -73,10 +86,12 @@ function Product() {
useEffect
(()
=>
{
useEffect
(()
=>
{
handleCreate
()
handleCreate
()
getProduct
()
},
[
cart
])
},
[
cart
])
return
(
return
(
<
div
>
<
div
>
{
/* {getProduct} */
}
<
style
type
=
"
text/css
"
>
<
style
type
=
"
text/css
"
>
{
`
{
`
.btn {
.btn {
...
...
client/src/Pages/ProductRegist.js
View file @
df51efcd
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Row
,
Col
,
Button
,
Form
,
Container
}
from
'
react-bootstrap
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
{
Row
,
Col
,
Button
,
Form
,
Container
,
Alert
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
import
axios
from
'
axios
'
import
catchErrors
from
'
../utils/catchErrors
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
let
color
=
{}
let
color
=
{}
let
c
olors
=
[]
let
preC
olors
=
[]
let
added
color
s
=
[]
let
color
Html
=
[]
let
list
=
[]
let
list
=
[]
function
ProductsRegist
()
{
function
ProductsRegist
()
{
...
@@ -16,8 +16,8 @@ function ProductsRegist() {
...
@@ -16,8 +16,8 @@ function ProductsRegist() {
stock
:
0
,
stock
:
0
,
main_category
:
''
,
main_category
:
''
,
sub_category
:
[],
sub_category
:
[],
size
:
[],
size
s
:
[],
color
:
[],
color
s
:
[],
description
:
''
,
description
:
''
,
main_image
:
[],
main_image
:
[],
detail_image
:
[]
detail_image
:
[]
...
@@ -61,25 +61,24 @@ function ProductsRegist() {
...
@@ -61,25 +61,24 @@ function ProductsRegist() {
}
}
function
addColor
()
{
function
addColor
()
{
addedcolors
.
push
(
preColors
.
push
(
color
[
"
colors
"
])
<
div
>
{
color
[
"
color
"
]}
<
/div
>
colorHtml
.
push
(
<
p
>
{
color
[
"
colors
"
]}
<
/p
>
)
)
if
(
product
.
color
)
{
setProduct
({...
product
,
"
colors
"
:
preColors
})
setProduct
({
...
product
,
[
color
]:
colors
})
}
else
{
setProduct
({
...
product
,
"
color
"
:
colors
})
}
}
function
colorChange
(
e
){
color
[
e
.
target
.
name
]
=
e
.
target
.
value
}
}
function
handleChange
(
event
)
{
function
handleChange
(
event
)
{
const
{
name
,
value
}
=
event
.
target
const
{
name
,
value
,
files
}
=
event
.
target
if
(
event
.
target
.
name
===
"
sub_category
"
)
{
if
(
event
.
target
.
name
===
"
sub_category
"
)
{
product
[
"
sub_category
"
].
push
(
event
.
target
.
value
)
product
[
"
sub_category
"
].
push
(
event
.
target
.
value
)
}
else
if
(
event
.
target
.
name
===
"
color
"
)
{
}
else
if
(
files
)
{
color
[
event
.
target
.
name
]
=
event
.
target
.
value
setProduct
({
...
product
,
[
name
]:
files
})
// console.log(color)
}
else
{
}
else
{
setProduct
({
...
product
,
[
name
]:
value
})
setProduct
({
...
product
,
[
name
]:
value
})
}
}
...
@@ -96,17 +95,33 @@ function ProductsRegist() {
...
@@ -96,17 +95,33 @@ function ProductsRegist() {
sizes
.
push
(
key
)
sizes
.
push
(
key
)
}
}
}
}
product
[
"
size
"
].
push
(
sizes
)
product
[
"
sizes
"
]
=
sizes
console
.
log
(
product
)
const
formData
=
new
FormData
();
const
formData
=
new
FormData
();
for
(
let
key
in
product
)
{
for
(
const
key
in
product
)
{
console
.
log
(
"
product[key]=
"
,
product
[
key
])
if
(
key
==
"
main_image
"
||
key
==
"
detail_image
"
)
{
for
(
const
file
of
product
[
key
])
{
formData
.
append
(
key
,
file
)
}
}
else
{
formData
.
append
(
key
,
product
[
key
])
formData
.
append
(
key
,
product
[
key
])
}
}
console
.
log
(
"
formData=
"
,
formData
)
}
console
.
log
(
product
)
// formData 값 확인용
// for (const key of formData.keys()) {
// console.log("key=",key);
// }
// for (const value of formData.values()) {
// console.log(value);
// }
try
{
try
{
const
response
=
axios
.
post
(
'
/api/product/regist
'
,
{
data
:
formData
})
const
response
=
await
axios
.
post
(
'
/api/product/regist
'
,
formData
)
setSuccess
(
true
)
console
.
log
(
response
)
}
catch
(
error
)
{
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
catchErrors
(
error
,
setError
)
}
}
...
@@ -120,6 +135,7 @@ function ProductsRegist() {
...
@@ -120,6 +135,7 @@ function ProductsRegist() {
<
Container
>
<
Container
>
<
Row
className
=
"
justify-content-md-center
"
>
<
Row
className
=
"
justify-content-md-center
"
>
<
Col
md
=
{
8
}
className
=
"
border p-1
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
<
Col
md
=
{
8
}
className
=
"
border p-1
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
{
error
&&
<
Alert
variant
=
"
danger
"
className
=
"
text-center
"
>
{
error
}
<
/Alert>
}
<
h2
className
=
"
text-center mt-5 font-weight-bold
"
>
상품등록
<
/h2
>
<
h2
className
=
"
text-center mt-5 font-weight-bold
"
>
상품등록
<
/h2
>
<
Form
className
=
"
p-5
"
onSubmit
=
{
handleSubmit
}
>
<
Form
className
=
"
p-5
"
onSubmit
=
{
handleSubmit
}
>
<
Form
.
Group
controlId
=
"
productNameform
"
>
<
Form
.
Group
controlId
=
"
productNameform
"
>
...
@@ -161,19 +177,18 @@ function ProductsRegist() {
...
@@ -161,19 +177,18 @@ function ProductsRegist() {
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Group
>
<
Form
.
Label
>
사이즈
<
/Form.Label
>
<
Form
.
Label
>
사이즈
<
/Form.Label
>
{
/* {console.log(checked)} */
}
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
Free
"
value
=
"
Free
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
size
"
label
=
"
Free
"
value
=
"
Free
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
XL
"
value
=
"
XL
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
size
"
label
=
"
XL
"
value
=
"
XL
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
L
"
value
=
"
L
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
size
"
label
=
"
L
"
value
=
"
L
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
M
"
value
=
"
M
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
size
"
label
=
"
M
"
value
=
"
M
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
S
"
value
=
"
S
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
size
"
label
=
"
S
"
value
=
"
S
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
XS
"
value
=
"
XS
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
size
"
label
=
"
XS
"
value
=
"
XS
"
onChange
=
{
handleCheckBox
}
/
>
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Group
>
<
Form
.
Label
>
색상
<
/Form.Label
>
<
Form
.
Label
>
색상
<
/Form.Label
>
<
Row
>
<
Row
>
<
Col
md
=
{
10
}
>
<
Col
md
=
{
10
}
>
<
Form
.
Control
as
=
"
textarea
"
rows
=
{
1
}
name
=
"
color
"
placeholder
=
"
색상
"
onChange
=
{
handle
Change
}
/
>
<
Form
.
Control
as
=
"
textarea
"
rows
=
{
1
}
name
=
"
color
s
"
placeholder
=
"
색상
"
onChange
=
{
color
Change
}
/
>
<
/Col
>
<
/Col
>
<
Col
>
<
Col
>
...
@@ -181,7 +196,7 @@ function ProductsRegist() {
...
@@ -181,7 +196,7 @@ function ProductsRegist() {
<
Button
className
=
"
float-right
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
onClick
=
{
addColor
}
>
추가
<
/Button
>
<
Button
className
=
"
float-right
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
onClick
=
{
addColor
}
>
추가
<
/Button
>
<
/Col
>
<
/Col
>
<
/Row
>
<
/Row
>
{
added
color
s
.
map
((
element
)
=>
element
)}
{
color
Html
.
map
((
element
)
=>
element
)}
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productDescriptionform
"
>
<
Form
.
Group
controlId
=
"
productDescriptionform
"
>
...
...
client/src/Pages/ProductsList.js
View file @
df51efcd
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
Pagination
from
'
../Components/Pagination
'
;
import
Pagination
from
'
../Components/Pagination
'
;
import
search
from
'
../search.svg
'
;
import
{
Container
,
Row
,
Col
,
Form
,
FormControl
,
Button
,
Card
,
Dropdown
}
from
'
react-bootstrap
'
;
import
{
Container
,
Row
,
Col
,
Form
,
FormControl
,
Button
,
Card
,
Dropdown
}
from
'
react-bootstrap
'
;
function
ProductsList
()
{
function
ProductsList
()
{
const
[
sub
,
setSub
]
=
useState
([
'
PADDED JACKET
'
,
'
JACKET
'
,
'
JUMPER
'
,
'
COAT
'
,
'
FLEECE
'
,
'
CARDIGAN / VEST
'
])
const
[
sub
,
setSub
]
=
useState
([
'
PADDED JACKET
'
,
'
JACKET
'
,
'
JUMPER
'
,
'
COAT
'
,
'
FLEECE
'
,
'
CARDIGAN / VEST
'
])
// useEffect(() => {
// getProfile(user)
// }, [user])
// async function getProfile(user){
// console.log(user)
// try {
// const response = await axios.get(`/api/users/profile/${user}`)
// setProfile(response.data)
// } catch (error) {
// catchErrors(error, setError)
// }
// }
function
handleSubmit
(
e
)
{
function
handleSubmit
(
e
)
{
e
.
preventDefault
()
e
.
preventDefault
()
}
}
...
@@ -26,11 +39,11 @@ function ProductsList() {
...
@@ -26,11 +39,11 @@ function ProductsList() {
`
}
`
}
<
/style
>
<
/style
>
<
Container
>
<
Container
>
<
Row
>
<
Row
className
=
"
justify-content-center
"
>
<
Col
sm
=
{
10
}
xs
=
{
12
}
>
<
Col
sm
=
{
10
}
xs
=
{
12
}
>
<
h1
style
=
{{
fontSize
:
"
3rem
"
}}
className
=
"
text-center
"
>
OUTER
<
/h1
>
<
h1
style
=
{{
fontSize
:
"
3rem
"
}}
className
=
"
text-center
"
>
OUTER
<
/h1
>
<
div
>
{
sub
.
map
((
ele
)
=>
(
<
div
className
=
"
text-center
"
>
{
sub
.
map
((
ele
)
=>
(
<
Button
className
=
"
justify-content-center
m-1
"
>
{
ele
}
<
/Button
>
<
Button
className
=
"
m-1
"
>
{
ele
}
<
/Button
>
))}
<
/div
>
))}
<
/div
>
<
/Col
>
<
/Col
>
<
/Row
>
<
/Row
>
...
@@ -45,11 +58,13 @@ function ProductsList() {
...
@@ -45,11 +58,13 @@ function ProductsList() {
<
Dropdown
.
Item
>
높은가격
<
/Dropdown.Item
>
<
Dropdown
.
Item
>
높은가격
<
/Dropdown.Item
>
<
/Dropdown.Menu
>
<
/Dropdown.Menu
>
<
/Dropdown
>
<
/Dropdown
>
<
Form
as
=
{
Row
}
onSubmit
=
{
handleSubmit
}
className
=
"
justify-content-end mx-0
"
>
<
FormControl
type
=
"
text
"
placeholder
=
"
Search
"
style
=
{{
width
:
"
13rem
"
}}
/
>
<
FormControl
type
=
"
text
"
placeholder
=
"
Search
"
style
=
{{
width
:
"
13rem
"
}}
/
>
<
Button
type
=
"
submit
"
className
=
"
search px-2
mb-1
"
>
<
Button
type
=
"
submit
"
className
=
"
search px-2
"
>
<
img
src
=
{
search
}
width
=
"
20
"
height
=
"
20
"
/>
<
img
src
=
"
icon/
search
.svg
"
width
=
"
20
"
height
=
"
20
"
/>
<
/Button
>
<
/Button
>
<
/Form
>
<
/Form
>
<
/Form
>
<
/Row
>
<
/Row
>
<
Row
md
=
{
8
}
sm
=
{
12
}
className
=
"
justify-content-start m-2
"
>
<
Row
md
=
{
8
}
sm
=
{
12
}
className
=
"
justify-content-start m-2
"
>
<
Card
className
=
"
mt-5
"
style
=
{{
width
:
"
18rem
"
,
margin
:
"
auto
"
}}
>
<
Card
className
=
"
mt-5
"
style
=
{{
width
:
"
18rem
"
,
margin
:
"
auto
"
}}
>
...
...
client/src/Pages/ShoppingCart.js
View file @
df51efcd
...
@@ -4,7 +4,6 @@ import { Card, Button, Container, Row, Col } from 'react-bootstrap';
...
@@ -4,7 +4,6 @@ import { Card, Button, Container, Row, Col } from 'react-bootstrap';
import
axios
from
'
axios
'
;
import
axios
from
'
axios
'
;
function
ShoppingCart
()
{
function
ShoppingCart
()
{
const
[
num
,
setNum
]
=
useState
(
0
)
const
[
num
,
setNum
]
=
useState
(
0
)
function
plusNum
()
{
function
plusNum
()
{
...
@@ -41,7 +40,7 @@ function ShoppingCart() {
...
@@ -41,7 +40,7 @@ function ShoppingCart() {
<
input
className
=
""
type
=
"
checkbox
"
id
=
"
exampleCheck1
"
/>
<
input
className
=
""
type
=
"
checkbox
"
id
=
"
exampleCheck1
"
/>
<
/Col
>
<
/Col
>
<
Col
className
=
"
text-center
"
>
<
Col
className
=
"
text-center
"
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
mg
/asd.jpg
"
style
=
{{
width
:
'
20rem
'
}}
/
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
i
con
/asd.jpg
"
style
=
{{
width
:
'
20rem
'
}}
/
>
<
/Col
>
<
/Col
>
<
Col
md
=
{
6
}
className
=
"
p-2
"
>
<
Col
md
=
{
6
}
className
=
"
p-2
"
>
<
Card
.
Body
>
<
Card
.
Body
>
...
...
client/src/Pages/Signup.js
View file @
df51efcd
...
@@ -14,7 +14,7 @@ const INIT_USER = {
...
@@ -14,7 +14,7 @@ const INIT_USER = {
}
}
function
Signup
()
{
function
Signup
()
{
const
[
user
,
setUser
]
=
useState
(
true
)
const
[
user
,
setUser
]
=
useState
(
INIT_USER
)
const
[
error
,
setError
]
=
useState
(
''
)
const
[
error
,
setError
]
=
useState
(
''
)
const
[
success
,
setSuccess
]
=
useState
(
false
)
const
[
success
,
setSuccess
]
=
useState
(
false
)
const
[
validated
,
setValidated
]
=
useState
(
false
);
const
[
validated
,
setValidated
]
=
useState
(
false
);
...
@@ -24,11 +24,9 @@ function Signup() {
...
@@ -24,11 +24,9 @@ function Signup() {
setUser
({
...
user
,
[
name
]:
value
})
setUser
({
...
user
,
[
name
]:
value
})
}
}
async
function
handleSubmit
(
event
)
{
async
function
handleSubmit
(
event
)
{
event
.
preventDefault
()
event
.
preventDefault
()
const
form
=
event
.
currentTarget
;
const
form
=
event
.
currentTarget
;
console
.
log
(
form
)
if
(
form
.
checkValidity
()
===
false
)
{
if
(
form
.
checkValidity
()
===
false
)
{
event
.
preventDefault
();
event
.
preventDefault
();
event
.
stopPropagation
();
event
.
stopPropagation
();
...
...
Prev
1
2
Next
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