Clarify recorder leave-page guidance

client/src/pages/Recorder.tsx

@@ -211,6 +211,13 @@ export default function Recorder() {
   const archiveProgress = archiveTaskQuery.data?.progress ?? getArchiveProgress(mediaSession);
   const archivePhaseLabel = getArchivePhaseLabel(mode, mediaSession, archiveTaskQuery.data?.progress);
   const totalUploadBytes = uploadBytes + queuedBytes;
+  const uploadStillDraining = mode === "finalizing" && (queuedBytes > 0 || queuedSegments > 0 || finalizeTaskMutation.isPending);
+  const archiveRunning =
+    archiveTaskQuery.data?.status === "queued" ||
+    archiveTaskQuery.data?.status === "running" ||
+    mediaSession?.archiveStatus === "queued" ||
+    mediaSession?.archiveStatus === "processing";
+  const canLeaveRecorderPage = !uploadStillDraining && (archiveRunning || mode === "archived");
 
   const syncSessionState = useCallback((session: MediaSession | null) => {
     currentSessionRef.current = session;
@@ -1025,6 +1032,30 @@ export default function Recorder() {
         </Alert>
       ) : null}
 
+      {uploadStillDraining ? (
+        <Alert variant="destructive">
+          <ShieldAlert className="h-4 w-4" />
+          <AlertTitle>仍需停留在当前页面</AlertTitle>
+          <AlertDescription>
+            结束已提交，但还有 {queuedSegments} 个分段、约 {formatFileSize(queuedBytes)} 待上传。
+            请先保持当前页面和网络连接，等“待上传缓存”变为 0 后再离开，否则本次录制尾段可能缺失。
+          </AlertDescription>
+        </Alert>
+      ) : null}
+
+      {canLeaveRecorderPage ? (
+        <Alert>
+          <Video className="h-4 w-4" />
+          <AlertTitle>上传已完成，无需继续停留在此页面</AlertTitle>
+          <AlertDescription>
+            当前录制分段已经全部上传。
+            {mode === "archived"
+              ? " 回放文件已生成，你现在可以返回其他页面，稍后也能在视频库继续查看。"
+              : " 后台会继续合并分段、生成回放并写入视频库，你可以直接离开，任务中心会反馈完成结果。"}
+          </AlertDescription>
+        </Alert>
+      ) : null}
+
       <div className="grid gap-4 xl:grid-cols-[minmax(0,1.7fr)_minmax(340px,0.9fr)]">
         <section className="space-y-4">
           <Card className="overflow-hidden border-0 shadow-lg">
@@ -1226,6 +1257,21 @@ export default function Recorder() {
                         ? mediaSession.lastError || "归档失败，请检查媒体服务日志。"
                         : `Worker 正在合并分段并生成归档文件，当前已上传 ${formatFileSize(uploadBytes)}。`}
                   </p>
+                  <div
+                    className={`rounded-2xl px-3 py-2 text-xs leading-5 ${
+                      uploadStillDraining
+                        ? "border border-destructive/25 bg-destructive/5 text-destructive"
+                        : canLeaveRecorderPage
+                          ? "border border-emerald-200 bg-emerald-50 text-emerald-700"
+                          : "border border-border/60 bg-background/70 text-muted-foreground"
+                    }`}
+                  >
+                    {uploadStillDraining
+                      ? `仍需停留：还有 ${queuedSegments} 个分段、约 ${formatFileSize(queuedBytes)} 待上传，待上传清零后再离开当前页面。`
+                      : canLeaveRecorderPage
+                        ? "上传已完成：无需继续停留在此页面，后台会继续生成回放并把结果写入视频库。"
+                        : "结束录制后会先清空本地待上传缓存，再转入后台归档。"}
+                  </div>
                 </div>
               )}