opensource/dify
2
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-04-15 18:06:36 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: start node

Browse Source
This commit is contained in:
Joel 2024-02-21 18:31:45 +08:00
parent e39d7021e0
commit 3341077587
20 changed files with 316 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
web/app/components/base/icons/assets/vender/line/editor/align-left.svg Normal file
View File

@ -0,0 +1,5 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="align-left">
<path id="Icon" d="M16 10H3M20 6H3M20 14H3M16 18H3" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 261 B

5
web/app/components/base/icons/assets/vender/line/editor/letter-spacing-01.svg Normal file
View File

@ -0,0 +1,5 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="letter-spacing-01">
<path id="Icon" d="M9 13L15 13M7 17L11.2717 7.60225C11.5031 7.09323 11.6188 6.83872 11.7791 6.75976C11.9184 6.69115 12.0816 6.69115 12.2209 6.75976C12.3812 6.83872 12.4969 7.09323 12.7283 7.60225L17 17M21 3V21M3 3L3 21" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 436 B

5
web/app/components/base/icons/assets/vender/line/general/check-done-01.svg Normal file
View File

@ -0,0 +1,5 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="check-done-01">
<path id="Icon" d="M6 15L8 17L12.5 12.5M8 8V5.2C8 4.0799 8 3.51984 8.21799 3.09202C8.40973 2.71569 8.71569 2.40973 9.09202 2.21799C9.51984 2 10.0799 2 11.2 2H18.8C19.9201 2 20.4802 2 20.908 2.21799C21.2843 2.40973 21.5903 2.71569 21.782 3.09202C22 3.51984 22 4.0799 22 5.2V12.8C22 13.9201 22 14.4802 21.782 14.908C21.5903 15.2843 21.2843 15.5903 20.908 15.782C20.4802 16 19.9201 16 18.8 16H16M5.2 22H12.8C13.9201 22 14.4802 22 14.908 21.782C15.2843 21.5903 15.5903 21.2843 15.782 20.908C16 20.4802 16 19.9201 16 18.8V11.2C16 10.0799 16 9.51984 15.782 9.09202C15.5903 8.71569 15.2843 8.40973 14.908 8.21799C14.4802 8 13.9201 8 12.8 8H5.2C4.0799 8 3.51984 8 3.09202 8.21799C2.71569 8.40973 2.40973 8.71569 2.21799 9.09202C2 9.51984 2 10.0799 2 11.2V18.8C2 19.9201 2 20.4802 2.21799 20.908C2.40973 21.2843 2.71569 21.5903 3.09202 21.782C3.51984 22 4.07989 22 5.2 22Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

39
web/app/components/base/icons/src/vender/line/editor/AlignLeft.json Normal file
View File

@ -0,0 +1,39 @@
{
"icon": {
"type": "element",
"isRootNode": true,
"name": "svg",
"attributes": {
"width": "24",
"height": "24",
"viewBox": "0 0 24 24",
"fill": "none",
"xmlns": "http://www.w3.org/2000/svg"
},
"children": [
{
"type": "element",
"name": "g",
"attributes": {
"id": "align-left"
},
"children": [
{
"type": "element",
"name": "path",
"attributes": {
"id": "Icon",
"d": "M16 10H3M20 6H3M20 14H3M16 18H3",
"stroke": "currentColor",
"stroke-width": "2",
"stroke-linecap": "round",
"stroke-linejoin": "round"
},
"children": []
}
]
}
]
},
"name": "AlignLeft"
}

16
web/app/components/base/icons/src/vender/line/editor/AlignLeft.tsx Normal file
View File

@ -0,0 +1,16 @@
// GENERATE BY script
// DON NOT EDIT IT MANUALLY
import * as React from 'react'
import data from './AlignLeft.json'
import IconBase from '@/app/components/base/icons/IconBase'
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
props,
ref,
) => <IconBase {...props} ref={ref} data={data as IconData} />)
Icon.displayName = 'AlignLeft'
export default Icon

39
web/app/components/base/icons/src/vender/line/editor/LetterSpacing01.json Normal file
View File

@ -0,0 +1,39 @@
{
"icon": {
"type": "element",
"isRootNode": true,
"name": "svg",
"attributes": {
"width": "24",
"height": "24",
"viewBox": "0 0 24 24",
"fill": "none",
"xmlns": "http://www.w3.org/2000/svg"
},
"children": [
{
"type": "element",
"name": "g",
"attributes": {
"id": "letter-spacing-01"
},
"children": [
{
"type": "element",
"name": "path",
"attributes": {
"id": "Icon",
"d": "M9 13L15 13M7 17L11.2717 7.60225C11.5031 7.09323 11.6188 6.83872 11.7791 6.75976C11.9184 6.69115 12.0816 6.69115 12.2209 6.75976C12.3812 6.83872 12.4969 7.09323 12.7283 7.60225L17 17M21 3V21M3 3L3 21",
"stroke": "currentColor",
"stroke-width": "2",
"stroke-linecap": "round",
"stroke-linejoin": "round"
},
"children": []
}
]
}
]
},
"name": "LetterSpacing01"
}

16
web/app/components/base/icons/src/vender/line/editor/LetterSpacing01.tsx Normal file
View File

@ -0,0 +1,16 @@
// GENERATE BY script
// DON NOT EDIT IT MANUALLY
import * as React from 'react'
import data from './LetterSpacing01.json'
import IconBase from '@/app/components/base/icons/IconBase'
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
props,
ref,
) => <IconBase {...props} ref={ref} data={data as IconData} />)
Icon.displayName = 'LetterSpacing01'
export default Icon

2
web/app/components/base/icons/src/vender/line/editor/index.ts
View File

@ -1,3 +1,5 @@
export { default as AlignLeft } from './AlignLeft'
export { default as BezierCurve03 } from './BezierCurve03'
export { default as Colors } from './Colors'
export { default as LetterSpacing01 } from './LetterSpacing01'
export { default as TypeSquare } from './TypeSquare'

39
web/app/components/base/icons/src/vender/line/general/CheckDone01.json Normal file
View File

@ -0,0 +1,39 @@
{
"icon": {
"type": "element",
"isRootNode": true,
"name": "svg",
"attributes": {
"width": "24",
"height": "24",
"viewBox": "0 0 24 24",
"fill": "none",
"xmlns": "http://www.w3.org/2000/svg"
},
"children": [
{
"type": "element",
"name": "g",
"attributes": {
"id": "check-done-01"
},
"children": [
{
"type": "element",
"name": "path",
"attributes": {
"id": "Icon",
"d": "M6 15L8 17L12.5 12.5M8 8V5.2C8 4.0799 8 3.51984 8.21799 3.09202C8.40973 2.71569 8.71569 2.40973 9.09202 2.21799C9.51984 2 10.0799 2 11.2 2H18.8C19.9201 2 20.4802 2 20.908 2.21799C21.2843 2.40973 21.5903 2.71569 21.782 3.09202C22 3.51984 22 4.0799 22 5.2V12.8C22 13.9201 22 14.4802 21.782 14.908C21.5903 15.2843 21.2843 15.5903 20.908 15.782C20.4802 16 19.9201 16 18.8 16H16M5.2 22H12.8C13.9201 22 14.4802 22 14.908 21.782C15.2843 21.5903 15.5903 21.2843 15.782 20.908C16 20.4802 16 19.9201 16 18.8V11.2C16 10.0799 16 9.51984 15.782 9.09202C15.5903 8.71569 15.2843 8.40973 14.908 8.21799C14.4802 8 13.9201 8 12.8 8H5.2C4.0799 8 3.51984 8 3.09202 8.21799C2.71569 8.40973 2.40973 8.71569 2.21799 9.09202C2 9.51984 2 10.0799 2 11.2V18.8C2 19.9201 2 20.4802 2.21799 20.908C2.40973 21.2843 2.71569 21.5903 3.09202 21.782C3.51984 22 4.07989 22 5.2 22Z",
"stroke": "currentColor",
"stroke-width": "2",
"stroke-linecap": "round",
"stroke-linejoin": "round"
},
"children": []
}
]
}
]
},
"name": "CheckDone01"
}

16
web/app/components/base/icons/src/vender/line/general/CheckDone01.tsx Normal file
View File

@ -0,0 +1,16 @@
// GENERATE BY script
// DON NOT EDIT IT MANUALLY
import * as React from 'react'
import data from './CheckDone01.json'
import IconBase from '@/app/components/base/icons/IconBase'
import type { IconBaseProps, IconData } from '@/app/components/base/icons/IconBase'
const Icon = React.forwardRef<React.MutableRefObject<SVGElement>, Omit<IconBaseProps, 'data'>>((
props,
ref,
) => <IconBase {...props} ref={ref} data={data as IconData} />)
Icon.displayName = 'CheckDone01'
export default Icon

1
web/app/components/base/icons/src/vender/line/general/index.ts
View File

@ -1,5 +1,6 @@
export { default as AtSign } from './AtSign'
export { default as Bookmark } from './Bookmark'
export { default as CheckDone01 } from './CheckDone01'
export { default as Check } from './Check'
export { default as DotsHorizontal } from './DotsHorizontal'
export { default as Edit02 } from './Edit02'

31
web/app/components/workflow/nodes/_base/components/input-var-type-icon.tsx Normal file
View File

@ -0,0 +1,31 @@
'use client'
import type { FC } from 'react'
import React from 'react'
import { InputVarType } from '../../../types'
import { AlignLeft, LetterSpacing01 } from '@/app/components/base/icons/src/vender/line/editor'
import { CheckDone01, Hash02 } from '@/app/components/base/icons/src/vender/line/general'
type Props = {
className?: string
type: InputVarType
}
const getIcon = (type: InputVarType) => {
return ({
[InputVarType.textInput]: LetterSpacing01,
[InputVarType.paragraph]: AlignLeft,
[InputVarType.select]: CheckDone01,
[InputVarType.number]: Hash02,
} as any)[type] || LetterSpacing01
}
const InputVarTypeIcon: FC<Props> = ({
className,
type,
}) => {
const Icon = getIcon(type)
return (
<Icon className={className} />
)
}
export default React.memo(InputVarTypeIcon)

4
web/app/components/workflow/nodes/if-else/mock.ts
View File

@ -1,7 +1,7 @@
import type { IfElseType } from './types'
import type { IfElseNodeType } from './types'
import { ComparisonOperator, LogicalOperator } from './types'
export const mockData: IfElseType = {
export const mockData: IfElseNodeType = {
title: 'Test',
desc: 'Test',
type: 'Test',

2
web/app/components/workflow/nodes/if-else/types.ts
View File

@ -31,7 +31,7 @@ export type Condition = {
value: string
}
export type IfElseType = CommonNodeType & {
export type IfElseNodeType = CommonNodeType & {
logical_operator: LogicalOperator
conditions: Condition[]
}

44
web/app/components/workflow/nodes/start/mock.ts Normal file
View File

@ -0,0 +1,44 @@
import type { StartNodeType } from './types'
import { InputVarType } from '@/app/components/workflow/types'
export const mockData: StartNodeType = {
title: 'Test',
desc: 'Test',
type: 'Test',
variables: [
{
type: InputVarType.textInput,
label: 'Test',
variable: 'str',
max_length: 10,
default: 'test',
required: true,
hint: 'Test',
},
{
type: InputVarType.paragraph,
label: 'Test',
variable: 'para',
default: 'test',
required: true,
hint: 'Test',
},
{
type: InputVarType.select,
label: 'Test',
variable: 'sel',
default: 'test',
required: false,
hint: 'Test',
options: ['op1', 'op2'],
},
{
type: InputVarType.number,
label: 'Test',
variable: 'num',
default: '1',
required: true,
hint: 'Test',
},
],
}

25
web/app/components/workflow/nodes/start/node.tsx
View File

@ -1,8 +1,31 @@
import type { FC } from 'react'
import { useTranslation } from 'react-i18next'
import InputVarTypeIcon from '../_base/components/input-var-type-icon'
import { mockData } from './mock'
import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
const i18nPrefix = 'workflow.nodes.start'
const Node: FC = () => {
const { t } = useTranslation()
const { variables } = mockData
return (
<div>start node</div>
<div className='px-3'>
<div className='space-y-0.5'>
{variables.map(variable => (
<div key={variable.variable} className='flex items-center h-6 justify-between bg-gray-100 rounded-md px-1 space-x-1 text-xs font-normal text-gray-700'>
<div className='w-0 grow flex items-center space-x-1'>
<Variable02 className='shrink-0 w-3.5 h-3.5 text-primary-500' />
<span className='w-0 grow truncate text-xs font-normal text-gray-700'>{variable.variable}</span>
</div>
<div className='ml-1 flex items-center space-x-1'>
{variable.required && <span className='text-xs font-normal text-gray-500 uppercase'>{t(`${i18nPrefix}.required`)}</span>}
<InputVarTypeIcon type={variable.type} className='w-3 h-3 text-gray-500' />
</div>
</div>
))}
</div>
</div>
)
}

5
web/app/components/workflow/nodes/start/types.ts Normal file
View File

@ -0,0 +1,5 @@
import type { CommonNodeType, InputVar } from '@/app/components/workflow/types'
export type StartNodeType = CommonNodeType & {
variables: InputVar[]
}

20
web/app/components/workflow/types.ts
View File

@ -36,6 +36,26 @@ export type Variable = {
value_selector: ValueSelector
}
export enum InputVarType {
textInput = 'text-input',
paragraph = 'paragraph',
select = 'select',
number = 'number',
url = 'url',
files = 'files',
}
export type InputVar = {
type: InputVarType
label: string
variable: string
max_length?: number
default?: string
required: boolean
hint?: string
options?: string[]
}
export type ModelConfig = {
provider: string
name: string

3
web/i18n/lang/workflow.en.ts
View File

@ -4,6 +4,9 @@ const translation = {
outputVars: 'Output Variables',
insertVarTip: 'Insert Variable',
},
start: {
required: 'required',
},
directAnswer: {
answer: 'Answer',
inputVars: 'Input Variables',

3
web/i18n/lang/workflow.zh.ts
View File

@ -4,6 +4,9 @@ const translation = {
outputVars: '输出变量',
insertVarTip: '插入变量',
},
start: {
required: '必填',
},
directAnswer: {
answer: '回复',
inputVars: '输入变量',