AI/dify
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/langgenius/dify.git synced 2025-08-19 22:39:10 +08:00
Code Issues Packages Projects Releases Wiki Activity

progress circle

Browse Source
This commit is contained in:
StyleZhang 2024-07-31 15:15:26 +08:00
parent 9c31c56115
commit 25c029877a
4 changed files with 28 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
web/app/components/base/file-uploader/file-list-flex/file-list-flex-operation.tsx
View File

@ -2,7 +2,9 @@ import {
forwardRef,
memo,
} from 'react'
import { RiCloseLine } from '@remixicon/react'
import FileListItem from './file-list-item'
import Button from '@/app/components/base/button'
const FileListFlexOperation = forwardRef<HTMLDivElement>((_, ref) => {
return (
@ -10,10 +12,24 @@ const FileListFlexOperation = forwardRef<HTMLDivElement>((_, ref) => {
ref={ref}
className='flex flex-wrap gap-2'
>
<FileListItem />
<FileListItem />
<FileListItem isFile />
<FileListItem isFile />
<div className='relative'>
<Button className='absolute -right-1.5 -top-1.5 p-0 w-5 h-5 rounded-full'>
<RiCloseLine className='w-4 h-4 text-components-button-secondary-text' />
</Button>
<FileListItem />
</div>
<div className='relative'>
<Button className='absolute -right-1.5 -top-1.5 p-0 w-5 h-5 rounded-full'>
<RiCloseLine className='w-4 h-4 text-components-button-secondary-text' />
</Button>
<FileListItem />
</div>
<div className='relative'>
<Button className='absolute -right-1.5 -top-1.5 p-0 w-5 h-5 rounded-full'>
<RiCloseLine className='w-4 h-4 text-components-button-secondary-text' />
</Button>
<FileListItem isFile />
</div>
</div>
)
})

2
web/app/components/base/file-uploader/file-list-flex/file-list-item.tsx
View File

@ -22,7 +22,7 @@ const FileListItem = ({
return (
<div className={cn(
'w-[68px] h-[68px] border-[2px] border-components-panel-border shadow-xs',
'w-[68px] h-[68px] border-[2px] border-effects-image-frame shadow-xs',
className,
)}></div>
)

1
web/app/components/base/file-uploader/file-uploader-in-attachment/index.tsx
View File

@ -52,6 +52,7 @@ const FileUploaderInAttachment = () => {
if (option.value === 'link') {
return (
<FileFromLinkOrLocal
key={option.value}
showFromLocal={false}
trigger={renderTrigger(option)}
/>

12
web/app/components/base/progress-bar/progress-circle.tsx
View File

@ -14,9 +14,9 @@ const ProgressCircle: React.FC<ProgressCircleProps> = ({
percentage = 0,
size = 12,
circleStrokeWidth = 1,
circleStrokeColor = 'components-progress-brand-border',
circleFillColor = 'components-progress-brand-bg',
sectorFillColor = 'components-progress-brand-progress',
circleStrokeColor = 'stroke-components-progress-brand-border',
circleFillColor = 'fill-components-progress-brand-bg',
sectorFillColor = 'fill-components-progress-brand-progress',
}) => {
const radius = size / 2
const center = size / 2
@ -41,8 +41,8 @@ const ProgressCircle: React.FC<ProgressCircleProps> = ({
>
<circle
className={cn(
`fill-${circleFillColor}`,
`stroke-${circleStrokeColor}`,
circleFillColor,
circleStrokeColor,
)}
cx={center + circleStrokeWidth / 2}
cy={center + circleStrokeWidth / 2}
@ -50,7 +50,7 @@ const ProgressCircle: React.FC<ProgressCircleProps> = ({
strokeWidth={circleStrokeWidth}
/>
<path
className={cn(`fill-${sectorFillColor}`)}
className={cn(sectorFillColor)}
d={pathData}
transform={`translate(${circleStrokeWidth / 2}, ${circleStrokeWidth / 2})`}
/>