pengjunjie/ragflow
1
0
Fork 1
mirror of https://github.com/infiniflow/ragflow.git synced 2026-02-01 16:15:07 +08:00
Code Issues Packages Projects Releases Wiki Activity

Fix: the styles of the multi-select component and the filter pop-up. (#12628)

Browse Source 
### What problem does this PR solve?

Fix: Fix the styles of the multi-select component and the filter pop-up.

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)
This commit is contained in:
chanx
2026-01-15 10:53:18 +08:00
committed by GitHub
parent 678a4f959c
commit 7af98328f5
2 changed files with 20 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
web/src/components/list-filter-bar/filter-popover.tsx
View File

@ -194,7 +194,7 @@ function CheckboxFormMultiple({
<Form {...form}> <Form {...form}>
<form <form
onSubmit={form.handleSubmit(onSubmit)} onSubmit={form.handleSubmit(onSubmit)}
className="space-y-8 px-5 py-2.5" className="space-y-8 px-5 py-2.5 max-h-[80vh] overflow-auto"
onReset={() => form.reset()} onReset={() => form.reset()}
> >
<div className="space-y-4"> <div className="space-y-4">
@ -265,20 +265,22 @@ function CheckboxFormMultiple({
)} )}
</div> </div>
</div> </div>
{!!filteredItem.list?.length && <div className="space-y-4 max-h-[300px] overflow-auto scrollbar-thin">
filteredItem.list.map((item) => { {!!filteredItem.list?.length &&
return ( filteredItem.list.map((item) => {
<FilterField return (
key={item.id} <FilterField
item={{ ...item }} key={item.id}
parent={{ item={{ ...item }}
...x, parent={{
id: x.field, ...x,
// field: `${x.field}${item.field ? '.' + item.field : ''}`, id: x.field,
}} // field: `${x.field}${item.field ? '.' + item.field : ''}`,
/> }}
); />
})} );
})}
</div>
<FormMessage /> <FormMessage />
</FormItem> </FormItem>
); );

5
web/src/components/ui/multi-select.tsx
View File

@ -124,7 +124,8 @@ const multiSelectVariants = cva(
* Props for MultiSelect component * Props for MultiSelect component
*/ */
interface MultiSelectProps interface MultiSelectProps
extends React.ButtonHTMLAttributes<HTMLButtonElement>, extends
React.ButtonHTMLAttributes<HTMLButtonElement>,
VariantProps<typeof multiSelectVariants> { VariantProps<typeof multiSelectVariants> {
/** /**
* An array of option objects to be displayed in the multi-select component. * An array of option objects to be displayed in the multi-select component.
@ -289,7 +290,7 @@ export const MultiSelect = React.forwardRef<
{...props} {...props}
onClick={handleTogglePopover} onClick={handleTogglePopover}
className={cn( className={cn(
'flex w-full p-1 rounded-md border border-border-button min-h-10 h-auto placeholder:text-text-disabled items-center justify-between bg-bg-input hover:bg-bg-input [&_svg]:pointer-events-auto', 'flex w-full p-1 rounded-md border border-border-button min-h-10 h-auto placeholder:text-text-disabled items-center justify-between bg-bg-input focus-visible:bg-bg-input hover:bg-bg-input [&_svg]:pointer-events-auto',
className, className,
)} )}
> >