mirror of
http://112.124.100.131/huang.ze/ebiz-dify-ai.git
synced 2025-12-08 10:26:50 +08:00
提供独立的模型供应商页面
This commit is contained in:
18
web/app/(commonLayout)/provider/page.tsx
Normal file
18
web/app/(commonLayout)/provider/page.tsx
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
'use client'
|
||||||
|
|
||||||
|
import React from 'react'
|
||||||
|
import AccountSetting from '@/app/components/header/account-setting'
|
||||||
|
|
||||||
|
const ProviderPage = () => {
|
||||||
|
const hideNavMenu = () => {
|
||||||
|
// 这里可以添加隐藏导航菜单的逻辑
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="h-full">
|
||||||
|
<AccountSetting onCancel={hideNavMenu} activeTab="provider" hideMenu={true} hideCloseButton={true}/>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ProviderPage
|
||||||
@@ -39,6 +39,8 @@ const iconClassName = `
|
|||||||
type IAccountSettingProps = {
|
type IAccountSettingProps = {
|
||||||
onCancel: () => void
|
onCancel: () => void
|
||||||
activeTab?: string
|
activeTab?: string
|
||||||
|
hideMenu?: boolean
|
||||||
|
hideCloseButton?: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
type GroupItem = {
|
type GroupItem = {
|
||||||
@@ -52,6 +54,8 @@ type GroupItem = {
|
|||||||
export default function AccountSetting({
|
export default function AccountSetting({
|
||||||
onCancel,
|
onCancel,
|
||||||
activeTab = 'members',
|
activeTab = 'members',
|
||||||
|
hideMenu = false,
|
||||||
|
hideCloseButton = false,
|
||||||
}: IAccountSettingProps) {
|
}: IAccountSettingProps) {
|
||||||
const [activeMenu, setActiveMenu] = useState(activeTab)
|
const [activeMenu, setActiveMenu] = useState(activeTab)
|
||||||
const { t } = useTranslation()
|
const { t } = useTranslation()
|
||||||
@@ -149,49 +153,56 @@ export default function AccountSetting({
|
|||||||
onClose={onCancel}
|
onClose={onCancel}
|
||||||
>
|
>
|
||||||
<div className='mx-auto flex h-[100vh] max-w-[1048px]'>
|
<div className='mx-auto flex h-[100vh] max-w-[1048px]'>
|
||||||
<div className='flex w-[44px] flex-col border-r border-divider-burn pl-4 pr-6 sm:w-[224px]'>
|
{!hideMenu && (
|
||||||
<div className='title-2xl-semi-bold mb-8 mt-6 px-3 py-2 text-text-primary'>{t('common.userProfile.settings')}</div>
|
<div className='flex w-[44px] flex-col border-r border-divider-burn pl-4 pr-6 sm:w-[224px]'>
|
||||||
<div className='w-full'>
|
<div className='title-2xl-semi-bold mb-8 mt-6 px-3 py-2 text-text-primary'>{t('common.userProfile.settings')}</div>
|
||||||
{
|
<div className='w-full'>
|
||||||
menuItems.map(menuItem => (
|
{
|
||||||
<div key={menuItem.key} className='mb-2'>
|
menuItems.map(menuItem => (
|
||||||
{!isCurrentWorkspaceDatasetOperator && (
|
<div key={menuItem.key} className='mb-2'>
|
||||||
<div className='system-xs-medium-uppercase mb-0.5 py-2 pb-1 pl-3 text-text-tertiary'>{menuItem.name}</div>
|
{!isCurrentWorkspaceDatasetOperator && (
|
||||||
)}
|
<div className='system-xs-medium-uppercase mb-0.5 py-2 pb-1 pl-3 text-text-tertiary'>{menuItem.name}</div>
|
||||||
<div>
|
)}
|
||||||
{
|
<div>
|
||||||
menuItem.items.map(item => (
|
{
|
||||||
<div
|
menuItem.items.map(item => (
|
||||||
key={item.key}
|
<div
|
||||||
className={cn(
|
key={item.key}
|
||||||
'mb-0.5 flex h-[37px] cursor-pointer items-center rounded-lg p-1 pl-3 text-sm',
|
className={cn(
|
||||||
activeMenu === item.key ? 'system-sm-semibold bg-state-base-active text-components-menu-item-text-active' : 'system-sm-medium text-components-menu-item-text')}
|
'mb-0.5 flex h-[37px] cursor-pointer items-center rounded-lg p-1 pl-3 text-sm',
|
||||||
title={item.name}
|
activeMenu === item.key ? 'system-sm-semibold bg-state-base-active text-components-menu-item-text-active' : 'system-sm-medium text-components-menu-item-text')}
|
||||||
onClick={() => setActiveMenu(item.key)}
|
title={item.name}
|
||||||
>
|
onClick={() => setActiveMenu(item.key)}
|
||||||
{activeMenu === item.key ? item.activeIcon : item.icon}
|
>
|
||||||
{!isMobile && <div className='truncate'>{item.name}</div>}
|
{activeMenu === item.key ? item.activeIcon : item.icon}
|
||||||
</div>
|
{!isMobile && <div className='truncate'>{item.name}</div>}
|
||||||
))
|
</div>
|
||||||
}
|
))
|
||||||
|
}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
))
|
||||||
))
|
}
|
||||||
}
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className='relative flex w-[824px]'>
|
|
||||||
<div className='absolute -right-11 top-6 z-[9999] flex flex-col items-center'>
|
|
||||||
<Button
|
|
||||||
variant='tertiary'
|
|
||||||
size='large'
|
|
||||||
className='px-2'
|
|
||||||
onClick={onCancel}
|
|
||||||
>
|
|
||||||
<RiCloseLine className='h-5 w-5' />
|
|
||||||
</Button>
|
|
||||||
<div className='system-2xs-medium-uppercase mt-1 text-text-tertiary'>ESC</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
)}
|
||||||
|
<div className={cn(
|
||||||
|
'relative flex',
|
||||||
|
hideCloseButton ? 'w-[1048px]' : 'w-[824px]',
|
||||||
|
)}>
|
||||||
|
{!hideCloseButton && (
|
||||||
|
<div className='absolute -right-11 top-6 z-[9999] flex flex-col items-center'>
|
||||||
|
<Button
|
||||||
|
variant='tertiary'
|
||||||
|
size='large'
|
||||||
|
className='px-2'
|
||||||
|
onClick={onCancel}
|
||||||
|
>
|
||||||
|
<RiCloseLine className='h-5 w-5' />
|
||||||
|
</Button>
|
||||||
|
<div className='system-2xs-medium-uppercase mt-1 text-text-tertiary'>ESC</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
<div ref={scrollRef} className='w-full overflow-y-auto bg-components-panel-bg pb-4'>
|
<div ref={scrollRef} className='w-full overflow-y-auto bg-components-panel-bg pb-4'>
|
||||||
<div className={cn('sticky top-0 z-20 mx-8 mb-[18px] flex items-center bg-components-panel-bg pb-2 pt-[27px]', scrolled && 'border-b border-divider-regular')}>
|
<div className={cn('sticky top-0 z-20 mx-8 mb-[18px] flex items-center bg-components-panel-bg pb-2 pt-[27px]', scrolled && 'border-b border-divider-regular')}>
|
||||||
<div className='title-2xl-semi-bold shrink-0 text-text-primary'>
|
<div className='title-2xl-semi-bold shrink-0 text-text-primary'>
|
||||||
|
|||||||
Reference in New Issue
Block a user