mirror of https://github.com/langgenius/dify.git
feat: http node struct
This commit is contained in:
Joel
parent
8b8fdb48bb
commit
9bb9807252
|
|
@ -46,9 +46,9 @@ const Page: FC = () => {
|
|||
/*
|
||||
* TODO: for debug.
|
||||
* 2 directAnswer 3: llm 5: questionClassifier
|
||||
* 7 Code, 8 TemplateTransform
|
||||
* 7 Code, 8 TemplateTransform 9 http
|
||||
*/
|
||||
selectedNodeId='7'
|
||||
selectedNodeId='9'
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,25 @@
|
|||
import type { HttpNodeType } from './types'
|
||||
|
||||
export const mockData: HttpNodeType = {
|
||||
title: 'Test',
|
||||
desc: 'Test',
|
||||
type: 'Test',
|
||||
variables: [
|
||||
{
|
||||
variable: 'name',
|
||||
value_selector: ['aaa', 'name'],
|
||||
},
|
||||
{
|
||||
variable: 'age',
|
||||
value_selector: ['bbb', 'b', 'c'],
|
||||
},
|
||||
],
|
||||
method: 'get',
|
||||
url: 'https://api.dify.com/xx',
|
||||
headers: '',
|
||||
params: '',
|
||||
body: {
|
||||
type: 'json',
|
||||
data: '',
|
||||
},
|
||||
}
|
||||
|
|
@ -1,8 +1,84 @@
|
|||
import type { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import useConfig from './use-config'
|
||||
import { mockData } from './mock'
|
||||
import VarList from '@/app/components/workflow/nodes/_base/components/variable/var-list'
|
||||
import Field from '@/app/components/workflow/nodes/_base/components/field'
|
||||
import AddButton from '@/app/components/base/button/add-button'
|
||||
import Split from '@/app/components/workflow/nodes/_base/components/split'
|
||||
import OutputVars, { VarItem } from '@/app/components/workflow/nodes/_base/components/output-vars'
|
||||
|
||||
const i18nPrefix = 'workflow.nodes.http'
|
||||
|
||||
const Panel: FC = () => {
|
||||
const { t } = useTranslation()
|
||||
const readOnly = false
|
||||
|
||||
const {
|
||||
inputs,
|
||||
handleVarListChange,
|
||||
handleAddVariable,
|
||||
} = useConfig(mockData)
|
||||
|
||||
return (
|
||||
<div>start panel inputs</div>
|
||||
<div className='mt-2'>
|
||||
<div className='px-4 pb-4 space-y-4'>
|
||||
<Field
|
||||
title={t(`${i18nPrefix}.inputVars`)}
|
||||
operations={
|
||||
<AddButton onClick={handleAddVariable} />
|
||||
}
|
||||
>
|
||||
<VarList
|
||||
readonly={readOnly}
|
||||
list={inputs.variables}
|
||||
onChange={handleVarListChange}
|
||||
/>
|
||||
</Field>
|
||||
<Field
|
||||
title={t(`${i18nPrefix}.api`)}
|
||||
>
|
||||
API
|
||||
</Field>
|
||||
<Field
|
||||
title={t(`${i18nPrefix}.headers`)}
|
||||
>
|
||||
headers
|
||||
</Field>
|
||||
<Field
|
||||
title={t(`${i18nPrefix}.params`)}
|
||||
>
|
||||
params
|
||||
</Field>
|
||||
<Field
|
||||
title={t(`${i18nPrefix}.body`)}
|
||||
>
|
||||
body
|
||||
</Field>
|
||||
</div>
|
||||
<Split />
|
||||
<div className='px-4 pt-4 pb-2'>
|
||||
<OutputVars>
|
||||
<>
|
||||
<VarItem
|
||||
name='body'
|
||||
type='string'
|
||||
description={t(`${i18nPrefix}.outputVars.body`)}
|
||||
/>
|
||||
<VarItem
|
||||
name='status_code'
|
||||
type='string'
|
||||
description={t(`${i18nPrefix}.outputVars.statusCode`)}
|
||||
/>
|
||||
<VarItem
|
||||
name='headers'
|
||||
type='sting'
|
||||
description={t(`${i18nPrefix}.outputVars.headers`)}
|
||||
/>
|
||||
</>
|
||||
</OutputVars>
|
||||
</div>
|
||||
</div >
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,13 @@
|
|||
import type { CommonNodeType, Variable } from '@/app/components/workflow/types'
|
||||
|
||||
export type HttpNodeType = CommonNodeType & {
|
||||
variables: Variable[]
|
||||
method: string
|
||||
url: string
|
||||
headers: string
|
||||
params: string
|
||||
body: {
|
||||
type: string
|
||||
data: string
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
import { useState } from 'react'
|
||||
import useVarList from '../_base/hooks/use-var-list'
|
||||
import type { HttpNodeType } from './types'
|
||||
|
||||
const useConfig = (initInputs: HttpNodeType) => {
|
||||
const [inputs, setInputs] = useState<HttpNodeType>(initInputs)
|
||||
|
||||
const { handleVarListChange, handleAddVariable } = useVarList<HttpNodeType>({
|
||||
inputs,
|
||||
setInputs,
|
||||
})
|
||||
|
||||
return {
|
||||
inputs,
|
||||
handleVarListChange,
|
||||
handleAddVariable,
|
||||
}
|
||||
}
|
||||
|
||||
export default useConfig
|
||||
|
|
@ -107,7 +107,6 @@ const Panel: FC = () => {
|
|||
</>
|
||||
</OutputVars>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,6 +19,18 @@ const translation = {
|
|||
usage: 'Model Usage Information',
|
||||
},
|
||||
},
|
||||
http: {
|
||||
inputVars: 'Input Variables',
|
||||
api: 'API',
|
||||
headers: 'Headers',
|
||||
params: 'Params',
|
||||
body: 'Body',
|
||||
outputVars: {
|
||||
body: 'Response Content',
|
||||
statusCode: 'Response Status Code',
|
||||
headers: 'Response Header List JSON',
|
||||
},
|
||||
},
|
||||
code: {
|
||||
inputVars: 'Input Variables',
|
||||
outputVars: 'Output Variables',
|
||||
|
|
|
|||
|
|
@ -19,6 +19,18 @@ const translation = {
|
|||
usage: '模型用量信息',
|
||||
},
|
||||
},
|
||||
http: {
|
||||
inputVars: '输入变量',
|
||||
api: 'API',
|
||||
headers: '响应头',
|
||||
params: '参数',
|
||||
body: '响应内容',
|
||||
outputVars: {
|
||||
body: '响应内容',
|
||||
statusCode: '响应状态码',
|
||||
headers: '响应头列表 JSON',
|
||||
},
|
||||
},
|
||||
code: {
|
||||
inputVars: '输入变量',
|
||||
outputVars: '输出变量',
|
||||
|
|
|
|||
Loading…
Reference in New Issue