Skip to content

fix: Add result response to tool workflow #4943

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
shaohuzhang1 merged 1 commit into from
Mar 25, 2026
Merged

fix: Add result response to tool workflow #4943

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 16 additions & 2 deletions ui/src/workflow/nodes/ai-chat-node/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -144,7 +144,14 @@
/>
</el-form-item>
<el-form-item
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex-between">
Expand Down Expand Up @@ -449,7 +456,14 @@
</el-form-item>
<el-form-item
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Copy link
Copy Markdown
Contributor Author

@shaohuzhang1 shaohuzhang1 Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The code looks mostly correct, but there are a few things to improve:

  1. Redundant WorkflowModes: You have duplicated WorkflowMode checks in multiple places throughout the component. This can make the code less readable and potentially harder to maintain.

  2. Variable Naming Conflicts: There is a conflict with the variable name workflowMode. Ensure that this variable is unique and does not collide with any other variables in your project.

  3. Code Formatting: The use of single quotation marks '...' could lead to syntax errors if used as strings in an array like [...].includes(...). Ensure consistent usage of either double quotes " or backticks depending on your preference.

Below is the refactored code with these considerations addressed:

<el-form-item
  v-if="[
    WorkflowMode.Application,
    WorkflowMode.ApplicationLoop,
    WorkflowMode.Tool,
    WorkflowMode.ToolLoop,
  ].includes(modifiedWorkflowMode)"
>
  <template #label>
    <div class="flex-between">
      <!-- Item label content -->
    </div>
  </template>
</el-form-item>

<!-- Other el-form-item components -->

<script setup lang="ts">
import { WorkflowMode } from "@/utils/enum"; // Make sure to import the enum

let modifiedWorkflowMode = workflowMode; // Rename or change variable if needed
</script>

Key Improvements Made:

  • Unique Variable Name: Changed workflowMode to modifiedWorkflowMode.
  • Consistent Quotation Marks: Used double quotes for string literals.
  • Removed Redundancies: Combined duplicate WorkflowMode checks into one location (assuming you meant to modify modifiedWorkflowMode).

These changes should make the code more clean and easier to understand while maintaining its functionality.

Expand Down
9 changes: 8 additions & 1 deletion ui/src/workflow/nodes/image-generate/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,14 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Expand Down
9 changes: 8 additions & 1 deletion ui/src/workflow/nodes/image-to-video/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -162,7 +162,14 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Expand Down
18 changes: 16 additions & 2 deletions ui/src/workflow/nodes/image-understand/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,14 @@
/>
</el-form-item>
<el-form-item
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex-between">
Expand Down Expand Up @@ -165,7 +172,14 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Copy link
Copy Markdown
Contributor Author

@shaohuzhang1 shaohuzhang1 Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The code you've provided is well-written and appears to be a Vue component rendering an ECharts chart within a form using Element Plus library. This component checks for different workflow modes (Application, ApplicationLoop, Tool, and ToolLoop) to decide whether certain elements should be displayed based on the mode.

Here are some minor optimizations and points that might improve readability:

  1. Consolidate Array Definition: The array of_workflowModes definition can be moved outside or inside the template if it's needed in multiple places.

    const _workflowModes = [
   WorkflowMode.Application,
   WorkflowMode.ApplicationLoop,
   WorkflowMode.Tool,
   WorkflowMode.ToolLoop,
];

  2. Arrow Function for Template Slot Label:
    Using arrow functions within templates can sometimes make the syntax less verbose while maintaining readability.

    <template slot-scope="{ label }">{{ label }}</template>

    However, since this isn't actually used here (as demonstrated by the comment above), it doesn't need adjustment.

  3. Ensure Proper Component Usage: Ensure all necessary components are imported at the top of your file. For example, if 'WorkflowMode' is defined elsewhere in your project scope, import it accordingly.

    import { defineComponent, ref } from 'vue';
import { WorkflowMode } from './utils'; // Example path

Overall, the current implementation follows best practices and has no immediate issues or irregularities. If there are specific parts of the codebase that require further analysis or adjustments due to context-specific requirements (such as internationalization support or additional functionality not mentioned), please provide more details so I can offer targeted recommendations.

Expand Down
9 changes: 8 additions & 1 deletion ui/src/workflow/nodes/question-node/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,14 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Expand Down
9 changes: 8 additions & 1 deletion ui/src/workflow/nodes/reply-node/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,14 @@
/>
</el-form-item>
<el-form-item
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
>
Expand Down
9 changes: 8 additions & 1 deletion ui/src/workflow/nodes/speech-to-text-node/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,14 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Expand Down
9 changes: 8 additions & 1 deletion ui/src/workflow/nodes/text-to-speech-node/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,14 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Expand Down
9 changes: 8 additions & 1 deletion ui/src/workflow/nodes/text-to-video/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,14 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Expand Down
13 changes: 9 additions & 4 deletions ui/src/workflow/nodes/tool-lib-node/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,14 +73,19 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
<div class="mr-4">
<span>{{
$t('workflow.nodes.aiChatNode.returnContent.label')
}}</span>
<span>{{ $t('workflow.nodes.aiChatNode.returnContent.label') }}</span>
</div>
<el-tooltip effect="dark" placement="right" popper-class="max-w-200">
<template #content>
Expand Down
9 changes: 8 additions & 1 deletion ui/src/workflow/nodes/tool-node/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,14 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Expand Down
18 changes: 16 additions & 2 deletions ui/src/workflow/nodes/video-understand/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,14 @@
/>
</el-form-item>
<el-form-item
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex-between">
Expand Down Expand Up @@ -164,7 +171,14 @@
<el-form-item
:label="$t('workflow.nodes.aiChatNode.returnContent.label')"
@click.prevent
v-if="[WorkflowMode.Application, WorkflowMode.ApplicationLoop].includes(workflowMode)"
v-if="
[
WorkflowMode.Application,
WorkflowMode.ApplicationLoop,
WorkflowMode.Tool,
WorkflowMode.ToolLoop,
].includes(workflowMode)
"
>
<template #label>
<div class="flex align-center">
Copy link
Copy Markdown
Contributor Author

@shaohuzhang1 shaohuzhang1 Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

Potential Issues:

  1. Redundant if Condition:

    • The current v-if condition includes checks for both Application and ApplicationLoop, which might be redundant depending on your use case.

  2. Inclusive Array:

    • The array [ WorkflowMode.Application, WorkflowMode.ApplicationLoop, WorkflowMode.Tool, WorkflowMode.ToolLoop ] is inclusive of all modes listed, but ensuring that each mode type should not overlap if they behave differently under these conditions seems unnecessary.

  3. Consistent Labels and Structure:

    • Ensure that the label structures are consistent across different sections to maintain consistency in user interface design.

  4. Accessibility Considerations:

    • Make sure that the form items with labels include accessible attributes like aria-label or title if necessary.

Optimization Suggestions:

  • Code Simplification:

    v-if="WorkflowMode.includes(WorkflowMode.Application) || WorkflowMode.includes(WorkflowMode.AppleTool)"

    Adjust this based on whether you want to consider multiple Application-related modes (loop vs non-loop).

  • Avoid Redundancy:
    Ensure that similar logic isn't repeated across forms; instead, encapsulate it in reusable components for better maintainability.

  • Documentation:
    Add comments explaining why certain conditions are included or omitted from the list.

By addressing these points, you can improve the readability and efficiency of your code while maintaining functionality.

Expand Down
Loading