feat: Add component WenCai #1739 (#2388)

### What problem does this PR solve?

feat: Add component WenCai #1739

### Type of change

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

web/src/locales/en.ts

@@ -875,6 +875,23 @@ The above is the content you need to summarize.`,
       operator: 'Operator',
       value: 'Value',
       useTemplate: 'Use this template',
+      wenCai: 'WenCai',
+      queryType: 'Query type',
+      wenCaiDescription:
+        'The component can be used to obtain information on a wide range of financial areas, including but not limited to stocks, funds, etc...',
+      wenCaiQueryTypeOptions: {
+        stock: 'stock',
+        zhishu: 'index',
+        fund: 'fund',
+        hkstock: 'Hong Kong shares',
+        usstock: 'US stock market',
+        threeboard: 'New OTC Market',
+        conbond: 'Convertible Bond',
+        insurance: 'insurance',
+        futures: 'futures',
+        lccp: 'Financing',
+        foreign_exchange: 'Foreign currency',
+      },
     },
     footer: {
       profile: 'All rights reserved @ React',

web/src/locales/zh-traditional.ts

@@ -829,6 +829,23 @@ export default {
       operator: '操作符',
       value: '值',
       useTemplate: '使用該模板',
+      wenCai: '問財',
+      queryType: '查詢類型',
+      wenCaiDescription:
+        '該組件可用於獲取廣泛的金融領域的信息，包括但不限於股票、基金等...',
+      wenCaiQueryTypeOptions: {
+        stock: '股票',
+        zhishu: '指數',
+        fund: '基金',
+        hkstock: '港股',
+        usstock: '美股',
+        threeboard: '新三板',
+        conbond: '可轉債',
+        insurance: '保險',
+        futures: '期貨',
+        lccp: '理財',
+        foreign_exchange: '股票',
+      },
     },
     footer: {
       profile: '“保留所有權利 @ react”',

web/src/locales/zh.ts

@@ -847,6 +847,23 @@ export default {
       operator: '操作符',
       value: '值',
       useTemplate: '使用该模板',
+      wenCai: '问财',
+      queryType: '查询类型',
+      wenCaiDescription:
+        '该组件可用于获取广泛金融领域的信息，包括但不限于股票、基金等...',
+      wenCaiQueryTypeOptions: {
+        stock: '股票',
+        zhishu: '指数',
+        fund: '基金',
+        hkstock: '港股',
+        usstock: '美股',
+        threeboard: '新三板',
+        conbond: '可转债',
+        insurance: '保险',
+        futures: '期货',
+        lccp: '理财',
+        foreign_exchange: '股票',
+      },
     },
     footer: {
       profile: 'All rights reserved @ React',

web/src/pages/flow/constant.tsx

@@ -12,6 +12,7 @@ import { ReactComponent as KeywordIcon } from '@/assets/svg/keyword.svg';
 import { ReactComponent as PubMedIcon } from '@/assets/svg/pubmed.svg';
 import { ReactComponent as QWeatherIcon } from '@/assets/svg/qweather.svg';
 import { ReactComponent as SwitchIcon } from '@/assets/svg/switch.svg';
+import { ReactComponent as WenCaiIcon } from '@/assets/svg/wencai.svg';
 import { ReactComponent as WikipediaIcon } from '@/assets/svg/wikipedia.svg';
 
 import { variableEnabledFieldMap } from '@/constants/chat';
@@ -59,6 +60,7 @@ export enum Operator {
   QWeather = 'QWeather',
   ExeSQL = 'ExeSQL',
   Switch = 'Switch',
+  WenCai = 'WenCai',
 }
 
 export const operatorIconMap = {
@@ -85,6 +87,7 @@ export const operatorIconMap = {
   [Operator.QWeather]: QWeatherIcon,
   [Operator.ExeSQL]: ExeSqlIcon,
   [Operator.Switch]: SwitchIcon,
+  [Operator.WenCai]: WenCaiIcon,
 };
 
 export const operatorMap: Record<
@@ -194,6 +197,7 @@ export const operatorMap: Record<
   [Operator.QWeather]: { backgroundColor: '#a4bbf3' },
   [Operator.ExeSQL]: { backgroundColor: '#b9efe8' },
   [Operator.Switch]: { backgroundColor: '#dbaff6' },
+  [Operator.WenCai]: { backgroundColor: '#faac5b' },
 };
 
 export const componentMenuList = [
@@ -263,6 +267,9 @@ export const componentMenuList = [
   {
     name: Operator.ExeSQL,
   },
+  {
+    name: Operator.WenCai,
+  },
 ];
 
 export const initialRetrievalValues = {
@@ -402,6 +409,8 @@ export const initialExeSqlValues = {
 
 export const initialSwitchValues = { conditions: [] };
 
+export const initialWenCaiValues = { top_n: 20, query_type: 'stock' };
+
 export const CategorizeAnchorPointPositions = [
   { top: 1, right: 34 },
   { top: 8, right: 18 },
@@ -472,6 +481,7 @@ export const RestrictedUpstreamMap = {
   [Operator.QWeather]: [Operator.Begin, Operator.Retrieval],
   [Operator.ExeSQL]: [Operator.Begin],
   [Operator.Switch]: [Operator.Begin],
+  [Operator.WenCai]: [Operator.Begin],
 };
 
 export const NodeMap = {
@@ -498,6 +508,7 @@ export const NodeMap = {
   [Operator.QWeather]: 'ragNode',
   [Operator.ExeSQL]: 'ragNode',
   [Operator.Switch]: 'categorizeNode',
+  [Operator.WenCai]: 'ragNode',
 };
 
 export const LanguageOptions = [
@@ -2652,3 +2663,17 @@ export const SwitchOperatorOptions = [
 ];
 
 export const SwitchLogicOperatorOptions = ['and', 'or'];
+
+export const WenCaiQueryTypeOptions = [
+  'stock',
+  'zhishu',
+  'fund',
+  'hkstock',
+  'usstock',
+  'threeboard',
+  'conbond',
+  'insurance',
+  'futures',
+  'lccp',
+  'foreign_exchange',
+];

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

@@ -28,6 +28,7 @@ import RelevantForm from '../relevant-form';
 import RetrievalForm from '../retrieval-form';
 import RewriteQuestionForm from '../rewrite-question-form';
 import SwitchForm from '../switch-form';
+import WenCaiForm from '../wencai-form';
 import WikipediaForm from '../wikipedia-form';
 
 import styles from './index.less';
@@ -60,6 +61,7 @@ const FormMap = {
   [Operator.QWeather]: QWeatherForm,
   [Operator.ExeSQL]: ExeSQLForm,
   [Operator.Switch]: SwitchForm,
+  [Operator.WenCai]: WenCaiForm,
 };
 
 const EmptyContent = () => <div>empty</div>;

web/src/pages/flow/hooks.ts

@@ -52,6 +52,7 @@ import {
   initialRetrievalValues,
   initialRewriteQuestionValues,
   initialSwitchValues,
+  initialWenCaiValues,
   initialWikipediaValues,
 } from './constant';
 import { ICategorizeForm, IRelevantForm, ISwitchForm } from './interface';
@@ -113,6 +114,7 @@ export const useInitializeOperatorParams = () => {
       [Operator.QWeather]: initialQWeatherValues,
       [Operator.ExeSQL]: initialExeSqlValues,
       [Operator.Switch]: initialSwitchValues,
+      [Operator.WenCai]: initialWenCaiValues,
     };
   }, [llmId]);
 

web/src/pages/flow/wencai-form/index.tsx

@@ -0,0 +1,35 @@
+import TopNItem from '@/components/top-n-item';
+import { useTranslate } from '@/hooks/common-hooks';
+import { Form, Select } from 'antd';
+import { useMemo } from 'react';
+import { WenCaiQueryTypeOptions } from '../constant';
+import { IOperatorForm } from '../interface';
+
+const WenCaiForm = ({ onValuesChange, form }: IOperatorForm) => {
+  const { t } = useTranslate('flow');
+
+  const wenCaiQueryTypeOptions = useMemo(() => {
+    return WenCaiQueryTypeOptions.map((x) => ({
+      value: x,
+      label: t(`wenCaiQueryTypeOptions.${x}`),
+    }));
+  }, [t]);
+
+  return (
+    <Form
+      name="basic"
+      labelCol={{ span: 6 }}
+      wrapperCol={{ span: 18 }}
+      autoComplete="off"
+      form={form}
+      onValuesChange={onValuesChange}
+    >
+      <TopNItem initialValue={10} max={99}></TopNItem>
+      <Form.Item label={t('queryType')} name={'query_type'}>
+        <Select options={wenCaiQueryTypeOptions}></Select>
+      </Form.Item>
+    </Form>
+  );
+};
+
+export default WenCaiForm;