(feature)(webapp) add filter modify and similar questions (#213)

webapp/packages/chat-sdk/src/components/ChatItem/ExecuteItem.tsx

@@ -1,10 +1,11 @@
-import { Spin } from 'antd';
-import { CheckCircleFilled } from '@ant-design/icons';
+import { Button, Spin } from 'antd';
+import { CheckCircleFilled, ReloadOutlined } from '@ant-design/icons';
 import { PREFIX_CLS } from '../../common/constants';
 import { MsgDataType } from '../../common/type';
 import ChatMsg from '../ChatMsg';
 import WebPage from '../ChatMsg/WebPage';
 import Loading from './Loading';
+import React, { ReactNode } from 'react';
 
 type Props = {
   queryId?: number;
@@ -12,8 +13,11 @@ type Props = {
   entitySwitchLoading: boolean;
   chartIndex: number;
   executeTip?: string;
+  executeItemNode?: ReactNode;
+  renderCustomExecuteNode?: boolean;
   data?: MsgDataType;
   triggerResize?: boolean;
+  onRefresh: () => void;
 };
 
 const ExecuteItem: React.FC<Props> = ({
@@ -22,12 +26,15 @@ const ExecuteItem: React.FC<Props> = ({
   entitySwitchLoading,
   chartIndex,
   executeTip,
+  executeItemNode,
+  renderCustomExecuteNode,
   data,
   triggerResize,
+  onRefresh,
 }) => {
   const prefixCls = `${PREFIX_CLS}-item`;
 
-  const getNodeTip = (title: string, tip?: string) => {
+  const getNodeTip = (title: ReactNode, tip?: string) => {
     return (
       <>
         <div className={`${prefixCls}-title-bar`}>
@@ -42,12 +49,19 @@ const ExecuteItem: React.FC<Props> = ({
     );
   };
 
+  const reloadNode = (
+    <Button className={`${prefixCls}-reload`} size="small" onClick={onRefresh}>
+      <ReloadOutlined />
+      重新查询
+    </Button>
+  );
+
   if (executeLoading) {
     return getNodeTip('数据查询中');
   }
 
   if (executeTip) {
-    return getNodeTip('数据查询失败', executeTip);
+    return getNodeTip(<>数据查询失败：{reloadNode}</>, executeTip);
   }
 
   if (!data) {
@@ -58,14 +72,19 @@ const ExecuteItem: React.FC<Props> = ({
     <>
       <div className={`${prefixCls}-title-bar`}>
         <CheckCircleFilled className={`${prefixCls}-step-icon`} />
-        <div className={`${prefixCls}-step-title`}>数据查询</div>
+        <div className={`${prefixCls}-step-title`}>
+          数据查询：
+          {reloadNode}
+        </div>
       </div>
-      <div className={`${prefixCls}-content-container ${prefixCls}-last-node`}>
+      <div className={`${prefixCls}-content-container`}>
         <Spin spinning={entitySwitchLoading}>
           {data.queryAuthorization?.message && (
             <div className={`${prefixCls}-auth-tip`}>提示：{data.queryAuthorization.message}</div>
           )}
-          {data?.queryMode === 'WEB_PAGE' ? (
+          {renderCustomExecuteNode && executeItemNode ? (
+            executeItemNode
+          ) : data?.queryMode === 'WEB_PAGE' ? (
             <WebPage id={queryId!} data={data} />
           ) : (
             <ChatMsg