From 03ebffe993ea2403227f288e2bf955e5f44903b5 Mon Sep 17 00:00:00 2001 From: chichoon Date: Wed, 2 Mar 2022 12:31:15 +0900 Subject: [PATCH 1/5] =?UTF-8?q?Feat:=20CategoryPage=20=EC=83=81=EB=8B=A8?= =?UTF-8?q?=20=EB=B0=94=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 카테고리 선택할 수 있도록 NativeSelect 추가 (CreateArticle 참고) - 링크 연결 완료 (useNavigate) --- .../CategoryPage/Components/CategoryBody.jsx | 21 +++++++++++++++++-- 1 file changed, 19 insertions(+), 2 deletions(-) diff --git a/src/Pages/CategoryPage/Components/CategoryBody.jsx b/src/Pages/CategoryPage/Components/CategoryBody.jsx index e6b7bdc..deb0825 100644 --- a/src/Pages/CategoryPage/Components/CategoryBody.jsx +++ b/src/Pages/CategoryPage/Components/CategoryBody.jsx @@ -6,6 +6,8 @@ import { ArticleService } from 'Network'; import { PreviewArticleNoti, PreviewArticle } from 'Components'; import CircularProgress from '@mui/material/CircularProgress'; +import NativeSelect from '@mui/material/NativeSelect'; +import FormControl from '@mui/material/FormControl'; import Fab from '@mui/material/Fab'; import CreateIcon from '@mui/icons-material/Create'; @@ -19,6 +21,7 @@ const CategoryBody = () => { const [hasNextPage, setHasNextPage] = useState(true); const [target, setTarget] = useState(null); const [curCate, setCurCate] = useState(''); + const cateList = ['자유 게시판', '익명 게시판', '고양이 게시판']; const loca = useLocation(); const navi = useNavigate(); const categoryId = loca.pathname.split('/')[2]; @@ -31,6 +34,10 @@ const CategoryBody = () => { navi(`/article/${id}`); }; + const handleChangeCate = id => { + navi(`/category/${parseInt(id) + 1}`); + }; + const setInitalArticles = async () => { setIsLoaded(true); const result = await ArticleService.getArticles(categoryId); @@ -93,9 +100,19 @@ const CategoryBody = () => { <> -
{curCate}
+ + { + handleChangeCate(e.target.value); + }} + > + {cateList.map((cate, idx) => { + return ; + })} + + - {articles && articles.map(article => { if (categoryId === '3') From 1f93e819648dae83c24f291d781ccb9bd61cfaad Mon Sep 17 00:00:00 2001 From: chichoon Date: Wed, 2 Mar 2022 12:31:55 +0900 Subject: [PATCH 2/5] =?UTF-8?q?Design:=20CategoryPage=20=EC=83=81=EB=8B=A8?= =?UTF-8?q?=EB=B0=94=20=EC=8A=A4=ED=83=80=EC=9D=BC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 카테고리 선택바 추가하고, 글쓰기 페이지 (CreateArticleBody) 와 통일성을 위해 스타일 수정 --- src/Pages/CategoryPage/CategoryPage.styled.js | 30 +++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/src/Pages/CategoryPage/CategoryPage.styled.js b/src/Pages/CategoryPage/CategoryPage.styled.js index 1791abd..e215f02 100644 --- a/src/Pages/CategoryPage/CategoryPage.styled.js +++ b/src/Pages/CategoryPage/CategoryPage.styled.js @@ -1,4 +1,5 @@ import styled from 'styled-components'; +import GlobalStyled from 'Styled/Global.styled'; import ListItem from '@mui/material/ListItem'; @@ -28,6 +29,35 @@ const MainBody = styled.div` } } } + .category_form { + * { + border: none !important; + border-bottom: none !important; + } + *:hover { + border: none !important; + border-bottom: none !important; + } + *::before { + border: none !important; + border-bottom: none !important; + } + *::after { + border: none !important; + border-bottom: none !important; + } + + select { + color: ${GlobalStyled.theme.categoryNameTextColor}; + font-size: 1.1rem; + font-weight: 700; + padding-top: 0; + padding-bottom: 0; + } + svg { + color: ${GlobalStyled.theme.categoryNameTextColor}; + } + } `; const CusListItem = styled(ListItem)` From 55d52cfb72cce6efdde9277eda75b010e3022669 Mon Sep 17 00:00:00 2001 From: chichoon Date: Thu, 3 Mar 2022 11:57:00 +0900 Subject: [PATCH 3/5] =?UTF-8?q?feat:=20=EC=B9=B4=ED=85=8C=EA=B3=A0?= =?UTF-8?q?=EB=A6=AC=20=EB=B3=80=EA=B2=BD=20=EC=8B=9C=20=EA=B2=8C=EC=8B=9C?= =?UTF-8?q?=EA=B8=80=20=EB=B3=80=EA=B2=BD=EB=90=98=EB=8F=84=EB=A1=9D=20use?= =?UTF-8?q?Effect=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - categoryID에 의존하는 useEffect 생성 - 더 좋은 방법이 있다면 최적화 필요 --- src/Pages/CategoryPage/Components/CategoryBody.jsx | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/Pages/CategoryPage/Components/CategoryBody.jsx b/src/Pages/CategoryPage/Components/CategoryBody.jsx index deb0825..b4face6 100644 --- a/src/Pages/CategoryPage/Components/CategoryBody.jsx +++ b/src/Pages/CategoryPage/Components/CategoryBody.jsx @@ -21,7 +21,7 @@ const CategoryBody = () => { const [hasNextPage, setHasNextPage] = useState(true); const [target, setTarget] = useState(null); const [curCate, setCurCate] = useState(''); - const cateList = ['자유 게시판', '익명 게시판', '고양이 게시판']; + const cateList = ['자유 게시판', '익명 게시판', '공지 게시판']; const loca = useLocation(); const navi = useNavigate(); const categoryId = loca.pathname.split('/')[2]; @@ -57,6 +57,16 @@ const CategoryBody = () => { setInitalArticles(); }, []); + useEffect(() => { + console.log('category:' + categoryId); + if (categoryId > 3) { + alert('준비 중입니다!'); + navi('/'); + } + setCurCate(getCategoryByUrl(loca)); + setInitalArticles(); + }, [categoryId]); + // 무한 스크롤 임시 정지 const getMoreItem = async () => { From 7b19d448e7a166f75b50a114082ea07e862a02fa Mon Sep 17 00:00:00 2001 From: chichoon Date: Thu, 3 Mar 2022 11:58:03 +0900 Subject: [PATCH 4/5] =?UTF-8?q?remove:=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=ED=95=9C=20console.log=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - categoryID 출력용 --- src/Pages/CategoryPage/Components/CategoryBody.jsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/Pages/CategoryPage/Components/CategoryBody.jsx b/src/Pages/CategoryPage/Components/CategoryBody.jsx index b4face6..43125bd 100644 --- a/src/Pages/CategoryPage/Components/CategoryBody.jsx +++ b/src/Pages/CategoryPage/Components/CategoryBody.jsx @@ -58,7 +58,6 @@ const CategoryBody = () => { }, []); useEffect(() => { - console.log('category:' + categoryId); if (categoryId > 3) { alert('준비 중입니다!'); navi('/'); From f41ef1661d22cf270e7cdcd24845ccf6f3b65170 Mon Sep 17 00:00:00 2001 From: chichoon Date: Thu, 3 Mar 2022 19:21:28 +0900 Subject: [PATCH 5/5] =?UTF-8?q?feat:=20=EC=A4=91=EB=B3=B5=EB=90=98?= =?UTF-8?q?=EB=8A=94=20useEffect=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Pages/CategoryPage/Components/CategoryBody.jsx | 9 --------- 1 file changed, 9 deletions(-) diff --git a/src/Pages/CategoryPage/Components/CategoryBody.jsx b/src/Pages/CategoryPage/Components/CategoryBody.jsx index 43125bd..f82ca87 100644 --- a/src/Pages/CategoryPage/Components/CategoryBody.jsx +++ b/src/Pages/CategoryPage/Components/CategoryBody.jsx @@ -48,15 +48,6 @@ const CategoryBody = () => { setHasNextPage(meta.hasNextPage); }; - useEffect(() => { - if (categoryId > 3) { - alert('준비 중입니다!'); - navi('/'); - } - setCurCate(getCategoryByUrl(loca)); - setInitalArticles(); - }, []); - useEffect(() => { if (categoryId > 3) { alert('준비 중입니다!');