diff --git a/src/app/page.tsx b/src/app/page.tsx index 2da3ef3..5d2ed6e 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -22,6 +22,92 @@ import type { } from '@/lib/types'; import type { VIDEO_TEMPLATES } from '@/lib/templates'; +function sessionModeLabel(mode?: GenSession['inputMode']) { + if (mode === 'remix') return '二创'; + if (mode === 'replicate') return '复刻'; + if (mode === 'extend') return '补全'; + return '想法'; +} + +function sessionReferenceImages(session: GenSession) { + const uploaded = session.uploadedImages?.map(image => ({ + url: image.url, + label: image.role === 'subject' ? '主体图' : image.role === 'reference' ? '参考图' : image.accessoryName || image.role, + })) ?? []; + if (uploaded.length) return uploaded; + return session.refImages.map((url, index) => ({ url, label: `参考 ${index + 1}` })); +} + +function CurrentSessionRail({ session }: { session: GenSession }) { + const refs = sessionReferenceImages(session); + const selectedCount = session.images.filter(image => image.status === 'selected').length; + const packCount = session.packs?.length ?? 0; + + return ( + + ); +} + export default function Home() { const [sessions, setSessions] = useState([]); const [current, setCurrent] = useState(null); @@ -353,30 +439,35 @@ export default function Home() { /> )} {current && ( -
-
-
- Step · 02 · Quick Screen -

本次生成

-

- {new Date(current.createdAt).toLocaleString('zh-CN')} -

+
+
+ +
+
+
+ Step · 03 · Quick Screen +

本次生成

+

+ {new Date(current.createdAt).toLocaleString('zh-CN')} +

+
+ {current.id} +
+ +
- {current.id}
- -
)}
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx index 488ea9b..7bf3901 100644 --- a/src/components/Sidebar.tsx +++ b/src/components/Sidebar.tsx @@ -2,72 +2,6 @@ import type { GenSession } from '@/lib/types'; -function modeLabel(mode?: GenSession['inputMode']) { - if (mode === 'remix') return '二创'; - if (mode === 'replicate') return '复刻'; - if (mode === 'extend') return '补全'; - return '想法'; -} - -function imageSourcesForSession(session: GenSession) { - const uploaded = session.uploadedImages?.map(image => ({ - url: image.url, - label: image.role === 'subject' ? '主体图' : image.role === 'reference' ? '参考图' : image.accessoryName || image.role, - })) ?? []; - if (uploaded.length) return uploaded; - return session.refImages.map((url, index) => ({ url, label: `参考 ${index + 1}` })); -} - -function ActiveSessionDetail({ session }: { session: GenSession }) { - const refs = imageSourcesForSession(session); - const selectedCount = session.images.filter(image => image.status === 'selected').length; - const packCount = session.packs?.length ?? 0; - - return ( -
-
- Session - - {modeLabel(session.inputMode)} - -
-
- {session.characterSpec?.name || session.prompt} -
-
-
-
图片
- {session.images.length} -
-
-
选中
- {selectedCount} -
-
-
- {packCount} -
-
- {refs.length > 0 && ( -
-
Reference
-
- {refs.slice(0, 4).map((ref, index) => ( -
- {ref.label} -
- ))} -
-
- )} -
- {new Date(session.createdAt).toLocaleString('zh-CN', { month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' })} - {session.id.slice(0, 10)} -
-
- ); -} - export default function Sidebar({ open, onToggle, @@ -99,10 +33,8 @@ export default function Sidebar({ ); } - const activeSession = sessions.find(session => session.id === currentId) ?? null; - return ( -