Feat: Bring the parser operator when creating a new data flow #9869 (#10309)

### What problem does this PR solve?

Feat: Bring the parser operator when creating a new data flow #9869
### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/data-flow/constant.tsx

@@ -268,11 +268,6 @@ export const initialParserValues = {
       fileFormat: FileType.PowerPoint,
       output_format: PptOutputFormat.Json,
     },
-    {
-      fileFormat: FileType.Audio,
-      llm_id: '',
-      output_format: AudioOutputFormat.Text,
-    },
   ],
 };
 

web/src/pages/data-flow/hooks/use-run-dataflow.ts

@@ -1,3 +1,4 @@
+import message from '@/components/ui/message';
 import { useSendMessageBySSE } from '@/hooks/use-send-message';
 import api from '@/utils/api';
 import { get } from 'lodash';
@@ -38,6 +39,8 @@ export function useRunDataflow(
         }
 
         return msgId;
+      } else {
+        message.error(get(res, 'data.message', ''));
       }
     },
     [hideRunOrChatDrawer, id, saveGraph, send, setMessageId],

web/src/pages/data-flow/index.tsx

@@ -68,7 +68,8 @@ export default function DataFlow() {
   const { handleExportJson } = useHandleExportOrImportJsonFile();
   const { saveGraph, loading } = useSaveGraph();
   const { flowDetail: agentDetail } = useFetchDataOnMount();
-  const { handleRun } = useSaveGraphBeforeOpeningDebugDrawer(showChatDrawer);
+  const { handleRun, loading: running } =
+    useSaveGraphBeforeOpeningDebugDrawer(showChatDrawer);
 
   const {
     visible: versionDialogVisible,
@@ -136,14 +137,18 @@ export default function DataFlow() {
           >
             <LaptopMinimalCheck /> {t('flow.save')}
           </ButtonLoading>
-          <Button
+          <ButtonLoading
             variant={'secondary'}
             onClick={handleRunAgent}
             disabled={isParsing}
+            loading={running}
           >
-            <CirclePlay className={isParsing ? 'animate-spin' : ''} />
-            {isParsing ? t('dataflow.running') : t('flow.run')}
-          </Button>
+            {running || (
+              <CirclePlay className={isParsing ? 'animate-spin' : ''} />
+            )}
+
+            {isParsing || running ? t('dataflow.running') : t('flow.run')}
+          </ButtonLoading>
           <Button variant={'secondary'} onClick={showVersionDialog}>
             <History />
             {t('flow.historyversion')}

web/src/pages/data-flow/utils.ts

@@ -14,6 +14,7 @@ import {
   NodeHandleId,
   Operator,
 } from './constant';
+import { ExtractorFormSchemaType } from './form/extractor-form';
 import { HierarchicalMergerFormSchemaType } from './form/hierarchical-merger-form';
 import { ParserFormSchemaType } from './form/parser-form';
 import { SplitterFormSchemaType } from './form/splitter-form';
@@ -143,6 +144,10 @@ function transformHierarchicalMergerParams(
   return { ...params, hierarchy: Number(params.hierarchy), levels };
 }
 
+function transformExtractorParams(params: ExtractorFormSchemaType) {
+  return { ...params, prompts: [{ content: params.prompts, role: 'user' }] };
+}
+
 // construct a dsl based on the node information of the graph
 export const buildDslComponentsByGraph = (
   nodes: RAGFlowNodeType[],
@@ -174,6 +179,9 @@ export const buildDslComponentsByGraph = (
         case Operator.HierarchicalMerger:
           params = transformHierarchicalMergerParams(params);
           break;
+        case Operator.Extractor:
+          params = transformExtractorParams(params);
+          break;
 
         default:
           break;