auto-save 2026-05-13 14:27 (~4)

web/components/nodes/index.tsx

@@ -680,34 +680,38 @@ export function ImageGenNode({ data, selected }: any) {
         )}
       </NodeShell>
 
-      {/* Portal hover 大预览 — 视口居中 */}
-      {mounted && hoverKey && job && (() => {
-        const [fi, ei] = hoverKey.split("_")
+      {/* Portal hover 大预览 — 浮在缩略图上方 */}
+      {mounted && hover && job && (() => {
+        const [fi, ei] = hover.key.split("_")
         const frameIdx = parseInt(fi, 10)
         const p = elementCrops.find((x) => x.frameIdx === frameIdx && x.elementId === ei)
         if (!p) return null
+        const vidAspect = job.height > 0 ? job.height / job.width : 16 / 9
+        const maxH = Math.min(window.innerHeight * 0.7, hover.rect.top - 16)
+        const maxW = Math.min(window.innerWidth * 0.6, 600)
+        let h = maxH, w = h / vidAspect
+        if (w > maxW) { w = maxW; h = w * vidAspect }
+        const centerX = hover.rect.left + hover.rect.width / 2
+        const left = Math.max(12, Math.min(window.innerWidth - w - 12, centerX - w / 2))
         return createPortal(
           <div
-            className="fixed inset-0 z-[120] pointer-events-none flex items-center justify-center p-6"
-            style={{ animation: "drawer-in 0.18s cubic-bezier(0.32, 0.72, 0, 1)" }}
+            className="fixed z-[120] pointer-events-none"
+            style={{
+              top: hover.rect.top - h - 12,
+              left,
+              animation: "drawer-in 0.18s cubic-bezier(0.32, 0.72, 0, 1)",
+            }}
           >
-            <div className="absolute inset-0 bg-black/40 backdrop-blur-sm" />
-            <div className="relative rounded-2xl overflow-hidden border border-violet-300/40 bg-black" style={{ boxShadow: "0 50px 120px -10px rgba(0,0,0,0.9), 0 0 0 1px rgba(255,255,255,0.06)" }}>
+            <div className="rounded-2xl overflow-hidden border border-white/25 bg-black" style={{ boxShadow: "0 30px 80px -10px rgba(0,0,0,0.85), 0 0 0 1px rgba(255,255,255,0.06)" }}>
               <img
                 src={cutoutUrl(job.id, p.frameIdx, p.elementId)}
                 alt={`preview ${p.elementId}`}
                 className="block"
-                style={{
-                  maxHeight: "85vh",
-                  maxWidth: "70vw",
-                  width: "auto",
-                  height: "auto",
-                  objectFit: "contain",
-                }}
+                style={{ width: w, height: h, objectFit: "contain" }}
               />
-              <div className="flex items-center justify-between px-4 py-2.5 bg-black/80 backdrop-blur-md">
-                <span className="text-white text-[13px] font-medium">{p.name}</span>
-                <span className="text-white/60 text-[11.5px] font-mono">来自分镜 {p.frameIdx + 1} · 点击进入分镜头编排</span>
+              <div className="flex items-center justify-between px-3 py-2 bg-black/70 backdrop-blur-md">
+                <span className="text-white text-[12.5px] font-medium">{p.name}</span>
+                <span className="text-white/60 text-[11px] font-mono">来自分镜 {p.frameIdx + 1}</span>
               </div>
             </div>
           </div>,