From ce8c64dc70c790a35d10ea8ddb59fb627ae392b3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=87=E9=98=B3?= <3311118881@qq.com> Date: Mon, 7 Oct 2024 12:06:03 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E5=B7=A5=E4=BD=9C=E5=8F=B0?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Empty/empty.svg | 1 + src/components/Empty/index.tsx | 11 +++++++++++ src/pages/Work/index.tsx | 27 ++++++++++++++++----------- 3 files changed, 28 insertions(+), 11 deletions(-) create mode 100644 src/components/Empty/empty.svg create mode 100644 src/components/Empty/index.tsx diff --git a/src/components/Empty/empty.svg b/src/components/Empty/empty.svg new file mode 100644 index 0000000..9ffcaae --- /dev/null +++ b/src/components/Empty/empty.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/Empty/index.tsx b/src/components/Empty/index.tsx new file mode 100644 index 0000000..5e3f9ec --- /dev/null +++ b/src/components/Empty/index.tsx @@ -0,0 +1,11 @@ +import Empty from './empty.svg' + +export default () => { + return ( + <> +
+ 空空如也 +
+ + ) +} \ No newline at end of file diff --git a/src/pages/Work/index.tsx b/src/pages/Work/index.tsx index 96885d0..fdd2585 100644 --- a/src/pages/Work/index.tsx +++ b/src/pages/Work/index.tsx @@ -12,6 +12,7 @@ import link from './image/link.svg'; import dayjs from 'dayjs'; import RandomAvatar from "@/components/RandomAvatar"; +import Empty from "@/components/Empty"; type Menu = "comment" | "link" | "wall"; @@ -78,7 +79,7 @@ const ListItem = ({ item, type, handleApproval, handleRejection }: ListItemProps const WorkPage = () => { const activeSty = "bg-[#f9f9ff] text-primary"; - const [active, setActive] = useState("link"); + const [active, setActive] = useState("comment"); const [commentList, setCommentList] = useState([]); const [linkList, setLinkList] = useState([]); const [wallList, setWallList] = useState([]); @@ -128,6 +129,15 @@ const WorkPage = () => { fetchData(type); }; + const renderList = (list: any[], type: Menu) => { + if (list.length === 0) { + return ; + } + return list.map(item => ( + + )); + }; + return ( <> @@ -147,16 +157,11 @@ const WorkPage = () => { ))} </ul> </div> + <div className="w-10/12 pl-6 py-4 space-y-10"> - {active === "link" && linkList.map(item => ( - <ListItem key={item.id} item={item} type="link" handleApproval={handleApproval} handleRejection={handleRejection} /> - ))} - {active === "comment" && commentList.map(item => ( - <ListItem key={item.id} item={item} type="comment" handleApproval={handleApproval} handleRejection={handleRejection} /> - ))} - {active === "wall" && wallList.map(item => ( - <ListItem key={item.id} item={item} type="wall" handleApproval={handleApproval} handleRejection={handleRejection} /> - ))} + {active === "link" && renderList(linkList, "link")} + {active === "comment" && renderList(commentList, "comment")} + {active === "wall" && renderList(wallList, "wall")} </div> </div> </Card> @@ -164,4 +169,4 @@ const WorkPage = () => { ); } -export default WorkPage; +export default WorkPage; \ No newline at end of file