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
e2bb9325
Commit
e2bb9325
authored
Jan 25, 2021
by
Jiwon Yoon
Browse files
Merge branch 'ourMaster' into jiwon
parents
dcddb500
520cf554
Changes
23
Show whitespace changes
Inline
Side-by-side
client/src/App.js
View file @
e2bb9325
import
'
./App.css
'
;
import
{
BrowserRouter
as
Router
,
Route
,
Redirect
,
Switch
}
from
'
react-router-dom
'
;
import
PrivateRoute
from
"
./Components/PrivateRoute
"
;
import
AdminRoute
from
"
./Components/AdminRoute
"
;
import
Home
from
'
./Pages/Home
'
;
import
Login
from
'
./Pages/Login
'
;
import
Signup
from
'
./Pages/Signup
'
;
...
...
@@ -27,13 +28,25 @@ function App() {
<
Route
path
=
"
/product/:productId
"
component
=
{
Product
}
/
>
<
Route
path
=
"
/categories/:main/:sub
"
component
=
{
ProductsList
}
/
>
<
Route
path
=
"
/categories/:main
"
component
=
{
ProductsList
}
/
>
<
Route
path
=
"
/admin
"
component
=
{
Admin
}
/
>
<
Route
path
=
"
/regist
"
component
=
{
ProductRegist
}
/
>
<
Route
path
=
"
/shoppingcart
"
component
=
{
ShoppingCart
}
/
>
<
Route
path
=
"
/payment
"
component
=
{
Payment
}
/
>
<
Route
path
=
"
/paymentcompleted
"
component
=
{
PaymentCompleted
}
/
>
<
Route
path
=
"
/account
"
component
=
{
Account
}
/
>
<
Route
path
=
'
/kakao
'
component
=
{()
=>
{
window
.
location
.
href
=
'
https://compmath.korea.ac.kr
'
;
return
null
;
}}
/
>
<
AdminRoute
path
=
"
/admin
"
>
<
Admin
/>
<
/AdminRoute
>
<
AdminRoute
path
=
"
/regist
"
>
<
ProductRegist
/>
<
/AdminRoute
>
<
PrivateRoute
path
=
"
/shoppingcart
"
>
<
ShoppingCart
/>
<
/PrivateRoute
>
<
PrivateRoute
path
=
"
/payment
"
>
<
Payment
/>
<
/PrivateRoute
>
<
PrivateRoute
path
=
"
/account
"
>
<
Account
/>
<
/PrivateRoute
>
{
/* <PrivateRoute path='/kakao'>
</PrivateRoute>
<Route component={() => { window.location.href = 'https://compmath.korea.ac.kr'; return null; }} /> */
}
<
Redirect
path
=
"
/
"
to
=
"
/
"
/>
<
/Switch
>
<
/Router
>
...
...
client/src/Components/AdminRoute.js
0 → 100644
View file @
e2bb9325
import
React
from
'
react
'
;
import
{
Redirect
,
Route
}
from
'
react-router-dom
'
;
import
{
isAdmin
}
from
'
../utils/auth
'
;
function
PrivateRoute
({
path
,
children
})
{
if
(
isAdmin
())
{
return
(
<
Route
path
=
{
path
}
>
{
children
}
<
/Route
>
)
}
else
{
alert
(
'
권한이 없습니다. 죄송합니다.
'
);
return
(
<
Redirect
to
=
'
/
'
/>
)
}
}
export
default
PrivateRoute
\ No newline at end of file
client/src/Components/AllCard.js
0 → 100644
View file @
e2bb9325
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Card
,
Button
}
from
'
react-bootstrap
'
;
function
AllCard
({
id
,
name
,
price
,
main_img
})
{
function
handleDelete
(
e
)
{
const
card
=
e
.
target
.
parentNode
.
parentNode
alert
(
'
해당 상품을 성공적으로 삭제하였습니다.
'
)
card
.
remove
()
}
return
(
<
Card
id
=
{
id
}
className
=
"
m-3
"
style
=
{{
width
:
"
18rem
"
}}
>
<
Card
.
Img
variant
=
"
top
"
src
=
{
main_img
&&
`/images/
${
main_img
}
`
}
style
=
{{
objectFit
:
"
contain
"
,
height
:
"
22rem
"
}}
/
>
<
Card
.
Body
>
<
Card
.
Title
style
=
{{
whiteSpace
:
"
nowrap
"
,
overflow
:
"
hidden
"
,
textOverflow
:
"
ellipsis
"
}}
>
{
name
}
<
/Card.Title
>
<
Card
.
Text
>
{
price
}
원
<
/Card.Text
>
<
Button
className
=
"
float-right
"
onClick
=
{
handleDelete
}
>
삭제
<
/Button
>
<
/Card.Body
>
<
/Card
>
)
}
export
default
AllCard
\ No newline at end of file
client/src/Components/ListCard.js
View file @
e2bb9325
...
...
@@ -2,7 +2,6 @@ import React, { useState, useEffect, useRef } from 'react';
import
{
Card
,
Button
}
from
'
react-bootstrap
'
;
function
ListCard
({
id
,
name
,
price
,
main_img
})
{
function
handleDelete
(
e
)
{
const
card
=
e
.
target
.
parentNode
.
parentNode
alert
(
'
해당 상품을 성공적으로 삭제하였습니다.
'
)
...
...
@@ -15,7 +14,6 @@ function ListCard({ id, name, price, main_img }) {
<
Card
.
Body
>
<
Card
.
Title
style
=
{{
whiteSpace
:
"
nowrap
"
,
overflow
:
"
hidden
"
,
textOverflow
:
"
ellipsis
"
}}
>
{
name
}
<
/Card.Title
>
<
Card
.
Text
>
{
price
}
원
<
/Card.Text
>
{
/* <Button className="float-right" onClick={handleDelete}>삭제</Button> */
}
<
/Card.Body
>
<
/Card
>
)
...
...
client/src/Components/MainNav.js
View file @
e2bb9325
import
React
from
'
react
'
;
import
{
Navbar
,
Nav
}
from
'
react-bootstrap
'
;
import
{
handleLogout
,
isAuthenticated
}
from
'
../utils/auth
'
;
import
{
handleLogout
,
isAuthenticated
,
isAdmin
}
from
'
../utils/auth
'
;
function
MainNav
()
{
const
user
=
isAuthenticated
()
const
admin
=
isAdmin
()
return
(
<
Navbar
sticky
=
"
top
"
style
=
{{
background
:
"
#CDC5C2
"
}}
>
...
...
@@ -15,6 +15,9 @@ function MainNav() {
<
Nav
className
=
"
ml-auto
"
>
{
user
?
<>
<
Nav
.
Link
className
=
"
text-light
"
onClick
=
{()
=>
handleLogout
()}
>
Logout
<
/Nav.Link
>
<
Nav
.
Link
className
=
"
text-light
"
href
=
"
/account
"
>
Mypage
<
/Nav.Link
>
<
Nav
.
Link
href
=
"
/shoppingcart
"
>
<
img
alt
=
"
카트
"
src
=
"
/icon/cart.svg
"
width
=
"
30
"
height
=
"
30
"
/>
<
/Nav.Link
>
<
/
>
:
(
<>
...
...
@@ -22,12 +25,9 @@ function MainNav() {
<
Nav
.
Link
className
=
"
text-light
"
href
=
'
/signup
'
>
Sign
Up
<
/Nav.Link
>
<
/
>
)}
<
Nav
.
Link
href
=
"
/shoppingcart
"
>
<
img
alt
=
"
카트
"
src
=
"
/icon/cart.svg
"
width
=
"
30
"
height
=
"
30
"
/>
<
/Nav.Link
>
<
Nav
.
Link
href
=
"
/admin
"
>
{
admin
?
<
Nav
.
Link
href
=
"
/admin
"
>
<
img
alt
=
"
관리자
"
src
=
"
/icon/option.svg
"
width
=
"
30
"
height
=
"
30
"
/>
<
/Nav.Link
>
<
/Nav.Link>
: ''
}
<
/Nav
>
<
/Navbar
>
)
...
...
client/src/Components/Pagination.js
View file @
e2bb9325
import
React
from
'
react
'
;
import
{
Pagination
}
from
'
react-bootstrap
'
;
function
pagination
()
{
let
active
=
1
;
let
items
=
[];
for
(
let
number
=
1
;
number
<=
5
;
number
++
)
{
items
.
push
(
<
Pagination
.
Item
key
=
{
number
}
active
=
{
number
===
active
}
>
{
number
}
<
/Pagination.Item>
,
);
}
function
Paginations
(
props
)
{
return
(
<
Pagination
className
=
"
justify-content-center
"
>
{
items
}
<
/Pagination
>
<
Pagination
>
<
Pagination
.
First
onClick
=
{()
=>
props
.
handlePage
(
1
)}
/
>
{
props
.
index
===
1
?
<
Pagination
.
Prev
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
)}
/> : <Pagination.Prev onClick={
()
=>props.handlePage
(
props.index - 1
)
} /
>
}
{
props
.
index
===
props
.
endPage
-
1
?
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
-
3
)}
>
{
props
.
index
-
3
}
<
/Pagination.Item> : ""
}
{
props
.
index
===
props
.
endPage
?
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
-
4
)}
>
{
props
.
index
-
4
}
<
/Pagination.Item> : ""
}
{
props
.
index
===
props
.
endPage
?
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
-
3
)}
>
{
props
.
index
-
3
}
<
/Pagination.Item> : ""
}
{
props
.
index
<
3
?
""
:
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
-
2
)}
>
{
props
.
index
-
2
}
<
/Pagination.Item>
}
{
props
.
index
===
1
?
""
:
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
-
1
)}
>
{
props
.
index
-
1
}
<
/Pagination.Item>
}
<
Pagination
.
Item
active
>
{
props
.
index
}
<
/Pagination.Item
>
{
props
.
index
===
props
.
endPage
?
""
:
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
+
1
)}
>
{
props
.
index
+
1
}
<
/Pagination.Item>
}
{
props
.
index
>
props
.
endPage
-
2
?
""
:
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
+
2
)}
>
{
props
.
index
+
2
}
<
/Pagination.Item>
}
{
props
.
index
===
1
?
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
+
3
)}
>
{
props
.
index
+
3
}
<
/Pagination.Item> : ""
}
{
props
.
index
===
1
?
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
+
4
)}
>
{
props
.
index
+
4
}
<
/Pagination.Item> : ""
}
{
props
.
index
===
2
?
<
Pagination
.
Item
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
+
3
)}
>
{
props
.
index
+
3
}
<
/Pagination.Item> : ""
}
{
props
.
index
===
props
.
endPage
?
""
:
<
Pagination
.
Next
onClick
=
{()
=>
props
.
handlePage
(
props
.
index
+
1
)}
/>
}
<
Pagination
.
Last
onClick
=
{()
=>
props
.
handlePage
(
props
.
endPage
)}
/
>
<
/Pagination
>
)
}
export
default
pagination
\ No newline at end of file
export
default
Paginations
\ No newline at end of file
client/src/Components/PrivateRoute.js
0 → 100644
View file @
e2bb9325
import
React
from
'
react
'
;
import
{
Redirect
,
Route
}
from
'
react-router-dom
'
;
import
{
isAuthenticated
}
from
'
../utils/auth
'
;
function
PrivateRoute
({
path
,
children
})
{
if
(
isAuthenticated
())
{
return
(
<
Route
path
=
{
path
}
>
{
children
}
<
/Route
>
)
}
else
{
alert
(
'
회원이 아닙니다. 로그인 및 회원가입을 진행해 주세요.
'
);
return
(
<
Redirect
to
=
'
/
'
/>
)
}
}
export
default
PrivateRoute
\ No newline at end of file
client/src/Components/SubNav.js
View file @
e2bb9325
...
...
@@ -26,7 +26,7 @@ function SubNav() {
},
[])
return
(
<
Navbar
sticky
=
"
top
"
className
=
"
flex-nowrap
"
style
=
{{
top
:
"
6
2
px
"
,
paddingTop
:
"
0
"
,
paddingBottom
:
"
0
"
,
backgroundColor
:
"
#fff
"
}}
>
<
Navbar
sticky
=
"
top
"
className
=
"
flex-nowrap
"
style
=
{{
top
:
"
5
6px
"
,
paddingTop
:
"
0
"
,
paddingBottom
:
"
0
"
,
backgroundColor
:
"
#fff
"
}}
>
<
style
type
=
"
text/css
"
>
{
`
.nav-link, .nav-link:hover, .nav-link:active {
...
...
client/src/Pages/Account.js
View file @
e2bb9325
...
...
@@ -16,29 +16,25 @@ function Account() {
const
[
proshow
,
setProshow
]
=
useState
(
false
)
const
[
error
,
setError
]
=
useState
(
""
)
const
userId
=
isAuthenticated
()
const
[
ordered
,
setOrdered
]
=
useState
(
''
)
async
function
getUsername
(
user
)
{
// console.log("tlg")
try
{
const
response
=
await
axios
.
get
(
`/api/users/account/
${
user
}
`
)
setAccount
(
response
.
data
)
console
.
log
(
'
555555555
'
,
response
.
data
);
}
catch
(
error
)
{
catchError
(
error
,
setError
)
// console.log('error2222', error)
}
}
useEffect
(()
=>
{
getUsername
(
userId
)
getOrdered
(
userId
)
},
[
userId
])
const
handleChange
=
(
event
)
=>
{
const
{
name
,
value
,
files
}
=
event
.
target
if
(
files
)
{
for
(
const
file
of
files
)
{
// console.log("name=", name, "value=", value, 'file=', file);
}
setAccount
({
...
account
,
[
name
]:
files
})
}
else
{
console
.
log
(
"
name=
"
,
name
,
"
value=
"
,
value
);
...
...
@@ -81,6 +77,16 @@ function Account() {
}
}
async
function
getOrdered
({})
{
console
.
log
(
"
object
"
)
try
{
const
response
=
await
axios
.
get
(
`/api/users/addorder`
)
setOrdered
(
response
.
data
)
}
catch
(
error
)
{
catchError
(
error
,
setError
)
}
}
return
(
<
Container
className
=
"
px-3
"
>
<
style
type
=
"
text/css
"
>
...
...
@@ -105,7 +111,7 @@ function Account() {
)}
<
/Button
>
<
Modal
show
=
{
show
}
onHide
=
{()
=>
setShow
(
false
)}
>
<
Modal
.
Header
closeButton
style
=
{{
background
:
"
#F7F3F3
"
}}
>
<
Modal
.
Header
closeButton
style
=
{{
background
:
"
#F7F3F3
"
}}
>
<
Modal
.
Title
>
이미지를
변경하시겠습니까
?
<
/Modal.Title
>
<
/Modal.Header
>
<
Form
onSubmit
=
{
handleSubmit
}
>
...
...
@@ -136,7 +142,7 @@ function Account() {
size
=
"
sm
"
show
=
{
proshow
}
onHide
=
{()
=>
setProshow
(
false
)}
>
<
Modal
.
Header
closeButton
style
=
{{
background
:
"
#F7F3F3
"
}}
>
<
Modal
.
Header
closeButton
style
=
{{
background
:
"
#F7F3F3
"
}}
>
<
Modal
.
Title
>
회원정보
<
/Modal.Title
>
<
/Modal.Header
>
<
Modal
.
Body
>
...
...
client/src/Pages/Admin.js
View file @
e2bb9325
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
List
Card
from
'
../Components/
List
Card
'
;
import
All
Card
from
'
../Components/
All
Card
'
;
import
Pagination
from
'
../Components/Pagination
'
;
import
axios
from
'
axios
'
;
import
{
isAdmin
}
from
"
../utils/auth
"
;
import
catchError
from
'
../utils/catchErrors
'
;
import
{
Row
,
Form
,
FormControl
,
Button
,
Card
,
Container
}
from
'
react-bootstrap
'
;
import
{
Row
,
Form
,
FormControl
,
Button
,
Container
}
from
'
react-bootstrap
'
;
function
Admin
()
{
const
[
productlist
,
setProductlist
]
=
useState
([])
const
[
error
,
setError
]
=
useState
(
''
)
const
role
=
isAdmin
()
useEffect
(()
=>
{
getProductlist
()
...
...
@@ -34,11 +32,6 @@ function Admin() {
e
.
preventDefault
()
}
if
(
!
role
)
{
alert
(
'
죄송합니다.접근 권한이 없습니다.
'
)
return
<
Redirect
to
=
"
/
"
/>
}
return
(
<
Container
>
<
style
type
=
"
text/css
"
>
...
...
@@ -63,7 +56,7 @@ function Admin() {
<
/Row
>
<
Row
className
=
"
justify-content-center m-5
"
>
{
productlist
.
map
(
pro
=>
(
<
List
Card
id
=
{
pro
.
_id
}
name
=
{
pro
.
pro_name
}
price
=
{
pro
.
price
}
main_img
=
{
pro
.
main_imgUrl
}
/
>
<
All
Card
id
=
{
pro
.
_id
}
name
=
{
pro
.
pro_name
}
price
=
{
pro
.
price
}
main_img
=
{
pro
.
main_imgUrl
}
/
>
))}
<
/Row
>
<
Pagination
/>
...
...
client/src/Pages/Home.js
View file @
e2bb9325
...
...
@@ -21,7 +21,6 @@ function Home() {
async
function
getProductlist
()
{
try
{
const
response
=
await
axios
.
get
(
`/api/product/getproduct`
)
console
.
log
(
"
res=
"
,
response
.
data
)
setProductlist
({
bestProduct
:
response
.
data
.
bestProduct
,
newProduct
:
response
.
data
.
newProduct
})
}
catch
(
error
)
{
catchError
(
error
,
setError
)
...
...
client/src/Pages/Payment.js
View file @
e2bb9325
...
...
@@ -8,9 +8,8 @@ import { isAuthenticated } from '../utils/auth';
import
catchErrors
from
'
../utils/catchErrors
'
;
function
Payment
({
match
,
location
})
{
const
[
cart
,
setCart
]
=
useState
([])
const
[
order
,
setOrder
]
=
useState
({
products
:
[]
})
const
[
order
,
setOrder
]
=
useState
({
products
:
[]})
const
[
userData
,
setUserData
]
=
useState
({})
const
[
error
,
setError
]
=
useState
()
const
[
post
,
setPost
]
=
useState
([])
...
...
client/src/Pages/Product.js
View file @
e2bb9325
...
...
@@ -215,8 +215,24 @@ function Product({ match, location }) {
<
/Row
>
<
Row
className
=
"
justify-content-center mt-5 mx-0
"
>
<
Col
sm
=
{
11
}
md
=
{
8
}
>
<
h3
style
=
{{
borderBottom
:
"
1px solid #91877F
"
,
paddingBottom
:
"
5px
"
,
marginBottom
:
"
1em
"
}}
>
설명
<
/h3
>
<
div
><
/div
>
<
h3
style
=
{{
borderBottom
:
"
1px solid #91877F
"
,
paddingBottom
:
"
5px
"
,
marginBottom
:
"
1em
"
}}
className
=
"
p-3
"
>
설명
<
/h3
>
<
Col
className
=
'
m-3 text-center d-flex justify-content-center
'
>
<
div
style
=
{{
wordBreak
:
'
break-all
'
,
wordWrap
:
'
break-word
'
,
fontFamily
:
"
맑은 고딕
"
}}
className
=
"
p-3
"
>
<
h1
className
=
'
m-3
'
>
{
product
.
name
}
<
/h1
>
<>
<
Image
src
=
{
`/images/
${
product
.
main_img
}
`
}
style
=
{{
objectFit
:
"
contain
"
,
width
:
'
100%
'
}}
/
>
<
/
>
<
Card
className
=
'
m-3 d-flex justify-content-center
'
>
<
Card
.
Body
>
{
product
.
description
}
<
/Card.Body
>
<
/Card
>
<
h3
className
=
'
mt-5
'
>
[
Detail
Images
]
<
/h3
>
<
Image
src
=
{
`/images/
${
product
.
detail_imgs
}
`
}
style
=
{{
objectFit
:
"
contain
"
}}
className
=
'
m-3
'
/>
<
/div
>
<
/Col
>
<
/Col
>
<
/Row
>
<
Row
className
=
"
justify-content-center mx-0 pt-3 px-2
"
style
=
{{
position
:
"
fixed
"
,
bottom
:
"
0
"
,
width
:
"
100%
"
,
backgroundColor
:
"
#fff
"
}}
>
...
...
client/src/Pages/ProductsList.js
View file @
e2bb9325
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Link
}
from
'
react-router-dom
'
;
import
ListCard
from
'
../Components/ListCard
'
;
import
Pagination
from
"
../Components/Pagination
"
;
import
axios
from
'
axios
'
;
import
catchError
from
'
../utils/catchErrors
'
;
import
{
Container
,
Row
,
Col
,
Form
,
FormControl
,
Button
,
Dropdown
,
ButtonGroup
}
from
'
react-bootstrap
'
;
function
ProductsList
({
match
})
{
const
[
search
,
setSearch
]
=
useState
({
word
:
''
})
const
[
mainCategory
,
setMainCategory
]
=
useState
(
match
.
params
.
main
.
toUpperCase
())
const
[
sub
c
ategory
,
setSub
c
ategory
]
=
useState
([])
const
[
sub
C
ategory
,
setSub
C
ategory
]
=
useState
([])
const
[
productlist
,
setProductlist
]
=
useState
([])
const
[
currentPage
,
setCurrentPage
]
=
useState
(
1
);
const
[
postsPerPage
,
setPostsPerPage
]
=
useState
(
6
);
const
[
error
,
setError
]
=
useState
(
''
)
const
indexOfLast
=
currentPage
*
postsPerPage
;
const
indexOfFirst
=
indexOfLast
-
postsPerPage
;
function
currentPosts
(
tmp
)
{
let
currentPosts
=
0
;
currentPosts
=
tmp
.
slice
(
indexOfFirst
,
indexOfLast
);
return
currentPosts
;
}
useEffect
(()
=>
{
setMainCategory
(
match
.
params
.
main
.
toUpperCase
())
...
...
@@ -17,65 +29,93 @@ function ProductsList({ match }) {
useEffect
(()
=>
{
getSubsCategories
(
[]
)
getSubsCategories
()
getProductlist
()
},
[
mainCategory
])
function
handleSearch
()
{
function
handleChange
(
event
)
{
console
.
log
(
'
handle change
'
,
event
.
target
.
value
)
setSearch
({
word
:
event
.
target
.
value
})
}
async
function
handleSearch
(
event
)
{
event
.
preventDefault
()
try
{
setError
(
''
)
const
response
=
await
axios
.
post
(
`/api/product/getproduct/main/
${
mainCategory
}
`
,
search
)
console
.
log
(
"
response.data=
"
,
response
.
data
)
setProductlist
(
response
.
data
)
}
catch
(
error
)
{
catchError
(
error
,
setError
)
}
}
async
function
getSubsCategories
(
[]
)
{
async
function
getSubsCategories
()
{
try
{
const
response
=
await
axios
.
get
(
`/api/categories/sub/
${
mainCategory
}
`
)
setSubcategory
(
Object
.
values
(
response
.
data
)[
0
])
console
.
log
(
"
response data=
"
,
response
.
data
)
setSubCategory
(
Object
.
values
(
response
.
data
)[
0
])
console
.
log
(
"
object value=
"
,
Object
.
values
(
response
.
data
));
}
catch
(
error
)
{
catchError
(
error
,
setError
)
}
}
async
function
getProductlist
()
{
console
.
log
(
"
tlfgpd
"
)
try
{
const
response
=
await
axios
.
get
(
`/api/product/getproduct/
${
mainCategory
}
`
)
console
.
log
(
"
response.data=
"
,
response
.
data
)
const
response
=
await
axios
.
get
(
`/api/product/getproduct/main/
${
mainCategory
}
`
)
setProductlist
(
response
.
data
)
}
catch
(
error
)
{
catchError
(
error
,
setError
)
}
}
async
function
handleSort
(
method
)
{
try
{
const
response
=
await
axios
.
get
(
`/api/product/getproduct/?q=
${
method
}
`
)
setProductlist
(
response
.
data
)
}
catch
(
error
)
{
catchError
(
error
,
setError
)
}
}
async
function
handleSubname
(
e
)
{
const
subname
=
e
.
target
.
name
console
.
log
(
"
subname=
"
,
subname
)
try
{
console
.
log
(
"
first test!!!!!!!!
"
)
const
response
=
await
axios
.
get
(
`/api/product/getproduct/sub/
${
subname
}
`
)
console
.
log
(
"
subname response data=
"
,
response
.
data
)
setProductlist
(
response
.
data
)
}
catch
(
error
)
{
console
.
log
(
"
error22
"
)
}
}
return
(
<
div
>
<
Container
>
<
style
type
=
"
text/css
"
>
{
`
a, a:hover, a:active {
color: #000;
text-decoration: none;
}
.btn {
background-color: #CDC5C2;
border-color: #CDC5C2;
}
.btn:hover, .btn:active, .btn:focus, .show>.btn-primary.dropdown-toggle {
background-color: #91877F;
.btn:hover {
background: #91877F;
border-color: #91877F;
}
`
}
<
/style
>
<
Container
>
<
Row
className
=
"
justify-content-center
"
>
<
Col
sm
=
{
10
}
xs
=
{
12
}
>
<
h1
style
=
{{
fontSize
:
"
3rem
"
}}
className
=
"
text-center
"
>
{
mainCategory
}
<
/h1
>
<
div
className
=
"
text-center
"
>
<
ButtonGroup
className
=
"
m-3
"
variant
=
"
outline-light secondary
"
style
=
{{
display
:
"
inline-block
"
}}
>
{
sub
c
ategory
.
map
(
el
=>
(
<
Button
className
=
"
m-1
"
variant
=
"
secondary
"
>
{
el
}
<
/Button>
))
}
{
sub
C
ategory
.
map
(
el
=>
(
<
Button
className
=
"
m-1
"
variant
=
"
secondary
"
name
=
{
el
}
onClick
=
{
handleSubname
}
>
{
el
}
<
/Button>
))
}
<
/ButtonGroup
>
<
/div
>
<
/Col
>
...
...
@@ -84,34 +124,21 @@ function ProductsList({ match }) {
<
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
.
Item
onClick
=
{()
=>
handleSort
(
'
purchase
'
)}
>
인기상품
<
/Dropdown.Item
>
<
Dropdown
.
Item
onClick
=
{()
=>
handleSort
(
'
newest
'
)}
>
신상품
<
/Dropdown.Item
>
<
Dropdown
.
Item
onClick
=
{()
=>
handleSort
(
'
lowest
'
)}
>
낮은가격
<
/Dropdown.Item
>
<
Dropdown
.
Item
onClick
=
{()
=>
handleSort
(
'
highest
'
)}
>
높은가격
<
/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
"
>
<
Form
inline
onSubmit
=
{
handleSearch
}
className
=
"
justify-content-end mx-0
"
>
<
FormControl
type
=
"
text
"
onChange
=
{
handleChange
}
placeholder
=
"
Search
"
style
=
{{
width
:
"
13rem
"
}}
/
>
<
Button
type
=
"
submit
"
className
=
"
px-2
"
>
<
img
src
=
"
/icon/search.svg
"
width
=
"
20
"
height
=
"
20
"
/>
<
/Button
>
<
/Form
>
<
/Row
>
<
Row
md
=
{
8
}
sm
=
{
12
}
className
=
"
justify-content-center m-2
"
>
{
productlist
.
map
(
pro
=>
(
// <ListCard as={Link} id={pro._id} name={pro.pro_name} price={pro.price} main_img={pro.main_imgUrl} 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
// }
// }} />
<
Link
to
=
{{
pathname
:
`/product/
${
pro
.
_id
}
`
,
state
:
{
...
...
@@ -128,9 +155,9 @@ function ProductsList({ match }) {
<
ListCard
id
=
{
pro
.
_id
}
name
=
{
pro
.
pro_name
}
price
=
{
pro
.
price
}
main_img
=
{
pro
.
main_imgUrl
}
/
>
<
/Link
>
))}
{
/* <Pagination className="justify-content-center" index={} endPage={} handlePage={}/> */
}
<
/Row
>
<
/Container
>
<
/div
>
)
}
...
...
client/src/Pages/ShoppingCart.js
View file @
e2bb9325
import
React
,
{
useState
,
useEffect
,
useRef
}
from
'
react
'
;
import
{
Link
,
Redirect
}
from
'
react-router-dom
'
;
import
{
Card
,
Button
,
Container
,
Row
,
Col
}
from
'
react-bootstrap
'
;
import
{
Button
,
Container
,
Row
,
Col
}
from
'
react-bootstrap
'
;
import
axios
from
'
axios
'
;
import
catchErrors
from
'
../utils/catchErrors
'
;
import
{
isAuthenticated
}
from
'
../utils/auth
'
import
{
isAuthenticated
}
from
'
../utils/auth
'
;
import
CartCard
from
'
../Components/CartCard
'
;
function
ShoppingCart
()
{
...
...
@@ -134,7 +134,6 @@ function ShoppingCart() {
}}
className
=
"
px-5
"
style
=
{{
background
:
"
#91877F
"
,
borderColor
:
'
#91877F
'
}}
onClick
=
{
putCheckedCart
}
block
>
결제하기
<
/Button
>
<
/div
>
<
/Container
>
<
/div
>
)
}
...
...
client/src/Pages/Signup.js
View file @
e2bb9325
...
...
@@ -71,42 +71,44 @@ function Signup() {
<
Row
className
=
"
justify-content-center
"
>
<
Col
md
=
{
6
}
xs
=
{
10
}
className
=
"
border
"
style
=
{{
background
:
'
#F7F3F3
'
}}
>
<
h2
className
=
"
text-center m
t
-5
"
>
Sign
Up
<
/h2
>
<
h2
className
=
"
text-center m-5
"
>
Sign
Up
<
/h2
>
{
error
&&
<
Alert
variant
=
'
danger
'
>
{
error
}
<
/Alert>
}
<
Form
noValidate
validated
=
{
validated
}
onSubmit
=
{
handleSubmit
}
className
=
"
p-
5
"
>
<
Form
.
Group
controlId
=
"
formBasicName
"
>
className
=
"
p-
4
"
>
<
Form
.
Group
as
=
{
Col
}
controlId
=
"
formBasicName
"
className
=
"
justify-content-end
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
id
"
>
이
름
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
<
Col
sm
=
{
8
}
xs
=
{
6
}
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
.
Control
.
Feedback
type
=
"
invalid
"
>
이름을
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicNumber
"
>
<
Form
.
Group
as
=
{
Col
}
controlId
=
"
formBasicNumber
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
number
"
>
주민등록번호
<
/Col
>
<
Row
>
<
Col
xs
=
{
3
}
>
<
Form
.
Control
required
type
=
"
text
"
name
=
"
number1
"
maxlength
=
"
6
"
className
=
"
m
x
-3 p-1
"
style
=
{{
width
:
'
80px
'
}}
className
=
"
m
l-1 mr
-3 p-1
"
style
=
{{
width
:
'
80px
'
}}
value
=
{
user
.
number1
}
onChange
=
{
handleChange
}
>
<
/Form.Control
>
<
div
className
=
'
font-weight-bold d-flex align-items-center
'
style
=
{{
text
:
'
center
'
}}
>
-
<
/div
>
<
/Col
>
<
Col
xs
=
{
1
}
>
<
div
className
=
'
font-weight-bold d-flex align-items-center
'
style
=
{{
text
:
'
center
'
}}
>-<
/div
>
<
/Col
>
<
Col
xs
=
{
2
}
>
<
Form
.
Control
required
type
=
"
text
"
name
=
"
number2
"
...
...
@@ -115,14 +117,12 @@ function Signup() {
value
=
{
user
.
number2
}
onChange
=
{
handleChange
}
>
<
/Form.Control
>
<
div
className
=
'
font-weight-bold d-flex align-items-center
'
>
*
*
*
*
*
*
<
/div
>
<
/Col
>
<
div
className
=
'
font-weight-bold d-flex align-items-center
'
>*
*
*
*
*
*
<
/div
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
주민등록번호를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Row
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicId
"
>
<
Form
.
Group
as
=
{
Col
}
controlId
=
"
formBasicId
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
id
"
>
아이디
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
...
...
@@ -136,7 +136,7 @@ function Signup() {
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
아이디를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicPassword
"
>
<
Form
.
Group
as
=
{
Col
}
controlId
=
"
formBasicPassword
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
password
"
>
비밀번호
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
...
...
@@ -148,12 +148,12 @@ function Signup() {
required
onChange
=
{
handleChange
}
/
>
<
Form
.
Control
.
Feedback
className
=
"
text-
c
en
ter
"
type
=
"
invalid
"
>
<
Form
.
Control
.
Feedback
className
=
"
text-en
d
"
type
=
"
invalid
"
>
비밀번호를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicPassword2
"
>
<
Form
.
Group
as
=
{
Col
}
controlId
=
"
formBasicPassword2
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
password
"
>
비밀번호
확인
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
...
...
@@ -169,7 +169,7 @@ function Signup() {
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicEmail
"
>
<
Form
.
Group
as
=
{
Col
}
controlId
=
"
formBasicEmail
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
email
"
>
이메일
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
as
=
{
Form
.
Control
}
...
...
@@ -182,7 +182,7 @@ function Signup() {
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
이메일
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Group
controlId
=
"
formBasicTel
"
>
<
Form
.
Group
as
=
{
Col
}
controlId
=
"
formBasicTel
"
>
<
Form
.
Row
>
<
Col
sm
=
{
4
}
xs
=
{
6
}
as
=
{
Form
.
Label
}
for
=
"
tel
"
>
휴대전화
<
/Col
>
<
Col
sm
=
{
8
}
xs
=
{
12
}
style
=
{{
width
:
'
160px
'
}}
className
=
'
p-0
'
>
...
...
@@ -200,7 +200,10 @@ function Signup() {
<
/Col
>
<
Form
.
Control
.
Feedback
type
=
"
invalid
"
>
휴대전화를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Row
>
<
/Form.Group
>
<
Form
.
Control
.
Feedback
className
=
"
text-end
"
type
=
"
invalid
"
>
비밀번호를
입력하세요
.
<
/Form.Control.Feedback
>
<
/Form.Group
>
<
Button
style
=
{{
background
:
'
#91877F
'
,
borderColor
:
'
#91877F
'
}}
type
=
"
submit
"
block
onClick
=
{
checkPassword
}
...
...
@@ -211,7 +214,7 @@ function Signup() {
<
/Col
>
<
/Row
>
<
/Container
>
<
/div
>
<
/div
>
)
}
...
...
server/controllers/cart.controller.js
View file @
e2bb9325
...
...
@@ -32,12 +32,15 @@ const changeCart = async (req, res) => {
const
showCart
=
async
(
req
,
res
)
=>
{
try
{
console
.
log
(
"
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
"
)
const
cart
=
await
Cart
.
findOne
({
userId
:
req
.
id
}).
populate
({
path
:
'
products.productId
'
,
model
:
'
Product
'
})
res
.
status
(
200
).
json
(
cart
.
products
)
console
.
log
(
"
cart-products :
"
,
cart
.
products
);
}
catch
(
error
)
{
console
.
log
(
"
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
"
)
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
쇼핑카트를 불러오지 못했습니다.
'
)
}
...
...
server/controllers/category.controller.js
View file @
e2bb9325
...
...
@@ -3,7 +3,6 @@ import Category from "../schemas/Category.js";
const
getCategory
=
async
(
req
,
res
)
=>
{
try
{
const
category
=
await
Category
.
find
({},
{
_id
:
0
})
// console.log("main= ", category);
res
.
json
(
category
)
}
catch
(
error
)
{
console
.
log
(
error
)
...
...
@@ -12,12 +11,12 @@ const getCategory = async (req, res) => {
}
const
getSubCategory
=
async
(
req
,
res
)
=>
{
//
console.log("req.params=", req.params);
console
.
log
(
"
req.params=
?(getsubcategory)
"
,
req
.
params
);
const
{
sub
}
=
req
.
params
try
{
const
subcategory
=
await
Category
.
findOne
({},
{
_id
:
0
}).
select
(
`
${
sub
}
`
)
// console.log("sub= ",subcategory);
res
.
json
(
subcategory
);
console
.
log
(
"
sub=
"
,
subcategory
);
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
카테고리를 불러오지 못했습니다.
'
)
}
...
...
@@ -51,20 +50,4 @@ const getsubId = async (req, res, next, ele) => {
next
()
}
// const userById = async (req, res, next, id) => {
// try {
// const user = await User.findById(id)
// if (!user) {
// res.status(404).send('사용자를 찾을 수 없습니다')
// }
// req.account = user
// next()
// } catch (error) {
// console.log(error);
// res.status(500).send('사용자 아이디 검색 실패')
// }
// }
export
default
{
getCategory
,
getsubId
,
getSubCategory
,
getToHome
}
\ No newline at end of file
server/controllers/order.controller.js
View file @
e2bb9325
...
...
@@ -14,6 +14,17 @@ const addorder = async (req, res) => {
}
}
const
Ordered
=
async
(
req
,
res
)
=>
{
const
{
db
}
=
req
.
body
try
{
const
ordered
=
await
req
.
body
.
findOne
({},
{
_id
:
0
}).
select
(
`
${
db
}
`
)
console
.
log
(
"
sub=
"
,
ordered
);
res
.
json
(
ordered
);
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
카테고리를 불러오지 못했습니다.
'
)
}
}
const
showorder
=
async
(
req
,
res
)
=>
{
try
{
const
order
=
await
Order
.
find
({
userId
:
req
.
userId
}).
sort
({
_id
:
-
1
}).
limit
(
1
).
populate
({
...
...
@@ -44,4 +55,4 @@ const orderById = async (req, res, next, id) => {
}
export
default
{
addorder
,
showorder
,
orderById
}
\ No newline at end of file
export
default
{
addorder
,
showorder
,
orderById
,
Ordered
}
server/controllers/product.controller.js
View file @
e2bb9325
...
...
@@ -51,6 +51,7 @@ const getAll = async (req, res) => {
}
const
getlist
=
(
req
,
res
)
=>
{
console
.
log
(
'
get list
'
)
try
{
res
.
json
(
req
.
productslist
)
}
catch
(
error
)
{
...
...
@@ -58,43 +59,55 @@ const getlist = (req, res) => {
}
}
const
categoryId
=
async
(
req
,
res
,
next
,
category
)
=>
{
const
subname
=
async
(
req
,
res
)
=>
{
try
{
const
productslist
=
await
Product
.
find
({
main_category
:
category
})
if
(
!
productslist
)
{
res
.
status
(
404
).
send
(
'
상품을 찾을 수 없습니다.
'
)
}
req
.
productslist
=
productslist
next
()
console
.
log
(
"
last subname::: LET ME SEE
"
)
res
.
json
(
req
.
findsubname
)
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
상품을 불러오지 못했습니다.
'
)
}
}
const
subgetlist
=
(
req
,
res
)
=>
{
const
categoryId
=
async
(
req
,
res
,
next
,
category
)
=>
{
const
{
search
}
=
req
.
body
console
.
log
(
"
server search=
"
,
search
)
try
{
res
.
json
(
req
.
subproductslist
)
const
productslist
=
await
Product
.
find
({
main_category
:
category
})
// if (!productslist) {
// res.status(404).send('상품을 찾을 수 없습니다.')
// }
req
.
productslist
=
productslist
console
.
log
(
"
nononono
"
,
req
.
productslist
)
next
()
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
상품을 불러오지 못했습니다.
'
)
}
}
const
subcategoryId
=
async
(
req
,
res
,
next
,
sub
category
)
=>
{
const
subcategoryId
=
async
(
req
,
res
,
next
,
sub
name
)
=>
{
try
{
const
subproductslist
=
await
Product
.
find
({
sub_category
:
subcategory
})
if
(
!
subproductslist
)
{
res
.
status
(
404
).
send
(
'
상품을 찾을 수 없습니다.
'
)
console
.
log
(
"
Please===>>>
"
,
subname
)
const
findSubname
=
await
Product
.
find
({
sub_category
:
subname
})
console
.
log
(
"
findSubname111=
"
,
findSubname
)
if
(
!
findSubname
)
{
const
findSubname
=
{
_id
:
'
nothing
'
,
pro_name
:
'
상품준비중
'
,
price
:
0
,
main_imgUrl
:
''
}
req
.
subproductslist
=
subproductslist
next
()
console
.
log
(
"
findSubname2222=
"
,
findSubname
)
res
.
send
(
findSubname
)
}
res
.
send
(
findSubname
)
}
catch
(
error
)
{
res
.
status
(
500
).
send
(
'
상품을 불러오지 못했습니다.
'
)
res
.
send
(
'
상품을 불러오지 못했습니다.
'
)
}
}
const
plusPurchase
=
async
(
req
,
res
)
=>
{
const
{
products
}
=
req
.
body
// console.log(products)
try
{
for
(
let
i
=
0
;
i
<
products
.
length
;
i
++
)
{
const
count
=
products
[
i
].
count
...
...
@@ -112,7 +125,6 @@ const plusPurchase = async (req, res) => {
}
}
)
// console.log("i=", i)
}
res
.
send
(
"
구매수 늘리기, 재고수 줄이기 성공
"
)
}
catch
(
error
)
{
...
...
@@ -120,4 +132,4 @@ const plusPurchase = async (req, res) => {
}
}
export
default
{
imageUpload
,
regist
,
getToHome
,
getAll
,
categoryId
,
getlist
,
subcategoryId
,
subgetlist
,
plusPurchase
}
\ No newline at end of file
export
default
{
imageUpload
,
regist
,
getToHome
,
getAll
,
categoryId
,
getlist
,
subcategoryId
,
subname
,
plusPurchase
}
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