opensource
/
dify
mirror of https://github.com/langgenius/dify.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

chore: can show popup

This commit is contained in:
Joel 2025-08-22 16:59:04 +08:00
parent a41176b66d
commit baa77d3cda
8 changed files with 29 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
web/app/components/base/prompt-editor/index.tsx
View File

@ -271,6 +271,7 @@ const PromptEditor: FC<PromptEditorProps> = ({
<>
<HITLInputBlock />
<HITLInputBlockReplacementBlock
nodeId={hitlInputBlock.nodeId}
nodeTitle={hitlInputBlock.nodeTitle}
formInputs={hitlInputBlock.formInputs}
onFormInputsChange={hitlInputBlock.onFormInputsChange}

3
web/app/components/base/prompt-editor/plugins/hitl-input-block/component-ui.tsx
View File

@ -14,6 +14,7 @@ import { useBoolean } from 'ahooks'
import Modal from '../../../modal'
type Props = {
nodeId: string
nodeTitle: string
varName: string
isSelected: boolean
@ -24,6 +25,7 @@ type Props = {
}
const ComponentUI: FC<Props> = ({
nodeId,
nodeTitle,
varName,
// isSelected,
@ -129,6 +131,7 @@ const ComponentUI: FC<Props> = ({
className='max-w-[372px] !p-0'
>
<InputField
nodeId={nodeId}
isEdit
payload={formInput}
onChange={handleChange}

3
web/app/components/base/prompt-editor/plugins/hitl-input-block/component.tsx
View File

@ -7,6 +7,7 @@ import produce from 'immer'
type Props = {
nodeKey: string
nodeId: string
nodeTitle: string
varName: string
formInputs?: FormInputItem[]
@ -17,6 +18,7 @@ type Props = {
const HITLInputComponent: FC<Props> = ({
nodeKey,
nodeId,
nodeTitle,
varName,
formInputs = [],
@ -45,6 +47,7 @@ const HITLInputComponent: FC<Props> = ({
className='w-full pb-1 pt-3'
>
<ComponentUi
nodeId={nodeId}
nodeTitle={nodeTitle}
varName={varName}
isSelected={isSelected}

2
web/app/components/base/prompt-editor/plugins/hitl-input-block/hitl-input-block-replacement-block.tsx
View File

@ -20,6 +20,7 @@ const REGEX = new RegExp(HITL_INPUT_REG)
const HITLInputReplacementBlock = ({
// onInsert,
nodeId,
nodeTitle,
formInputs,
onFormInputsChange,
@ -37,6 +38,7 @@ const HITLInputReplacementBlock = ({
const varName = textNode.getTextContent().split('.')[1].replace(/#}}$/, '')
return $applyNodeReplacement($createHITLInputNode(
varName,
nodeId,
nodeTitle,
formInputs || [],
onFormInputsChange!,

15
web/app/components/base/prompt-editor/plugins/hitl-input-block/node.tsx
View File

@ -5,6 +5,7 @@ import type { FormInputItem } from '@/app/components/workflow/nodes/human-input/
export type SerializedNode = SerializedLexicalNode & {
variableName: string
nodeId: string
nodeTitle: string
formInputs: FormInputItem[]
onFormInputsChange: (inputs: FormInputItem[]) => void
@ -14,6 +15,7 @@ export type SerializedNode = SerializedLexicalNode & {
export class HITLInputNode extends DecoratorNode<React.JSX.Element> {
__variableName: string
__nodeId: string
__nodeTitle: string
__formInputs?: FormInputItem[]
__onFormInputsChange: (inputs: FormInputItem[]) => void
@ -42,6 +44,11 @@ export class HITLInputNode extends DecoratorNode<React.JSX.Element> {
return self.__nodeTitle
}
getNodeId(): string {
const self = this.getLatest()
return self.__nodeId
}
getFormInputs(): FormInputItem[] {
const self = this.getLatest()
return self.__formInputs || []
@ -65,6 +72,7 @@ export class HITLInputNode extends DecoratorNode<React.JSX.Element> {
static clone(node: HITLInputNode): HITLInputNode {
return new HITLInputNode(
node.__variableName,
node.__nodeId,
node.__nodeTitle,
node.__formInputs || [],
node.__onFormInputsChange,
@ -80,6 +88,7 @@ export class HITLInputNode extends DecoratorNode<React.JSX.Element> {
constructor(
varName: string,
nodeId: string,
nodeTitle: string,
formInputs: FormInputItem[],
onFormInputsChange: (inputs: FormInputItem[]) => void,
@ -90,6 +99,7 @@ export class HITLInputNode extends DecoratorNode<React.JSX.Element> {
super(key)
this.__variableName = varName
this.__nodeId = nodeId
this.__nodeTitle = nodeTitle
this.__formInputs = formInputs
this.__onFormInputsChange = onFormInputsChange
@ -111,6 +121,7 @@ export class HITLInputNode extends DecoratorNode<React.JSX.Element> {
return <HILTInputBlockComponent
nodeKey={this.getKey()}
varName={this.getVariableName()}
nodeId={this.getNodeId()}
nodeTitle={this.getNodeTitle()}
formInputs={this.getFormInputs()}
onChange={this.getOnFormInputsChange()}
@ -122,6 +133,7 @@ export class HITLInputNode extends DecoratorNode<React.JSX.Element> {
static importJSON(serializedNode: SerializedNode): HITLInputNode {
const node = $createHITLInputNode(
serializedNode.variableName,
serializedNode.nodeId,
serializedNode.nodeTitle,
serializedNode.formInputs,
serializedNode.onFormInputsChange,
@ -137,6 +149,7 @@ export class HITLInputNode extends DecoratorNode<React.JSX.Element> {
type: 'hitl-input-block',
version: 1,
variableName: this.getVariableName(),
nodeId: this.getNodeId(),
nodeTitle: this.getNodeTitle(),
formInputs: this.getFormInputs(),
onFormInputsChange: this.getOnFormInputsChange(),
@ -152,6 +165,7 @@ export class HITLInputNode extends DecoratorNode<React.JSX.Element> {
export function $createHITLInputNode(
variableName: string,
nodeId: string,
nodeTitle: string,
formInputs: FormInputItem[],
onFormInputsChange: (inputs: FormInputItem[]) => void,
@ -160,6 +174,7 @@ export function $createHITLInputNode(
): HITLInputNode {
return new HITLInputNode(
variableName,
nodeId,
nodeTitle,
formInputs,
onFormInputsChange,

5
web/app/components/base/prompt-editor/plugins/hitl-input-block/pre-populate.tsx
View File

@ -59,6 +59,7 @@ const PrePopulate: FC<Props> = ({
value={valueSelector || []}
onChange={onValueSelectorChange!}
readonly={false}
zIndex={1000}
/>
)
}
@ -72,9 +73,9 @@ const PrePopulate: FC<Props> = ({
return (
<div>
{main}
<div className={cn('flex space-x-1 text-text-tertiary')}>
<div className={cn('flex items-center space-x-1 text-text-tertiary')} onClick={() => onIsVariableChange?.(!isVariable)}>
<Variable02 className='size-3.5' />
<div>{t(`${i18nPrefix}.useVarInstead`)}</div>
<div className='system-xs-medium'>{t(`${i18nPrefix}.useVarInstead`)}</div>
</div>
</div>
)

1
web/app/components/base/prompt-editor/types.ts
View File

@ -80,6 +80,7 @@ export type WorkflowVariableBlockType = {
export type HITLInputBlockType = {
show?: boolean
nodeId: string
nodeTitle: string
formInputs?: FormInputItem[]
onFormInputsChange?: (inputs: FormInputItem[]) => void

1
web/app/components/workflow/nodes/human-input/components/form-content.tsx
View File

@ -53,6 +53,7 @@ const FormContent: FC<Props> = ({
hitlInputBlock={{
show: true,
formInputs,
nodeId,
nodeTitle,
onFormInputsChange,
onFormInputItemRename,