mirror of
http://112.124.100.131/huang.ze/ebiz-dify-ai.git
synced 2025-12-24 10:13:01 +08:00
feat: add some feature
This commit is contained in:
@@ -1,15 +1,15 @@
|
||||
import React, { useEffect } from 'react'
|
||||
import { useShallow } from 'zustand/react/shallow'
|
||||
import { RiLayoutRight2Line } from '@remixicon/react'
|
||||
import { LayoutRight2LineMod } from '../base/icons/src/public/knowledge'
|
||||
import NavLink from './navLink'
|
||||
import { RiLayoutLeft2Line, RiLayoutRight2Line } from '@remixicon/react'
|
||||
import type { NavIcon } from './navLink'
|
||||
import NavLink from './navLink'
|
||||
import AppBasic from './basic'
|
||||
import AppInfo from './app-info'
|
||||
import DatasetInfo from './dataset-info'
|
||||
import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
|
||||
import { useStore as useAppStore } from '@/app/components/app/store'
|
||||
import cn from '@/utils/classnames'
|
||||
import { useSearchParams } from 'next/navigation'
|
||||
|
||||
export type IAppDetailNavProps = {
|
||||
iconType?: 'app' | 'dataset' | 'notion'
|
||||
@@ -27,7 +27,16 @@ export type IAppDetailNavProps = {
|
||||
extraInfo?: (modeState: string) => React.ReactNode
|
||||
}
|
||||
|
||||
const AppDetailNav = ({ title, desc, isExternal, icon, icon_background, navigation, extraInfo, iconType = 'app' }: IAppDetailNavProps) => {
|
||||
const AppDetailNav = ({
|
||||
title,
|
||||
desc,
|
||||
isExternal,
|
||||
icon,
|
||||
icon_background,
|
||||
navigation,
|
||||
extraInfo,
|
||||
iconType = 'app',
|
||||
}: IAppDetailNavProps) => {
|
||||
const { appSidebarExpand, setAppSiderbarExpand } = useAppStore(useShallow(state => ({
|
||||
appSidebarExpand: state.appSidebarExpand,
|
||||
setAppSiderbarExpand: state.setAppSiderbarExpand,
|
||||
@@ -47,6 +56,15 @@ const AppDetailNav = ({ title, desc, isExternal, icon, icon_background, navigati
|
||||
}
|
||||
}, [appSidebarExpand, setAppSiderbarExpand])
|
||||
|
||||
const searchParams = useSearchParams()
|
||||
|
||||
// 从 router 查询参数,若有 sidebar选项,按照参数设置,没有的话,默认是展示内容
|
||||
const showSidebar = !(searchParams?.get('sidebar')) || (searchParams?.get('sidebar') === '1')
|
||||
|
||||
// console.log('searchParams?.get("sidebar"): ', searchParams?.get('sidebar'),!(searchParams?.get('sidebar')) , (searchParams?.get('sidebar') === '1'))
|
||||
// console.log('showSidebar: ', showSidebar)
|
||||
// 如果showSidebar为false,不显示
|
||||
if (!showSidebar) return null
|
||||
return (
|
||||
<div
|
||||
className={`
|
||||
@@ -61,7 +79,7 @@ const AppDetailNav = ({ title, desc, isExternal, icon, icon_background, navigati
|
||||
`}
|
||||
>
|
||||
{iconType === 'app' && (
|
||||
<AppInfo expand={expand} />
|
||||
<AppInfo expand={expand}/>
|
||||
)}
|
||||
{iconType === 'dataset' && (
|
||||
<DatasetInfo
|
||||
@@ -85,7 +103,7 @@ const AppDetailNav = ({ title, desc, isExternal, icon, icon_background, navigati
|
||||
)}
|
||||
</div>
|
||||
<div className='px-4'>
|
||||
<div className={cn('mx-auto mt-1 h-[1px] bg-divider-subtle', !expand && 'w-6')} />
|
||||
<div className={cn('mx-auto mt-1 h-[1px] bg-divider-subtle', !expand && 'w-6')}/>
|
||||
</div>
|
||||
<nav
|
||||
className={`
|
||||
@@ -95,7 +113,8 @@ const AppDetailNav = ({ title, desc, isExternal, icon, icon_background, navigati
|
||||
>
|
||||
{navigation.map((item, index) => {
|
||||
return (
|
||||
<NavLink key={index} mode={appSidebarExpand} iconMap={{ selected: item.selectedIcon, normal: item.icon }} name={item.name} href={item.href} />
|
||||
<NavLink key={index} mode={appSidebarExpand} iconMap={{ selected: item.selectedIcon, normal: item.icon }}
|
||||
name={item.name} href={item.href}/>
|
||||
)
|
||||
})}
|
||||
</nav>
|
||||
@@ -108,13 +127,13 @@ const AppDetailNav = ({ title, desc, isExternal, icon, icon_background, navigati
|
||||
`}
|
||||
>
|
||||
<div
|
||||
className='flex h-6 w-6 cursor-pointer items-center justify-center text-gray-500'
|
||||
className='flex h-6 w-6 cursor-pointer items-center justify-center'
|
||||
onClick={() => handleToggle(appSidebarExpand)}
|
||||
>
|
||||
{
|
||||
expand
|
||||
? <RiLayoutRight2Line className='h-5 w-5 text-components-menu-item-text' />
|
||||
: <LayoutRight2LineMod className='h-5 w-5 text-components-menu-item-text' />
|
||||
? <RiLayoutRight2Line className='h-5 w-5 text-components-menu-item-text'/>
|
||||
: <RiLayoutLeft2Line className='h-5 w-5 text-components-menu-item-text'/>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user