hz/ebiz-dify-ai
1
0
Fork 0
mirror of http://112.124.100.131/huang.ze/ebiz-dify-ai.git synced 2025-12-21 00:36:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

Feat: settings dark mode (#15184)

Browse Source
This commit is contained in:
KVOJJJin
2025-03-07 11:56:20 +08:00
committed by GitHub
parent 69746f2f0b
commit f588ccff72
34 changed files with 450 additions and 427 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
web/app/components/header/account-setting/members-page/operation/index.tsx
View File

@@ -4,26 +4,12 @@ import { Fragment, useMemo } from 'react'
import { useContext } from 'use-context-selector'
import { Menu, Transition } from '@headlessui/react'
import { CheckIcon, ChevronDownIcon } from '@heroicons/react/24/outline'
import s from './index.module.css'
import { useProviderContext } from '@/context/provider-context'
import cn from '@/utils/classnames'
import type { Member } from '@/models/common'
import { deleteMemberOrCancelInvitation, updateMemberRole } from '@/service/common'
import { ToastContext } from '@/app/components/base/toast'
const itemClassName = `
flex px-3 py-2 cursor-pointer hover:bg-gray-50 rounded-lg
`
const itemIconClassName = `
w-4 h-4 mt-[2px] mr-1 text-primary-600
`
const itemTitleClassName = `
leading-[20px] text-sm text-gray-700 whitespace-nowrap
`
const itemDescClassName = `
leading-[18px] text-xs text-gray-500 whitespace-nowrap
`
type IOperationProps = {
member: Member
operatorRole: string
@@ -90,15 +76,9 @@ const Operation = ({
{
({ open }) => (
<>
<Menu.Button className={cn(
`
group flex items-center justify-between w-full h-full
hover:bg-gray-100 cursor-pointer ${open && 'bg-gray-100'}
text-[13px] text-gray-700 px-3
`,
)}>
<Menu.Button className={cn('group px-3 flex items-center justify-between w-full h-full system-sm-regular text-text-secondary cursor-pointer hover:bg-state-base-hover', open && 'bg-state-base-hover')}>
{RoleMap[member.role] || RoleMap.normal}
<ChevronDownIcon className={`w-4 h-4 group-hover:block ${open ? 'block' : 'hidden'}`} />
<ChevronDownIcon className={cn('w-4 h-4 group-hover:block', open ? 'block' : 'hidden')} />
</Menu.Button>
<Transition
as={Fragment}
@@ -110,27 +90,21 @@ const Operation = ({
leaveTo="transform opacity-0 scale-95"
>
<Menu.Items
className={cn(
`
absolute right-0 top-[52px] z-10 bg-white border-[0.5px] border-gray-200
divide-y divide-gray-100 origin-top-right rounded-lg
`,
s.popup,
)}
className={cn('absolute origin-top-right right-0 top-[52px] z-10 bg-components-panel-bg-blur backdrop-blur-sm rounded-xl border-[0.5px] border-components-panel-border shadow-lg')}
>
<div className="px-1 py-1">
<div className="p-1">
{
roleList.map(role => (
<Menu.Item key={role}>
<div className={itemClassName} onClick={() => handleUpdateMemberRole(role)}>
<div className='flex px-3 py-2 cursor-pointer hover:bg-state-base-hover rounded-lg' onClick={() => handleUpdateMemberRole(role)}>
{
role === member.role
? <CheckIcon className={itemIconClassName} />
: <div className={itemIconClassName} />
? <CheckIcon className='w-4 h-4 mt-[2px] mr-1 text-text-accent' />
: <div className='w-4 h-4 mt-[2px] mr-1 text-text-accent' />
}
<div>
<div className={itemTitleClassName}>{t(`common.members.${toHump(role)}`)}</div>
<div className={itemDescClassName}>{t(`common.members.${toHump(role)}Tip`)}</div>
<div className='system-sm-semibold text-text-secondary whitespace-nowrap'>{t(`common.members.${toHump(role)}`)}</div>
<div className='system-xs-regular text-text-tertiary whitespace-nowrap'>{t(`common.members.${toHump(role)}Tip`)}</div>
</div>
</div>
</Menu.Item>
@@ -138,12 +112,12 @@ const Operation = ({
}
</div>
<Menu.Item>
<div className='px-1 py-1'>
<div className={itemClassName} onClick={handleDeleteMemberOrCancelInvitation}>
<div className={itemIconClassName} />
<div className='p-1 border-t border-divider-subtle'>
<div className='flex px-3 py-2 cursor-pointer hover:bg-state-base-hover rounded-lg' onClick={handleDeleteMemberOrCancelInvitation}>
<div className='w-4 h-4 mt-[2px] mr-1 text-text-accent' />
<div>
<div className={itemTitleClassName}>{t('common.members.removeFromTeam')}</div>
<div className={itemDescClassName}>{t('common.members.removeFromTeamTip')}</div>
<div className='system-sm-semibold text-text-secondary whitespace-nowrap'>{t('common.members.removeFromTeam')}</div>
<div className='system-xs-regular text-text-tertiary whitespace-nowrap'>{t('common.members.removeFromTeamTip')}</div>
</div>
</div>
</div>