Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
students
shopping-mall
Commits
f143e8c2
"src/git@compmath.korea.ac.kr:students/survey.git" did not exist on "eab79372fb655822e578745113e465c7c8762f78"
Commit
f143e8c2
authored
Jan 13, 2021
by
Jiwon Yoon
Browse files
Merge branch 'ourMaster' into jiwon
parents
7efc0961
491d40f2
Changes
10
Hide whitespace changes
Inline
Side-by-side
client/src/App.js
View file @
f143e8c2
...
@@ -16,9 +16,9 @@ import SubNav from './Components/SubNav';
...
@@ -16,9 +16,9 @@ import SubNav from './Components/SubNav';
function
App
()
{
function
App
()
{
return
(
return
(
<
div
>
<
div
>
{
/* {console.log("match.params=",match.params(product))} */
}
<
MainNav
/>
<
MainNav
/>
<
SubNav
/>
<
SubNav
/>
<
Router
>
<
Router
>
...
@@ -26,8 +26,8 @@ function App() {
...
@@ -26,8 +26,8 @@ function App() {
<
Route
exact
path
=
"
/
"
component
=
{
Home
}
/
>
<
Route
exact
path
=
"
/
"
component
=
{
Home
}
/
>
<
Route
path
=
"
/login
"
component
=
{
Login
}
/
>
<
Route
path
=
"
/login
"
component
=
{
Login
}
/
>
<
Route
path
=
"
/signup
"
component
=
{
Signup
}
/
>
<
Route
path
=
"
/signup
"
component
=
{
Signup
}
/
>
<
Route
path
=
"
/product
"
component
=
{
Product
}
/
>
{
/*
<Route path="/product" component={Product} />
*/
}
<
Route
path
=
"
/product
slis
t
"
component
=
{
ProductsList
}
/
>
<
Route
path
=
"
/product
/:produc
t
"
component
=
{
ProductsList
}
/
>
<
Route
path
=
"
/admin
"
component
=
{
Admin
}
/
>
<
Route
path
=
"
/admin
"
component
=
{
Admin
}
/
>
<
Route
path
=
"
/regist
"
component
=
{
ProductRegist
}
/
>
<
Route
path
=
"
/regist
"
component
=
{
ProductRegist
}
/
>
<
Route
path
=
"
/shoppingcart
"
component
=
{
ShoppingCart
}
/
>
<
Route
path
=
"
/shoppingcart
"
component
=
{
ShoppingCart
}
/
>
...
...
client/src/Components/SubNav.js
View file @
f143e8c2
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
{
Navbar
,
Nav
,
NavDropdown
}
from
'
react-bootstrap
'
;
import
{
Navbar
,
Nav
,
NavDropdown
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
function
SubNav
()
{
function
SubNav
()
{
const
[
toggle
,
setToggle
]
=
useState
({
"
dress
"
:
false
,
"
outer
"
:
false
,
"
top
"
:
false
,
"
pants
"
:
false
,
"
skirt
"
:
false
,
"
training
"
:
false
,
"
shoes
"
:
false
});
const
[
categorysDiv
,
setCategorysDiv
]
=
useState
([])
const
[
error
,
setError
]
=
useState
(
''
)
function
handleMouseEnter
(
id
)
{
setToggle
({
[
id
]:
true
})
}
useEffect
(
async
()
=>
{
try
{
function
handleMouseLeave
(
id
)
{
const
response
=
await
axios
.
get
(
'
/api/categorys
'
)
setToggle
({
[
id
]:
false
})
let
list
=
[]
}
Object
.
keys
(
response
.
data
[
0
]).
forEach
((
ele
)
=>
{
const
url
=
ele
.
toLowerCase
()
function
handleToggle
(
id
)
{
list
.
push
(
setToggle
({
[
id
]:
!
toggle
[
`
${
id
}
`
]
})
<
Nav
.
Link
href
=
{
`/product/
${
url
}
`
}
>
{
ele
}
<
/Nav.Link
>
}
)
})
function
handleClick
(
url
)
{
setCategorysDiv
(
list
)
return
<
Redirect
to
=
{
url
}
/
>
}
catch
(
error
)
{
}
catchErrors
(
error
,
setError
)
}
},
[])
return
(
return
(
<
Navbar
sticky
=
"
top
"
className
=
"
flex-nowrap
"
style
=
{{
top
:
"
62px
"
,
paddingTop
:
"
0
"
,
paddingBottom
:
"
0
"
,
backgroundColor
:
"
#fff
"
,
overflowX
:
"
auto
"
}}
>
<
Navbar
sticky
=
"
top
"
className
=
"
flex-nowrap
"
style
=
{{
top
:
"
62px
"
,
paddingTop
:
"
0
"
,
paddingBottom
:
"
0
"
,
backgroundColor
:
"
#fff
"
}}
>
<
style
type
=
"
text/css
"
>
<
style
type
=
"
text/css
"
>
{
`
{
`
.nav-link, .nav-link:hover, .nav-link:active {
.nav-link, .nav-link:hover, .nav-link:active {
color: #91877F;
color: #91877F;
}
}
.dropdown-toggle:after {
display: none;
}
.dropdown-menu {
background-color: #91877F;
}
.dropdown-item {
color: #f8f9fa;
}
.dropdown-item:focus, .dropdown-item:hover {
color: #91877F;
}
.dropdown-item:active {
background-color: #f8f9fa;
}
`
}
`
}
<
/style
>
<
/style
>
<
Nav
>
<
Nav
>
<
NavDropdown
title
=
"
DRESS
"
onMouseEnter
=
{()
=>
handleMouseEnter
(
"
dress
"
)}
onMouseLeave
=
{()
=>
handleMouseLeave
(
"
dress
"
)}
show
=
{
toggle
.
dress
}
toggle
=
{()
=>
handleToggle
(
"
dress
"
)}
onClick
=
{()
=>
handleClick
(
"
/dress
"
)}
>
{
categorysDiv
.
map
(
item
=>
item
)}
<
NavDropdown
.
Item
href
=
"
/dress/long
"
>
LONG
DRESS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/dress/short
"
>
SHORT
DRESS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/dress/knit
"
>
KNIT
DRESS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/dress/shirt
"
>
SHIRT
DRESS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/dress/pattern
"
>
PATTERN
DRESS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/dress/bustier
"
>
BUSTIER
DRESS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/dress/two-piece
"
>
TWO
-
PIECE
DRESS
<
/NavDropdown.Item
>
<
/NavDropdown
>
<
NavDropdown
title
=
"
OUTER
"
onMouseEnter
=
{()
=>
handleMouseEnter
(
"
outer
"
)}
onMouseLeave
=
{()
=>
handleMouseLeave
(
"
outer
"
)}
show
=
{
toggle
.
outer
}
toggle
=
{()
=>
handleToggle
(
"
outer
"
)}
onClick
=
{()
=>
handleClick
(
"
/outer
"
)}
>
<
NavDropdown
.
Item
href
=
"
/outer/padded-jacket
"
>
PADDED
JACKET
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/outer/jacket
"
>
JACKET
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/outer/jumper
"
>
JUMPER
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/outer/coat
"
>
COAT
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/outer/fleece
"
>
FLEECE
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/outer/cardigan_vest
"
>
CARDIGAN
/
VEST
<
/NavDropdown.Item
>
<
/NavDropdown
>
<
NavDropdown
title
=
"
TOP
"
onMouseEnter
=
{()
=>
handleMouseEnter
(
"
top
"
)}
onMouseLeave
=
{()
=>
handleMouseLeave
(
"
top
"
)}
show
=
{
toggle
.
top
}
toggle
=
{()
=>
handleToggle
(
"
top
"
)}
onClick
=
{()
=>
handleClick
(
"
/top
"
)}
>
<
NavDropdown
.
Item
href
=
"
/top/knit
"
>
KNIT
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/top/hoody
"
>
HOODY
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/top/blouse
"
>
BLOUSE
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/top/shirt
"
>
SHIRT
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/top/sweatshirt
"
>
SWEATSHIRT
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/top/long-sleeve-shirt
"
>
LONG
SLEEVE
SHIRT
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/top/short-sleeved-shirt_sleeveless-shirt
"
>
SHORT
SLEEVE
/
SLEEVELESS
SHIRT
<
/NavDropdown.Item
>
<
/NavDropdown
>
<
NavDropdown
title
=
"
PANTS
"
onMouseEnter
=
{()
=>
handleMouseEnter
(
"
pants
"
)}
onMouseLeave
=
{()
=>
handleMouseLeave
(
"
pants
"
)}
show
=
{
toggle
.
pants
}
toggle
=
{()
=>
handleToggle
(
"
pants
"
)}
onClick
=
{()
=>
handleClick
(
"
/pants
"
)}
>
<
NavDropdown
.
Item
href
=
"
/pants/jeans
"
>
JEANS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/skinny-jeans
"
>
SKINNY
JEANS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/banding
"
>
BANDING
PANTS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/wide-fit
"
>
WIDE
-
FIT
PANTS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/boot-cut
"
>
BOOT
-
CUT
PANTS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/straight-fit
"
>
STRAIGHT
-
FIT
PANTS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/wide-fit
"
>
WIDE
-
FIT
PANTS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/shorts
"
>
SHORTS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/trousers
"
>
TROUSERS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/leggings
"
>
LEGGINGS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/pants/jumpsuit_overalls
"
>
JUMPSUIT
/
OVERALLS
<
/NavDropdown.Item
>
<
/NavDropdown
>
<
NavDropdown
title
=
"
SKIRT
"
onMouseEnter
=
{()
=>
handleMouseEnter
(
"
skirt
"
)}
onMouseLeave
=
{()
=>
handleMouseLeave
(
"
skirt
"
)}
show
=
{
toggle
.
skirt
}
toggle
=
{()
=>
handleToggle
(
"
skirt
"
)}
onClick
=
{()
=>
handleClick
(
"
/skirt
"
)}
>
<
NavDropdown
.
Item
href
=
"
/skirt/long
"
>
LONG
SKIRT
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/skirt/midi
"
>
MIDI
SKIRT
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/skirt/mini
"
>
MINI
SKIRT
<
/NavDropdown.Item
>
<
/NavDropdown
>
<
Nav
.
Item
>
<
Nav
.
Link
href
=
"
/training
"
>
TRAINING
<
/Nav.Link
>
<
/Nav.Item
>
<
NavDropdown
title
=
"
SHOES
"
onMouseEnter
=
{()
=>
handleMouseEnter
(
"
shoes
"
)}
onMouseLeave
=
{()
=>
handleMouseLeave
(
"
shoes
"
)}
show
=
{
toggle
.
shoes
}
toggle
=
{()
=>
handleToggle
(
"
shoes
"
)}
onClick
=
{()
=>
handleClick
(
"
/shoes
"
)}
>
<
NavDropdown
.
Item
href
=
"
/skirt/sneakers_slip-on
"
>
SNEAKERS
/
SLIP
-
ON
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/skirt/flat_loafer
"
>
FLAT
/
LOAFER
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/skirt/heel_pump
"
>
HEEL
/
PUMP
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/skirt/boots
"
>
BOOTS
<
/NavDropdown.Item
>
<
NavDropdown
.
Item
href
=
"
/skirt/sandal_slipper
"
>
SANDAL
/
SLIPPER
<
/NavDropdown.Item
>
<
/NavDropdown
>
<
/Nav
>
<
/Nav
>
<
/Navbar
>
<
/Navbar
>
)
)
...
...
client/src/Pages/Home.js
View file @
f143e8c2
...
@@ -3,6 +3,9 @@ import { Card, Container, Row } from 'react-bootstrap';
...
@@ -3,6 +3,9 @@ import { Card, Container, Row } from 'react-bootstrap';
function
Home
()
{
function
Home
()
{
return
(
return
(
<
div
>
<
div
>
<
Container
className
=
"
my-5
"
>
<
Container
className
=
"
my-5
"
>
...
...
client/src/Pages/ProductRegist.js
View file @
f143e8c2
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
axios
from
'
axios
'
import
{
Row
,
Col
,
Button
,
Form
,
Container
,
Alert
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
...
@@ -22,15 +23,7 @@ function ProductsRegist() {
...
@@ -22,15 +23,7 @@ function ProductsRegist() {
main_image
:
[],
main_image
:
[],
detail_image
:
[]
detail_image
:
[]
}
}
const
categorys
=
{
const
[
categorys
,
setCategorys
]
=
useState
({
0
:
[],
1
:
[[]]
})
"
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
[
product
,
setProduct
]
=
useState
(
INIT_PRODUCT
)
const
[
product
,
setProduct
]
=
useState
(
INIT_PRODUCT
)
const
[
categoryNum
,
setCategoryNum
]
=
useState
(
0
)
const
[
categoryNum
,
setCategoryNum
]
=
useState
(
0
)
const
[
tag
,
setTag
]
=
useState
(
0
)
const
[
tag
,
setTag
]
=
useState
(
0
)
...
@@ -38,8 +31,15 @@ function ProductsRegist() {
...
@@ -38,8 +31,15 @@ function ProductsRegist() {
const
[
success
,
setSuccess
]
=
useState
(
false
)
const
[
success
,
setSuccess
]
=
useState
(
false
)
const
[
checked
,
setChecked
]
=
useState
({
"
Free
"
:
false
,
"
XL
"
:
false
,
"
L
"
:
false
,
"
M
"
:
false
,
"
S
"
:
false
,
"
XS
"
:
false
})
const
[
checked
,
setChecked
]
=
useState
({
"
Free
"
:
false
,
"
XL
"
:
false
,
"
L
"
:
false
,
"
M
"
:
false
,
"
S
"
:
false
,
"
XS
"
:
false
})
const
mainCategorys
=
Object
.
keys
(
categorys
)
useEffect
(
async
()
=>
{
const
subCategorys
=
Object
.
values
(
categorys
)
try
{
const
response
=
await
axios
.
get
(
'
/api/categorys
'
)
const
data
=
response
.
data
[
0
]
setCategorys
([
Object
.
keys
(
data
),
Object
.
values
(
data
)])
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
},
[])
function
addCategory
()
{
function
addCategory
()
{
console
.
log
(
product
)
console
.
log
(
product
)
...
@@ -50,12 +50,13 @@ function ProductsRegist() {
...
@@ -50,12 +50,13 @@ function ProductsRegist() {
<
/div>
)
<
/div>
)
setTag
(
tag
+
1
)
setTag
(
tag
+
1
)
}
}
function
deleteCategory
(
e
)
{
function
deleteCategory
(
e
)
{
const
categ
=
e
.
target
.
parentNode
const
categ
=
e
.
target
.
parentNode
categ
.
remove
()
categ
.
remove
()
product
[
"
sub_category
"
].
splice
(
e
.
target
.
parentNode
.
firstElementChild
.
getAttribute
(
"
i
"
),
1
)
product
[
"
sub_category
"
].
splice
(
categ
.
firstElementChild
.
getAttribute
(
"
i
"
),
1
)
console
.
log
(
product
)
}
}
function
handleCheckBox
(
e
)
{
function
handleCheckBox
(
e
)
{
setChecked
({
...
checked
,
[
e
.
target
.
value
]:
!
checked
[
`
${
e
.
target
.
value
}
`
]
})
setChecked
({
...
checked
,
[
e
.
target
.
value
]:
!
checked
[
`
${
e
.
target
.
value
}
`
]
})
}
}
...
@@ -65,17 +66,18 @@ function ProductsRegist() {
...
@@ -65,17 +66,18 @@ function ProductsRegist() {
colorHtml
.
push
(
colorHtml
.
push
(
<
p
>
{
color
[
"
colors
"
]}
<
/p
>
<
p
>
{
color
[
"
colors
"
]}
<
/p
>
)
)
setProduct
({...
product
,
"
colors
"
:
preColors
})
setProduct
({
...
product
,
"
colors
"
:
preColors
})
}
}
function
colorChange
(
e
){
function
colorChange
(
e
)
{
color
[
e
.
target
.
name
]
=
e
.
target
.
value
color
[
e
.
target
.
name
]
=
e
.
target
.
value
}
}
function
handleChange
(
event
)
{
function
handleChange
(
event
)
{
const
{
name
,
value
,
files
}
=
event
.
target
const
{
name
,
value
,
files
}
=
event
.
target
if
(
event
.
target
.
name
===
"
sub_category
"
)
{
console
.
log
(
"
event.target.name=
"
,
name
,
"
event.target.value=
"
,
value
)
product
[
"
sub_category
"
].
push
(
event
.
target
.
value
)
if
(
name
===
"
sub_category
"
)
{
product
[
name
].
push
(
value
)
}
else
if
(
files
)
{
}
else
if
(
files
)
{
setProduct
({
...
product
,
[
name
]:
files
})
setProduct
({
...
product
,
[
name
]:
files
})
...
@@ -95,8 +97,7 @@ function ProductsRegist() {
...
@@ -95,8 +97,7 @@ function ProductsRegist() {
sizes
.
push
(
key
)
sizes
.
push
(
key
)
}
}
}
}
product
[
"
sizes
"
]
=
sizes
product
[
"
sizes
"
]
=
sizes
console
.
log
(
product
)
const
formData
=
new
FormData
();
const
formData
=
new
FormData
();
for
(
let
key
in
product
)
{
for
(
let
key
in
product
)
{
if
(
key
===
"
main_imgUrl
"
||
key
===
"
detail_imgUrl
"
)
{
if
(
key
===
"
main_imgUrl
"
||
key
===
"
detail_imgUrl
"
)
{
...
@@ -118,92 +119,92 @@ function ProductsRegist() {
...
@@ -118,92 +119,92 @@ function ProductsRegist() {
if
(
success
)
{
if
(
success
)
{
return
<
Redirect
to
=
'
/
'
/>
return
<
Redirect
to
=
'
/
'
/>
}
}
return
(
return
(
<
div
>
<
Container
className
=
"
mt-5
"
>
<
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
"
>
<
Form
.
Label
>
상품명
<
/Form.Label
>
<
Form
.
Label
>
상품명
<
/Form.Label
>
<
Form
.
Control
type
=
"
text
"
name
=
"
pro_name
"
placeholder
=
"
상품명
"
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
type
=
"
text
"
name
=
"
pro_name
"
placeholder
=
"
상품명
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productAmountform
"
>
<
Form
.
Group
controlId
=
"
productAmountform
"
>
<
Form
.
Label
>
재고
<
/Form.Label
>
<
Form
.
Label
>
재고
<
/Form.Label
>
<
Form
.
Control
type
=
"
text
"
name
=
"
stock
"
placeholder
=
"
숫자만 입력해주세요
"
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
type
=
"
text
"
name
=
"
stock
"
placeholder
=
"
숫자만 입력해주세요
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productPriceform
"
>
<
Form
.
Group
controlId
=
"
productPriceform
"
>
<
Form
.
Label
>
가격
<
/Form.Label
>
<
Form
.
Label
>
가격
<
/Form.Label
>
<
Form
.
Control
type
=
"
text
"
name
=
"
price
"
placeholder
=
"
숫자만 입력해주세요
"
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
type
=
"
text
"
name
=
"
price
"
placeholder
=
"
숫자만 입력해주세요
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Group
>
<
Form
.
Label
>
분류
<
/Form.Label
>
<
Form
.
Label
>
분류
<
/Form.Label
>
<
Row
>
<
Row
>
<
Col
md
=
{
4
}
>
<
Col
md
=
{
4
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
main_category
"
onChange
=
{
handleChange
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
main_category
"
onChange
=
{
handleChange
}
>
<
option
value
=
""
>
상위분류
<
/option
>
<
option
value
=
""
>
상위분류
<
/option
>
{
mainCategorys
.
map
((
main
)
=>
(
{
categorys
[
0
].
map
((
main
)
=>
(
<
option
value
=
{
main
}
>
{
main
}
<
/option
>
<
option
value
=
{
main
}
>
{
main
}
<
/option
>
))}
))}
<
/Form.Control
>
<
/Form.Control
>
<
/Col
>
<
/Col
>
<
Col
md
=
{
6
}
>
<
Col
md
=
{
6
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
sub_category
"
onChange
=
{
handleChange
}
>
<
Form
.
Control
as
=
"
select
"
name
=
"
sub_category
"
onChange
=
{
handleChange
}
>
<
option
value
=
""
>
하위분류
<
/option
>
<
option
value
=
""
>
하위분류
<
/option
>
{
subCategorys
[
categoryNum
].
map
((
sub
)
=>
(
{
categorys
[
1
][
categoryNum
].
map
((
sub
)
=>
(
<
option
value
=
{
sub
}
>
{
sub
}
<
/option
>
<
option
value
=
{
sub
}
>
{
sub
}
<
/option
>
))}
))}
<
/Form.Control
>
<
/Form.Control
>
<
/Col
>
<
/Col
>
<
Col
>
<
Col
>
<
Button
className
=
"
float-right
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
onClick
=
{
addCategory
}
>
추가
<
/Button
>
<
Button
className
=
"
float-right
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
onClick
=
{
addCategory
}
>
추가
<
/Button
>
<
/Col
>
<
/Col
>
<
/Row
>
<
/Row
>
{
list
.
map
((
element
)
=>
element
)}
{
list
.
map
((
element
)
=>
element
)}
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Group
>
<
Form
.
Label
>
사이즈
<
/Form.Label
>
<
Form
.
Label
>
사이즈
<
/Form.Label
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
Free
"
value
=
"
Free
"
onChange
=
{
handleCheckBox
}
/
>
<
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
=
"
XL
"
value
=
"
XL
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
L
"
value
=
"
L
"
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
=
"
M
"
value
=
"
M
"
onChange
=
{
handleCheckBox
}
/
>
<
Form
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
label
=
"
S
"
value
=
"
S
"
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
.
Check
type
=
"
checkbox
"
name
=
"
sizes
"
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
=
"
colors
"
placeholder
=
"
색상
"
onChange
=
{
colorChange
}
/
>
<
Form
.
Control
as
=
"
textarea
"
rows
=
{
1
}
name
=
"
colors
"
placeholder
=
"
색상
"
onChange
=
{
colorChange
}
/
>
<
/Col
>
<
/Col
>
<
Col
>
<
Col
>
<
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
>
{
colorHtml
.
map
((
element
)
=>
element
)}
{
colorHtml
.
map
((
element
)
=>
element
)}
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
productDescriptionform
"
>
<
Form
.
Group
controlId
=
"
productDescriptionform
"
>
<
Form
.
Label
>
상품설명
<
/Form.Label
>
<
Form
.
Label
>
상품설명
<
/Form.Label
>
<
Form
.
Control
as
=
"
textarea
"
name
=
"
description
"
rows
=
{
3
}
placeholder
=
"
상품을 설명해주세요
"
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
as
=
"
textarea
"
name
=
"
description
"
rows
=
{
3
}
placeholder
=
"
상품을 설명해주세요
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Group
>
<
Form
.
Label
>
대표이미지
<
/Form.Label
>
<
Form
.
Label
>
대표이미지
<
/Form.Label
>
<
Form
.
File
id
=
"
productImageform
"
name
=
"
main_imgUrl
"
onChange
=
{
handleChange
}
/
>
<
Form
.
File
id
=
"
productImageform
"
name
=
"
main_image
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
/Form.Group
>
<
Form
.
Group
>
<
Form
.
Group
>
<
Form
.
Label
>
상세이미지
<
/Form.Label
>
<
Form
.
Label
>
상세이미지
<
/Form.Label
>
<
Form
.
File
id
=
"
productImageform
"
name
=
"
detail_imgUrl
"
onChange
=
{
handleChange
}
/
>
<
Form
.
File
id
=
"
productImageform
"
name
=
"
detail_image
"
onChange
=
{
handleChange
}
/
>
<
/Form.Group
>
<
/Form.Group
>
<
Button
className
=
"
float-right
"
type
=
"
submit
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
>
등록
<
/Button
>
<
Button
className
=
"
float-right
"
type
=
"
submit
"
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
>
등록
<
/Button
>
<
/Form
>
<
/Form
>
<
/Col
>
<
/Col
>
<
/Row
>
<
/Row
>
<
/Container
>
<
/Container
>
<
/div
>
)
)
}
}
...
...
client/src/Pages/ProductsList.js
View file @
f143e8c2
...
@@ -44,6 +44,7 @@ function ProductsList() {
...
@@ -44,6 +44,7 @@ function ProductsList() {
return
(
return
(
<
div
>
<
div
>
<
style
type
=
"
text/css
"
>
<
style
type
=
"
text/css
"
>
{
`
{
`
.btn {
.btn {
...
@@ -89,7 +90,7 @@ function ProductsList() {
...
@@ -89,7 +90,7 @@ function ProductsList() {
<
ListCard
productlist
=
{
productlist
}
/
>
<
ListCard
productlist
=
{
productlist
}
/
>
<
/Row
>
<
/Row
>
<
/Container
>
<
/Container
>
<
Pagination
/>
{
/*
<Pagination
postsPerPage={postsPerPage} totalPosts={posts.length} paginate={paginate} /> */
}
<
/div
>
<
/div
>
)
)
}
}
...
...
server/app.js
View file @
f143e8c2
import
express
from
'
express
'
;
import
express
from
'
express
'
;
import
fs
from
'
fs
'
;
import
fs
from
'
fs
'
;
import
connectDb
from
'
./schemas/index.js
'
import
connectDb
from
'
./schemas/index.js
'
;
import
categoryRouter
from
"
./routes/category.routes.js
"
;
import
userRouter
from
"
./routes/user.routes.js
"
;
import
userRouter
from
"
./routes/user.routes.js
"
;
import
productRouter
from
'
./routes/product.routes.js
'
;
import
productRouter
from
'
./routes/product.routes.js
'
;
import
cartRouter
from
'
./routes/cart.routes.js
'
;
import
cartRouter
from
'
./routes/cart.routes.js
'
;
...
@@ -19,9 +20,7 @@ fs.readdir('uploads', (error) => {
...
@@ -19,9 +20,7 @@ fs.readdir('uploads', (error) => {
connectDb
()
connectDb
()
const
app
=
express
();
const
app
=
express
();
app
.
use
(
express
.
json
())
app
.
use
(
express
.
json
());
app
.
use
(
cors
())
app
.
use
(
cors
())
app
.
use
(
express
.
static
(
path
.
join
(
process
.
cwd
(),
'
dist
'
)))
app
.
use
(
express
.
static
(
path
.
join
(
process
.
cwd
(),
'
dist
'
)))
// app.use(bodyParser.urlencoded({ extended: true }))
// app.use(bodyParser.urlencoded({ extended: true }))
...
@@ -29,6 +28,7 @@ app.use('/images', express.static('uploads/'))
...
@@ -29,6 +28,7 @@ app.use('/images', express.static('uploads/'))
// app.use('/', indexRouter);
// app.use('/', indexRouter);
app
.
use
(
'
/
'
,
kakaopayRoutes
)
app
.
use
(
'
/
'
,
kakaopayRoutes
)
app
.
use
(
'
/api/categorys
'
,
categoryRouter
)
app
.
use
(
'
/api/users
'
,
userRouter
)
app
.
use
(
'
/api/users
'
,
userRouter
)
app
.
use
(
'
/api/auth
'
,
authRouter
)
app
.
use
(
'
/api/auth
'
,
authRouter
)
app
.
use
(
'
/api/product
'
,
productRouter
)
app
.
use
(
'
/api/product
'
,
productRouter
)
...
...
server/controllers/category.controller.js
0 → 100644
View file @
f143e8c2
import
Category
from
"
../schemas/Category.js
"
;
const
getCategory
=
async
(
req
,
res
)
=>
{
try
{
const
category
=
await
Category
.
find
({},
{
_id
:
0
})
res
.
json
(
category
)
}
catch
(
error
)
{
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
카테고리 검색 실패
'
)
}
}
export
default
{
getCategory
}
\ No newline at end of file
server/controllers/product.controller.js
View file @
f143e8c2
...
@@ -9,8 +9,9 @@ const imageUpload = upload.fields([
...
@@ -9,8 +9,9 @@ const imageUpload = upload.fields([
])
])
const
regist
=
async
(
req
,
res
)
=>
{
const
regist
=
async
(
req
,
res
)
=>
{
console
.
log
(
"
req.body=
"
,
req
.
body
)
try
{
try
{
const
{
pro_name
,
price
,
stock
,
main_category
,
sub_category
,
description
}
=
req
.
body
const
{
pro_name
,
price
,
stock
,
main_category
,
sub_category
,
description
,
colors
,
sizes
}
=
req
.
body
const
main_img
=
req
.
files
[
'
main_image
'
][
0
]
const
main_img
=
req
.
files
[
'
main_image
'
][
0
]
const
detail_img
=
req
.
files
[
'
detail_image
'
]
const
detail_img
=
req
.
files
[
'
detail_image
'
]
const
main_imgUrl
=
main_img
.
filename
const
main_imgUrl
=
main_img
.
filename
...
@@ -19,7 +20,7 @@ const regist = async (req, res) => {
...
@@ -19,7 +20,7 @@ const regist = async (req, res) => {
detail_imgUrls
.
push
(
file
.
filename
)
detail_imgUrls
.
push
(
file
.
filename
)
})
})
const
newProduct
=
await
new
Product
({
const
newProduct
=
await
new
Product
({
pro_name
,
price
,
stock
,
main_category
,
sub_category
,
description
,
main_imgUrl
,
detail_imgUrls
pro_name
,
price
,
stock
,
main_category
,
sub_category
,
description
,
main_imgUrl
,
detail_imgUrls
,
colors
,
sizes
}).
save
()
}).
save
()
res
.
json
(
newProduct
)
res
.
json
(
newProduct
)
}
catch
(
error
)
{
}
catch
(
error
)
{
...
...
server/routes/category.routes.js
0 → 100644
View file @
f143e8c2
import
express
from
"
express
"
;
import
categoryCtrl
from
"
../controllers/category.controller.js
"
;
const
router
=
express
.
Router
()
router
.
route
(
'
/
'
)
.
get
(
categoryCtrl
.
getCategory
)
export
default
router
\ No newline at end of file
server/schemas/Category.js
0 → 100644
View file @
f143e8c2
import
mongoose
from
'
mongoose
'
const
{
Array
}
=
mongoose
.
Schema
.
Types
const
CategorysSchema
=
new
mongoose
.
Schema
({
"
DRESS
"
:
{
type
:
Array
,
required
:
true
},
"
OUTER
"
:
{
type
:
Array
,
required
:
true
},
"
TOP
"
:
{
type
:
Array
,
required
:
true
},
"
PANTS
"
:
{
type
:
Array
,
required
:
true
},
"
SKIRT
"
:
{
type
:
Array
,
required
:
true
},
"
TRAINING
"
:
{
type
:
Array
,
required
:
true
},
"
SHOES
"
:
{
type
:
Array
,
required
:
true
},
})
export
default
mongoose
.
models
.
Categorys
||
mongoose
.
model
(
'
Categorys
'
,
CategorysSchema
)
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment