77530c49f8
- 为agent.json添加apiUrl、apiKey、apiModel字段支持 - 更新API接口类型定义，支持传递自定义API配置 - 优化AgentRepoList组件UI样式和交互效果 - 增强JSON文件上传校验逻辑，支持API配置验证 - 改进任务结果页面布局和视觉呈现 - 添加任务过程查看抽屉功能 - 实现执行按钮动态样式和悬停效果 - 优化节点连接线渲染逻辑和性能
106 lines
2.4 KiB
Vue
106 lines
2.4 KiB
Vue
<script setup lang="ts">
|
|
import type { IExecuteRawResponse } from '@/api'
|
|
import { computed } from 'vue'
|
|
import MarkdownIt from 'markdown-it'
|
|
import DOMPurify from 'dompurify'
|
|
import Iod from './Iod.vue'
|
|
|
|
const props = defineProps<{
|
|
executePlans: IExecuteRawResponse[]
|
|
nodeId?: string
|
|
actionId?: string
|
|
}>()
|
|
|
|
const md = new MarkdownIt({
|
|
html: true,
|
|
linkify: true,
|
|
typographer: true,
|
|
breaks: true
|
|
})
|
|
|
|
function sanitize(str?: string) {
|
|
if (!str) {
|
|
return ''
|
|
}
|
|
const cleanStr = str.replace(/\\n/g, '\n').replace(/\n\s*\d+\./g, '\n$&')
|
|
const html = md.render(cleanStr)
|
|
return html
|
|
// return DOMPurify.sanitize(html)
|
|
}
|
|
|
|
interface Data {
|
|
Description: string
|
|
Content: string
|
|
LogNodeType: string
|
|
}
|
|
const data = computed<Data | null>(() => {
|
|
for (const result of props.executePlans) {
|
|
if (result.NodeId === props.nodeId) {
|
|
// LogNodeType 为 object直接渲染Content
|
|
if (result.LogNodeType === 'object') {
|
|
return {
|
|
Description: props.nodeId,
|
|
Content: sanitize(result.content),
|
|
LogNodeType: result.LogNodeType
|
|
}
|
|
}
|
|
|
|
if (!result.ActionHistory) {
|
|
return null
|
|
}
|
|
|
|
for (const action of result.ActionHistory) {
|
|
if (action.ID === props.actionId) {
|
|
return {
|
|
Description: action.Description,
|
|
Content: sanitize(action.Action_Result),
|
|
LogNodeType: result.LogNodeType
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
return null
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="data" class="card-item w-full pl-[56px] pr-[41px]">
|
|
<!-- 分割线 -->
|
|
<div v-if="data.LogNodeType !== 'object'" class="h-[1px] w-full bg-[#494B51] my-[8px]"></div>
|
|
<div
|
|
v-if="data.Description"
|
|
class="text-[16px] flex items-center gap-1 text-[var(--color-text-secondary)] mb-1"
|
|
>
|
|
{{ data.Description }}
|
|
<Iod v-if="data.LogNodeType !== 'object'" />
|
|
</div>
|
|
<div
|
|
class="rounded-[8px] p-[15px] text-[14px] bg-[var(--color-bg-result-detail)] text-[var(--color-text-detail)]"
|
|
>
|
|
<div
|
|
class="markdown-content max-h-[240px] overflow-y-auto max-w-full"
|
|
v-html="data.Content"
|
|
></div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
.card-item + .card-item {
|
|
margin-top: 10px;
|
|
}
|
|
.markdown-content {
|
|
:deep(code) {
|
|
display: block;
|
|
width: 100px;
|
|
max-width: 100%;
|
|
}
|
|
|
|
:deep(pre) {
|
|
overflow-x: auto;
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
</style>
|