Fix: Fixed the issue where clicking the SQL tool test button did not request the interface #9541 (#9542)

### What problem does this PR solve? Fix: Fixed the issue where clicking the SQL tool test button did not request the interface #9541 ### Type of change - [x] Bug Fix (non-breaking change which fixes an issue)
2026-02-07 02:55:08 +08:00 · 2025-08-19 16:41:32 +08:00
parent 787e0c6786
commit a41a646909
14 changed files with 268 additions and 84 deletions
--- a/web/src/components/metadata-filter/index.tsx
+++ b/web/src/components/metadata-filter/index.tsx
@ -0,0 +1,72 @@
+import { DatasetMetadata } from '@/constants/chat';
+import { useTranslate } from '@/hooks/common-hooks';
+import { useFormContext, useWatch } from 'react-hook-form';
+import { z } from 'zod';
+import { SelectWithSearch } from '../originui/select-with-search';
+import { RAGFlowFormItem } from '../ragflow-form';
+import { MetadataFilterConditions } from './metadata-filter-conditions';
+
+type MetadataFilterProps = {
+  prefix?: string;
+};
+
+export const MetadataFilterSchema = {
+  meta_data_filter: z
+    .object({
+      method: z.string().optional(),
+      manual: z
+        .array(
+          z.object({
+            key: z.string(),
+            op: z.string(),
+            value: z.string(),
+          }),
+        )
+        .optional(),
+    })
+    .optional(),
+};
+
+export function MetadataFilter({ prefix = '' }: MetadataFilterProps) {
+  const { t } = useTranslate('chat');
+  const form = useFormContext();
+
+  const methodName = prefix + 'meta_data_filter.method';
+
+  const kbIds: string[] = useWatch({
+    control: form.control,
+    name: prefix + 'kb_ids',
+  });
+  const metadata = useWatch({
+    control: form.control,
+    name: methodName,
+  });
+  const hasKnowledge = Array.isArray(kbIds) && kbIds.length > 0;
+
+  const MetadataOptions = Object.values(DatasetMetadata).map((x) => {
+    return {
+      value: x,
+      label: t(`meta.${x}`),
+    };
+  });
+
+  return (
+    <>
+      {hasKnowledge && (
+        <RAGFlowFormItem
+          label={t('metadata')}
+          name={methodName}
+          tooltip={t('metadataTip')}
+        >
+          <SelectWithSearch options={MetadataOptions} />
+        </RAGFlowFormItem>
+      )}
+      {hasKnowledge && metadata === DatasetMetadata.Manual && (
+        <MetadataFilterConditions
+          kbIds={kbIds}
+          prefix={prefix}
+        ></MetadataFilterConditions>
+      )}
+    </>
+  );
+}
--- a/web/src/components/metadata-filter/metadata-filter-conditions.tsx
+++ b/web/src/components/metadata-filter/metadata-filter-conditions.tsx
@ -0,0 +1,135 @@
+import { SelectWithSearch } from '@/components/originui/select-with-search';
+import { Button } from '@/components/ui/button';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
+import {
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@/components/ui/form';
+import { Input } from '@/components/ui/input';
+import { Separator } from '@/components/ui/separator';
+import { useFetchKnowledgeMetadata } from '@/hooks/use-knowledge-request';
+import { SwitchOperatorOptions } from '@/pages/agent/constant';
+import { useBuildSwitchOperatorOptions } from '@/pages/agent/form/switch-form';
+import { Plus, X } from 'lucide-react';
+import { useCallback } from 'react';
+import { useFieldArray, useFormContext } from 'react-hook-form';
+import { useTranslation } from 'react-i18next';
+
+export function MetadataFilterConditions({
+  kbIds,
+  prefix = '',
+}: {
+  kbIds: string[];
+  prefix?: string;
+}) {
+  const { t } = useTranslation();
+  const form = useFormContext();
+  const name = prefix + 'meta_data_filter.manual';
+  const metadata = useFetchKnowledgeMetadata(kbIds);
+
+  const switchOperatorOptions = useBuildSwitchOperatorOptions();
+
+  const { fields, remove, append } = useFieldArray({
+    name,
+    control: form.control,
+  });
+
+  const add = useCallback(
+    (key: string) => () => {
+      append({
+        key,
+        value: '',
+        op: SwitchOperatorOptions[0].value,
+      });
+    },
+    [append],
+  );
+
+  return (
+    <section className="flex flex-col gap-2">
+      <div className="flex items-center justify-between">
+        <FormLabel>{t('chat.conditions')}</FormLabel>
+        <DropdownMenu>
+          <DropdownMenuTrigger>
+            <Button variant={'ghost'} type="button">
+              <Plus />
+            </Button>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent>
+            {Object.keys(metadata.data).map((key, idx) => {
+              return (
+                <DropdownMenuItem key={idx} onClick={add(key)}>
+                  {key}
+                </DropdownMenuItem>
+              );
+            })}
+          </DropdownMenuContent>
+        </DropdownMenu>
+      </div>
+      <div className="space-y-5">
+        {fields.map((field, index) => {
+          const typeField = `${name}.${index}.key`;
+          return (
+            <div key={field.id} className="flex w-full items-center gap-2">
+              <FormField
+                control={form.control}
+                name={typeField}
+                render={({ field }) => (
+                  <FormItem className="flex-1 overflow-hidden">
+                    <FormControl>
+                      <Input
+                        {...field}
+                        placeholder={t('common.pleaseInput')}
+                      ></Input>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+              <Separator className="w-3 text-text-secondary" />
+              <FormField
+                control={form.control}
+                name={`${name}.${index}.op`}
+                render={({ field }) => (
+                  <FormItem className="flex-1 overflow-hidden">
+                    <FormControl>
+                      <SelectWithSearch
+                        {...field}
+                        options={switchOperatorOptions}
+                      ></SelectWithSearch>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+              <Separator className="w-3 text-text-secondary" />
+              <FormField
+                control={form.control}
+                name={`${name}.${index}.value`}
+                render={({ field }) => (
+                  <FormItem className="flex-1 overflow-hidden">
+                    <FormControl>
+                      <Input placeholder={t('common.pleaseInput')} {...field} />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+              <Button variant={'ghost'} onClick={() => remove(index)}>
+                <X className="text-text-sub-title-invert " />
+              </Button>
+            </div>
+          );
+        })}
+      </div>
+    </section>
+  );
+}