Skip to content

GitLab

Commit fbce3d1a authored by kusang96's avatar kusang96
Browse files

Merge branch 'kimpen' into ourMaster

parents fa94e0d1 d4c8d671
Hide whitespace changes
Inline Side-by-side
client/src/Components/Pagination.js
View file @ fbce3d1a
import { Pagination } from "react-bootstrap";
import React from 'react';
import { Pagination } from 'react-bootstrap';
function Paginations({ inedx, endPage, handlePage }) {
function Paginations({ index, endPage, handlePage }) {
return (
<Pagination>
......@@ -15,7 +15,6 @@ function Paginations({ inedx, endPage, handlePage }) {
<Pagination.Item active>{index}</Pagination.Item>
{index === endPage ? "" : <Pagination.Item onClick={()=>handlePage(index + 1)}>{index + 1}</Pagination.Item>}
{index > endPage-2 ? "" : <Pagination.Item onClick={()=>handlePage(index + 2)}>{index + 2}</Pagination.Item>}
{index === 1 ? <Pagination.Item onClick={()=>handlePage(index + 3)}>{index + 3}</Pagination.Item> : ""}
......@@ -26,7 +25,6 @@ function Paginations({ inedx, endPage, handlePage }) {
<Pagination.Last onClick={() =>handlePage(endPage)} />
</Pagination>
)
}
export default Paginations
\ No newline at end of file
client/src/Components/SubNav.js
View file @ fbce3d1a
......@@ -15,8 +15,7 @@ function SubNav() {
Object.keys(response.data[0]).forEach((ele) => {
const url = ele.toLowerCase()
list.push(
<Nav.Link href={`/categories/${url}`}>{ele}
</Nav.Link>
<Nav.Link href={`/categories/${url}`}>{ele}</Nav.Link>
)
})
setCategoriesDiv(list)
......
client/src/Pages/Admin.js
View file @ fbce3d1a
import React, { useState, useEffect, useRef } from 'react';
import { Redirect } from 'react-router-dom';
import AllCard from '../Components/AllCard';
import Pagination from '../Components/Pagination';
import Pagination from "../Components/Pagination";
import axios from 'axios';
import catchError from '../utils/catchErrors';
import { Row, Form, FormControl, Button, Container } from 'react-bootstrap';
function Admin() {
const INIT_STATUS = { indexOfFirst: 0, indexOfLast: 10 }
const [search, setSearch] = useState({ word: '' })
const [productlist, setProductlist] = useState([])
const [status, setStatus] = useState(INIT_STATUS)
const [currentPage, setCurrentPage] = useState(1);
const [per, setPer] = useState(10);
const [error, setError] = useState('')
const searchref = useRef(null)
const indexOfLast = currentPage * per;
const indexOfFirst = indexOfLast - per;
useEffect(() => {
getProductlist()
}, [])
function paginate(items, index, itemNumber) {
const posts = [];
const startIndex = (index - 1) * itemNumber
for (var i = 0; i < itemNumber; i++) {
posts.push(items[(startIndex + i)])
}
return posts
}
function currentPosts(tmp) {
let currentPosts = 0;
currentPosts = tmp.slice(indexOfFirst, indexOfLast);
console.log("postsPerPage=",currentPage)
return currentPosts;
}
async function getProductlist() {
try {
const response = await axios.get(`/api/product/getproduct/all`)
......@@ -24,12 +48,28 @@ function Admin() {
}
}
function handleSearch() {
function handleChange(event) {
setSearch({ word: event.target.value })
}
function handleSubmit(e) {
async function handleSubmit(e) {
e.preventDefault()
try {
setError('')
const response = await axios.get(`/api/product/getproduct/all?product=${search.word}`)
console.log("response.data=", response.data)
setProductlist(response.data)
} catch (error) {
catchError(error, setError)
} finally {
searchref.current.value = ''
}
}
if (error) {
alert(`${error}`)
setError('')
searchref.current.value = ''
}
return (
......@@ -48,18 +88,18 @@ function Admin() {
`}
</style>
<Row as={Form} onSubmit={handleSubmit} className="justify-content-end mx-0 my-5">
<FormControl type="text" placeholder="Search" style={{ width: "13rem" }} />
<FormControl ref={searchref} 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>
<Button sm={2} xs={6} type="button" href="/regist" className="ml-1">상품 등록</Button>
</Row>
<Row className="justify-content-center m-5">
{productlist.map(pro => (
{currentPosts(productlist).map(pro => (
<AllCard id={pro._id} name={pro.pro_name} price={pro.price} main_img={pro.main_imgUrl} />
))}
</Row>
<Pagination />
<Pagination index={currentPage} totalPosts={Math.ceil(productlist.length / per)} handlePage={setCurrentPage} />
</Container>
)
}
......
client/src/Pages/Payment.js
View file @ fbce3d1a
import axios from 'axios';
import React, { useState, useEffect, useRef } from 'react';
import DaumPostcode from "react-daum-postcode";
import { Container, Card, Row, Col, Button, Form, FormGroup } from 'react-bootstrap';
import { Container, Row, Col, Button, Form } from 'react-bootstrap';
import { Redirect, Link, useHistory } from 'react-router-dom';
import PaymentCard from '../Components/PaymentCard';
import { isAuthenticated } from '../utils/auth';
......@@ -9,7 +9,7 @@ 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([])
......@@ -231,87 +231,82 @@ function Payment({ match, location }) {
}
return (
<div>
{/* {console.log(completeState)} */}
<Container>
<h3 className="my-5 font-weight-bold text-center">주문/결제</h3>
<div>
<h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>주문자 정보</h5>
<Row className="justify-content-md-center">
<Col md={4}>
<Form>
<Form.Group controlId="formBasicName">
<Form.Label>이름</Form.Label>
<Form.Control type="text" value={userData.name} readOnly />
</Form.Group>
<Form.Group controlId="formBasicTel">
<Form.Label>휴대전화</Form.Label>
<Form.Control type="tel" value={userData.tel} readOnly />
</Form.Group>
<Form.Group controlId="formBasicEmail">
<Form.Label>이메일</Form.Label>
<Form.Control type="email" value={userData.email} readOnly />
</Form.Group>
</Form>
</Col>
</Row>
</div>
<div>
<h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>받는사람 정보</h5>
<Row className="justify-content-center">
<Col md={8}>
<Form>
<Form.Group>
<Form.Label>이름</Form.Label>
<Form.Control type="text" name="name" onChange={handleReceiverInfo}></Form.Control>
</Form.Group>
<Form.Group>
<Form.Label>휴대전화</Form.Label>
<Form.Control type="text" name="tel" onChange={handleReceiverInfo}></Form.Control>
</Form.Group>
<Form.Group controlId="formBasicAdd">
<Form.Label>주소</Form.Label>
<Form.Row>
<Col xs={4} sm={4}>
<Form.Control type="text" name="postalCode" id="add" onChange={handleReceiverInfo} value={address.code} disabled={(address.code == null) ? false : true} placeholder="우편번호" required ></Form.Control>
</Col>
<Col >
<Button style={{ background: '#91877F', borderColor: '#91877F' }} className="mx-1" onClick={postClick}>우편번호</Button>
{post}
</Col>
</Form.Row>
<Form.Row>
<Col>
<Form.Control type="text" name="address" id="add1" onChange={handleReceiverInfo} value={address.full} disabled={(address.code == null) ? false : true} placeholder="주소" required></Form.Control>
<Form.Control type="text" name="address2" id="add2" onChange={handleReceiverInfo} placeholder="상세주소" required></Form.Control>
<Form.Control.Feedback type="invalid" > 상세 주소를 입력하세요. </Form.Control.Feedback>
</Col>
</Form.Row>
</Form.Group>
</Form>
</Col>
</Row>
</div>
<div>
<h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>주문상품정보</h5>
<PaymentCard cart={cart} deleteOrder={deleteOrder} />
</div>
<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">{finalPrice}원</span>
</li>
<li>
<span className="text-secondary">배송비</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">{finalPrice + 2500}원</span>
</div>
<Container>
<h3 className="my-5 font-weight-bold text-center">주문/결제</h3>
<div>
<h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>주문자 정보</h5>
<Row className="justify-content-md-center">
<Col md={4}>
<Form>
<Form.Group controlId="formBasicName">
<Form.Label>이름</Form.Label>
<Form.Control type="text" value={userData.name} readOnly />
</Form.Group>
<Form.Group controlId="formBasicTel">
<Form.Label>휴대전화</Form.Label>
<Form.Control type="tel" value={userData.tel} readOnly />
</Form.Group>
<Form.Group controlId="formBasicEmail">
<Form.Label>이메일</Form.Label>
<Form.Control type="email" value={userData.email} readOnly />
</Form.Group>
</Form>
</Col>
</Row>
</div>
<div>
<h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>받는사람 정보</h5>
<Row className="justify-content-center">
<Col md={8}>
<Form>
<Form.Group>
<Form.Label>이름</Form.Label>
<Form.Control type="text" name="name" onChange={handleReceiverInfo}></Form.Control>
</Form.Group>
<Form.Group>
<Form.Label>휴대전화</Form.Label>
<Form.Control type="text" name="tel" onChange={handleReceiverInfo}></Form.Control>
</Form.Group>
<Form.Group controlId="formBasicAdd">
<Form.Label>주소</Form.Label>
<Form.Row>
<Col xs={4} sm={4}>
<Form.Control type="text" name="postalCode" id="add" onChange={handleReceiverInfo} value={address.code} disabled={(address.code == null) ? false : true} placeholder="우편번호" required ></Form.Control>
</Col>
<Col >
<Button style={{ background: '#91877F', borderColor: '#91877F' }} className="mx-1" onClick={postClick}>우편번호</Button>
{post}
</Col>
</Form.Row>
<Form.Row>
<Col>
<Form.Control type="text" name="address" id="add1" onChange={handleReceiverInfo} value={address.full} disabled={(address.code == null) ? false : true} placeholder="주소" required></Form.Control>
<Form.Control type="text" name="address2" id="add2" onChange={handleReceiverInfo} placeholder="상세주소" required></Form.Control>
<Form.Control.Feedback type="invalid" > 상세 주소를 입력하세요. </Form.Control.Feedback>
</Col>
</Form.Row>
</Form.Group>
</Form>
</Col>
</Row>
</div>
<div>
<h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>주문상품정보</h5>
<PaymentCard cart={cart} deleteOrder={deleteOrder} />
</div>
<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">{finalPrice}원</span>
</li>
<li>
<span className="text-secondary">배송비</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">{finalPrice + 2500}원</span>
</div>
<div>
<h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>결제수단</h5>
......@@ -324,8 +319,12 @@ function Payment({ match, location }) {
<div className="text-center">
<Button type="button" onClick={paymentCompleted} className="px-5" style={{ background: "#91877F", borderColor: '#91877F' }} block>결제완료</Button>
</div>
</Container>
</div>
{paymentWay}
</div>
<div className="text-center">
<Button className="px-5" style={{ background: "#91877F", borderColor: '#91877F' }} onClick={paymentCompleted} block>결제완료</Button>
</div>
</Container>
)
}
......
client/src/Pages/ProductsList.js
View file @ fbce3d1a
......@@ -16,6 +16,7 @@ function ProductsList({ match }) {
const [error, setError] = useState('')
const indexOfLast = currentPage * postsPerPage;
const indexOfFirst = indexOfLast - postsPerPage;
const searchref = useRef(null)
const [sortingName, setSortingName] = useState('정렬')
......@@ -36,24 +37,26 @@ function ProductsList({ match }) {
}, [mainCategory])
function handleChange(event) {
console.log('handle change', event.target.value)
setSearch({ word: event.target.value })
}
async function handleSearch(event) {
event.preventDefault()
async function handleSearch(e) {
e.preventDefault()
try {
setError('')
const response = await axios.post(`/api/product/getproduct/main/${mainCategory}`, search)
const response = await axios.get(`/api/product/getproduct/main/${mainCategory}?product=${search.word}`)
console.log("response.data=", response.data)
setProductlist(response.data)
} catch (error) {
catchError(error, setError)
} finally {
searchref.current.value = ''
}
}
async function getSubsCategories() {
try {
setError('')
const response = await axios.get(`/api/categories/sub/${mainCategory}`)
setSubCategory(Object.values(response.data)[0])
console.log("object value=", Object.values(response.data));
......@@ -64,6 +67,7 @@ function ProductsList({ match }) {
async function getProductlist() {
try {
setError('')
const response = await axios.get(`/api/product/getproduct/main/${mainCategory}`)
setProductlist(response.data)
} catch (error) {
......@@ -132,7 +136,6 @@ function ProductsList({ match }) {
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=${subname}`)
......@@ -143,6 +146,12 @@ function ProductsList({ match }) {
}
}
if (error) {
alert(`${error}`)
setError('')
searchref.current.value = ''
}
return (
<Container>
{console.log(productlist)}
......@@ -157,9 +166,13 @@ function ProductsList({ match }) {
border-color: #CDC5C2;
}
.btn:hover {
background: #91877F;
background-color: #91877F;
border-color: #91877F;
}
.dropdown-item:hover, .dropdown-item:active {
background-color: #91877F;
color: #fff;
}
`}
</style>
<Row className="justify-content-center">
......@@ -174,7 +187,7 @@ function ProductsList({ match }) {
</Row>
<Row className="justify-content-end mx-0 mt-5 mb-3">
<Form inline onSubmit={handleSearch} className="justify-content-end mx-0 my-2">
<FormControl type="text" onChange={handleChange} placeholder="Search" style={{ width: "13rem" }} />
<FormControl ref={searchref} type="text" onChange={handleChange} placeholder="Search" style={{ width: "13rem" }} />
<Button type="submit" className="px-2 mr-2">
<img src="/icon/search.svg" width="20" height="20" />
</Button>
......
server/controllers/product.controller.js
View file @ fbce3d1a
......@@ -43,15 +43,23 @@ const getToHome = async (req, res) => {
const getAll = async (req, res) => {
try {
const productslist = await Product.find({}).sort({ createdAt: -1 })
res.json(productslist)
if (req.query.product) {
const productslist = await Product.find({ pro_name: { $regex: new RegExp(req.query.product) } }).sort({ createdAt: -1 })
if (productslist.length == 0) {
res.status(404).send('상품을 찾을 수 없습니다.')
} else {
res.json(productslist)
}
} else {
const productslist = await Product.find({}).sort({ createdAt: -1 })
res.json(productslist)
}
} catch (error) {
res.status(500).send('상품을 불러오지 못했습니다.')
}
}
const getlist = (req, res) => {
console.log('get list')
try {
res.json(req.productslist)
} catch (error) {
......@@ -61,15 +69,19 @@ const getlist = (req, res) => {
const categoryId = async (req, res, next, category) => {
const { search } = req.body
console.log("server search=", search)
console.log("req=", req.query.product)
try {
const productslist = await Product.find({ main_category: category })
// if (!productslist) {
// res.status(404).send('상품을 찾을 수 없습니다.')
// }
req.productslist = productslist
console.log("nononono", req.productslist)
if (req.query.product) {
const productslist = await Product.find({ main_category: category, pro_name: { $regex: new RegExp(req.query.product) } })
if (productslist.length == 0) {
res.status(404).send('상품을 찾을 수 없습니다.')
} else {
req.productslist = productslist
}
} else {
const productslist = await Product.find({ main_category: category })
req.productslist = productslist
}
next()
} catch (error) {
res.status(500).send('상품을 불러오지 못했습니다.')
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment