diff --git a/src/components/modal/ProductModal/ProductModal.jsx b/src/components/modal/ProductModal/ProductModal.jsx index 1da9a7b..8e624bf 100644 --- a/src/components/modal/ProductModal/ProductModal.jsx +++ b/src/components/modal/ProductModal/ProductModal.jsx @@ -3,26 +3,45 @@ import { Container, Ul, Li, GrayLine, Button } from '../styled'; import ProductAlert from './ProductAlert'; import { useNavigate } from 'react-router-dom'; -export default function ProductModal({ setisModalOpen }) { +export default function ProductModal({ + setisModalOpen, + isMyProfile, + productList, +}) { const [isAlertOpen, setIsAlertOpen] = useState(false); const navigate = useNavigate(); const handleToEdit = () => { navigate('/product/edit/${productId}'); //백틱으로 나중에바꿔주기 }; + console.log(productList, 'ji'); return ( <> setisModalOpen(false)}> {isAlertOpen ? : null} diff --git a/src/pages/profile/Profile.jsx b/src/pages/profile/Profile.jsx index 21cac80..82eb7d5 100644 --- a/src/pages/profile/Profile.jsx +++ b/src/pages/profile/Profile.jsx @@ -17,10 +17,11 @@ import { MediumFollowButton, UnfollowButton, } from '../../components/common/button/Button'; -import Product from '../../components/common/product/Product'; +//import Product from '../../components/common/product/Product'; import HomePost from '../../components/common/home/HomePost'; import HomeAlbum from '../../components/common/home/HomeAlbum'; import TabMenu from '../../components/common/tab/TabMenu'; +import ProductModal from '../../components/modal/ProductModal/ProductModal'; // 스타일 import * as S from './Profile.style'; @@ -50,6 +51,10 @@ export default function Profile() { const myPostArray = myPost.post; const [productList, setProductList] = useState([]); const navigate = useNavigate(); + const [isModalOpen, setisModalOpen] = useState(false); + const showModal = () => { + setisModalOpen(true); + }; useEffect(() => { setIsMyProfile(accountname === myAccountname); @@ -144,6 +149,15 @@ export default function Profile() { // console.log('isMyProfile:', isMyProfile); // console.log(myPostArray); + const handleProductClick = (e) => { + if (isMyProfile) { + e.preventDefault(); + showModal(); + } else { + e.stopPropagation(); + } + }; + return (
@@ -217,9 +231,16 @@ export default function Profile() { {productList.map((product, index) => ( - - {product.itemName} - {product.price} + { + handleProductClick(e); + }} + > + + {product.itemName} + {product.price} + ))} @@ -247,6 +268,13 @@ export default function Profile() { + {isModalOpen ? ( + + ) : null}
); }