Commit 47900a5a authored by kusang96's avatar kusang96
Browse files

추천 및 pagination

parent 6ff1b7f2
......@@ -15,7 +15,7 @@ function ListCard(props) {
)
} else if (props.status === 'recommend') {
return (
<Card id={props.id} style={{ minWidth: "8rem" }}>
<Card id={props.id} className="mx-1" style={{ width: "10rem" }}>
<Card.Img variant="top" src={props.main_img && `/images/${props.main_img}`} style={{ objectFit: "contain" }} />
<Card.Body className="px-0">
<Card.Title style={{ whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" }}>{props.name}</Card.Title>
......
......@@ -35,8 +35,8 @@ function Paginations({ index, totalPages, handlePage }) {
{index === totalPages ? "" : <Pagination.Item onClick={()=>handlePage(index + 1)}>{index + 1}</Pagination.Item>}
{index > totalPages-2 ? "" : <Pagination.Item onClick={()=>handlePage(index + 2)}>{index + 2}</Pagination.Item>}
{index <= totalPages-3 && index >= 1 ? <Pagination.Item onClick={()=>handlePage(index + 3)}>{index + 3}</Pagination.Item> : ""}
{index <= totalPages-4 && index >= 1 ? <Pagination.Item onClick={()=>handlePage(index + 4)}>{index + 4}</Pagination.Item> : ""}
{index <= totalPages-3 && index < 3 ? <Pagination.Item onClick={()=>handlePage(index + 3)}>{index + 3}</Pagination.Item> : ""}
{index <= totalPages-4 && index < 2 ? <Pagination.Item onClick={()=>handlePage(index + 4)}>{index + 4}</Pagination.Item> : ""}
{index === totalPages ? <Pagination.Next disabled /> : <Pagination.Next onClick={()=>handlePage(index + 1)} />}
<Pagination.Last onClick={() =>handlePage(totalPages)} />
......
......@@ -22,14 +22,17 @@ function Product({ match, location }) {
const handleShow = () => setShow(true);
useEffect(() => {
recommend()
}, [])
getRecommend()
}, [product])
useEffect(() => {
setProduct(location.state)
}, [location.state])
useEffect(() => {
if (size && color) {
pushOptions()
}
getRecommend()
}, [size, color])
async function getRecommend(){
......@@ -138,7 +141,6 @@ function Product({ match, location }) {
userId: localStorage.getItem('id'),
products: cart
})
console.log(response.data)
history.push("/payment")
} catch (error) {
catchErrors(error, setError)
......@@ -151,12 +153,14 @@ function Product({ match, location }) {
}
}
return (
<div>
{console.log(product)}
<style type="text/css">
{`
a, a:hover, a:active {
color: #000;
text-decoration: none;
}
.btn {
background-color: #CDC5C2;
border-color: #CDC5C2;
......@@ -264,7 +268,7 @@ function Product({ match, location }) {
<h6 style={{ borderBottom: "1px solid", paddingBottom: "5px", marginBottom: "1em" }}>회원님이 선호할만한 상품 추천
<a className="close float-right" onClick={(e) => handleClick(e)} style={{ fontSize: "1rem", cursor: "pointer" }}>X</a>
</h6>
<Row className="justify-content-evenly mx-0" style={{ flexWrap: "nowrap", width: "100%", overflowX: "auto" }}>
<Row className="justify-content-center mx-0" style={{ flexWrap: "nowrap", width: "100%", overflowX: "auto" }}>
{productList.map(pro => (
<Link to={{
pathname: `/product/${pro._id}`,
......@@ -282,13 +286,6 @@ function Product({ match, location }) {
<ListCard id={pro._id} name={pro.pro_name} price={pro.price} main_img={pro.main_imgUrl} status={'recommend'} />
</Link>
))}
{/* <Col as={Card} style={{ minWidth: "8rem" }}>
<Card.Img variant="top" src="https://img.sonyunara.com/files/goods/67504/1607328307_0.jpg" style={{ objectFit: "contain" }} />
<Card.Body className="px-0">
<Card.Title>클로타탄원피스</Card.Title>
<Card.Text>구매자 수: 30</Card.Text>
</Card.Body>
</Col> */}
</Row>
</Col>
</Row>
......
......@@ -81,7 +81,9 @@ const recommendPro = async (req, res) => {
// a must be equal to b
return 0;
});
const array = filteredRecommend.map(async (el) => {
console.log('sort=',filteredRecommend)
const finalrecommend= filteredRecommend.slice(0, 4)
const array = finalrecommend.map(async (el) => {
const aa = await Product.findById(el._id)
return aa
})
......
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