收口统一创作流程一期

src/components/unified-creation/UnifiedCreationPage.tsx

@@ -1,3 +1,4 @@
+import { ArrowLeft } from 'lucide-react';
 import type { ReactNode } from 'react';
 
 import type { UnifiedCreationSpec } from './unifiedCreationSpecs';
@@ -5,15 +6,19 @@ import type { UnifiedCreationSpec } from './unifiedCreationSpecs';
 type UnifiedCreationPageProps = {
   spec: UnifiedCreationSpec;
   children: ReactNode;
+  onBack?: () => void;
+  isBackDisabled?: boolean;
 };
 
 export function UnifiedCreationPage({
   spec,
   children,
+  onBack,
+  isBackDisabled = false,
 }: UnifiedCreationPageProps) {
   return (
     <div
-      className="unified-creation-page platform-remap-surface mx-auto flex w-full max-w-5xl flex-col px-3 pt-2 sm:px-4 sm:pt-3"
+      className="unified-creation-page platform-remap-surface mx-auto flex h-full min-h-0 w-full max-w-5xl flex-col overflow-y-auto overflow-x-hidden px-3 pt-2 sm:px-4 sm:pt-3"
       data-play-id={spec.playId}
       data-field-kinds={spec.fields.map((field) => field.kind).join(',')}
       data-workspace-stage={spec.workspaceStage}
@@ -21,10 +26,22 @@ export function UnifiedCreationPage({
       data-result-stage={spec.resultStage}
     >
       <header className="unified-creation-page__header shrink-0 pb-3">
-        <div className="flex items-center justify-between gap-3">
-          <h1 className="m-0 min-w-0 truncate text-[1.35rem] font-black leading-tight tracking-normal text-[var(--platform-text-strong)] sm:text-[1.65rem]">
-            {spec.title}
-          </h1>
+        <div className="mb-2 flex items-center justify-between gap-3">
+          {onBack ? (
+            <button
+              type="button"
+              onClick={onBack}
+              disabled={isBackDisabled}
+              className={`platform-button platform-button--ghost min-h-0 shrink-0 px-3 py-1.5 text-[11px] ${
+                isBackDisabled ? 'cursor-not-allowed opacity-45' : ''
+              }`}
+            >
+              <ArrowLeft className="h-3.5 w-3.5" />
+              返回
+            </button>
+          ) : (
+            <span aria-hidden="true" className="min-h-8 w-0 shrink-0" />
+          )}
           <span
             className="unified-creation-page__play-badge shrink-0 rounded-full border border-[var(--platform-subpanel-border)] bg-white/80 px-3 py-1 text-[11px] font-black text-[var(--platform-text-soft)]"
             data-testid="unified-creation-play-badge"
@@ -32,6 +49,11 @@ export function UnifiedCreationPage({
             {spec.playId}
           </span>
         </div>
+        <div className="flex items-center justify-between gap-3">
+          <h1 className="m-0 min-w-0 truncate text-[1.35rem] font-black leading-tight tracking-normal text-[var(--platform-text-strong)] sm:text-[1.65rem]">
+            {spec.title}
+          </h1>
+        </div>
       </header>
       <div className="sr-only" data-testid="unified-creation-spec">
         <h1>{spec.title}</h1>
@@ -49,7 +71,7 @@ export function UnifiedCreationPage({
           ))}
         </ul>
       </div>
-      <div className="unified-creation-page__content pb-3 sm:pb-4">
+      <div className="unified-creation-page__content flex min-h-max flex-col pb-3 sm:pb-4">
         {children}
       </div>
     </div>