Compare commits

...

2 Commits

Author SHA1 Message Date
288b695de2 fix: preserve primary image aspect ratio 2026-05-20 17:13:15 +08:00
36c93cddf8 auto-save 2026-05-20 17:11 (~2) 2026-05-20 17:11:41 +08:00
2 changed files with 31 additions and 2 deletions

View File

@@ -1573,6 +1573,20 @@
"message": "fix: improve project brief preview layout",
"hash": "61e597c",
"files_changed": 3
},
{
"ts": "2026-05-20T16:48:47+08:00",
"type": "commit",
"message": "fix: improve project brief preview layout",
"hash": "8d4275f",
"files_changed": 3
},
{
"ts": "2026-05-20T17:11:41+08:00",
"type": "commit",
"message": "auto-save 2026-05-20 17:11 (~2)",
"hash": "36c93cd",
"files_changed": 2
}
]
}

View File

@@ -90,6 +90,11 @@ function ProjectBrief({ session }: { session: GenSession }) {
const generatedAssets = (session.packs ?? []).reduce((sum, pack) => sum + pack.assets.length, 0);
const totalSlots = packSlotTotal();
const [previewOpen, setPreviewOpen] = useState(false);
const [primaryAspectRatio, setPrimaryAspectRatio] = useState('1 / 1');
useEffect(() => {
setPrimaryAspectRatio('1 / 1');
}, [primaryImage?.url]);
return (
<section className="project-brief-panel">
@@ -114,8 +119,18 @@ function ProjectBrief({ session }: { session: GenSession }) {
onFocus={() => setPreviewOpen(true)}
onBlur={() => setPreviewOpen(false)}
>
<div className="project-primary-preview">
<img src={primaryImage.url} alt="当前主方案" className="project-primary-image" />
<div className="project-primary-preview" style={{ aspectRatio: primaryAspectRatio }}>
<img
src={primaryImage.url}
alt="当前主方案"
className="project-primary-image"
onLoad={event => {
const image = event.currentTarget;
if (image.naturalWidth && image.naturalHeight) {
setPrimaryAspectRatio(`${image.naturalWidth} / ${image.naturalHeight}`);
}
}}
/>
</div>
<div className="project-primary-meta">
<span className="text-[10px] font-semibold uppercase tracking-[0.16em] text-white/70">Primary</span>