Compare commits
9 Commits
0f5ae1c4d4
...
flow
| Author | SHA1 | Date | |
|---|---|---|---|
| df6f1eb548 | |||
| 73e6ff3c54 | |||
|
ec37d04ae5 | ||
|
|
172ef4c099 | ||
|
|
306c20aa7f | ||
|
|
24d5d10ecb | ||
|
|
4a9a9ec238 | ||
|
|
08aa1d8382 | ||
|
|
1b3045dfd4 |
@@ -34,6 +34,10 @@ public class WebApplication implements ApplicationRunner, ApplicationContextAwar
|
|||||||
return context.getBean(clazz);
|
return context.getBean(clazz);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public static <T> T getBean(String name, Class<T> clazz) {
|
||||||
|
return context.getBean(name, clazz);
|
||||||
|
}
|
||||||
|
|
||||||
@Override
|
@Override
|
||||||
public void run(ApplicationArguments args) {
|
public void run(ApplicationArguments args) {
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -150,9 +150,11 @@ public class EmbeddingNodes {
|
|||||||
@LiteflowMethod(value = LiteFlowMethodEnum.PROCESS, nodeId = "qa_split", nodeName = "使用Q/A格式分段", nodeType = NodeTypeEnum.COMMON)
|
@LiteflowMethod(value = LiteFlowMethodEnum.PROCESS, nodeId = "qa_split", nodeName = "使用Q/A格式分段", nodeType = NodeTypeEnum.COMMON)
|
||||||
public void qaSplit(NodeComponent node) {
|
public void qaSplit(NodeComponent node) {
|
||||||
EmbeddingContext context = node.getContextBean(EmbeddingContext.class);
|
EmbeddingContext context = node.getContextBean(EmbeddingContext.class);
|
||||||
|
// language=TEXT
|
||||||
context.getDocuments().addAll(llmSplit(
|
context.getDocuments().addAll(llmSplit(
|
||||||
"""
|
"""
|
||||||
对用户输入的文本，生成多组高质量的问答对。请遵循以下指南：
|
对用户输入的文本，生成多组高质量的问答对。请遵循以下指南：
|
||||||
|
|
||||||
1. 问题部分：
|
1. 问题部分：
|
||||||
为同一个主题创建尽可能多的不同表述的问题，确保问题的多样性。
|
为同一个主题创建尽可能多的不同表述的问题，确保问题的多样性。
|
||||||
每个问题应考虑用户可能的多种问法，例如：
|
每个问题应考虑用户可能的多种问法，例如：
|
||||||
@@ -167,7 +169,7 @@ public class EmbeddingNodes {
|
|||||||
答案应直接基于给定文本，确保准确性和一致性。
|
答案应直接基于给定文本，确保准确性和一致性。
|
||||||
包含相关的细节，如日期、名称、职位等具体信息，必要时提供背景信息以增强理解。
|
包含相关的细节，如日期、名称、职位等具体信息，必要时提供背景信息以增强理解。
|
||||||
3. 格式：
|
3. 格式：
|
||||||
使用"问："标记问题集合的开始，所有问题应在一个段落内，问题之间用空格分隔。
|
使用"问："标记问题的开始，问题文本应在一个段落内完成。
|
||||||
使用"答："标记答案的开始，答案应清晰分段，便于阅读。
|
使用"答："标记答案的开始，答案应清晰分段，便于阅读。
|
||||||
问答对之间用“---”分隔，以提高可读性。
|
问答对之间用“---”分隔，以提高可读性。
|
||||||
4. 内容要求：
|
4. 内容要求：
|
||||||
@@ -175,6 +177,8 @@ public class EmbeddingNodes {
|
|||||||
避免添加文本中未提及的信息，确保信息的真实性。
|
避免添加文本中未提及的信息，确保信息的真实性。
|
||||||
一个问题搭配一个答案，避免一组问答对中同时涉及多个问题。
|
一个问题搭配一个答案，避免一组问答对中同时涉及多个问题。
|
||||||
如果文本信息不足以回答某个方面，可以在答案中说明 "根据给定信息无法确定"，并尽量提供相关的上下文。
|
如果文本信息不足以回答某个方面，可以在答案中说明 "根据给定信息无法确定"，并尽量提供相关的上下文。
|
||||||
|
除了问答对本身，避免输出任何与问答对无关的提示性、引导性、解释性的文本。
|
||||||
|
|
||||||
格式样例：
|
格式样例：
|
||||||
问：苹果通常是什么颜色的？
|
问：苹果通常是什么颜色的？
|
||||||
答：红色。
|
答：红色。
|
||||||
|
|||||||
@@ -44,7 +44,7 @@ public class ChartTool {
|
|||||||
""") String request
|
""") String request
|
||||||
) {
|
) {
|
||||||
log.info("Enter method: mermaid[request]. request:{}", request);
|
log.info("Enter method: mermaid[request]. request:{}", request);
|
||||||
ChatClient.Builder builder = WebApplication.getBean(ChatClient.Builder.class);
|
ChatClient.Builder builder = WebApplication.getBean("chat", ChatClient.Builder.class);
|
||||||
ChatClient client = builder.build();
|
ChatClient client = builder.build();
|
||||||
return client.prompt()
|
return client.prompt()
|
||||||
// language=TEXT
|
// language=TEXT
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
<!--suppress CssUnknownTarget, HtmlUnknownTarget -->
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html lang="zh">
|
<html lang="zh">
|
||||||
<head>
|
<head>
|
||||||
@@ -13,6 +14,15 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'LXGWWenKai';
|
||||||
|
src: url('fonts/LXGWNeoXiHei.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
|
||||||
|
*:not(.fa,.fas) {
|
||||||
|
font-family: LXGWWenKai, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji', serif !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
@@ -16,6 +16,7 @@
|
|||||||
"@fortawesome/fontawesome-free": "^6.7.2",
|
"@fortawesome/fontawesome-free": "^6.7.2",
|
||||||
"@lightenna/react-mermaid-diagram": "^1.0.20",
|
"@lightenna/react-mermaid-diagram": "^1.0.20",
|
||||||
"@tinyflow-ai/react": "^0.2.1",
|
"@tinyflow-ai/react": "^0.2.1",
|
||||||
|
"@xyflow/react": "^12.7.0",
|
||||||
"ahooks": "^3.8.5",
|
"ahooks": "^3.8.5",
|
||||||
"amis": "^6.12.0",
|
"amis": "^6.12.0",
|
||||||
"antd": "^5.26.1",
|
"antd": "^5.26.1",
|
||||||
@@ -30,7 +31,8 @@
|
|||||||
"react-dom": "^18.3.1",
|
"react-dom": "^18.3.1",
|
||||||
"react-markdown": "^10.1.0",
|
"react-markdown": "^10.1.0",
|
||||||
"react-router": "^7.6.2",
|
"react-router": "^7.6.2",
|
||||||
"styled-components": "^6.1.18"
|
"styled-components": "^6.1.18",
|
||||||
|
"zustand": "^5.0.5"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@types/markdown-it": "^14.1.2",
|
"@types/markdown-it": "^14.1.2",
|
||||||
|
|||||||
84
service-web/client/pnpm-lock.yaml
generated
84
service-web/client/pnpm-lock.yaml
generated
@@ -29,6 +29,9 @@ importers:
|
|||||||
'@tinyflow-ai/react':
|
'@tinyflow-ai/react':
|
||||||
specifier: ^0.2.1
|
specifier: ^0.2.1
|
||||||
version: 0.2.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(svelte@5.28.2)
|
version: 0.2.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(svelte@5.28.2)
|
||||||
|
'@xyflow/react':
|
||||||
|
specifier: ^12.7.0
|
||||||
|
version: 12.7.0(@types/react@18.3.23)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
|
||||||
ahooks:
|
ahooks:
|
||||||
specifier: ^3.8.5
|
specifier: ^3.8.5
|
||||||
version: 3.8.5(react@18.3.1)
|
version: 3.8.5(react@18.3.1)
|
||||||
@@ -74,6 +77,9 @@ importers:
|
|||||||
styled-components:
|
styled-components:
|
||||||
specifier: ^6.1.18
|
specifier: ^6.1.18
|
||||||
version: 6.1.18(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
|
version: 6.1.18(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
|
||||||
|
zustand:
|
||||||
|
specifier: ^5.0.5
|
||||||
|
version: 5.0.5(@types/react@18.3.23)(react@18.3.1)(use-sync-external-store@1.5.0(react@18.3.1))
|
||||||
devDependencies:
|
devDependencies:
|
||||||
'@types/markdown-it':
|
'@types/markdown-it':
|
||||||
specifier: ^14.1.2
|
specifier: ^14.1.2
|
||||||
@@ -1092,6 +1098,12 @@ packages:
|
|||||||
peerDependencies:
|
peerDependencies:
|
||||||
vite: ^4 || ^5 || ^6 || ^7.0.0-beta.0
|
vite: ^4 || ^5 || ^6 || ^7.0.0-beta.0
|
||||||
|
|
||||||
|
'@xyflow/react@12.7.0':
|
||||||
|
resolution: {integrity: sha512-U6VMEbYjiCg1byHrR7S+b5ZdHTjgCFX4KpBc634G/WtEBUvBLoMQdlCD6uJHqodnOAxpt3+G2wiDeTmXAFJzgQ==}
|
||||||
|
peerDependencies:
|
||||||
|
react: '>=17'
|
||||||
|
react-dom: '>=17'
|
||||||
|
|
||||||
'@xyflow/svelte@0.1.39':
|
'@xyflow/svelte@0.1.39':
|
||||||
resolution: {integrity: sha512-QZ5mzNysvJeJW7DxmqI4Urhhef9tclqtPr7WAS5zQF5Gk6k9INwzey4CYNtEZo8XMj9H8lzgoJRmgMPnJEc1kw==}
|
resolution: {integrity: sha512-QZ5mzNysvJeJW7DxmqI4Urhhef9tclqtPr7WAS5zQF5Gk6k9INwzey4CYNtEZo8XMj9H8lzgoJRmgMPnJEc1kw==}
|
||||||
peerDependencies:
|
peerDependencies:
|
||||||
@@ -1100,6 +1112,9 @@ packages:
|
|||||||
'@xyflow/system@0.0.59':
|
'@xyflow/system@0.0.59':
|
||||||
resolution: {integrity: sha512-+xgqYhoBv5F10TQx0SiKZR/DcWtuxFYR+e/LluHb7DMtX4SsMDutZWEJ4da4fDco25jZxw5G9fOlmk7MWvYd5Q==}
|
resolution: {integrity: sha512-+xgqYhoBv5F10TQx0SiKZR/DcWtuxFYR+e/LluHb7DMtX4SsMDutZWEJ4da4fDco25jZxw5G9fOlmk7MWvYd5Q==}
|
||||||
|
|
||||||
|
'@xyflow/system@0.0.62':
|
||||||
|
resolution: {integrity: sha512-Z2ufbnvuYxIOCGyzE/8eX8TAEM8Lpzc/JafjD1Tzy6ZJs/E7KGVU17Q1F5WDHVW+dbztJAdyXMG0ejR9bwSUAA==}
|
||||||
|
|
||||||
abbrev@1.1.1:
|
abbrev@1.1.1:
|
||||||
resolution: {integrity: sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==}
|
resolution: {integrity: sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==}
|
||||||
|
|
||||||
@@ -3599,6 +3614,39 @@ packages:
|
|||||||
zrender@5.6.0:
|
zrender@5.6.0:
|
||||||
resolution: {integrity: sha512-uzgraf4njmmHAbEUxMJ8Oxg+P3fT04O+9p7gY+wJRVxo8Ge+KmYv0WJev945EH4wFuc4OY2NLXz46FZrWS9xJg==}
|
resolution: {integrity: sha512-uzgraf4njmmHAbEUxMJ8Oxg+P3fT04O+9p7gY+wJRVxo8Ge+KmYv0WJev945EH4wFuc4OY2NLXz46FZrWS9xJg==}
|
||||||
|
|
||||||
|
zustand@4.5.7:
|
||||||
|
resolution: {integrity: sha512-CHOUy7mu3lbD6o6LJLfllpjkzhHXSBlX8B9+qPddUsIfeF5S/UZ5q0kmCsnRqT1UHFQZchNFDDzMbQsuesHWlw==}
|
||||||
|
engines: {node: '>=12.7.0'}
|
||||||
|
peerDependencies:
|
||||||
|
'@types/react': '>=16.8'
|
||||||
|
immer: '>=9.0.6'
|
||||||
|
react: '>=16.8'
|
||||||
|
peerDependenciesMeta:
|
||||||
|
'@types/react':
|
||||||
|
optional: true
|
||||||
|
immer:
|
||||||
|
optional: true
|
||||||
|
react:
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
zustand@5.0.5:
|
||||||
|
resolution: {integrity: sha512-mILtRfKW9xM47hqxGIxCv12gXusoY/xTSHBYApXozR0HmQv299whhBeeAcRy+KrPPybzosvJBCOmVjq6x12fCg==}
|
||||||
|
engines: {node: '>=12.20.0'}
|
||||||
|
peerDependencies:
|
||||||
|
'@types/react': '>=18.0.0'
|
||||||
|
immer: '>=9.0.6'
|
||||||
|
react: '>=18.0.0'
|
||||||
|
use-sync-external-store: '>=1.2.0'
|
||||||
|
peerDependenciesMeta:
|
||||||
|
'@types/react':
|
||||||
|
optional: true
|
||||||
|
immer:
|
||||||
|
optional: true
|
||||||
|
react:
|
||||||
|
optional: true
|
||||||
|
use-sync-external-store:
|
||||||
|
optional: true
|
||||||
|
|
||||||
zwitch@2.0.4:
|
zwitch@2.0.4:
|
||||||
resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
|
resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
|
||||||
|
|
||||||
@@ -4613,6 +4661,17 @@ snapshots:
|
|||||||
transitivePeerDependencies:
|
transitivePeerDependencies:
|
||||||
- '@swc/helpers'
|
- '@swc/helpers'
|
||||||
|
|
||||||
|
'@xyflow/react@12.7.0(@types/react@18.3.23)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
|
||||||
|
dependencies:
|
||||||
|
'@xyflow/system': 0.0.62
|
||||||
|
classcat: 5.0.5
|
||||||
|
react: 18.3.1
|
||||||
|
react-dom: 18.3.1(react@18.3.1)
|
||||||
|
zustand: 4.5.7(@types/react@18.3.23)(react@18.3.1)
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- '@types/react'
|
||||||
|
- immer
|
||||||
|
|
||||||
'@xyflow/svelte@0.1.39(svelte@5.28.2)':
|
'@xyflow/svelte@0.1.39(svelte@5.28.2)':
|
||||||
dependencies:
|
dependencies:
|
||||||
'@svelte-put/shortcut': 3.1.1(svelte@5.28.2)
|
'@svelte-put/shortcut': 3.1.1(svelte@5.28.2)
|
||||||
@@ -4630,6 +4689,18 @@ snapshots:
|
|||||||
d3-selection: 3.0.0
|
d3-selection: 3.0.0
|
||||||
d3-zoom: 3.0.0
|
d3-zoom: 3.0.0
|
||||||
|
|
||||||
|
'@xyflow/system@0.0.62':
|
||||||
|
dependencies:
|
||||||
|
'@types/d3-drag': 3.0.7
|
||||||
|
'@types/d3-interpolate': 3.0.4
|
||||||
|
'@types/d3-selection': 3.0.11
|
||||||
|
'@types/d3-transition': 3.0.9
|
||||||
|
'@types/d3-zoom': 3.0.8
|
||||||
|
d3-drag: 3.0.0
|
||||||
|
d3-interpolate: 3.0.1
|
||||||
|
d3-selection: 3.0.0
|
||||||
|
d3-zoom: 3.0.0
|
||||||
|
|
||||||
abbrev@1.1.1:
|
abbrev@1.1.1:
|
||||||
optional: true
|
optional: true
|
||||||
|
|
||||||
@@ -7708,4 +7779,17 @@ snapshots:
|
|||||||
dependencies:
|
dependencies:
|
||||||
tslib: 2.3.0
|
tslib: 2.3.0
|
||||||
|
|
||||||
|
zustand@4.5.7(@types/react@18.3.23)(react@18.3.1):
|
||||||
|
dependencies:
|
||||||
|
use-sync-external-store: 1.5.0(react@18.3.1)
|
||||||
|
optionalDependencies:
|
||||||
|
'@types/react': 18.3.23
|
||||||
|
react: 18.3.1
|
||||||
|
|
||||||
|
zustand@5.0.5(@types/react@18.3.23)(react@18.3.1)(use-sync-external-store@1.5.0(react@18.3.1)):
|
||||||
|
optionalDependencies:
|
||||||
|
'@types/react': 18.3.23
|
||||||
|
react: 18.3.1
|
||||||
|
use-sync-external-store: 1.5.0(react@18.3.1)
|
||||||
|
|
||||||
zwitch@2.0.4: {}
|
zwitch@2.0.4: {}
|
||||||
|
|||||||
BIN
service-web/client/public/fonts/LXGWNeoXiHei.ttf
Normal file
BIN
service-web/client/public/fonts/LXGWNeoXiHei.ttf
Normal file
Binary file not shown.
4
service-web/client/src/index.scss
Normal file
4
service-web/client/src/index.scss
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
// 改写一些amis中控制不到的全局CSS
|
||||||
|
button.btn-deleted:hover {
|
||||||
|
color: #dc2626 !important;
|
||||||
|
}
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
import {createRoot} from 'react-dom/client'
|
import {createRoot} from 'react-dom/client'
|
||||||
import {createHashRouter, RouterProvider} from 'react-router'
|
import {createHashRouter, RouterProvider} from 'react-router'
|
||||||
|
import './index.scss'
|
||||||
import './components/Registry.ts'
|
import './components/Registry.ts'
|
||||||
|
|
||||||
import {routes} from './route.tsx'
|
import {routes} from './route.tsx'
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ import {ProLayout} from '@ant-design/pro-components'
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import {Outlet, useLocation, useNavigate} from 'react-router'
|
import {Outlet, useLocation, useNavigate} from 'react-router'
|
||||||
import {menus} from '../route.tsx'
|
import {menus} from '../route.tsx'
|
||||||
|
import {ConfigProvider} from 'antd'
|
||||||
|
|
||||||
const App: React.FC = () => {
|
const App: React.FC = () => {
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
@@ -34,7 +35,18 @@ const App: React.FC = () => {
|
|||||||
style={{minHeight: '100vh'}}
|
style={{minHeight: '100vh'}}
|
||||||
contentStyle={{backgroundColor: 'white', padding: '10px 10px 10px 20px'}}
|
contentStyle={{backgroundColor: 'white', padding: '10px 10px 10px 20px'}}
|
||||||
>
|
>
|
||||||
<Outlet/>
|
<ConfigProvider
|
||||||
|
theme={{
|
||||||
|
components: {
|
||||||
|
Card: {
|
||||||
|
bodyPadding: 0,
|
||||||
|
bodyPaddingSM: 0,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Outlet/>
|
||||||
|
</ConfigProvider>
|
||||||
</ProLayout>
|
</ProLayout>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,19 +1,487 @@
|
|||||||
import {Tinyflow} from '@tinyflow-ai/react'
|
import {DeleteFilled, EditFilled, PlusCircleFilled, SaveFilled} from '@ant-design/icons'
|
||||||
import '@tinyflow-ai/react/dist/index.css'
|
import {
|
||||||
|
addEdge,
|
||||||
|
applyEdgeChanges,
|
||||||
|
applyNodeChanges,
|
||||||
|
Background,
|
||||||
|
BackgroundVariant,
|
||||||
|
Controls,
|
||||||
|
type Edge,
|
||||||
|
Handle,
|
||||||
|
MiniMap,
|
||||||
|
type Node,
|
||||||
|
type NodeProps,
|
||||||
|
type OnConnect,
|
||||||
|
type OnEdgesChange,
|
||||||
|
type OnNodesChange,
|
||||||
|
Position,
|
||||||
|
ReactFlow,
|
||||||
|
} from '@xyflow/react'
|
||||||
|
import {useMount} from 'ahooks'
|
||||||
|
import type {Schema} from 'amis'
|
||||||
|
import {Button, Card, Drawer, Dropdown, message, Space} from 'antd'
|
||||||
|
import {arrToMap, filter, find, findIdx, isEqual, isNil, randomId} from 'licia'
|
||||||
|
import {type JSX, useState} from 'react'
|
||||||
|
import styled from 'styled-components'
|
||||||
|
import '@xyflow/react/dist/style.css'
|
||||||
|
import {create} from 'zustand/react'
|
||||||
|
import {amisRender, commonInfo} from '../util/amis.tsx'
|
||||||
|
|
||||||
function Test() {
|
const FlowableDiv = styled.div`
|
||||||
|
height: 93vh;
|
||||||
|
|
||||||
|
.toolbar {
|
||||||
|
z-index: 999;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.node-card {
|
||||||
|
cursor: grab;
|
||||||
|
|
||||||
|
.card-container {
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
type AmisNodeType = 'normal' | 'start' | 'end'
|
||||||
|
|
||||||
|
const AmisNode = (
|
||||||
|
props: NodeProps,
|
||||||
|
type: AmisNodeType,
|
||||||
|
name: String,
|
||||||
|
description?: String,
|
||||||
|
columnSchema?: Schema[],
|
||||||
|
) => {
|
||||||
|
const {id, data} = props
|
||||||
|
const {getDataById, removeNode, editNode} = data
|
||||||
return (
|
return (
|
||||||
<div className="flowable">
|
<div className="p-1 w-64">
|
||||||
<Tinyflow
|
<Card
|
||||||
className="tinyflow-instance"
|
className="node-card"
|
||||||
style={{height: '95vh'}}
|
title={name}
|
||||||
onDataChange={(value) => {
|
size="small"
|
||||||
console.log(value)
|
hoverable
|
||||||
console.log(JSON.stringify(value))
|
>
|
||||||
}}
|
<Dropdown
|
||||||
/>
|
className="card-container"
|
||||||
|
trigger={['contextMenu']}
|
||||||
|
menu={{
|
||||||
|
items: [
|
||||||
|
{
|
||||||
|
key: 'edit',
|
||||||
|
label: '编辑',
|
||||||
|
icon: <EditFilled className="text-gray-600 hover:text-blue-500"/>,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'remove',
|
||||||
|
label: '删除',
|
||||||
|
icon: <DeleteFilled className="text-red-500 hover:text-red-500"/>,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
onClick: menu => {
|
||||||
|
switch (menu.key) {
|
||||||
|
case 'edit':
|
||||||
|
// @ts-ignore
|
||||||
|
editNode(id, name, description, columnSchema)
|
||||||
|
break
|
||||||
|
case 'remove':
|
||||||
|
// @ts-ignore
|
||||||
|
removeNode(id)
|
||||||
|
break
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div className="card-description p-2 text-secondary text-sm">
|
||||||
|
{description}
|
||||||
|
</div>
|
||||||
|
</Dropdown>
|
||||||
|
</Card>
|
||||||
|
{isEqual(type, 'start') || isEqual(type, 'normal')
|
||||||
|
? <Handle type="source" position={Position.Right}/> : undefined}
|
||||||
|
{isEqual(type, 'end') || isEqual(type, 'normal')
|
||||||
|
? <Handle type="target" position={Position.Left}/> : undefined}
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const StartAmisNode = (props: NodeProps) => AmisNode(
|
||||||
|
props,
|
||||||
|
'start',
|
||||||
|
'开始节点',
|
||||||
|
'定义输入变量',
|
||||||
|
[
|
||||||
|
{
|
||||||
|
type: 'input-kvs',
|
||||||
|
name: 'fields',
|
||||||
|
addButtonText: '新增入参',
|
||||||
|
draggable: false,
|
||||||
|
keyItem: {
|
||||||
|
label: '参数名称',
|
||||||
|
},
|
||||||
|
valueItems: [
|
||||||
|
{
|
||||||
|
type: 'input-text',
|
||||||
|
name: 'description',
|
||||||
|
label: '参数描述',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
name: 'type',
|
||||||
|
label: '参数类型',
|
||||||
|
required: true,
|
||||||
|
selectFirst: true,
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
label: '文本',
|
||||||
|
value: 'text',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '数字',
|
||||||
|
value: 'number',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '文件',
|
||||||
|
value: 'files',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
)
|
||||||
|
const EndAmisNode = (props: NodeProps) => AmisNode(
|
||||||
|
props,
|
||||||
|
'end',
|
||||||
|
'结束节点',
|
||||||
|
'定义输出变量',
|
||||||
|
[
|
||||||
|
{
|
||||||
|
type: 'input-kvs',
|
||||||
|
name: 'fields',
|
||||||
|
addButtonText: '新增输出',
|
||||||
|
draggable: false,
|
||||||
|
keyItem: {
|
||||||
|
label: '参数名称',
|
||||||
|
},
|
||||||
|
valueItems: [
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
name: 'type',
|
||||||
|
label: '参数',
|
||||||
|
required: true,
|
||||||
|
selectFirst: true,
|
||||||
|
options: [],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
)
|
||||||
|
const LlmAmisNode = (props: NodeProps) => AmisNode(
|
||||||
|
props,
|
||||||
|
'normal',
|
||||||
|
'大模型节点',
|
||||||
|
'使用大模型对话',
|
||||||
|
[
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
name: 'model',
|
||||||
|
label: '大模型',
|
||||||
|
required: true,
|
||||||
|
selectFirst: true,
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
label: 'Qwen3',
|
||||||
|
value: 'qwen3',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: 'Deepseek',
|
||||||
|
value: 'deepseek',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'textarea',
|
||||||
|
name: 'systemPrompt',
|
||||||
|
label: '系统提示词',
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
)
|
||||||
|
|
||||||
|
const initialNodes: Node[] = [
|
||||||
|
{
|
||||||
|
id: 'BMFP3Eov94',
|
||||||
|
type: 'start-amis-node',
|
||||||
|
position: {x: 10, y: 100},
|
||||||
|
data: {},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'PYK8LjduQ1',
|
||||||
|
type: 'end-amis-node',
|
||||||
|
position: {x: 500, y: 100},
|
||||||
|
data: {},
|
||||||
|
},
|
||||||
|
]
|
||||||
|
const initialEdges: Edge[] = []
|
||||||
|
|
||||||
|
const useStore = create<{
|
||||||
|
data: Record<string, any>,
|
||||||
|
getData: () => Record<string, any>,
|
||||||
|
setData: (data: Record<string, any>) => void,
|
||||||
|
getDataById: (id: string) => any,
|
||||||
|
setDataById: (id: string, data: any) => void,
|
||||||
|
}>((set, get) => ({
|
||||||
|
data: {},
|
||||||
|
getData: () => get().data,
|
||||||
|
setData: (data) => set(data),
|
||||||
|
getDataById: id => get().data[id],
|
||||||
|
setDataById: (id, data) => {
|
||||||
|
let updateData = get().data
|
||||||
|
updateData[id] = data
|
||||||
|
set({
|
||||||
|
data: updateData,
|
||||||
|
})
|
||||||
|
},
|
||||||
|
}))
|
||||||
|
|
||||||
|
const useFlowStore = create<{
|
||||||
|
nodes: Node[],
|
||||||
|
onNodesChange: OnNodesChange,
|
||||||
|
addNode: (node: Node) => void,
|
||||||
|
removeNode: (id: string) => void,
|
||||||
|
setNodes: (nodes: Node[]) => void,
|
||||||
|
|
||||||
|
edges: Edge[],
|
||||||
|
onEdgesChange: OnEdgesChange,
|
||||||
|
setEdges: (edges: Edge[]) => void,
|
||||||
|
|
||||||
|
onConnect: OnConnect,
|
||||||
|
}>((set, get) => ({
|
||||||
|
nodes: [],
|
||||||
|
onNodesChange: changes => {
|
||||||
|
set({
|
||||||
|
nodes: applyNodeChanges(changes, get().nodes),
|
||||||
|
})
|
||||||
|
},
|
||||||
|
addNode: node => set({nodes: get().nodes.concat(node)}),
|
||||||
|
removeNode: id => {
|
||||||
|
set({
|
||||||
|
nodes: filter(get().nodes, node => !isEqual(node.id, id)),
|
||||||
|
})
|
||||||
|
},
|
||||||
|
setNodes: nodes => set({nodes}),
|
||||||
|
|
||||||
|
edges: [],
|
||||||
|
onEdgesChange: changes => {
|
||||||
|
set({
|
||||||
|
edges: applyEdgeChanges(changes, get().edges),
|
||||||
|
})
|
||||||
|
},
|
||||||
|
setEdges: edges => set({edges}),
|
||||||
|
|
||||||
|
onConnect: connection => {
|
||||||
|
set({
|
||||||
|
edges: addEdge(connection, get().edges),
|
||||||
|
})
|
||||||
|
},
|
||||||
|
}))
|
||||||
|
|
||||||
|
function Test() {
|
||||||
|
const [messageApi, contextHolder] = message.useMessage()
|
||||||
|
const [nodeDef] = useState<{
|
||||||
|
key: string,
|
||||||
|
name: string,
|
||||||
|
component: (props: NodeProps) => JSX.Element
|
||||||
|
}[]>([
|
||||||
|
{
|
||||||
|
key: 'start-amis-node',
|
||||||
|
name: '开始',
|
||||||
|
component: StartAmisNode,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'end-amis-node',
|
||||||
|
name: '结束',
|
||||||
|
component: EndAmisNode,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'llm-amis-node',
|
||||||
|
name: '大模型',
|
||||||
|
component: LlmAmisNode,
|
||||||
|
},
|
||||||
|
])
|
||||||
|
const [open, setOpen] = useState(false)
|
||||||
|
|
||||||
|
const {getData, getDataById, setDataById} = useStore()
|
||||||
|
const {
|
||||||
|
nodes,
|
||||||
|
addNode,
|
||||||
|
removeNode,
|
||||||
|
setNodes,
|
||||||
|
onNodesChange,
|
||||||
|
edges,
|
||||||
|
setEdges,
|
||||||
|
onEdgesChange,
|
||||||
|
onConnect,
|
||||||
|
} = useFlowStore()
|
||||||
|
|
||||||
|
const [currentNodeForm, setCurrentNodeForm] = useState<JSX.Element>()
|
||||||
|
const editNode = (id: string, name: string, description: string, columnSchema?: Schema[]) => {
|
||||||
|
if (!isNil(columnSchema)) {
|
||||||
|
setCurrentNodeForm(
|
||||||
|
amisRender(
|
||||||
|
{
|
||||||
|
type: 'wrapper',
|
||||||
|
size: 'none',
|
||||||
|
body: [
|
||||||
|
{
|
||||||
|
type: 'tpl',
|
||||||
|
className: 'text-secondary',
|
||||||
|
tpl: description,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
debug: commonInfo.debug,
|
||||||
|
title: name,
|
||||||
|
type: 'form',
|
||||||
|
wrapWithPanel: false,
|
||||||
|
onEvent: {
|
||||||
|
submitSucc: {
|
||||||
|
actions: [
|
||||||
|
{
|
||||||
|
actionType: 'custom',
|
||||||
|
// @ts-ignore
|
||||||
|
script: (context, action, event) => {
|
||||||
|
setDataById(id, context.props.data)
|
||||||
|
setOpen(false)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
body: [
|
||||||
|
...(columnSchema ?? []),
|
||||||
|
{
|
||||||
|
type: 'wrapper',
|
||||||
|
size: 'none',
|
||||||
|
className: 'space-x-1 float-right',
|
||||||
|
body: [
|
||||||
|
{
|
||||||
|
type: 'action',
|
||||||
|
label: '取消',
|
||||||
|
onEvent: {
|
||||||
|
click: {
|
||||||
|
actions: [
|
||||||
|
{
|
||||||
|
actionType: 'custom',
|
||||||
|
// @ts-ignore
|
||||||
|
script: (context, action, event) => {
|
||||||
|
setOpen(false)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'submit',
|
||||||
|
label: '保存',
|
||||||
|
level: 'primary',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
getDataById(id),
|
||||||
|
),
|
||||||
|
)
|
||||||
|
setOpen(true)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
useMount(() => {
|
||||||
|
for (let node of initialNodes) {
|
||||||
|
node.data = {
|
||||||
|
getDataById,
|
||||||
|
setDataById,
|
||||||
|
removeNode,
|
||||||
|
editNode,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
setNodes(initialNodes)
|
||||||
|
setEdges(initialEdges)
|
||||||
|
})
|
||||||
|
|
||||||
|
return (
|
||||||
|
<FlowableDiv>
|
||||||
|
{contextHolder}
|
||||||
|
<Space className="toolbar">
|
||||||
|
<Button type="primary" onClick={() => console.log(JSON.stringify(getData()))}>
|
||||||
|
<SaveFilled/>
|
||||||
|
保存
|
||||||
|
</Button>
|
||||||
|
<Dropdown
|
||||||
|
menu={{
|
||||||
|
items: nodeDef.map(def => ({key: def.key, label: def.name})),
|
||||||
|
onClick: ({key}) => {
|
||||||
|
if (isEqual(key, 'start-amis-node') && findIdx(nodes, (node: Node) => isEqual(key, node.type)) > -1) {
|
||||||
|
messageApi.error('只能存在1个开始节点')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (isEqual(key, 'end-amis-node') && findIdx(nodes, (node: Node) => isEqual(key, node.type)) > -1) {
|
||||||
|
messageApi.error('只能存在1个结束节点')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
addNode({
|
||||||
|
id: randomId(10),
|
||||||
|
type: key,
|
||||||
|
position: {x: 100, y: 100},
|
||||||
|
data: {
|
||||||
|
getDataById,
|
||||||
|
setDataById,
|
||||||
|
removeNode,
|
||||||
|
editNode,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Button type="dashed">
|
||||||
|
<PlusCircleFilled/>
|
||||||
|
新增节点
|
||||||
|
</Button>
|
||||||
|
</Dropdown>
|
||||||
|
</Space>
|
||||||
|
<Drawer
|
||||||
|
title="节点编辑"
|
||||||
|
open={open}
|
||||||
|
closeIcon={false}
|
||||||
|
maskClosable={false}
|
||||||
|
destroyOnHidden
|
||||||
|
>
|
||||||
|
{currentNodeForm}
|
||||||
|
</Drawer>
|
||||||
|
<ReactFlow
|
||||||
|
nodes={nodes}
|
||||||
|
edges={edges}
|
||||||
|
onNodesChange={onNodesChange}
|
||||||
|
onEdgesChange={onEdgesChange}
|
||||||
|
onConnect={onConnect}
|
||||||
|
// @ts-ignore
|
||||||
|
nodeTypes={arrToMap(
|
||||||
|
nodeDef.map(def => def.key),
|
||||||
|
key => find(nodeDef, def => isEqual(key, def.key))!.component)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Controls/>
|
||||||
|
<MiniMap/>
|
||||||
|
<Background variant={BackgroundVariant.Cross} gap={20} size={3}/>
|
||||||
|
</ReactFlow>
|
||||||
|
</FlowableDiv>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
export default Test
|
export default Test
|
||||||
@@ -217,7 +217,7 @@ const Feedback: React.FC = () => {
|
|||||||
disabledOn: '${status === \'ANALYSIS_PROCESSING\'}',
|
disabledOn: '${status === \'ANALYSIS_PROCESSING\'}',
|
||||||
type: 'action',
|
type: 'action',
|
||||||
label: '删除',
|
label: '删除',
|
||||||
className: 'text-danger hover:text-red-600',
|
className: 'text-danger btn-deleted',
|
||||||
level: 'link',
|
level: 'link',
|
||||||
size: 'sm',
|
size: 'sm',
|
||||||
actionType: 'ajax',
|
actionType: 'ajax',
|
||||||
|
|||||||
@@ -142,7 +142,7 @@ const DataDetail: React.FC = () => {
|
|||||||
{
|
{
|
||||||
type: 'action',
|
type: 'action',
|
||||||
label: '删除',
|
label: '删除',
|
||||||
className: 'text-danger hover:text-red-600',
|
className: 'text-danger btn-deleted',
|
||||||
level: 'link',
|
level: 'link',
|
||||||
size: 'sm',
|
size: 'sm',
|
||||||
actionType: 'ajax',
|
actionType: 'ajax',
|
||||||
|
|||||||
@@ -87,7 +87,7 @@ const DataDetail: React.FC = () => {
|
|||||||
{
|
{
|
||||||
type: 'action',
|
type: 'action',
|
||||||
label: '删除',
|
label: '删除',
|
||||||
className: 'text-danger hover:text-red-600',
|
className: 'text-danger btn-deleted',
|
||||||
level: 'link',
|
level: 'link',
|
||||||
size: 'sm',
|
size: 'sm',
|
||||||
actionType: 'ajax',
|
actionType: 'ajax',
|
||||||
|
|||||||
@@ -188,7 +188,7 @@ const Knowledge: React.FC = () => {
|
|||||||
{
|
{
|
||||||
type: 'action',
|
type: 'action',
|
||||||
label: '删除',
|
label: '删除',
|
||||||
className: 'text-danger hover:text-red-600',
|
className: 'text-danger btn-deleted',
|
||||||
level: 'link',
|
level: 'link',
|
||||||
size: 'sm',
|
size: 'sm',
|
||||||
actionType: 'ajax',
|
actionType: 'ajax',
|
||||||
|
|||||||
@@ -169,7 +169,7 @@ const tableDetailDialog = (variable: string, targetList: any) => {
|
|||||||
|
|
||||||
const overviewYarnJob = (cluster: string, search: string, queue: string | undefined, yarnQueue: string) => {
|
const overviewYarnJob = (cluster: string, search: string, queue: string | undefined, yarnQueue: string) => {
|
||||||
return {
|
return {
|
||||||
className: 'text-base leading-none',
|
className: 'text-sm leading-none',
|
||||||
type: 'table-view',
|
type: 'table-view',
|
||||||
border: false,
|
border: false,
|
||||||
padding: '0 10px 0 15px',
|
padding: '0 10px 0 15px',
|
||||||
|
|||||||
@@ -91,7 +91,7 @@ function Table() {
|
|||||||
columns: [
|
columns: [
|
||||||
{
|
{
|
||||||
label: 'Flink job id',
|
label: 'Flink job id',
|
||||||
width: 195,
|
width: 200,
|
||||||
fixed: 'left',
|
fixed: 'left',
|
||||||
type: 'wrapper',
|
type: 'wrapper',
|
||||||
size: 'none',
|
size: 'none',
|
||||||
|
|||||||
@@ -99,7 +99,7 @@ function Version() {
|
|||||||
columns: [
|
columns: [
|
||||||
{
|
{
|
||||||
label: 'Flink job id',
|
label: 'Flink job id',
|
||||||
width: 195,
|
width: 200,
|
||||||
fixed: 'left',
|
fixed: 'left',
|
||||||
type: 'wrapper',
|
type: 'wrapper',
|
||||||
size: 'none',
|
size: 'none',
|
||||||
|
|||||||
Reference in New Issue
Block a user