feat: 简化工作流可视化,直接显示工作流截图
- 移除图片/iframe切换功能,仅保留静态图片显示 - 移除showWorkflowImage状态变量 - 图片完整贴合容器四边,使用object-cover样式 - 添加工作流可视化截图(workflow-visualization.jpeg)
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 268 KiB |
@@ -957,7 +957,7 @@ const WorkflowPageV4 = () => {
|
|||||||
// setShowResultModal(false);
|
// setShowResultModal(false);
|
||||||
|
|
||||||
// 在新标签页中打开详情页面
|
// 在新标签页中打开详情页面
|
||||||
const baseUrl = 'http://localhost:4155';
|
const baseUrl = 'http://192.168.2.9:4155';
|
||||||
|
|
||||||
if (selectedOrderClass) {
|
if (selectedOrderClass) {
|
||||||
// 根据订单班 ID 映射到对应的路径
|
// 根据订单班 ID 映射到对应的路径
|
||||||
@@ -1127,13 +1127,26 @@ const WorkflowPageV4 = () => {
|
|||||||
<Maximize2 className="w-4 h-4 text-gray-600" />
|
<Maximize2 className="w-4 h-4 text-gray-600" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex-1">
|
<div className="flex-1 relative">
|
||||||
<iframe
|
{/* 工作流效果图 */}
|
||||||
src="http://localhost:5678/workflow/"
|
<div className="absolute inset-0 bg-gray-50">
|
||||||
// src="http://localhost:5678/workflow/XbfF8iRI4a69hmYS"
|
<img
|
||||||
className="w-full h-full border-0"
|
src="/images/workflow-visualization.jpeg"
|
||||||
title="n8n Workflow"
|
alt="工作流可视化效果图"
|
||||||
/>
|
className="w-full h-full object-cover"
|
||||||
|
onError={(e) => {
|
||||||
|
// 如果图片加载失败,显示占位符
|
||||||
|
e.currentTarget.style.display = 'none';
|
||||||
|
const parent = e.currentTarget.parentElement;
|
||||||
|
if (parent) {
|
||||||
|
const placeholder = document.createElement('div');
|
||||||
|
placeholder.className = 'text-center text-gray-400 flex items-center justify-center h-full';
|
||||||
|
placeholder.innerHTML = '<p>工作流效果图加载失败</p>';
|
||||||
|
parent.appendChild(placeholder);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user