diff --git a/ui/src/components/icons/index.ts b/ui/src/components/icons/index.ts index 6b83adf9a..ece51a9f3 100644 --- a/ui/src/components/icons/index.ts +++ b/ui/src/components/icons/index.ts @@ -533,24 +533,18 @@ export const iconMap: any = { 'svg', { style: { height: '100%', width: '100%' }, - viewBox: '0 0 16 16', + viewBox: '0 0 1024 1024', version: '1.1', xmlns: 'http://www.w3.org/2000/svg' }, [ h('path', { - d: 'M7.99984 3.66667C8.46007 3.66667 8.83317 4.03977 8.83317 4.5C8.83317 4.96023 8.46007 5.33333 7.99984 5.33333C7.5396 5.33333 7.1665 4.96023 7.1665 4.5C7.1665 4.03977 7.5396 3.66667 7.99984 3.66667Z', + d: 'M512 234.666667A53.333333 53.333333 0 1 1 512 341.333333a53.333333 53.333333 0 0 1 0-106.666666zM522.666667 384h-64a21.333333 21.333333 0 0 0-21.333334 21.333333v42.666667a21.333333 21.333333 0 0 0 21.333334 21.333333h21.333333v213.333334H426.666667a21.333333 21.333333 0 0 0-21.333334 21.333333v42.666667a21.333333 21.333333 0 0 0 21.333334 21.333333h192a21.333333 21.333333 0 0 0 21.333333-21.333333v-42.666667a21.333333 21.333333 0 0 0-21.333333-21.333333h-53.333334v-256a42.666667 42.666667 0 0 0-42.666666-42.666667z', fill: 'currentColor' }), h('path', { - d: 'M8.1665 6H7.33317C7.05703 6 6.83317 6.22386 6.83317 6.5V6.83333C6.83317 7.10948 7.05703 7.33333 7.33317 7.33333H7.49984V10.6667H6.83317C6.55703 10.6667 6.33317 10.8905 6.33317 11.1667V11.5C6.33317 11.7761 6.55703 12 6.83317 12H9.49984C9.77598 12 9.99984 11.7761 9.99984 11.5V11.1667C9.99984 10.8905 9.77598 10.6667 9.49984 10.6667H8.83317V6.66667C8.83317 6.29848 8.53469 6 8.1665 6Z', + d: 'M512 981.333333C252.8 981.333333 42.666667 771.2 42.666667 512S252.8 42.666667 512 42.666667s469.333333 210.133333 469.333333 469.333333-210.133333 469.333333-469.333333 469.333333z m0-85.333333a384 384 0 1 0 0-768 384 384 0 0 0 0 768z', fill: 'currentColor' - }), - h('path', { - d: 'M7.99984 15.3332C3.94984 15.3332 0.666504 12.0498 0.666504 7.99984C0.666504 3.94984 3.94984 0.666504 7.99984 0.666504C12.0498 0.666504 15.3332 3.94984 15.3332 7.99984C15.3332 12.0498 12.0498 15.3332 7.99984 15.3332ZM7.99984 13.9998C11.3135 13.9998 13.9998 11.3135 13.9998 7.99984C13.9998 4.68617 11.3135 1.99984 7.99984 1.99984C4.68617 1.99984 1.99984 4.68617 1.99984 7.99984C1.99984 11.3135 4.68617 13.9998 7.99984 13.9998Z', - fill: 'currentColor', - fillRule: 'evenodd', - clipRule: 'evenodd' }) ] ) @@ -935,5 +929,30 @@ export const iconMap: any = { ) ]) } + }, + 'app-fitview': { + iconReader: () => { + return h('i', [ + h( + 'svg', + { + style: { height: '100%', width: '100%' }, + viewBox: '0 0 1024 1024', + version: '1.1', + xmlns: 'http://www.w3.org/2000/svg' + }, + [ + h('path', { + d: 'M128 85.333333h192a21.333333 21.333333 0 0 1 21.333333 21.333334v42.666666a21.333333 21.333333 0 0 1-21.333333 21.333334H170.666667v149.333333a21.333333 21.333333 0 0 1-21.333334 21.333333h-42.666666a21.333333 21.333333 0 0 1-21.333334-21.333333V128a42.666667 42.666667 0 0 1 42.666667-42.666667z m768 853.333334h-192a21.333333 21.333333 0 0 1-21.333333-21.333334v-42.666666a21.333333 21.333333 0 0 1 21.333333-21.333334H853.333333v-149.333333a21.333333 21.333333 0 0 1 21.333334-21.333333h42.666666a21.333333 21.333333 0 0 1 21.333334 21.333333V896a42.666667 42.666667 0 0 1-42.666667 42.666667zM85.333333 896v-192a21.333333 21.333333 0 0 1 21.333334-21.333333h42.666666a21.333333 21.333333 0 0 1 21.333334 21.333333V853.333333h149.333333a21.333333 21.333333 0 0 1 21.333333 21.333334v42.666666a21.333333 21.333333 0 0 1-21.333333 21.333334H128a42.666667 42.666667 0 0 1-42.666667-42.666667zM938.666667 128v192a21.333333 21.333333 0 0 1-21.333334 21.333333h-42.666666a21.333333 21.333333 0 0 1-21.333334-21.333333V170.666667h-149.333333a21.333333 21.333333 0 0 1-21.333333-21.333334v-42.666666a21.333333 21.333333 0 0 1 21.333333-21.333334H896a42.666667 42.666667 0 0 1 42.666667 42.666667z', + fill: 'currentColor' + }), + h('path', { + d: 'M512 512m-170.666667 0a170.666667 170.666667 0 1 0 341.333334 0 170.666667 170.666667 0 1 0-341.333334 0Z', + fill: 'currentColor' + }) + ] + ) + ]) + } } } diff --git a/ui/src/styles/app.scss b/ui/src/styles/app.scss index bd3a8fa5a..6a9464dea 100644 --- a/ui/src/styles/app.scss +++ b/ui/src/styles/app.scss @@ -122,6 +122,9 @@ h5 { .w-500 { width: 500px; } +.max-w-200 { + max-width: 200px; +} .mt-4 { margin-top: calc(var(--app-base-px) - 4px); @@ -567,6 +570,13 @@ h5 { background-color: var(--el-fill-color-light); } } + .model-icon { + width: 20px; + } + .check-icon { + position: absolute; + right: 10px; + } } // 段落card diff --git a/ui/src/views/application/CreateAndSetting.vue b/ui/src/views/application/CreateAndSetting.vue index 966151f12..30c31f498 100644 --- a/ui/src/views/application/CreateAndSetting.vue +++ b/ui/src/views/application/CreateAndSetting.vue @@ -539,13 +539,7 @@ onMounted(() => { height: calc(var(--app-main-height) - 150px); } } -.model-icon { - width: 20px; -} -.check-icon { - position: absolute; - right: 10px; -} + .prologue-md-editor { height: 150px; } diff --git a/ui/src/views/template/component/CreateModelDialog.vue b/ui/src/views/template/component/CreateModelDialog.vue index c342d43c2..e01cc1efc 100644 --- a/ui/src/views/template/component/CreateModelDialog.vue +++ b/ui/src/views/template/component/CreateModelDialog.vue @@ -6,6 +6,7 @@ :close-on-press-escape="false" :destroy-on-close="true" :before-close="close" + append-to-body > diff --git a/ui/src/views/template/component/SelectProviderDialog.vue b/ui/src/views/template/component/SelectProviderDialog.vue index ae77e9eb4..be5cf53b7 100644 --- a/ui/src/views/template/component/SelectProviderDialog.vue +++ b/ui/src/views/template/component/SelectProviderDialog.vue @@ -7,6 +7,7 @@ :destroy-on-close="true" :before-close="close" title="选择供应商" + append-to-body > diff --git a/ui/src/workflow/common/NodeControl.vue b/ui/src/workflow/common/NodeControl.vue index ff4ce3e1c..808deefd5 100644 --- a/ui/src/workflow/common/NodeControl.vue +++ b/ui/src/workflow/common/NodeControl.vue @@ -1,11 +1,17 @@ - - - 放大 - 缩小 - 适应 - - + + + + + + + + + + + + + diff --git a/ui/src/workflow/common/data.ts b/ui/src/workflow/common/data.ts index e7871c197..827cb8ee7 100644 --- a/ui/src/workflow/common/data.ts +++ b/ui/src/workflow/common/data.ts @@ -14,7 +14,8 @@ export const baseNodes = [ node_data: { name: '', desc: '', - prologue: '' + prologue: + '您好,我是 MaxKB 小助手,您可以向我提出 MaxKB 使用问题。\n- MaxKB 主要功能有什么?\n- MaxKB 支持哪些大语言模型?\n- MaxKB 支持哪些文档类型?' } } }, @@ -94,6 +95,32 @@ export const menuNodes = [ ] } }, + { + type: 'question-node', + text: '根据历史聊天记录优化完善当前问题,更利于匹配知识库分段', + label: '问题优化', + icon: 'question-node-icon', + properties: { + height: '', + stepName: '问题优化', + input: [ + { + key: '' + } + ], + output: [ + { + key: '' + } + ], + fields: [ + { + label: '用户问题', + value: 'question' + } + ] + } + }, { type: 'condition-node', text: '根据不同条件执行不同的节点', @@ -113,5 +140,25 @@ export const menuNodes = [ } ] } + }, + { + type: 'reply-node', + text: '指定回复内容,引用变量会转换为字符串进行输出', + label: '指定回复', + icon: 'reply-node-icon', + properties: { + height: '', + stepName: '指定回复', + input: [ + { + key: '' + } + ], + output: [ + { + key: '' + } + ] + } } ] diff --git a/ui/src/workflow/icons/question-node-icon.vue b/ui/src/workflow/icons/question-node-icon.vue index 04610d351..74ab30d0f 100644 --- a/ui/src/workflow/icons/question-node-icon.vue +++ b/ui/src/workflow/icons/question-node-icon.vue @@ -1,6 +1,6 @@ - + diff --git a/ui/src/workflow/icons/reply-node-icon.vue b/ui/src/workflow/icons/reply-node-icon.vue index f259fd58c..07b2ed56f 100644 --- a/ui/src/workflow/icons/reply-node-icon.vue +++ b/ui/src/workflow/icons/reply-node-icon.vue @@ -1,6 +1,6 @@ - + diff --git a/ui/src/workflow/index.vue b/ui/src/workflow/index.vue index 7c9cba67d..ff761f807 100644 --- a/ui/src/workflow/index.vue +++ b/ui/src/workflow/index.vue @@ -101,8 +101,7 @@ const graphData = { height: '', stepName: 'AI 对话', input: [{ key: '输入' }], - output: [{ key: '输出' }], - node_data: { model: '', name: '' } + output: [{ key: '输出' }] } }, { @@ -114,8 +113,7 @@ const graphData = { height: '', stepName: 'AI 对话', input: [{ key: '输入' }], - output: [{ key: '输出' }], - node_data: { model: '', name: '' } + output: [{ key: '输出' }] } }, { @@ -127,8 +125,7 @@ const graphData = { height: '', stepName: 'AI 对话', input: [{ key: '输入' }], - output: [{ key: '输出' }], - node_data: { model: '', name: '' } + output: [{ key: '输出' }] } } ], diff --git a/ui/src/workflow/nodes/ai-chat-node/index.vue b/ui/src/workflow/nodes/ai-chat-node/index.vue index 324ce55e2..b3cc87968 100644 --- a/ui/src/workflow/nodes/ai-chat-node/index.vue +++ b/ui/src/workflow/nodes/ai-chat-node/index.vue @@ -12,62 +12,208 @@ ref="aiChatNodeFormRef" > - - - + + + + + + {{ item.name }} + + + + + + + + {{ item.name }} + (不可用) + + + + + + + + + 添加模型 + + + - - + + + + + + + + 提示词* + + + 通过调整提示词内容,可以引导大模型聊天方向,该提示词会被固定在上下文的开头。可以使用变量:{data} + 是携带知识库中已知信息;{question} 是用户提出的问题。 + + + + + + + + + 参数输出 + AI 回答内容 {content} + + + diff --git a/ui/src/workflow/nodes/base-node/index.vue b/ui/src/workflow/nodes/base-node/index.vue index 5f448cf87..e1da99742 100644 --- a/ui/src/workflow/nodes/base-node/index.vue +++ b/ui/src/workflow/nodes/base-node/index.vue @@ -55,17 +55,18 @@ import { ref, computed, onMounted } from 'vue' import { MdEditor } from 'md-editor-v3' const props = defineProps<{ nodeModel: any }>() +const form = { + name: '', + desc: '', + prologue: + '您好,我是 MaxKB 小助手,您可以向我提出 MaxKB 使用问题。\n- MaxKB 主要功能有什么?\n- MaxKB 支持哪些大语言模型?\n- MaxKB 支持哪些文档类型?' +} const chat_data = computed({ get: () => { if (props.nodeModel.properties.node_data) { return props.nodeModel.properties.node_data } else { - props.nodeModel.properties.node_data = { - name: '', - desc: '', - prologue: - '您好,我是 MaxKB 小助手,您可以向我提出 MaxKB 使用问题。\n- MaxKB 主要功能有什么?\n- MaxKB 支持哪些大语言模型?\n- MaxKB 支持哪些文档类型?' - } + set(props.nodeModel.properties, 'node_data', form) } return props.nodeModel.properties.node_data }, diff --git a/ui/src/workflow/nodes/question-node/index.ts b/ui/src/workflow/nodes/question-node/index.ts new file mode 100644 index 000000000..648b515e4 --- /dev/null +++ b/ui/src/workflow/nodes/question-node/index.ts @@ -0,0 +1,12 @@ +import ChatNodeVue from './index.vue' +import { AppNode, AppNodeModel } from '@/workflow/common/app-node.ts' +class ChatNode extends AppNode { + constructor(props: any) { + super(props, ChatNodeVue) + } +} +export default { + type: 'ai-chat-node', + model: AppNodeModel, + view: ChatNode +} diff --git a/ui/src/workflow/nodes/question-node/index.vue b/ui/src/workflow/nodes/question-node/index.vue new file mode 100644 index 000000000..1c5deede8 --- /dev/null +++ b/ui/src/workflow/nodes/question-node/index.vue @@ -0,0 +1,221 @@ + + + 节点设置 + + + + + + + + + {{ item.name }} + + + + + + + + {{ item.name }} + (不可用) + + + + + + + + + 添加模型 + + + + + + + + + + + + + 提示词* + + + 通过调整提示词内容,可以引导大模型聊天方向,该提示词会被固定在上下文的开头。可以使用变量:{data} + 是携带知识库中已知信息;{question} 是用户提出的问题。 + + + + + + + + + + + + + 参数输出 + 用户问题 {question} + + + + + + + diff --git a/ui/src/workflow/nodes/search-dataset-node/index.vue b/ui/src/workflow/nodes/search-dataset-node/index.vue index 194c13046..1eb354a86 100644 --- a/ui/src/workflow/nodes/search-dataset-node/index.vue +++ b/ui/src/workflow/nodes/search-dataset-node/index.vue @@ -134,7 +134,7 @@ const form_data = computed({ if (props.nodeModel.properties.node_data) { return props.nodeModel.properties.node_data } else { - set(props.nodeModel.properties, 'node_data', form.value) + set(props.nodeModel.properties, 'node_data', form) } return props.nodeModel.properties.node_data },