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
39c07bff
Commit
39c07bff
authored
Jan 15, 2021
by
박상호
🎼
Browse files
Merge remote-tracking branch 'origin/ourMaster' into sangho
parents
c66765f3
ccc8f484
Changes
43
Hide whitespace changes
Inline
Side-by-side
client/src/Pages/Login.js
View file @
39c07bff
...
...
@@ -35,7 +35,7 @@ function Login() {
try
{
setError
(
''
)
const
response
=
await
axios
.
post
(
'
/api/auth/login
'
,
user
)
handleLogin
(
response
.
data
.
userId
)
handleLogin
(
response
.
data
)
setSuccess
(
true
)
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
...
...
client/src/Pages/Payment.js
View file @
39c07bff
...
...
@@ -210,9 +210,6 @@ function Payment() {
<
h5
className
=
"
font-weight-bold py-3 border-top border-bottom text-center
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
주문상품정보
<
/h5
>
<
Card
>
<
Row
className
=
"
mx-1
"
>
<
Col
xs
=
{
2
}
sm
=
{
2
}
className
=
"
text-center my-auto
"
>
<
input
className
=
""
type
=
"
checkbox
"
id
=
"
exampleCheck1
"
/>
<
/Col
>
<
Col
className
=
"
text-center
"
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
img/asd.jpg
"
style
=
{{
width
:
'
20rem
'
}}
/
>
<
/Col
>
...
...
@@ -254,7 +251,7 @@ function Payment() {
<
h5
className
=
"
font-weight-bold py-3 border-top border-bottom text-center
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
결제수단
<
/h5
>
<
div
className
=
"
text-center mt-5
"
>
<
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
>
{
paymentWay
}
<
/div
>
...
...
client/src/Pages/Product.js
View file @
39c07bff
...
...
@@ -3,32 +3,46 @@ import React, { useState, useEffect, useRef } from 'react';
import
{
Row
,
Col
,
Form
,
Card
,
Button
}
from
'
react-bootstrap
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
function
Product
()
{
const
[
product
,
setProduct
]
=
useState
()
const
[
select
,
setSelect
]
=
useState
({
color
:
""
,
size
:
""
})
const
[
cart
,
setCart
]
=
useState
()
const
[
error
,
setError
]
=
useState
(
''
)
const
preCart
=
[]
function
Product
({
match
,
location
})
{
const
[
product
,
setProduct
]
=
useState
(
location
.
state
)
const
[
cart
,
setCart
]
=
useState
(
location
.
state
)
const
[
error
,
setError
]
=
useState
(
''
)
const
[
selected
,
setSelected
]
=
useState
({
sizes
:
false
,
colors
:
false
})
const
[
price
,
setPrice
]
=
useState
(
0
)
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
)
useEffect
(()
=>
{
if
(
selected
.
sizes
===
true
&&
selected
.
colors
===
true
)
{
pushOptions
()
console
.
log
(
preCart
)
}
}
},
[
cart
])
function
handleClick
(
e
)
{
const
box
=
e
.
target
.
parentNode
.
parentNode
box
.
style
.
display
=
"
none
"
}
function
pushOptions
()
{
preCart
.
push
(
cart
)
selected
.
sizes
=
false
selected
.
colors
=
false
setPrice
(
product
.
price
+
price
)
}
function
handleChange
(
e
)
{
const
{
name
,
value
}
=
e
.
target
setSelect
({
...
select
,
[
name
]:
value
})
if
(
e
.
target
.
name
===
"
sizes
"
)
{
setCart
({
...
cart
,
[
name
]:
value
})
selected
.
sizes
=
true
}
else
if
(
e
.
target
.
name
===
"
colors
"
)
{
setCart
({
...
cart
,
[
name
]:
value
})
selected
.
colors
=
true
}
// setCart({ ...cart, [name]: value })
// handleCreate()
}
function
listDelete
(
e
)
{
...
...
@@ -38,60 +52,53 @@ function Product() {
}
function
handleCreate
()
{
console
.
log
(
"
실행
"
,
"
cart=
"
,
cart
)
if
(
cart
!==
undefined
)
{
if
(
cart
.
color
!==
""
)
{
const
list
=
document
.
getElementById
(
'
list
'
)
list
.
style
.
borderBottom
=
"
1px solid
"
const
shopping
=
document
.
createElement
(
'
div
'
)
shopping
.
className
=
"
d-flex justify-content-between my-2
"
shopping
.
innerHTML
=
`
${
cart
.
color
}
/
${
cart
.
size
}
<input type="number" min="0" max="10" value="1" style="width: 40px" />
<p style="margin-bottom: 0px">14,000원</p>`
const
deleteA
=
document
.
createElement
(
'
a
'
)
deleteA
.
innerText
=
'
X
'
deleteA
.
addEventListener
(
'
click
'
,
listDelete
)
shopping
.
appendChild
(
deleteA
)
list
.
appendChild
(
shopping
)
}
}
// if (product !== undefined) {
// if (product.colors !== "" && product.sizes !== "") {
// cart.push(
// <div className="d-flex justify-content-between my-2" >
// <p>{product.color} {product.size} </p>
// <input name="count" type="number" min="0" max="10" style="width: 40px" onChange={handleChange} />
// <p style="margin-bottom: 0px">{product.price}</p>
// </div>
// )
// const list = document.getElementById('list')
// list.style.borderBottom = "1px solid"
// const shopping = document.createElement('div')
// shopping.className = "d-flex justify-content-between my-2"
// shopping.innerHTML = `${product.color} / ${product.size}
// <input type="number" min="0" max="10" value="1" style="width: 40px" />
// <p style="margin-bottom: 0px">14,000원</p>`
// const deleteA = document.createElement('a')
// deleteA.innerText = 'X'
// deleteA.addEventListener('click', listDelete)
// shopping.appendChild(deleteA)
// list.appendChild(shopping)
// }
// }
}
async
function
addCart
()
{
// color, size, count, product
Object
Id(productlist에서 props), userId(로컬) 를 보내줌
//
preCart(
color, size, count
)
, productId(productlist에서 props), userId(로컬) 를 보내줌
try
{
// setError('')
const
response
=
await
axios
.
post
(
'
/api/addcart
'
,
{
userId
:
"
jiwon5393
"
,
productObjectId
:
"
5ff7fd63d41cae4ecce51dd1
"
,
color
:
"
red
"
,
size
:
"
free
"
,
count
:
"
1
"
setError
(
''
)
const
response
=
await
axios
.
put
(
'
/api/cart/addcart
'
,
{
userId
:
localStorage
.
getItem
(
'
loginStatus
'
),
productId
:
"
a8f4d63ead77717f940a2b27deb707a6
"
,
products
:
preCart
})
console
.
log
(
response
)
}
catch
(
error
){
//
catchErrors(error, setError)
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
alert
(
"
상품등록이 완료되었습니다.
"
)
}
useEffect
(()
=>
{
if
(
Object
.
keys
(
select
).
length
==
2
)
{
setCart
({
...
select
})
setSelect
({})
}
},
[
select
])
useEffect
(()
=>
{
handleCreate
()
getProduct
()
},
[
cart
])
// useEffect(() => {
// handleCreate()
// }, [product])
return
(
<
div
>
{
/* {getP
roduct
} */
}
{
console
.
log
(
"
match=
"
,
match
.
params
,
"
location=
"
,
location
.
state
,
"
product=
"
,
p
roduct
)
}
<
style
type
=
"
text/css
"
>
{
`
.btn {
...
...
@@ -107,33 +114,34 @@ function Product() {
<
/style
>
<
Row
className
=
"
justify-content-center mt-5 mx-0
"
>
<
Col
sm
=
{
11
}
md
=
{
4
}
>
<
img
src
=
"
https://img.sonyunara.com/files/goods/65976/1601953605_0.jpg
"
style
=
{{
objectFit
:
"
contain
"
,
width
:
"
100%
"
}}
/
>
<
img
src
=
{
product
.
main_img
}
style
=
{{
objectFit
:
"
contain
"
,
width
:
"
100%
"
}}
/
>
<
/Col
>
<
Col
sm
=
{
11
}
md
=
{
4
}
className
=
"
align-middle mt-4
"
>
<
h3
className
=
"
mb-4
"
>
sop682
리본끈셋원피스
<
/h3
>
<
h5
className
=
"
mb-4
"
>
가격
:
14
,
000
원
<
/h5
>
<
h3
className
=
"
mb-4
"
>
{
product
.
name
}
<
/h3
>
<
h5
className
=
"
mb-4
"
>
가격
:
{
product
.
price
}
원
<
/h5
>
<
Form
style
=
{{
borderBottom
:
"
1px solid
"
}}
>
<
Form
.
Group
style
=
{{
borderBottom
:
"
1px solid
"
,
paddingBottom
:
"
2rem
"
}}
>
<
Form
.
Label
>
색상
<
/Form.Label
>
<
Form
.
Control
as
=
"
select
"
className
=
"
mb-2
"
name
=
"
color
"
defaultValue
=
"
옵션 선택
"
onChange
=
{
handleChange
}
>
<
Form
.
Control
as
=
"
select
"
className
=
"
mb-2
"
name
=
"
color
s
"
defaultValue
=
"
옵션 선택
"
onChange
=
{
handleChange
}
>
<
option
>
옵션선택
<
/option
>
<
option
>
브릭레드
(
스트랩포함
)
<
/option
>
<
option
>
베이지
(
스트랩포함
)
<
/option
>
<
option
>
블랙
(
스트랩포함
)
<
/option
>
{
product
.
colors
.
map
((
e
)
=>
(
<
option
>
{
e
}
<
/option
>
))}
<
/Form.Control
>
<
Form
.
Label
>
사이즈
<
/Form.Label
>
<
Form
.
Control
as
=
"
select
"
className
=
"
mb-2
"
name
=
"
size
"
defaultValue
=
"
옵션 선택
"
onChange
=
{
handleChange
}
>
<
Form
.
Control
as
=
"
select
"
className
=
"
mb-2
"
name
=
"
size
s
"
defaultValue
=
"
옵션 선택
"
onChange
=
{
handleChange
}
>
<
option
>
옵션선택
<
/option
>
<
option
>
M
<
/option
>
<
option
>
L
<
/option
>
<
option
>
XL
<
/option
>
<
option
>
FREE
<
/option
>
{
product
.
sizes
.
map
((
e
)
=>
(
<
option
>
{
e
}
<
/option
>
))}
<
/Form.Control
>
<
/Form.Group
>
<
div
id
=
"
list
"
><
/div
>
{
preCart
.
map
((
e
)
=>
(
<
div
>
{
e
.
colors
}
/{e.sizes}</
div
>
))}
<
Row
className
=
"
justify-content-between mx-0 my-3
"
style
=
{{
width
:
"
100%
"
}}
>
<
Col
>
총
금액
<
/Col
>
<
Col
className
=
"
text-right
"
>
14
,
000
원
<
/Col
>
<
Col
className
=
"
text-right
"
>
{
price
}
원
<
/Col
>
<
/Row
>
<
Row
className
=
"
justify-content-between mx-0 my-3
"
style
=
{{
width
:
"
100%
"
}}
>
<
Button
onClick
=
{
addCart
}
style
=
{{
width
:
"
49%
"
}}
>
장바구니
<
/Button
>
...
...
client/src/Pages/ProductRegist.js
View file @
39c07bff
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Row
,
Col
,
Button
,
Form
,
Container
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
import
catchErrors
from
'
../utils/catchErrors
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
{
Row
,
Col
,
Button
,
Form
,
Container
,
Alert
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
let
color
=
{}
let
preColors
=
[]
let
colorHtml
=
[]
let
list
=
[]
...
...
@@ -22,40 +21,58 @@ function ProductsRegist() {
main_image
:
[],
detail_image
:
[]
}
const
categorys
=
{
"
DRESS
"
:
[
"
LONG DRESS
"
,
"
SHORT DRESS
"
,
"
KNIT DRESS
"
,
"
SHIRT DRESS
"
,
"
PATTERN DRESS
"
,
"
BUSTIER DRESS
"
,
"
TWO-PIECE DRESS
"
],
"
OUTER
"
:
[
"
PADDED JACKET
"
,
"
JACKET
"
,
"
JUMPER
"
,
"
COAT
"
,
"
FLEECE
"
,
"
CARDIGAN / VEST
"
],
"
TOP
"
:
[
"
KNIT
"
,
"
HOODY
"
,
"
BLOUSE
"
,
"
SHIRT
"
,
"
SWEATSHIRT
"
,
"
LONG SLEEVE SHIRT
"
,
"
SHORT SLEEVE / SLEEVELESS SHIRT
"
],
"
PANTS
"
:
[
"
JEANS
"
,
"
SKINNY JEANS
"
,
"
BANDING PANTS
"
,
"
WIDE-FIT PANTS
"
,
"
BOOT-CUT PANTS
"
,
"
STRAIGHT-FIT PANTS
"
,
"
SHORTS
"
,
"
TROUSERS
"
,
"
LEGGINGS
"
,
"
JUMPSUIT / OVERALLS
"
],
"
SKIRT
"
:
[
"
LONG SKIRT
"
,
"
MIDI SKIRT
"
,
"
MINI SKIRT
"
],
"
TRAINING
"
:
[],
"
SHOES
"
:
[
"
SNEAKERS / SLIP-ON
"
,
"
FLAT / LOAFER
"
,
"
HEEL / PUMP
"
,
"
BOOTS
"
,
"
SANDAL / SLIPPER
"
]
}
const
[
categories
,
setCategories
]
=
useState
({
0
:
[],
1
:
[[]]
})
const
[
product
,
setProduct
]
=
useState
(
INIT_PRODUCT
)
const
[
categoryNum
,
setCategoryNum
]
=
useState
(
0
)
const
[
tag
,
setTag
]
=
useState
(
0
)
const
[
subCate
,
setSubCate
]
=
useState
(
''
)
const
[
color
,
setColor
]
=
useState
({})
const
[
error
,
setError
]
=
useState
(
''
)
const
[
success
,
setSuccess
]
=
useState
(
false
)
const
[
checked
,
setChecked
]
=
useState
({
"
Free
"
:
false
,
"
XL
"
:
false
,
"
L
"
:
false
,
"
M
"
:
false
,
"
S
"
:
false
,
"
XS
"
:
false
})
const
mainCategorys
=
Object
.
keys
(
categorys
)
const
subCategorys
=
Object
.
values
(
categorys
)
useEffect
(
async
()
=>
{
try
{
const
response
=
await
axios
.
get
(
'
/api/categories/main
'
)
const
data
=
response
.
data
[
0
]
setCategories
([
Object
.
keys
(
data
),
Object
.
values
(
data
)])
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
},
[])
function
addCategory
()
{
console
.
log
(
product
)
list
.
push
(
<
div
>
<
span
i
=
{
tag
}
>
{
product
[
"
main_category
"
]}
/ {
product
[
"
sub
_c
ate
gory"
][
tag
]
}</
span
>
<
input
type
=
"
image
"
src
=
"
https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png
"
className
=
"
float-right align-middle
"
onClick
=
{
deleteCategory
}
/
>
<
span
name
=
{
subCate
}
>
{
product
[
"
main_category
"
]}
/ {sub
C
ate}
</
span
>
<
input
name
=
{
subCate
}
type
=
"
image
"
src
=
"
https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png
"
className
=
"
float-right align-middle
"
onClick
=
{
deleteCategory
}
/
>
<
/div>
)
setTag
(
tag
+
1
)
console
.
log
(
list
)
}
function
deleteCategory
(
e
)
{
const
categ
=
e
.
target
.
parentNode
categ
.
remove
()
product
[
"
sub_category
"
].
splice
(
e
.
target
.
parentNode
.
firstElementChild
.
getAttribute
(
"
i
"
),
1
)
console
.
log
(
product
)
e
.
target
.
parentNode
.
remove
()
const
index
=
product
[
"
sub_category
"
].
findIndex
((
item
)
=>
{
return
item
===
e
.
target
.
name
})
product
[
"
sub_category
"
].
splice
(
index
,
1
)
setSubCate
(
''
)
console
.
log
(
product
[
"
sub_category
"
].
length
)
}
function
handleCategory
(
e
)
{
const
{
name
,
value
}
=
e
.
target
if
(
e
.
target
.
name
===
"
main_category
"
)
{
setCategoryNum
(
e
.
target
.
selectedIndex
-
1
)
}
if
(
name
===
"
sub_category
"
)
{
product
[
name
].
push
(
value
)
setSubCate
(
value
)
}
else
{
setProduct
({
...
product
,
[
name
]:
value
})
}
console
.
log
(
value
)
}
function
handleCheckBox
(
e
)
{
setChecked
({
...
checked
,
[
e
.
target
.
value
]:
!
checked
[
`
${
e
.
target
.
value
}
`
]
})
}
...
...
@@ -63,28 +80,35 @@ function ProductsRegist() {
function
addColor
()
{
preColors
.
push
(
color
[
"
colors
"
])
colorHtml
.
push
(
<
p
>
{
color
[
"
colors
"
]}
<
/p
>
<
div
>
<
span
>
{
color
[
"
colors
"
]}
<
/span
>
<
input
name
=
{
subCate
}
type
=
"
image
"
src
=
"
https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png
"
className
=
"
float-right align-middle
"
onClick
=
{
deleteColor
}
/
>
<
/div
>
)
setProduct
({...
product
,
"
colors
"
:
preColors
})
setColor
({})
setProduct
({
...
product
,
"
colors
"
:
preColors
})
}
function
deleteColor
(
e
)
{
e
.
target
.
parentNode
.
remove
()
product
[
"
colors
"
].
splice
(
e
.
name
,
1
)
setColor
({})
console
.
log
(
product
)
}
function
colorChange
(
e
){
color
[
e
.
target
.
name
]
=
e
.
target
.
value
function
handleColor
(
e
)
{
color
[
e
.
target
.
name
]
=
e
.
target
.
value
}
function
handleChange
(
event
)
{
const
{
name
,
value
,
files
}
=
event
.
target
if
(
event
.
target
.
name
===
"
sub_category
"
)
{
product
[
"
sub_category
"
].
push
(
event
.
target
.
value
)
}
else
if
(
files
)
{
console
.
log
(
"
event.target.name=
"
,
name
,
"
event.target.value=
"
,
value
)
if
(
files
)
{
setProduct
({
...
product
,
[
name
]:
files
})
}
else
{
setProduct
({
...
product
,
[
name
]:
value
})
}
if
(
event
.
target
.
name
===
"
main_category
"
)
{
setCategoryNum
(
event
.
target
.
selectedIndex
-
1
)
}
}
async
function
handleSubmit
(
e
)
{
...
...
@@ -95,8 +119,7 @@ function ProductsRegist() {
sizes
.
push
(
key
)
}
}
product
[
"
sizes
"
]
=
sizes
console
.
log
(
product
)
product
[
"
sizes
"
]
=
sizes
const
formData
=
new
FormData
();
for
(
let
key
in
product
)
{
if
(
key
===
"
main_image
"
||
key
===
"
detail_image
"
)
{
...
...
@@ -107,103 +130,101 @@ function ProductsRegist() {
}
}
try
{
const
response
=
axios
.
post
(
'
/api/product/regist
'
,
formData
)
// setSuccess(true)
const
response
=
await
axios
.
post
(
'
/api/product/regist
'
,
formData
)
console
.
log
(
response
)
setSuccess
(
true
)
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
}
if
(
success
)
{
return
<
Redirect
to
=
'
/
'
/>
return
<
Redirect
to
=
'
/
admin
'
/>
}
return
(
<
div
>
<
Container
>
<
Row
className
=
"
justify-content-md-center
"
>
<
Col
md
=
{
8
}
className
=
"
border p-1
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
<
h2
className
=
"
text-center mt-5 font-weight-bold
"
>
상품등록
<
/h2
>
<
Form
className
=
"
p-5
"
onSubmit
=
{
handleSubmit
}
>
<
Form
.
Group
controlId
=
"
productNameform
"
>
<
Form
.
Label
>
상품명
<
/Form.Label
>
<
Form
.
Control
type
=
"
text
"
name
=
"
pro_name
"
placeholder
=
"
상품명
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productAmountform
"
>
<
Form
.
Label
>
재고
<
/Form.Label
>
<
Form
.
Control
type
=
"
text
"
name
=
"
stock
"
placeholder
=
"
숫자만 입력해주세요
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productPriceform
"
>
<
Form
.
Label
>
가격
<
/Form.Label
>
<
Form
.
Control
type
=
"
text
"
name
=
"
price
"
placeholder
=
"
숫자만 입력해주세요
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
분류
<
/Form.Label
>
<
Row
>
<
Col
md
=
{
4
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
main_category
"
onChange
=
{
handleChange
}
>
<
option
value
=
""
>
상위분류
<
/option
>
{
mainCategorys
.
map
((
main
)
=>
(
<
option
value
=
{
main
}
>
{
main
}
<
/option
>
))}
<
/Form.Control
>
<
/Col
>
<
Col
md
=
{
6
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
sub_category
"
onChange
=
{
handleChange
}
>
<
option
value
=
""
>
하위분류
<
/option
>
{
subCategorys
[
categoryNum
].
map
((
sub
)
=>
(
<
option
value
=
{
sub
}
>
{
sub
}
<
/option
>
))}
<
/Form.Control
>
<
/Col
>
<
Col
>
<
Button
className
=
"
float-right
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
onClick
=
{
addCategory
}
>
추가
<
/Button
>
<
/Col
>
<
/Row
>
{
list
.
map
((
element
)
=>
element
)}
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
사이즈
<
/Form.Label
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
Free
"
value
=
"
Free
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
XL
"
value
=
"
XL
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
L
"
value
=
"
L
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
M
"
value
=
"
M
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
S
"
value
=
"
S
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
XS
"
value
=
"
XS
"
onChange
=
{
handleCheckBox
}
/
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
색상
<
/Form.Label
>
<
Row
>
<
Col
md
=
{
10
}
>
<
Form
.
Control
as
=
"
textarea
"
rows
=
{
1
}
name
=
"
colors
"
placeholder
=
"
색상
"
onChange
=
{
colorChange
}
/
>
<
/Col
>
<
Col
>
<
Button
className
=
"
float-right
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
onClick
=
{
addColor
}
>
추가
<
/Button
>
<
/Col
>
<
/Row
>
{
colorHtml
.
map
((
element
)
=>
element
)}
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productDescriptionform
"
>
<
Form
.
Label
>
상품설명
<
/Form.Label
>
<
Form
.
Control
as
=
"
textarea
"
name
=
"
description
"
rows
=
{
3
}
placeholder
=
"
상품을 설명해주세요
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
대표이미지
<
/Form.Label
>
<
Form
.
File
id
=
"
productImageform
"
name
=
"
main_image
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
상세이미지
<
/Form.Label
>
<
Form
.
File
id
=
"
productImageform
"
name
=
"
detail_image
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Button
className
=
"
float-right
"
type
=
"
submit
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
>
등록
<
/Button
>
<
/Form
>
<
/Col
>
<
/Row
>
<
/Container
>
<
/div
>
<
Container
>
<
Row
className
=
"
justify-content-md-center
"
>
<
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
>
<
Form
className
=
"
p-5
"
onSubmit
=
{
handleSubmit
}
>
<
Form
.
Group
controlId
=
"
productNameform
"
>
<
Form
.
Label
>
상품명
<
/Form.Label
>
<
Form
.
Control
type
=
"
text
"
name
=
"
pro_name
"
placeholder
=
"
상품명
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productAmountform
"
>
<
Form
.
Label
>
재고
<
/Form.Label
>
<
Form
.
Control
type
=
"
text
"
name
=
"
stock
"
placeholder
=
"
숫자만 입력해주세요
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productPriceform
"
>
<
Form
.
Label
>
가격
<
/Form.Label
>
<
Form
.
Control
type
=
"
text
"
name
=
"
price
"
placeholder
=
"
숫자만 입력해주세요
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
분류
<
/Form.Label
>
<
Row
>
<
Col
md
=
{
4
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
main_category
"
onChange
=
{
handleCategory
}
disabled
=
{
product
[
"
sub_category
"
].
length
>
0
}
>
<
option
value
=
""
>
상위분류
<
/option
>
{
categories
[
0
].
map
((
main
)
=>
(
<
option
value
=
{
main
}
>
{
main
}
<
/option
>
))}
<
/Form.Control
>
<
/Col
>
<
Col
md
=
{
6
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
sub_category
"
onChange
=
{
handleCategory
}
disabled
=
{
product
[
"
main_category
"
]
===
"
TRAINING
"
}
>
<
option
value
=
""
>
하위분류
<
/option
>
{
categories
[
1
][
categoryNum
].
map
((
sub
)
=>
(
<
option
value
=
{
sub
}
>
{
sub
}
<
/option
>
))}
<
/Form.Control
>
<
/Col
>
<
Col
>
<
Button
className
=
"
float-right
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
onClick
=
{
addCategory
}
>
추가
<
/Button
>
<
/Col
>
<
/Row
>
{
list
.
map
((
element
)
=>
element
)}
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
사이즈
<
/Form.Label
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
Free
"
value
=
"
Free
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
XL
"
value
=
"
XL
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
L
"
value
=
"
L
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
M
"
value
=
"
M
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
S
"
value
=
"
S
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
XS
"
value
=
"
XS
"
onChange
=
{
handleCheckBox
}
/
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
색상
<
/Form.Label
>
<
Row
>
<
Col
md
=
{
10
}
>
<
Form
.
Control
as
=
"
textarea
"
rows
=
{
1
}
name
=
"
colors
"
value
=
{
color
[
"
colors
"
]}
placeholder
=
"
색상
"
onChange
=
{
handleColor
}
/
>
<
/Col
>
<
Col
>
<
Button
className
=
"
float-right
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
onClick
=
{
addColor
}
>
추가
<
/Button
>
<
/Col
>
<
/Row
>
{
colorHtml
.
map
((
element
)
=>
element
)}
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productDescriptionform
"
>
<
Form
.
Label
>
상품설명
<
/Form.Label
>
<
Form
.
Control
as
=
"
textarea
"
name
=
"
description
"
rows
=
{
3
}
placeholder
=
"
상품을 설명해주세요
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
대표이미지
<
/Form.Label
>
<
Form
.
File
id
=
"
productImageform
"
name
=
"
main_image
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Label
>
상세이미지
<
/Form.Label
>
<
Form
.
File
id
=
"
productImageform
"
name
=
"
detail_image
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
Button
className
=
"
float-right
"
type
=
"
submit
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
>
등록
<
/Button
>
<
/Form
>
<
/Col
>
<
/Row
>
<
/Container
>
)
}
...
...
client/src/Pages/ProductsList.js
View file @
39c07bff
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Link
}
from
'
react-router-dom
'
;
import
ListCard
from
'
../Components/ListCard
'
;
import
Pagination
from
'
../Components/Pagination
'
;
import
search
from
'
../search.svg
'
;
import
{
Container
,
Row
,
Col
,
Form
,
FormControl
,
Button
,
Card
,
Dropdown
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
;
import
catchError
from
'
../utils/catchErrors
'
;
import
{
isAuthenticated
}
from
'
../utils/auth
'
;
import
{
Container
,
Row
,
Col
,
Form
,
FormControl
,
Button
,
Dropdown
}
from
'
react-bootstrap
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
function
ProductsList
()
{
const
[
sub
,
setSub
]
=
useState
([
'
PADDED JACKET
'
,
'
JACKET
'
,
'
JUMPER
'
,
'
COAT
'
,
'
FLEECE
'
,
'
CARDIGAN / VEST
'
])
function
ProductsList
({
match
})
{
const
[
mainCategory
,
setMainCategory
]
=
useState
(
match
.
params
.
main
.
toUpperCase
())
const
[
subcategory
,
setSubcategory
]
=
useState
([])
const
[
productlist
,
setProductlist
]
=
useState
([])
const
[
sub
,
setSub
]
=
useState
([])
const
[
error
,
setError
]
=
useState
(
''
)
// useEffect(() => {
// getProfile(user)
// }, [user])
// const user=isAuthenticated()
// async function getProfile(user){
// console.log(user)
useEffect
(()
=>
{
getSubsCategories
()
getProductlist
()
},
[
mainCategory
])
useEffect
(()
=>
{
setMainCategory
(
match
.
params
.
main
.
toUpperCase
())
},
[
match
.
params
.
main
])
function
handleSearch
()
{
}
// async function handleClick(subCategory) {
// try {
// const response = await axios.get(`/api/users/profile/${user}`)
// setProfile(response.data)
// const response = await axios.get(`/api/product/getproduct/${subCategory}`)
// console.log("response.data=", response.data)
// setProductlist(response.data)
// } catch (error) {
// catchErrors(error, setError)
// }
// }
function
handleSubmit
(
e
)
{
// function handleSubmit(e) {
// e.preventDefault()
// }
async
function
getSubsCategories
()
{
try
{
const
response
=
await
axios
.
get
(
`/api/categories/sub/
${
mainCategory
}
`
)
console
.
log
(
"
sub
"
,
response
.
data
)
setSubcategory
(
response
.
data
)
}
catch
(
error
)
{
catchError
(
error
,
setError
)
}
}
async
function
getProductlist
()
{
try
{
const
response
=
await
axios
.
get
(
`/api/product/getproduct/
${
mainCategory
}
`
)
console
.
log
(
"
response.data=
"
,
response
.
data
)
setProductlist
(
response
.
data
)
}
catch
(
error
)
{
catchError
(
error
,
setError
)
}
}
function
handleClick
(
e
){
e
.
preventDefault
()
return
getsubproductlist
()
}
async
function
getsubproductlist
(){
try
{
const
response
=
await
axios
.
get
(
`/api/product/getproduct/
${
subcategory
}
`
)
console
.
log
(
"
response.data sub=
"
,
response
.
data
)
setProductlist
(
response
.
data
)
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
}
return
(
<
div
>
{
console
.
log
(
"
main=
"
,
mainCategory
)}
<
style
type
=
"
text/css
"
>
{
`
a, a:hover, a:active {
color: #000;
text-decoration: none;
}
.btn {
background-color: #CDC5C2;
border-color: #CDC5C2;
...
...
@@ -42,82 +103,52 @@ function ProductsList() {
<
Container
>
<
Row
className
=
"
justify-content-center
"
>
<
Col
sm
=
{
10
}
xs
=
{
12
}
>
<
h1
style
=
{{
fontSize
:
"
3rem
"
}}
className
=
"
text-center
"
>
OUTER
<
/h1
>
<
div
className
=
"
text-center
"
>
{
sub
.
map
((
ele
)
=>
(
<
Button
className
=
"
m-1
"
>
{
ele
}
<
/Button
>
<
h1
style
=
{{
fontSize
:
"
3rem
"
}}
className
=
"
text-center
"
>
{
mainCategory
}
<
/h1
>
<
div
className
=
"
text-center
"
>
{
sub
category
.
map
((
ele
)
=>
(
<
Button
className
=
"
m-1
"
onClick
=
{(
ele
)
=>
handleClick
(
ele
)}
>
{
ele
}
<
/Button
>
))}
<
/div
>
<
/Col
>
<
/Row
>
<
Row
className
=
"
justify-content-
betwe
en mx-0 my-5
"
>
<
Form
as
=
{
Row
}
onSubmit
=
{
handleSubmit
}
className
=
"
justify-content-end mx-0
"
>
<
Row
className
=
"
justify-content-en
d
mx-0 my-5
"
>
{
/*
<Form as={Row} onSubmit={handleSubmit} className="justify-content-end mx-0">
*/
}
<
Dropdown
>
<
Dropdown
.
Toggle
className
=
"
mx-2
"
>
정렬
<
/Dropdown.Toggle
>
<
Dropdown
.
Menu
>
<
Dropdown
.
Item
>
인기상품
<
/Dropdown.Item
>
<
Dropdown
.
Item
>
신상품
<
/Dropdown.Item
>
<
Dropdown
.
Item
>
낮은가격
<
/Dropdown.Item
>
<
Dropdown
.
Item
>
높은가격
<
/Dropdown.Item
>
<
/Dropdown.Menu
>
<
/Dropdown
>
<
FormControl
type
=
"
text
"
placeholder
=
"
Search
"
style
=
{{
width
:
"
13rem
"
}}
/
>
<
Button
type
=
"
submit
"
className
=
"
search px-2 mb-1
"
>
<
img
src
=
{
search
}
width
=
"
20
"
height
=
"
20
"
/>
<
/Button
>
<
/Form
>
<
Dropdown
.
Toggle
className
=
"
mx-2
"
>
정렬
<
/Dropdown.Toggle
>
<
Dropdown
.
Menu
>
<
Dropdown
.
Item
>
인기상품
<
/Dropdown.Item
>
<
Dropdown
.
Item
>
신상품
<
/Dropdown.Item
>
<
Dropdown
.
Item
>
낮은가격
<
/Dropdown.Item
>
<
Dropdown
.
Item
>
높은가격
<
/Dropdown.Item
>
<
/Dropdown.Menu
>
<
/Dropdown
>
<
Form
as
=
{
Row
}
onSubmit
=
{
handleSearch
}
className
=
"
justify-content-end mx-0
"
>
<
FormControl
type
=
"
text
"
placeholder
=
"
Search
"
style
=
{{
width
:
"
13rem
"
}}
/
>
<
Button
type
=
"
submit
"
className
=
"
search px-2
"
>
<
img
src
=
"
/icon/search.svg
"
width
=
"
20
"
height
=
"
20
"
/>
<
/Button
>
<
/Form
>
{
/* </Form> */
}
<
/Row
>
<
Row
md
=
{
8
}
sm
=
{
12
}
className
=
"
justify-content-start m-2
"
>
<
Card
className
=
"
mt-5
"
style
=
{{
width
:
"
18rem
"
,
margin
:
"
auto
"
}}
>
<
Card
.
Img
variant
=
"
top
"
src
=
"
https://img.sonyunara.com/files/goods/67460/1607053816_0.jpg
"
style
=
{{
objectFit
:
"
contain
"
,
height
:
"
22rem
"
}}
/
>
<
Card
.
Body
>
<
Card
.
Title
>
케이시앵글부츠
(
SH
)
<
/Card.Title
>
<
Card
.
Text
>
가격
:
12
,
000
원
<
/Card.Text
>
<
/Card.Body
>
<
/Card
>
<
Card
className
=
"
mt-5
"
style
=
{{
width
:
"
18rem
"
,
margin
:
"
auto
"
}}
>
<
Card
.
Img
variant
=
"
top
"
src
=
"
https://img.sonyunara.com/files/goods/48705/1552562469_0.jpg
"
style
=
{{
objectFit
:
"
contain
"
,
height
:
"
22rem
"
}}
/
>
<
Card
.
Body
>
<
Card
.
Title
>
메리제인플랫
(
SH
)
<
/Card.Title
>
<
Card
.
Text
>
가격
:
12
,
000
원
<
/Card.Text
>
<
/Card.Body
>
<
/Card
>
<
Card
className
=
"
mt-5
"
style
=
{{
width
:
"
18rem
"
,
margin
:
"
auto
"
}}
>
<
Card
.
Img
variant
=
"
top
"
src
=
"
https://img.sonyunara.com/files/goods/53386/1567390097_2.jpg
"
style
=
{{
objectFit
:
"
contain
"
,
height
:
"
22rem
"
}}
/
>
<
Card
.
Body
>
<
Card
.
Title
>
솔티드스니커즈
(
SH
)
<
/Card.Title
>
<
Card
.
Text
>
가격
:
12
,
000
원
<
/Card.Text
>
<
/Card.Body
>
<
/Card
>
<
Card
className
=
"
mt-5
"
style
=
{{
width
:
"
18rem
"
,
margin
:
"
auto
"
}}
>
<
Card
.
Img
variant
=
"
top
"
src
=
"
https://img.sonyunara.com/files/goods/61286/1587540563_0.jpg
"
style
=
{{
objectFit
:
"
contain
"
,
height
:
"
22rem
"
}}
/
>
<
Card
.
Body
>
<
Card
.
Title
>
버켄슬리퍼
(
SH
)
<
/Card.Title
>
<
Card
.
Text
>
가격
:
12
,
000
원
<
/Card.Text
>
<
/Card.Body
>
<
/Card
>
<
Card
className
=
"
mt-5
"
style
=
{{
width
:
"
18rem
"
,
margin
:
"
auto
"
}}
>
<
Card
.
Img
variant
=
"
top
"
src
=
"
https://hotping.co.kr/web/product/big/202011/b8f4c6471955b80fc3991b7d6df8926a.jpg
"
style
=
{{
objectFit
:
"
contain
"
,
height
:
"
22rem
"
}}
/
>
<
Card
.
Body
>
<
Card
.
Title
>
크레센도
하이힐펌프스
<
/Card.Title
>
<
Card
.
Text
>
가격
:
12
,
000
원
<
/Card.Text
>
<
/Card.Body
>
<
/Card
>
<
Card
className
=
"
mt-5
"
style
=
{{
width
:
"
18rem
"
,
margin
:
"
auto
"
}}
>
<
Card
.
Img
variant
=
"
top
"
src
=
"
https://hotping.co.kr/web/product/big/202011/888e4e8d6a2c2e7da385b079151fcba2.jpg
"
style
=
{{
objectFit
:
"
contain
"
,
height
:
"
22rem
"
}}
/
>
<
Card
.
Body
>
<
Card
.
Title
>
어텀솔져1cm
스웨이드로퍼
<
/Card.Title
>
<
Card
.
Text
>
가격
:
12
,
000
원
<
/Card.Text
>
<
/Card.Body
>
<
/Card
>
<
Card
className
=
"
mt-5
"
style
=
{{
width
:
"
18rem
"
,
margin
:
"
auto
"
}}
>
<
Card
.
Img
variant
=
"
top
"
src
=
"
https://hotping.co.kr/web/product/big/202007/3308564012eb14e6c11ed621fa7555fb.jpg
"
style
=
{{
objectFit
:
"
contain
"
,
height
:
"
22rem
"
}}
/
>
<
Card
.
Body
>
<
Card
.
Title
>
포웰3
.
5
cm
스니커즈
<
/Card.Title
>
<
Card
.
Text
>
가격
:
12
,
000
원
<
/Card.Text
>
<
/Card.Body
>
<
/Card
>
{
productlist
.
map
(
pro
=>
(
<
Link
to
=
{{
pathname
:
`/product/
${
pro
.
_id
}
`
,
state
:
{
id
:
pro
.
_id
,
name
:
pro
.
pro_name
,
price
:
pro
.
price
,
colors
:
pro
.
colors
,
sizes
:
pro
.
sizes
,
description
:
pro
.
description
,
main_img
:
pro
.
main_imgUrl
,
detail_imgs
:
pro
.
detail_imgUrls
}
}}
>
<
ListCard
id
=
{
pro
.
_id
}
name
=
{
pro
.
pro_name
}
price
=
{
pro
.
price
}
main_img
=
{
pro
.
main_imgUrl
}
/
>
<
/Link
>
))}
<
/Row
>
<
/Container
>
<
Pagination
/>
{
/*
<Pagination
postsPerPage={postsPerPage} totalPosts={posts.length} paginate={paginate} /> */
}
<
/div
>
)
}
...
...
client/src/Pages/ShoppingCart.js
View file @
39c07bff
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
{
Link
,
Redirect
}
from
'
react-router-dom
'
;
import
{
Card
,
Button
,
Container
,
Row
,
Col
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
import
{
isAuthenticated
}
from
'
../utils/auth
'
import
CartCard
from
'
../Components/CartCard
'
;
function
ShoppingCart
()
{
const
[
num
,
setNum
]
=
useState
()
const
[
error
,
setError
]
=
useState
(
''
)
const
[
cart
,
setCart
]
=
useState
([])
const
[
finalPrice
,
setFinalPrice
]
=
useState
(
0
)
const
user
=
isAuthenticated
()
const
[
num
,
setNum
]
=
useState
(
0
)
useEffect
(()
=>
{
getCart
()
},
[
user
])
function
plusNum
()
{
num
=
num
+
1
setNum
(
num
+
1
)
}
function
minusNum
()
{
...
...
@@ -16,67 +27,66 @@ function ShoppingCart() {
}
else
{
setNum
(
num
-
1
)
}
}
function
deleteCart
()
{
async
function
deleteCart
(
e
)
{
//장바구니 DB에서 해당 항목 삭제
console
.
log
(
e
.
target
.
name
)
try
{
const
response
=
await
axios
.
post
(
'
/api/cart/deletecart
'
,
{
cartId
:
e
.
target
.
name
})
console
.
log
(
response
.
data
)
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
console
.
log
(
'
카트에 담긴 항목을 삭제했습니다.
'
)
}
// async function getCart(){
// const response = await axios.get('/')
// }
async
function
getCart
()
{
try
{
const
response
=
await
axios
.
get
(
`/api/cart/showcart/
${
user
}
`
)
console
.
log
(
response
.
data
)
setCart
(
response
.
data
)
const
finalPrices
=
response
.
data
.
map
((
e
)
=>
{
return
e
.
count
*
e
.
productId
.
price
})
setFinalPrice
(
finalPrices
.
reduce
((
a
,
b
)
=>
(
a
+
b
)))
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
}
return
(
<
div
>
{
/* {getCart} */
}
<
Container
className
=
"
justify-content-center
"
>
<
h
3
className
=
"
my-5 font-weight-bold text-center
"
>
장바구니
<
/h
3
>
<
h
1
className
=
"
my-5 font-weight-bold text-center
"
>
장바구니
<
/h
1
>
<
div
>
<
h4
className
=
"
font-weight-bold py-3 border-top border-bottom text-center
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
주문상품정보
<
/h4
>
<
Card
>
<
Row
className
=
"
mx-1
"
>
<
Col
xs
=
{
2
}
sm
=
{
2
}
className
=
"
text-center my-auto
"
>
<
input
className
=
""
type
=
"
checkbox
"
id
=
"
exampleCheck1
"
/>
<
/Col
>
<
Col
className
=
"
text-center
"
>
<
Card
.
Img
className
=
"
img-fluid
"
variant
=
"
top
"
src
=
"
img/asd.jpg
"
style
=
{{
width
:
'
20rem
'
}}
/
>
<
/Col
>
<
Col
md
=
{
6
}
className
=
"
p-2
"
>
<
Card
.
Body
>
<
input
type
=
"
image
"
alt
=
"
삭제버튼
"
src
=
"
https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png
"
className
=
"
float-right
"
onClick
=
{
deleteCart
}
/
>
<
Card
.
Title
className
=
"
font-weight-bold mt-3
"
>
제품명
<
/Card.Title
>
<
Card
.
Text
>
가격
<
/Card.Text
>
<
Card
.
Text
>
옵션
<
/Card.Text
>
<
Card
.
Text
>
수량
<
/Card.Text
>
<
div
>
<
input
type
=
"
image
"
alt
=
"
마이너스
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/minus-math.png
"
className
=
"
align-middle
"
onClick
=
{
minusNum
}
/
>
<
input
type
=
"
text
"
style
=
{{
width
:
'
30px
'
}}
className
=
"
text-center align-middle mx-1
"
placeholder
=
"
1
"
value
=
{
num
}
readOnly
><
/input
>
<
input
type
=
"
image
"
alt
=
"
플러스
"
src
=
"
https://img.icons8.com/ios-glyphs/20/000000/plus-math.png
"
className
=
"
align-middle
"
onClick
=
{
plusNum
}
/
>
<
/div
>
<
/Card.Body
>
<
/Col
>
<
/Row
>
<
/Card
>
{
cart
.
length
>
0
?
<
CartCard
cart
=
{
cart
}
deleteCart
=
{
deleteCart
}
minusNum
=
{
minusNum
}
plusNum
=
{
plusNum
}
num
=
{
num
}
/
>
:
<
div
className
=
"
text-center my-5
"
>
장바구니에
담긴
상품이
없습니다
.
<
/div>
}
<
/div
>
<
div
className
=
"
p-5 m-
5
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
<
div
className
=
"
p-5 m-
3
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
<
ul
className
=
"
pl-0
"
style
=
{{
listStyle
:
'
none
'
}}
>
<
li
>
<
span
className
=
"
text-secondary
"
>
총
상품금액
<
/span
>
<
span
className
=
"
text-secondary float-right
"
>
12
,
000
원
<
/span
>
<
span
className
=
"
text-secondary float-right
"
>
{
finalPrice
}
원
<
/span
>
<
/li
>
<
li
>
<
span
className
=
"
text-secondary
"
>
배송비
<
/span
>
<
span
className
=
"
text-secondary float-right
"
>
2
,
500
원
<
/span
>
<
span
className
=
"
text-secondary float-right
"
>
2500
원
<
/span
>
<
/li
>
<
/ul
>
<
div
className
=
"
my-1 pt-2 border-top font-weight-bold
"
>
결제금액
<
span
className
=
"
float-right
"
>
14
,
500
원
<
/span
>
결제금액
<
span
className
=
"
float-right
"
>
{
finalPrice
+
2
500
}
원
<
/span
>
<
/div
>
<
/div
>
<
div
className
=
"
text-center
"
>
<
Button
className
=
"
px-5
"
style
=
{{
background
:
"
#91877F
"
,
borderColor
:
'
#91877F
'
}}
href
=
"
/payment
"
block
>
결제하기
<
/Button
>
<
Button
as
=
{
Link
}
to
=
{{
pathname
:
`/payment`
,
state
:
{
cart
}
}}
className
=
"
px-5
"
style
=
{{
background
:
"
#91877F
"
,
borderColor
:
'
#91877F
'
}}
block
>
결제하기
<
/Button
>
<
/div
>
<
/Container
>
...
...
client/src/Pages/Signup.js
View file @
39c07bff
...
...
@@ -24,11 +24,9 @@ function Signup() {
setUser
({
...
user
,
[
name
]:
value
})
}
async
function
handleSubmit
(
event
)
{
event
.
preventDefault
()
const
form
=
event
.
currentTarget
;
console
.
log
(
form
)
if
(
form
.
checkValidity
()
===
false
)
{
event
.
preventDefault
();
event
.
stopPropagation
();
...
...
@@ -44,8 +42,8 @@ function Signup() {
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
}
function
checkPassword
(
event
)
{
const
p1
=
user
.
password
const
p2
=
user
.
password2
...
...
@@ -60,137 +58,137 @@ function Signup() {
return
true
}
}
if
(
success
)
{
alert
(
'
회원가입 되었습니다.
'
)
return
<
Redirect
to
=
'
/login
'
/>
}
return
(
<
div
>
<
Container
className
=
"
my-5
"
>
return
(
<
div
>
<
Container
className
=
"
my-5
"
>
<
Row
className
=
"
justify-content-center
"
>
<
Col
md
=
{
6
}
xs
=
{
10
}
className
=
"
border
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
<
h2
className
=
"
text-center mt-5
"
>
Sign
Up
<
/h2
>
{
error
&&
<
Alert
variant
=
'
danger
'
>
{
error
}
<
/Alert>
}
<
Form
noValidate
validated
=
{
validated
}
onSubmit
=
{
handleSubmit
}
className
=
"
p-5
"
>
<
Form
.
Group
controlId
=
"
formBasicName
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
id
"
>
이
름
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
<
Row
className
=
"
justify-content-center
"
>
<
Col
md
=
{
6
}
xs
=
{
10
}
className
=
"
border
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
<
h2
className
=
"
text-center mt-5
"
>
Sign
Up
<
/h2
>
{
error
&&
<
Alert
variant
=
'
danger
'
>
{
error
}
<
/Alert>
}
<
Form
noValidate
validated
=
{
validated
}
onSubmit
=
{
handleSubmit
}
className
=
"
p-5
"
>
<
Form
.
Group
controlId
=
"
formBasicName
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
id
"
>
이
름
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
required
type
=
"
text
"
name
=
"
name
"
placeholder
=
"
Name
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
name
}
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
이름을
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicNumber
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
number
"
>
주민등록번호
<
/Col
>
<
Col
as
=
{
Row
}
sm
=
{
8
}
xs
=
{
10
}
>
<
Form
.
Control
required
type
=
"
text
"
name
=
"
name
"
placeholder
=
"
Name
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
name
}
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
이름을
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicNumber
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
number
"
>
주민등록번호
<
/Col
>
<
Col
as
=
{
Row
}
sm
=
{
8
}
xs
=
{
10
}
>
<
Form
.
Control
required
type
=
"
text
"
name
=
"
number1
"
maxlength
=
"
6
"
className
=
"
mx-2
"
style
=
{{
width
:
'
17 0px
'
}}
value
=
{
user
.
number1
}
onChange
=
{
handleChange
}
>
<
/Form.Control
>
name
=
"
number1
"
maxlength
=
"
6
"
className
=
"
mx-2
"
style
=
{{
width
:
'
17 0px
'
}}
value
=
{
user
.
number1
}
onChange
=
{
handleChange
}
>
<
/Form.Control
>
-
<
Form
.
Control
required
type
=
"
text
"
name
=
"
number2
"
maxlength
=
"
1
"
className
=
"
mx-3
"
style
=
{{
width
:
'
50px
'
}}
value
=
{
user
.
number2
}
onChange
=
{
handleChange
}
>
<
/Form.Control
>
required
type
=
"
text
"
name
=
"
number2
"
maxlength
=
"
1
"
className
=
"
mx-3
"
style
=
{{
width
:
'
50px
'
}}
value
=
{
user
.
number2
}
onChange
=
{
handleChange
}
>
<
/Form.Control
>
******
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
주민등록번호를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Col
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicId
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
id
"
>
아이디
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
required
type
=
"
text
"
name
=
"
id
"
placeholder
=
"
ID
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
id
}
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
아이디를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicPassword
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
password
"
>
비밀번호
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
type
=
"
password
"
name
=
"
password
"
placeholder
=
"
Password
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
password
}
required
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
className
=
"
text-center
"
type
=
"
invalid
"
>
비밀번호를
입력하세요
.
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
주민등록번호를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Col
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicId
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
id
"
>
아이디
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
required
type
=
"
text
"
name
=
"
id
"
placeholder
=
"
ID
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
id
}
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
아이디를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicPassword
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
password
"
>
비밀번호
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
type
=
"
password
"
name
=
"
password
"
placeholder
=
"
Password
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
password
}
required
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
className
=
"
text-center
"
type
=
"
invalid
"
>
비밀번호를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicPassword2
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
password
"
>
비밀번호
확인
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
type
=
"
password
"
name
=
"
password2
"
placeholder
=
"
Password
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
password2
}
required
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
비밀번호를
한번
더
입력하세요
.
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicPassword2
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
password
"
>
비밀번호
확인
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
type
=
"
password
"
name
=
"
password2
"
placeholder
=
"
Password
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
password2
}
required
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
비밀번호를
한번
더
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicTel
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
tel
"
>
휴대전화
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
required
type
=
"
text
"
name
=
"
tel
"
size
=
"
sm
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
tel
}
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
휴대전화를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Button
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
type
=
"
submit
"
block
onClick
=
{
checkPassword
}
>
Sign
Up
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicTel
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
tel
"
>
휴대전화
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
required
type
=
"
text
"
name
=
"
tel
"
size
=
"
sm
"
style
=
{{
width
:
'
160px
'
}}
value
=
{
user
.
tel
}
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
휴대전화를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Button
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
type
=
"
submit
"
block
onClick
=
{
checkPassword
}
>
Sign
Up
<
/Button
>
<
/Form
>
<
/Col
>
<
/Row
>
<
/Container
>
<
/div
>
)
<
/Form
>
<
/Col
>
<
/Row
>
<
/Container
>
<
/div
>
)
}
export
default
Signup
\ No newline at end of file
client/src/utils/auth.js
View file @
39c07bff
import
axios
from
"
axios
"
export
function
handleLogin
(
userId
)
{
localStorage
.
setItem
(
'
loginStatus
'
,
userId
)
export
function
handleLogin
({
userId
,
role
,
name
}){
localStorage
.
setItem
(
'
id
'
,
userId
)
localStorage
.
setItem
(
'
role
'
,
role
)
localStorage
.
setItem
(
'
name
'
,
name
)
}
export
async
function
handleLogout
()
{
localStorage
.
removeItem
(
'
loginStatus
'
)
export
async
function
handleLogout
(){
localStorage
.
removeItem
(
'
id
'
)
localStorage
.
removeItem
(
'
role
'
)
localStorage
.
removeItem
(
'
name
'
)
await
axios
.
get
(
'
/api/auth/logout
'
)
window
.
location
.
href
=
'
/
'
}
export
function
isAuthenticated
()
{
const
userId
=
localStorage
.
getItem
(
'
loginStatus
'
)
if
(
userId
)
{
export
function
isAuthenticated
(){
const
userId
=
localStorage
.
getItem
(
'
id
'
)
if
(
userId
){
return
userId
}
else
{
return
false
...
...
client/src/utils/catchErrors.js
View file @
39c07bff
function
catchErrors
(
error
,
displayError
)
{
function
catchErrors
(
error
,
displayError
)
{
let
errorMsg
if
(
error
.
response
){
errorMsg
=
error
.
response
.
data
if
(
error
.
response
)
{
errorMsg
=
error
.
response
.
data
console
.
log
(
errorMsg
)
}
else
if
(
error
.
request
){
errorMsg
=
error
.
request
}
else
if
(
error
.
request
)
{
errorMsg
=
error
.
request
console
.
log
(
errorMsg
)
}
else
{
errorMsg
=
error
.
message
}
else
{
errorMsg
=
error
.
message
console
.
log
(
errorMsg
)
}
displayError
(
errorMsg
)
}
export
default
catchErrors
export
default
catchErrors
\ No newline at end of file
server/app.js
View file @
39c07bff
import
express
from
'
express
'
;
// import bodyParser from "body-parser";
import
connectDb
from
'
./schemas/index.js
'
import
fs
from
'
fs
'
;
import
connectDb
from
'
./schemas/index.js
'
;
import
categoryRouter
from
"
./routes/category.routes.js
"
;
import
userRouter
from
"
./routes/user.routes.js
"
;
import
productRouter
from
'
./routes/product.routes.js
'
;
import
cartRouter
from
'
./routes/cart.routes.js
'
;
...
...
@@ -10,24 +11,28 @@ import config from './config.js'
import
authRouter
from
'
./routes/auth.routes.js
'
import
cors
from
'
cors
'
fs
.
readdir
(
'
uploads
'
,
(
error
)
=>
{
if
(
error
)
{
fs
.
mkdirSync
(
'
uploads
'
);
}
})
connectDb
()
const
app
=
express
();
app
.
use
(
"
/image
"
,
express
.
static
(
"
uploads/
"
))
app
.
use
(
express
.
json
());
app
.
use
(
express
.
json
())
app
.
use
(
cors
())
app
.
use
(
express
.
static
(
path
.
join
(
process
.
cwd
(),
'
dist
'
)))
// app.use(bodyParser.urlencoded({ extended: true }))
app
.
use
(
'
/images
'
,
express
.
static
(
'
uploads/
'
))
// app.use('/', indexRouter);
app
.
use
(
'
/
'
,
kakaopayRoutes
)
app
.
use
(
'
/api/categories
'
,
categoryRouter
)
app
.
use
(
'
/api/users
'
,
userRouter
)
app
.
use
(
'
/api/auth
'
,
authRouter
)
app
.
use
(
'
/api/product
'
,
productRouter
)
app
.
use
(
'
/api/
add
cart
'
,
cartRouter
)
app
.
use
(
'
/api/cart
'
,
cartRouter
)
app
.
listen
(
config
.
port
,
()
=>
{
console
.
info
(
'
Server started on port %s.
'
,
config
.
port
)
...
...
server/controllers/auth.controller.js
View file @
39c07bff
...
...
@@ -7,10 +7,10 @@ const login = async (req, res) => {
const
{
id
,
password
}
=
req
.
body
console
.
log
(
id
,
password
)
try
{
const
user
=
await
User
.
findOne
({
id
}).
select
(
'
+password
'
)
const
user
=
await
User
.
findOne
({
id
}).
select
(
'
password role name
'
)
console
.
log
(
'
u=
'
,
user
)
if
(
!
user
)
{
return
res
.
status
(
404
).
send
(
`
${
id
}
가 존재하지 않습니다.`
)
}
const
passwordMatch
=
await
bcrypt
.
compare
(
password
,
user
.
password
)
...
...
@@ -23,7 +23,7 @@ const login = async (req, res) => {
httpOnly
:
true
,
secure
:
config
.
env
===
'
production
'
})
res
.
json
({
userId
:
user
.
_id
})
res
.
json
({
userId
:
user
.
_id
,
role
:
user
.
role
,
name
:
user
.
name
})
}
else
{
res
.
status
(
401
).
send
(
'
비밀번호가 일치하지 않습니다.
'
)
...
...
server/controllers/cart.controller.js
View file @
39c07bff
import
Cart
from
"
../schemas/Cart.js
"
;
import
Product
from
'
../schemas/Product.js
'
const
cart
=
async
(
req
,
res
)
=>
{
const
{
userId
,
productObjectId
,
color
,
size
,
count
}
=
req
.
body
// console.log('req.body=', req.body)
// const {userId, productObjectId, }
// const { user, pro_name, price, main_image } = req.body
// color, size, count, productObjectId(productlist에서 props), userId(로컬)
const
addcart
=
async
(
req
,
res
)
=>
{
const
{
userId
,
products
}
=
req
.
body
try
{
const
produc
t
=
await
Product
.
find
({
_id
:
productObject
Id
})
if
(
product
)
{
// console.log(product)
const
{
pro
_name
,
price
,
main_image
}
=
product
[
0
]
const
products
=
{
productObjectId
,
color
,
size
,
count
,
pro_name
,
price
,
main_image
}
// console.log(products
)
const
newCart
=
await
new
Cart
(
{
userId
,
products
}).
save
(
)
console
.
log
(
newCart
)
res
.
json
(
newCart
)
const
car
t
=
await
Cart
.
findOne
({
userId
:
user
Id
})
await
Cart
.
updateOne
(
{
_id
:
cart
.
_id
},
{
$set
:
{
pro
ducts
:
product
s
}}
)
res
.
status
(
200
).
send
(
'
카트에 저장되었습니다.
'
)
}
catch
(
error
)
{
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
카트에 저장할 수 없습니다.
'
)
}
}
}
// const newCart = await new Cart(
{
// user, pro_name, price, stock, main_category, sub_category, main_image
// }).save()
// const asdf = await Cart.find({ user })
// console.log(newCart
)
// res.json(newCart
)
const
showcart
=
async
(
req
,
res
)
=>
{
try
{
const
cart
=
await
Cart
.
findOne
({
userId
:
req
.
id
}).
populate
({
path
:
'
products.productId
'
,
model
:
'
Product
'
}
)
res
.
status
(
200
).
json
(
cart
.
products
)
}
catch
(
error
)
{
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
죄송합니다. 다시 입력해 주십시오
.
'
)
res
.
status
(
500
).
send
(
'
쇼핑카트를 불러오지 못했습니다
.
'
)
}
}
const
deletecart
=
async
(
req
,
res
)
=>
{
console
.
log
(
req
.
body
)
const
{
cartId
}
=
req
.
body
try
{
await
Cart
.
deleteOne
({
_id
:
cartId
})
res
.
send
(
"
삭제완료
"
)
}
catch
(
error
)
{
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
해당 카트를 삭제하지 못했습니다.
'
)
// try {
// const user = await
// User.findById(id)
// if (!user) {
// console.log(error)
// res.status(404).send('사용자를 찾을 수 없습니다')
// }
// req.profile = user
// next()
// } catch (error) {
// console.log(error)
// res.status(500).send('사용자 아이디 실패')
// }
}
}
const
userById
=
async
(
req
,
res
,
next
,
id
)
=>
{
try
{
const
cart
=
await
Cart
.
findOne
({
userId
:
id
})
if
(
!
cart
)
{
res
.
status
(
404
).
send
(
"
사용자를 찾을 수 없습니다.
"
)
}
req
.
cart
=
cart
req
.
id
=
id
next
()
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
"
사용자 아이디 검색 실패
"
)
}
}
export
default
{
cart
}
\ No newline at end of file
export
default
{
addcart
,
showcart
,
deletecart
,
userById
}
\ No newline at end of file
server/controllers/category.controller.js
0 → 100644
View file @
39c07bff
import
Category
from
"
../schemas/Category.js
"
;
const
getCategory
=
async
(
req
,
res
)
=>
{
console
.
log
(
"
dsadd=
"
)
try
{
const
category
=
await
Category
.
find
({},
{
_id
:
0
})
res
.
json
(
category
)
}
catch
(
error
)
{
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
카테고리 검색 실패
'
)
}
}
const
getSubCategory
=
(
req
,
res
)
=>
{
}
const
getsubId
=
(
req
,
res
,
next
,
sub
)
=>
{
const
subcategory
=
await
category
.
find
({
"
Dress
"
})
console
.
log
(
'
sub=
'
,
sub
)
next
()
}
export
default
{
getCategory
,
getsubId
,
getSubCategory
}
\ No newline at end of file
server/controllers/product.controller.js
View file @
39c07bff
import
Product
from
"
../schemas/Product.js
"
;
import
multer
from
'
multer
'
;
const
upload
=
multer
({
dest
:
'
uploads/
'
})
const
upload
=
multer
({
dest
:
'
uploads/
'
});
const
fileUpload
=
upload
.
fields
([
{
name
:
'
main_image
'
,
maxCount
:
1
},
{
name
:
'
detail_image
'
,
maxCount
:
1
}
])
const
imageUpload
=
upload
.
fields
([
{
name
:
'
main_image
'
},
{
name
:
'
detail_image
'
}
])
const
regist
=
async
(
req
,
res
)
=>
{
console
.
log
(
'
req.body=
'
,
req
.
body
)
const
{
pro_name
,
price
,
stock
,
main_category
,
sub_category
,
colors
,
sizes
,
description
}
=
req
.
body
console
.
log
(
req
.
files
)
const
main_image
=
req
.
files
[
'
main_image
'
][
0
].
filename
console
.
log
(
main_image
)
const
detail_image
=
req
.
files
[
'
detail_image
'
][
0
].
filename
console
.
log
(
"
req.body=
"
,
req
.
body
)
try
{
const
{
pro_name
,
price
,
stock
,
main_category
,
sub_category
,
description
,
colors
,
sizes
}
=
req
.
body
const
main_img
=
req
.
files
[
'
main_image
'
][
0
]
const
detail_img
=
req
.
files
[
'
detail_image
'
]
const
main_imgUrl
=
main_img
.
filename
const
detail_imgUrls
=
[]
detail_img
.
forEach
(
file
=>
{
detail_imgUrls
.
push
(
file
.
filename
)
})
const
newProduct
=
await
new
Product
({
pro_name
,
price
,
stock
,
main_category
,
sub_category
,
colors
,
sizes
,
description
,
main_im
age
,
detail_im
age
pro_name
,
price
,
stock
,
main_category
,
sub_category
,
description
,
main_im
gUrl
,
detail_im
gUrls
,
colors
,
sizes
}).
save
()
res
.
json
(
newProduct
)
}
catch
(
error
)
{
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
죄송합니다. 다시 입력해 주십시오.
'
)
res
.
status
(
500
).
send
(
'
제품 정보 등록에 실패하였습니다. 다시 진행해 주십시오.
'
)
}
}
const
getToHome
=
async
(
res
,
req
)
=>
{
try
{
const
bestProduct
=
await
Product
.
find
({}).
sort
({
purchase
:
1
}).
limit
(
6
)
const
newProduct
=
await
Product
.
find
({}).
sort
({
createdAt
:
-
1
}).
limit
(
6
)
console
.
log
(
"
best=
"
,
bestProduct
)
console
.
log
(
"
new=
"
,
newProduct
)
res
.
json
(
bestProduct
,
newProduct
)
}
catch
{
res
.
status
(
500
).
send
(
'
상품을 불러오지 못했습니다.
'
)
}
}
const
getlist
=
(
req
,
res
)
=>
{
try
{
res
.
json
(
req
.
productslist
)
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
상품을 불러오지 못했습니다.
'
)
}
}
const
getProduct
=
(
req
,
res
)
=>
{
res
.
json
(
req
.
body
)
const
categoryId
=
async
(
req
,
res
,
next
,
category
)
=>
{
try
{
const
productslist
=
await
Product
.
find
({
main_category
:
category
})
if
(
!
productslist
)
{
res
.
status
(
404
).
send
(
'
상품을 찾을 수 없습니다.
'
)
}
req
.
productslist
=
productslist
next
()
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
상품을 불러오지 못했습니다.
'
)
}
}
const
subgetlist
=
(
req
,
res
)
=>
{
try
{
res
.
json
(
req
.
subproductslist
)
}
catch
(
error
){
res
.
status
(
500
).
send
(
'
상품을 불러오지 못했습니다.
'
)
}
}
const
subcategoryId
=
async
(
req
,
res
,
next
,
subcategory
)
=>
{
try
{
const
subproductslist
=
await
Product
.
find
({
sub_category
:
subcategory
})
if
(
!
subproductslist
)
{
res
.
status
(
404
).
send
(
'
상품을 찾을 수 없습니다.
'
)
}
req
.
subproductslist
=
subproductslist
next
()
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
상품을 불러오지 못했습니다.
'
)
}
}
export
default
{
regist
,
fileUpload
,
getProduct
}
\ No newline at end of file
export
default
{
imageUpload
,
regist
,
categoryId
,
getlist
,
subcategoryId
,
subgetlist
}
server/controllers/user.controller.js
View file @
39c07bff
import
Cart
from
"
../schemas/Cart.js
"
;
import
User
from
"
../schemas/User.js
"
;
import
isLength
from
'
validator/lib/isLength.js
'
import
bcrypt
from
'
bcryptjs
'
import
isLength
from
'
validator/lib/isLength.js
'
;
import
bcrypt
from
'
bcryptjs
'
;
import
multer
from
"
multer
"
;
const
uploadimg
=
multer
({
dest
:
'
uploads/
'
});
...
...
@@ -30,8 +31,10 @@ const userById = async (req, res, next, id) => {
const
signup
=
async
(
req
,
res
)
=>
{
const
{
name
,
number1
,
number2
,
id
,
password
,
tel
}
=
req
.
body
console
.
log
(
req
.
body
)
const
{
name
,
number1
,
number2
,
id
,
password
,
tel
}
=
req
.
body
try
{
if
(
!
isLength
(
password
,
{
min
:
8
,
max
:
15
}))
{
return
res
.
status
(
422
).
send
(
'
비밀번호는 8-15자리로 입력해주세요.
'
)
...
...
@@ -51,6 +54,7 @@ const signup = async (req, res) => {
password
:
hash
,
tel
,
}).
save
()
await
new
Cart
({
userId
:
newUser
.
_id
,
role
}).
save
()
console
.
log
(
newUser
)
res
.
json
(
newUser
)
...
...
@@ -60,7 +64,6 @@ const signup = async (req, res) => {
}
}
const
update
=
async
(
req
,
res
)
=>
{
console
.
log
(
"
req
"
,
req
.
body
)
try
{
...
...
server/routes/auth.routes.js
View file @
39c07bff
...
...
@@ -6,7 +6,7 @@ const router = express.Router()
router
.
route
(
'
/login
'
)
.
post
(
authCtrl
.
login
)
router
.
route
(
'
/logout
'
)
router
.
route
(
'
/logout
'
)
.
get
(
authCtrl
.
logout
)
export
default
router
\ No newline at end of file
server/routes/cart.routes.js
View file @
39c07bff
...
...
@@ -4,8 +4,16 @@ import cartCtrl from '../controllers/cart.controller.js';
const
router
=
express
.
Router
()
router
.
route
(
'
/
'
)
.
p
os
t
(
cartCtrl
.
cart
)
// .get()
router
.
route
(
'
/
addcart
'
)
.
p
u
t
(
cartCtrl
.
add
cart
)
// .get()
router
.
route
(
'
/showcart/:userId
'
)
.
get
(
cartCtrl
.
showcart
)
router
.
param
(
'
userId
'
,
cartCtrl
.
userById
)
router
.
route
(
'
/deletecart
'
)
.
post
(
cartCtrl
.
deletecart
)
export
default
router
\ No newline at end of file
server/routes/category.routes.js
0 → 100644
View file @
39c07bff
import
express
from
"
express
"
;
import
categoryCtrl
from
"
../controllers/category.controller.js
"
;
const
router
=
express
.
Router
()
router
.
route
(
'
/main
'
)
.
get
(
categoryCtrl
.
getCategory
)
router
.
route
(
'
/sub/:sub
'
)
.
get
(
categoryCtrl
.
getSubCategory
)
router
.
param
(
'
sub
'
,
categoryCtrl
.
getsubId
)
export
default
router
\ No newline at end of file
server/routes/product.routes.js
View file @
39c07bff
...
...
@@ -5,8 +5,19 @@ import productCtrl from '../controllers/product.controller.js';
const
router
=
express
.
Router
()
router
.
route
(
'
/regist
'
)
.
post
(
productCtrl
.
fileUpload
,
productCtrl
.
regist
)
router
.
route
(
'
/productone
'
)
.
get
(
productCtrl
.
getProduct
)
.
post
(
productCtrl
.
imageUpload
,
productCtrl
.
regist
)
router
.
route
(
'
/getproduct
'
)
.
get
(
productCtrl
.
getToHome
)
router
.
route
(
'
/getproduct/:category
'
)
.
get
(
productCtrl
.
getlist
)
router
.
route
(
'
/getproduct/:subcategory
'
)
.
get
(
productCtrl
.
subgetlist
)
router
.
param
(
'
category
'
,
productCtrl
.
categoryId
)
router
.
param
(
'
subcategory
'
,
productCtrl
.
subcategoryId
)
export
default
router
\ No newline at end of file
server/schemas/Cart.js
View file @
39c07bff
import
mongoose
from
'
mongoose
'
const
{
String
,
Number
,
Array
,
ObjectId
}
=
mongoose
.
Schema
.
Types
const
productschema
=
new
mongoose
.
Schema
({
pro_name
:
{
type
:
String
,
required
:
true
},
price
:{
type
:
Number
,
required
:
true
},
main_image
:
{
type
:
String
,
required
:
true
},
color
:{
type
:
String
,
required
:
true
},
size
:{
type
:
String
,
required
:
true
},
productObjectId
:
{
type
:
ObjectId
,
required
:
true
}
})
const
CartSchema
=
new
mongoose
.
Schema
({
userId
:
{
type
:
String
,
// required: true
type
:
ObjectId
,
ref
:
'
User
'
},
products
:
{
type
:
[
productschema
],
required
:
true
products
:
{
type
:
[
{
count
:
{
type
:
Number
,
default
:
1
},
productId
:
{
type
:
ObjectId
,
ref
:
'
Product
'
},
sizes
:
{
type
:
String
},
colors
:
{
type
:
String
}
}
]
}
},
{
timestamps
:
true
})
export
default
mongoose
.
models
.
Cart
||
mongoose
.
model
(
'
Cart
'
,
CartSchema
)
\ No newline at end of file
Prev
1
2
3
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