Skip to content

GitLab

Commit d9744453 authored by kusang96's avatar kusang96
Browse files

서버에서 정해진 갯수만큼 가져오기

parent 48427c96
Hide whitespace changes
Inline Side-by-side
client/src/Pages/Admin.js
View file @ d9744453
......@@ -6,40 +6,49 @@ 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 [length, setLength] = useState(0)
const [currentPage, setCurrentPage] = useState(1)
const [error, setError] = useState('')
const searchref = useRef(null)
const per = 10;
const per = 9;
useEffect(() => {
getProductlist()
}, [])
useEffect(() => {
setStatus({ indexOfFirst: (currentPage - 1) * per, indexOfLast: currentPage * per })
if (search.word == '') {
getProductlist()
} else {
handleSearch()
}
}, [currentPage])
function currentPosts(items) {
let currentPosts = 0;
currentPosts = items.slice(status.indexOfFirst, status.indexOfLast);
return currentPosts
}
async function getProductlist() {
try {
setError('')
const response = await axios.get(`/api/product/getproduct/all`)
setProductlist(response.data)
setCurrentPage(1)
setSearch({ word: '' })
const response = await axios.get(`/api/product/getproduct/all?page=${currentPage}`)
setProductlist(response.data.productPiece)
setLength(response.data.length)
} catch (error) {
catchError(error, setError)
}
}
async function handleSearch() {
try {
setError('')
const response = await axios.get(`/api/product/getproduct/all?product=${search.word}&page=${currentPage}`)
setProductlist(response.data.productPiece)
setLength(response.data.length)
} catch (error) {
catchError(error, setError)
}
}
function handleChange(event) {
setSearch({ word: event.target.value })
}
......@@ -48,9 +57,12 @@ function Admin() {
e.preventDefault()
try {
setError('')
const response = await axios.get(`/api/product/getproduct/all?product=${search.word}`)
setProductlist(response.data)
setCurrentPage(1)
if (currentPage != 1) {
setCurrentPage(1)
}
const response = await axios.get(`/api/product/getproduct/all?product=${search.word}&page=${currentPage}`)
setProductlist(response.data.productPiece)
setLength(response.data.length)
} catch (error) {
catchError(error, setError)
} finally {
......@@ -103,11 +115,11 @@ function Admin() {
<Button sm={2} xs={6} type="button" href="/regist" className="ml-1">상품 등록</Button>
</Row>
<Row className="justify-content-center m-5">
{currentPosts(productlist).map(pro => (
{productlist.map(pro => (
<AllCard id={pro._id} name={pro.pro_name} price={pro.price} main_img={pro.main_imgUrl} />
))}
</Row>
<Pagination index={currentPage} totalPages={Math.ceil(productlist.length / per)} handlePage={setCurrentPage} />
<Pagination index={currentPage} totalPages={Math.ceil(length / per)} handlePage={setCurrentPage} />
</Container>
)
}
......
client/src/Pages/ProductsList.js
View file @ d9744453
......@@ -7,20 +7,22 @@ import catchError from '../utils/catchErrors';
import { Container, Row, Col, Form, FormControl, Button, Dropdown, ButtonGroup, Image } from 'react-bootstrap';
function ProductsList({ match }) {
const INIT_STATUS = { indexOfFirst: 0, indexOfLast: 10 }
const [search, setSearch] = useState({ word: '' })
const [sortingName, setSortingName] = useState('정렬')
const [mainCategory, setMainCategory] = useState(match.params.main.toUpperCase())
const [subCategory, setSubCategory] = useState([])
const [selectSubCategory, setSelectSubCategory] = useState('')
const [productlist, setProductlist] = useState([])
const [status, setStatus] = useState(INIT_STATUS)
const [length, setLength] = useState(0)
const [currentPage, setCurrentPage] = useState(1)
const [error, setError] = useState('')
const searchref = useRef(null)
const per = 10;
const per = 9;
useEffect(() => {
setMainCategory(match.params.main.toUpperCase())
setSelectSubCategory('')
setCurrentPage(1)
}, [match.params.main])
......@@ -30,13 +32,25 @@ function ProductsList({ match }) {
}, [mainCategory])
useEffect(() => {
setStatus({ indexOfFirst: (currentPage - 1) * per, indexOfLast: currentPage * per })
if (search.word == '') {
getProductlist()
} else if (selectSubCategory != '') {
changePageforSubname()
} else {
setSelectSubCategory('')
searchList()
}
}, [currentPage])
function currentPosts(items) {
let currentPosts = '';
currentPosts = items.slice(status.indexOfFirst, status.indexOfLast);
return currentPosts
async function searchList() {
try {
setError('')
const response = await axios.get(`/api/product/getproduct/main/${mainCategory}?product=${search.word}&page=${currentPage}`)
setProductlist(response.data.productsPiece)
setLength(response.data.length)
} catch (error) {
catchError(error, setError)
}
}
function handleChange(event) {
......@@ -47,9 +61,12 @@ function ProductsList({ match }) {
e.preventDefault()
try {
setError('')
const response = await axios.get(`/api/product/getproduct/main/${mainCategory}?product=${search.word}`)
setProductlist(response.data)
setCurrentPage(1)
if (currentPage != 1) {
setCurrentPage(1)
}
const response = await axios.get(`/api/product/getproduct/main/${mainCategory}?product=${search.word}&page=${currentPage}`)
setProductlist(response.data.productsPiece)
setLength(response.data.length)
} catch (error) {
catchError(error, setError)
} finally {
......@@ -70,9 +87,10 @@ function ProductsList({ match }) {
async function getProductlist() {
try {
setError('')
const response = await axios.get(`/api/product/getproduct/main/${mainCategory}`)
setProductlist(response.data)
setCurrentPage(1)
setSearch({ word: '' })
const response = await axios.get(`/api/product/getproduct/main/${mainCategory}?page=${currentPage}`)
setProductlist(response.data.productsPiece)
setLength(response.data.length)
} catch (error) {
catchError(error, setError)
}
......@@ -126,13 +144,27 @@ function ProductsList({ match }) {
}
}
async function changePageforSubname() {
try {
setError('')
setSearch({ word: '' })
const response = await axios.get(`/api/product/getproduct/sub?subname=${selectSubCategory}&page=${currentPage}`)
setProductlist(response.data.productsPiece)
setLength(response.data.length)
} catch (error) {
catchError(error, setError)
}
}
async function handleSubname(e) {
const subname = e.target.name
setSelectSubCategory(e.target.name)
try {
setError('')
const response = await axios.get(`/api/product/getproduct/sub?subname=${subname}`)
setProductlist(response.data)
setCurrentPage(1)
setSearch({ word: '' })
const response = await axios.get(`/api/product/getproduct/sub?subname=${subname}&page=${currentPage}`)
setProductlist(response.data.productsPiece)
setLength(response.data.length)
} catch (error) {
catchError(error, setError)
}
......@@ -212,7 +244,7 @@ function ProductsList({ match }) {
</Row>
<Row md={8} sm={12} className="justify-content-center m-2">
{productlist.length > 0 ?
currentPosts(productlist).map(pro => (
productlist.map(pro => (
<Link to={{
pathname: `/product/${pro._id}`,
state: {
......@@ -235,7 +267,7 @@ function ProductsList({ match }) {
)
}
</Row>
{productlist.length != 0 ? <Pagination index={currentPage} totalPages={Math.ceil(productlist.length / per)} handlePage={setCurrentPage} /> : ''}
{productlist.length != 0 ? <Pagination index={currentPage} totalPages={Math.ceil(length / per)} handlePage={setCurrentPage} /> : ''}
</Container>
)
}
......
server/controllers/product.controller.js
View file @ d9744453
......@@ -38,17 +38,23 @@ const getToHome = async (req, res) => {
}
const getAll = async (req, res) => {
const per = 9;
try {
if (req.query.product) {
const productslist = await Product.find({ pro_name: { $regex: new RegExp(req.query.product) } }).sort({ createdAt: -1 })
const length = productslist.length
const productPiece = await Product.find({ pro_name: { $regex: new RegExp(req.query.product) } }).sort({ createdAt: -1 }).skip((req.query.page - 1) * per).limit(per)
if (productslist.length == 0) {
res.status(404).send('상품을 찾을 수 없습니다.')
} else {
res.json(productslist)
res.json({productPiece, length})
}
} else {
const productslist = await Product.find({}).sort({ createdAt: -1 })
res.json(productslist)
const length = productslist.length
const productPiece = await Product.find({}).sort({ createdAt: -1 }).skip((req.query.page - 1) * per).limit(per)
console.log("products=",productPiece)
res.json({productPiece, length})
}
} catch (error) {
res.status(500).send('상품을 불러오지 못했습니다.')
......@@ -57,7 +63,9 @@ const getAll = async (req, res) => {
const getlist = (req, res) => {
try {
res.json(req.productslist)
const productsPiece = req.productsPiece
const length = req.length
res.json({ productsPiece, length })
} catch (error) {
res.status(500).send('상품을 불러오지 못했습니다.')
}
......@@ -65,17 +73,24 @@ const getlist = (req, res) => {
const categoryId = async (req, res, next, category) => {
const per = 9;
try {
if (req.query.product) {
const productslist = await Product.find({ main_category: category, pro_name: { $regex: new RegExp(req.query.product) } })
const length = productslist.length
const productsPiece = await Product.find({ main_category: category, pro_name: { $regex: new RegExp(req.query.product) } }).skip((req.query.page - 1) * per).limit(per)
if (productslist.length == 0) {
res.status(404).send('상품을 찾을 수 없습니다.')
} else {
req.productslist = productslist
req.length = length
req.productsPiece = productsPiece
}
} else {
const productslist = await Product.find({ main_category: category })
req.productslist = productslist
const length = productslist.length
req.length = length
const productsPiece = await Product.find({ main_category: category }).skip((req.query.page - 1) * per).limit(per)
req.productsPiece = productsPiece
}
next()
} catch (error) {
......@@ -84,9 +99,12 @@ const categoryId = async (req, res, next, category) => {
}
const subname = async (req, res) => {
const per = 9;
try {
const findSubname = await Product.find({ sub_category: req.query.subname })
res.send(findSubname)
const productslist = await Product.find({ sub_category: req.query.subname })
const length = productslist.length
const productsPiece = await Product.find({ sub_category: req.query.subname }).skip((req.query.page - 1) * per).limit(per)
res.send({ productsPiece, length })
} 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