From a3ffdbb795780e0f35c60fe8cfd33d4e2a2007df Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E5=AE=87=E9=98=B3?= Date: Tue, 16 Jun 2026 10:09:32 +0800 Subject: [PATCH] =?UTF-8?q?feat(header,=20sidebar)=EF=BC=9A=E5=A2=9E?= =?UTF-8?q?=E5=BC=BA=E5=AF=BC=E8=88=AA=E9=93=BE=E6=8E=A5=E5=B9=B6=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=E9=A1=B5=E9=9D=A2=E7=B1=BB=E5=9E=8B=E6=94=AF=E6=8C=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 更新了 Header 和 SidebarNav 组件中的导航链接处理，以使用 href、target 和 rel 属性的实用函数。 - 在导航渲染中添加了对“页面”类型的支持，从而可以更好地组织和显示页面链接。 - 修改了 Cate 类型定义，将“页面”包含为有效类型。 - 从 cateNav 导出新的实用函数以改进链接管理。 --- .../Header/components/SidebarNav/index.tsx | 32 ++++++++++++++-- src/components/Header/index.tsx | 38 +++++++++++++++++-- src/types/app/cate.d.ts | 2 +- src/utils/cateNav.ts | 16 ++++++++ src/utils/index.ts | 3 +- 5 files changed, 81 insertions(+), 10 deletions(-) create mode 100644 src/utils/cateNav.ts diff --git a/src/components/Header/components/SidebarNav/index.tsx b/src/components/Header/components/SidebarNav/index.tsx index 54d1b4c..49ff157 100755 --- a/src/components/Header/components/SidebarNav/index.tsx +++ b/src/components/Header/components/SidebarNav/index.tsx @@ -1,5 +1,6 @@ import Show from '@/components/Show'; import { Cate } from '@/types/app/cate'; +import { getCateNavHref, getCateNavRel, getCateNavTarget } from '@/utils/cateNav'; import Link from 'next/link'; import { IoIosArrowDown } from 'react-icons/io'; import { motion, AnimatePresence } from 'framer-motion'; @@ -22,7 +23,7 @@ export default ({ list, open, onClose }: Props) => {
{one.type === 'cate' && (
  • - + {one.icon} {one.name} @@ -33,7 +34,7 @@ export default ({ list, open, onClose }: Props) => {
      {one.children?.map((two) => (
    • - + {two.name}
      • @@ -43,9 +44,32 @@ export default ({ list, open, onClose }: Props) => { )} + {one.type === 'page' && ( +
    • + + {one.icon} {one.name} + + + + + + +
        + {one.children?.map((two) => ( +
      • + + {two.icon} {two.name} + +
        • + ))} +
      +       +
      • + )} + {one.type === 'nav' && (
    • - + {one.icon} {one.name} @@ -56,7 +80,7 @@ export default ({ list, open, onClose }: Props) => {
        {one.children?.map((two) => (
      • - + {two.icon} {two.name}
        • diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx index fece2c0..4bb286c 100755 --- a/src/components/Header/index.tsx +++ b/src/components/Header/index.tsx @@ -14,6 +14,7 @@ import { BsFillMoonStarsFill, BsTextIndentLeft } from 'react-icons/bs'; import { Cate } from '@/types/app/cate'; import { getCateListAPI } from '@/api/cate'; +import { getCateNavHref, getCateNavRel, getCateNavTarget } from '@/utils/cateNav'; import { useConfigStore } from '@/stores'; @@ -107,7 +108,7 @@ export default () => { {/* 渲染分类 */} {one.type === 'cate' && (
      • - + {one.icon} {one.name} @@ -122,7 +123,7 @@ export default () => { className="opacity-0 -translate-x-2 group-hover/one:opacity-100 group-hover/one:translate-x-0 transition-all duration-300 ease-out" style={{ transitionDelay: `${index * 45 + 60}ms` }} > - + {two.name}
        • @@ -132,10 +133,39 @@ export default () => { )} + {/* 渲染页面 */} + {one.type === 'page' && ( +
      • + + {one.icon} {one.name} + + + + + + +
          + {one.children?.map((two, index) => ( +
        • + + {two.icon} + {two.name} + +
          • + ))} +
        +         +
        • + )} + {/* 渲染导航 */} {one.type === 'nav' && (
      • - + {one.icon} {one.name} {/* 如果有子分类就显示下拉三角 */} @@ -151,7 +181,7 @@ export default () => { className="opacity-0 -translate-x-2 group-hover/one:opacity-100 group-hover/one:translate-x-0 transition-all duration-300 ease-out" style={{ transitionDelay: `${index * 45 + 60}ms` }} > - + {two.icon} {two.name} diff --git a/src/types/app/cate.d.ts b/src/types/app/cate.d.ts index 56de852..4556dd6 100755 --- a/src/types/app/cate.d.ts +++ b/src/types/app/cate.d.ts @@ -5,7 +5,7 @@ export interface Cate { url: string, icon: string, level: number, - type: 'cate' | 'nav', + type: 'cate' | 'page' | 'nav', count: number, is_hide: boolean, order: number, diff --git a/src/utils/cateNav.ts b/src/utils/cateNav.ts new file mode 100644 index 0000000..b462495 --- /dev/null +++ b/src/utils/cateNav.ts @@ -0,0 +1,16 @@ +import { Cate } from '@/types/app/cate'; + +export function getCateNavHref(item: Cate): string { + if (item.type === 'cate') { + return `/cate/${item.id}?name=${item.name}`; + } + return item.url || '/'; +} + +export function getCateNavTarget(type: Cate['type']): '_self' | '_blank' { + return type === 'nav' ? '_blank' : '_self'; +} + +export function getCateNavRel(type: Cate['type']): 'noopener noreferrer' | undefined { + return type === 'nav' ? 'noopener noreferrer' : undefined; +} diff --git a/src/utils/index.ts b/src/utils/index.ts index 43b080a..6f4966e 100755 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -3,4 +3,5 @@ export * from './await-io'; export * from './htmlParser'; export * from './common'; export * from './url'; -export * from './request'; \ No newline at end of file +export * from './request'; +export * from './cateNav'; \ No newline at end of file