fix(图片): 记录弹窗图片从页面跳转改为点击放大预览

- TaskFlowView 记录图片 window.open 跳转 → antd Image.PreviewGroup 点击放大
- 与人员看板/效能分析的图片查看模式全局统一
This commit is contained in:
2026-08-28 11:33:46 +08:00
parent 1bb93e0a5f
commit 88f02cbdcf

View File

@ -2,6 +2,7 @@
* 流转树双模式可视化 — 焦点模式 + 全景模式
*/
import { memo, useMemo, useState, useEffect } from "react";
import { Image } from "antd";
import { FileText, X } from "lucide-react";
import type { TaskResponse } from "../../types/api";
import { TASK_STATUS } from "../../types/api";
@ -288,7 +289,11 @@ export const TaskFlowView = memo(function TaskFlowView({ tasks, onAction, curren
<div className={`mt-1.5 h-2 w-2 shrink-0 rounded-full ${i === 0 ? "bg-blue-500" : "bg-gray-300"}`} />
<div className="flex-1 rounded bg-gray-50 px-3 py-2"><p className={`text-gray-400 ${size === "lg" ? "text-xs" : "text-[10px]"}`}>{fmtTime(r.created_at)}</p>
{r.remark && <p className={`mt-0.5 text-gray-700 ${size === "lg" ? "text-sm" : "text-xs"}`}>{r.remark}</p>}
{(() => { const imgs = parseImages(r.images); if (!imgs.length) return null; return <div className="mt-1 flex gap-1 flex-wrap">{imgs.map((img, j) => <img key={j} src={imageUrl(img)} className={`rounded border object-cover cursor-pointer hover:opacity-80 transition-opacity ${size === "lg" ? "h-24 w-24" : "h-14 w-14"}`} onClick={() => window.open(imageUrl(img))} />)}</div>; })()}
{(() => { const imgs = parseImages(r.images); if (!imgs.length) return null; return (
<Image.PreviewGroup>
<div className="mt-1 flex gap-1 flex-wrap">{imgs.map((img, j) => <Image key={j} src={imageUrl(img)} width={size === "lg" ? 96 : 56} height={size === "lg" ? 96 : 56} className="rounded border object-cover" style={{ objectFit: "cover" }} />)}</div>
</Image.PreviewGroup>
); })()}
</div>
</div>
))}</div>}