Skip to content

Commit 5e0ee59

Browse files
wangdan-fit2cloudwangdan-fit2cloud
committed
feat: ExecutionDetail
1 parent dcec864 commit 5e0ee59

56 files changed

Lines changed: 729 additions & 1169 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎ui/AGENTS.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ ui/
7474
│ │ ├── component/ # Reusable workflow canvas UI
7575
│ │ ├── config/ # Maintainable node data, menus, mappings, and constants
7676
│ │ ├── core/ # Stable canvas behavior and shared node infrastructure
77-
│ │ ├── details/ # Node execution detail dispatch and shared presentation
77+
│ │ ├── Execution-details/ # Node execution detail dispatch and shared presentation
7878
│ │ ├── icons/ # Workflow node icons
7979
│ │ ├── node-menu/ # Basic, tool, and application node selection menus
8080
│ │ ├── nodes/ # Workflow node definitions and components

‎ui/src/api/types/tool.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -170,8 +170,8 @@ export interface ToolWorkflowRecord {
170170
meta: {
171171
output?: unknown
172172
details?:
173-
| import('@/workflow-canvas/details/types').ExecutionNodeDetail[]
174-
| Record<string, import('@/workflow-canvas/details/types').ExecutionNodeDetail>
173+
| import('@/workflow-canvas/Execution-details/types').ExecutionNodeDetail[]
174+
| Record<string, import('@/workflow-canvas/Execution-details/types').ExecutionNodeDetail>
175175
}
176176
}
177177

‎ui/src/components/global/markdown-editor/md-editor.scss‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -97,6 +97,8 @@
9797

9898
p {
9999
padding: 0 !important;
100+
margin: 0 !important;
101+
line-height: 22px !important;
100102
}
101103

102104
sup[data-title] {
@@ -144,6 +146,12 @@
144146
}
145147
}
146148

149+
/* Markdown 预览模式 */
150+
.mk-markdown-editor.md-editor-previewOnly {
151+
height: auto !important;
152+
background: transparent !important;
153+
}
154+
147155
/* 上标说明浮层由 sup-popover.ts 挂载到 body，使用独立类名限定范围。 */
148156
.markdown-sup-popover {
149157
background: var(--el-bg-color-overlay);

‎ui/src/conversation-panel/content/items/form.vue‎

Lines changed: 5 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<template>
22
<div class="content-form">
3-
<MdPreview class="!h-auto" editorId="conversation-text" :modelValue="leadingText|| ''"></MdPreview>
3+
<MdPreview class="!h-auto" editorId="conversation-text" :modelValue="leadingText || ''"></MdPreview>
44
<MkDynamicsForm ref="dynamicsFormRef" :view="is_submit" :render-data="form_field_list" v-model="form_data" />
5-
<MdPreview class="!h-auto" editorId="conversation-text" :modelValue="trailingText|| ''"></MdPreview>
5+
<MdPreview class="!h-auto" editorId="conversation-text" :modelValue="trailingText || ''"></MdPreview>
66
<el-button :type="is_submit ? 'info' : 'primary'" :disabled="is_submit" @click="submit">
77
{{ is_submit ? '已提交' : '提交' }}
88
</el-button>
@@ -19,10 +19,10 @@ const sendMessage = inject<(opts: any) => void>('sendMessage')
1919
const props = defineProps<{
2020
content: any
2121
}>()
22-
const form_content_format=computed(()=>props.content.form_content_format)
22+
const form_content_format = computed(() => props.content.form_content_format)
2323
const _submit = ref(false)
2424
const form_field_list = computed(() => props.content.form_field_list || [])
25-
const [leadingText, trailingText] = form_content_format.value.split('{{form}}').map(s => s.trim());
25+
const [leadingText, trailingText] = form_content_format.value.split('{{form}}').map((s) => s.trim())
2626
2727
const is_submit = computed(() => _submit.value || !!props.content.is_submit)
2828
const _form_data = ref<any>({})
@@ -56,14 +56,4 @@ const submit = async () => {
5656
}
5757
</script>
5858

59-
<style scoped lang="scss">
60-
.content-form {
61-
background: #ffffff;
62-
border: 1px solid var(--el-border-color-lighter, #e4e7ed);
63-
border-radius: 8px;
64-
padding: 16px;
65-
max-width: 100%;
66-
box-sizing: border-box;
67-
overflow: hidden;
68-
}
69-
</style>
59+
<style scoped lang="scss"></style>

‎ui/src/views/details-demo/index.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script setup lang="ts">
22
import { ref } from 'vue'
3-
import ExecutionDetailContent from '@/workflow-canvas/details/index.vue'
3+
import ExecutionDetailContent from '@/workflow-canvas/Execution-details/index.vue'
44
import { WorkflowMode, WorkflowNodeType } from '@/workflow-canvas/types'
5-
import type { ExecutionNodeDetail } from '@/workflow-canvas/details/types'
5+
import type { ExecutionNodeDetail } from '@/workflow-canvas/Execution-details/types'
66
77
defineOptions({ name: 'DetailsDemo' })
88

‎ui/src/views/workflow/knowledge/debug/action/Result.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
import { computed, onUnmounted, ref, watch } from 'vue'
33
import KnowledgeWorkflowApi from '@/api/admin/workspace/knowledge/workflow'
44
import type { KnowledgeWorkflowAction } from '@/api/types'
5-
import ExecutionDetailContent from '@/workflow-canvas/details/index.vue'
6-
import type { ExecutionNodeDetail } from '@/workflow-canvas/details/types'
5+
import ExecutionDetailContent from '@/workflow-canvas/Execution-details/index.vue'
6+
import type { ExecutionNodeDetail } from '@/workflow-canvas/Execution-details/types'
77
import { WorkflowMode } from '@/workflow-canvas/types'
88
99
defineOptions({ name: 'DebugResult' })

‎ui/src/views/workflow/tool/debug/DebugDrawer.vue‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,8 @@ function open(graph: LogicFlow.GraphData) {
3939
4040
function fieldRules(field: ToolInputField): FormItemRule[] {
4141
return [
42+
// 必填规则覆盖 change、blur 和提交校验，避免 FormItem 自动补充无文案的 required 规则。
43+
{ required: field.is_required, message: '请输入' },
4244
{
4345
validator: (_rule, value, callback) => {
4446
if (field.type === 'array' || field.type === 'dict') {
@@ -53,7 +55,7 @@ function fieldRules(field: ToolInputField): FormItemRule[] {
5355
return
5456
}
5557
if (value === undefined || value === '') {
56-
callback(field.is_required ? new Error('请输入参数') : undefined)
58+
callback(field.is_required ? new Error('请输入') : undefined)
5759
return
5860
}
5961
callback()

‎ui/src/views/workflow/tool/debug/ResultDrawer.vue‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { MsgError } from '@/utils/message'
77
import { ConversationStream } from '@/conversation-panel/stream'
88
import { aggregators } from '@/conversation-panel'
99
import ContentList from '@/conversation-panel/content-list/index.vue'
10-
import ExecutionDetailContent from '@/workflow-canvas/details/index.vue'
10+
import ExecutionDetailContent from '@/workflow-canvas/Execution-details/index.vue'
1111
import { WorkflowMode } from '@/workflow-canvas/types'
1212
1313
defineOptions({ name: 'ToolWorkflowDebugResultDrawer' })
@@ -129,8 +129,8 @@ defineExpose({ open, close })
129129
<el-tab-pane label="输出" name="output">
130130
<h4 class="mk-title-decoration mb-4 mt-4">回复内容</h4>
131131

132-
<!-- // TODO: 回复内容 -->
133-
<el-card class="small whitespace-pre-wrap" shadow="never">
132+
<!-- // TODO: 回复内容 调样式-->
133+
<el-card class="small" shadow="never">
134134
<ContentList :content-list="blocks" />
135135
<div v-if="running">回答中...</div>
136136
</el-card>
@@ -152,7 +152,7 @@ defineExpose({ open, close })
152152
</el-tab-pane>
153153
<el-tab-pane label="执行详情" name="details">
154154
<!-- TODO 执行详情 -->
155-
<ExecutionDetailContent :detail="executionDetails" :workflow-mode="WorkflowMode.Tool"></ExecutionDetailContent>
155+
<ExecutionDetailContent class="mt-6" :detail="executionDetails" :workflow-mode="WorkflowMode.Tool"></ExecutionDetailContent>
156156
</el-tab-pane>
157157
</el-tabs>
158158
</MkDrawer>

ui/src/workflow-canvas/details/BaseHeader.vue renamed to ui/src/workflow-canvas/Execution-details/BaseHeader.vue

Lines changed: 9 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
<script setup lang="ts">
22
import { computed, type Component } from 'vue'
3-
import { CaretRight, CircleCheck, CircleClose, Loading } from '@element-plus/icons-vue'
3+
import { SuccessFilled, CircleCloseFilled, Loading } from '@element-plus/icons-vue'
4+
import { formatTokenNumber } from '@/utils/number'
45
import { iconComponent } from '@/workflow-canvas/icons/utils'
56
import type { ExecutionNodeDetail } from './types'
67
78
defineOptions({ name: 'BaseHeader' })
89
910
const props = defineProps<{
1011
data: ExecutionNodeDetail
11-
show?: boolean
1212
// 是否显示 tokens 由各节点自行决定；tokens 数值统一由 data 计算。
1313
showTokens?: boolean
1414
}>()
@@ -20,26 +20,18 @@ const tokenCount = computed(() => (props.data?.message_tokens || 0) + (props.dat
2020
</script>
2121

2222
<template>
23-
<div class="flex-between">
23+
<div class="flex-between w-full">
2424
<div class="flex items-center gap-2">
25-
<el-icon class="text-N600 transition-transform" :class="{ 'rotate-90': show }">
26-
<CaretRight />
27-
</el-icon>
2825
<component :is="nodeIconComponent" v-if="nodeIconComponent" :size="24" />
29-
<h4>{{ data.name }}</h4>
26+
<h6>{{ data.name }}</h6>
3027
</div>
3128
<div class="flex items-center gap-3 text-N600">
32-
<span v-if="showTokens">{{ tokenCount }} tokens</span>
29+
<span v-if="showTokens">{{ formatTokenNumber(tokenCount) }} tokens</span>
3330
<span v-if="!isRunning">{{ data?.run_time?.toFixed(2) || '0.00' }} s</span>
34-
<el-icon v-if="isSuccess" class="text-success" :size="16">
35-
<CircleCheck />
36-
</el-icon>
37-
<el-icon v-else-if="isRunning" class="is-loading text-primary" :size="16">
38-
<Loading />
39-
</el-icon>
40-
<el-icon v-else class="text-danger" :size="16">
41-
<CircleClose />
42-
</el-icon>
31+
32+
<MkIcon v-if="isSuccess" :icon="SuccessFilled" class="text-success!" />
33+
<MkIcon v-else-if="isRunning" :icon="Loading" class="is-loading" />
34+
<MkIcon v-else :icon="CircleCloseFilled" class="text-danger!" />
4335
</div>
4436
</div>
4537
</template>

ui/src/workflow-canvas/details/DetailContainer.vue renamed to ui/src/workflow-canvas/Execution-details/DetailContainer.vue

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -21,18 +21,18 @@ const showContent = computed(() => isSuccess.value || props.showContentOnError)
2121
</script>
2222

2323
<template>
24-
<el-card class="execution-detail-card mb-2" shadow="never" style="--el-card-padding: 8px 12px">
25-
<div class="cursor-pointer" @click="show = !show">
26-
<slot name="header" :show="show" />
27-
</div>
28-
<el-collapse-transition>
29-
<div v-if="show" class="mt-3 flex flex-col gap-2">
24+
<el-card shadow="never">
25+
<MkCollapse v-model:expanded="show" trigger-class="py-0!">
26+
<template #label>
27+
<slot name="header" />
28+
</template>
29+
<div v-if="show" class="mt-4 space-y-2">
3030
<slot v-if="showContent" />
31-
<div v-else class="overflow-hidden rounded-md bg-N100">
32-
<h5 class="px-3 py-2">错误日志</h5>
33-
<div class="border-t border-dashed px-3 py-2 text-N900">{{ data.err_message || '-' }}</div>
31+
<div v-else class="mk-gray-card py-2! rounded-xl!">
32+
<h6 class="mb-2">错误日志</h6>
33+
<div>{{ data.err_message || '-' }}</div>
3434
</div>
3535
</div>
36-
</el-collapse-transition>
36+
</MkCollapse>
3737
</el-card>
3838
</template>

0 commit comments

Comments
 (0)