diff --git a/src/pages/Web/assets/svg/group.svg b/src/pages/Web/assets/svg/group.svg new file mode 100644 index 0000000..61499e9 --- /dev/null +++ b/src/pages/Web/assets/svg/group.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/pages/Web/index.tsx b/src/pages/Web/index.tsx index 372e952..705c413 100644 --- a/src/pages/Web/index.tsx +++ b/src/pages/Web/index.tsx @@ -5,6 +5,7 @@ import { getLinkListAPI, addLinkDataAPI, editLinkDataAPI, delLinkDataAPI, getWeb import { WebType, Web } from '@/types/app/web'; import Title from '@/components/Title'; import { RuleObject } from 'antd/es/form'; +import group from "./assets/svg/group.svg" import './index.scss'; export default () => { @@ -65,8 +66,23 @@ export default () => { }, []); useEffect(() => { - // setListTemp(list.filter(item => item.title.includes(search) || item.description.includes(search))); - }, [search, list]); + // 过滤出符合搜索条件的网站 + const filteredList = listTemp.filter(item => + item.title.includes(search) || item.description.includes(search) + ); + + // 按类型分组 + const grouped = filteredList.reduce((acc, item) => { + const groupName = item.type.name; + if (!acc[groupName]) { + acc[groupName] = []; + } + acc[groupName].push(item); + return acc; + }, {} as { [key: string]: Web[] }); + + setList(grouped); + }, [search, listTemp]); const deleteLinkData = async (id: number) => { try { @@ -149,13 +165,14 @@ export default () => { key: 'list', children: (
-
+
} value={search} onChange={e => setSearch(e.target.value)} + className='w-[400px]' />
@@ -164,7 +181,10 @@ export default () => { { Object.keys(list).map((key) => (
- {key} + + 分组图标 + {key} + { Object.values(list[key]).length ? (