浏览代码

feat: 添加聚焦、添加中断ai创作

liaojiaxing 1 月之前
父节点
当前提交
5f371f6484

+ 16 - 2
apps/designer/src/pages/flow/components/Config/AiCreator.tsx

@@ -41,7 +41,8 @@ export default function AICreator(props: {
 
 
   const {
   const {
     loading,
     loading,
-    onRequest
+    onRequest,
+    cancel
   } = useChat({
   } = useChat({
     app_name: "system_design",
     app_name: "system_design",
     onStart: () => {
     onStart: () => {
@@ -103,6 +104,19 @@ export default function AICreator(props: {
     },
     },
   }
   }
 
 
+  const handleStop = () => {
+    cancel();
+    messageApi.open({
+      key: messageKey,
+      type: 'error',
+      content: "AI创作已取消",
+      duration: 2,
+      style: {
+        marginTop: 300
+      }
+    });
+  }
+
   // 处理提交
   // 处理提交
   const onSubmit = () => {
   const onSubmit = () => {
     if (input.trim()) {
     if (input.trim()) {
@@ -255,7 +269,7 @@ export default function AICreator(props: {
                     type="primary"
                     type="primary"
                     shape="circle"
                     shape="circle"
                     icon={<i className="iconfont icon-stopcircle" />}
                     icon={<i className="iconfont icon-stopcircle" />}
-                    onClick={stop}
+                    onClick={handleStop}
                   ></Button>
                   ></Button>
                 </Tooltip>
                 </Tooltip>
               ) : (
               ) : (

+ 6 - 2
apps/designer/src/pages/flow/components/Footer/index.tsx

@@ -1,4 +1,4 @@
-import { CompressOutlined, ExpandOutlined, MinusOutlined, PlusOutlined, QuestionCircleFilled } from "@ant-design/icons";
+import { AimOutlined, CompressOutlined, ExpandOutlined, MinusOutlined, PlusOutlined, QuestionCircleFilled } from "@ant-design/icons";
 import { Button, ConfigProvider, Divider, Slider, Tooltip } from "antd";
 import { Button, ConfigProvider, Divider, Slider, Tooltip } from "antd";
 import React, { useEffect, useRef, useState } from "react";
 import React, { useEffect, useRef, useState } from "react";
 import { useFullscreen } from "ahooks";
 import { useFullscreen } from "ahooks";
@@ -71,8 +71,12 @@ export default function Footer() {
         <div className="footer-right flex items-center">
         <div className="footer-right flex items-center">
           <div>图形:{selectedCell?.length}/{countCell}</div>
           <div>图形:{selectedCell?.length}/{countCell}</div>
           <Divider type="vertical" />
           <Divider type="vertical" />
-          <Tooltip title="模板">
+          {/* <Tooltip title="模板">
             <Button type="text" icon={<i className="iconfont icon-buju" />} />
             <Button type="text" icon={<i className="iconfont icon-buju" />} />
+          </Tooltip> */}
+          <Tooltip title="聚焦">
+            {/* <Button type="text" icon={<i className="iconfont icon-buju" />} /> */}
+            <Button type="text" icon={<AimOutlined />} onClick={handleZoomFit}/>
           </Tooltip>
           </Tooltip>
           <Tooltip title={showNavigation ? "关闭视图导航" : "显示视图导航"}>
           <Tooltip title={showNavigation ? "关闭视图导航" : "显示视图导航"}>
             <Button type="text" icon={<i className="iconfont icon-map" />} onClick={() => setShowNavigation(!showNavigation)}/>
             <Button type="text" icon={<i className="iconfont icon-map" />} onClick={() => setShowNavigation(!showNavigation)}/>