添加审核 优化

core/frontend/src/components/free-create/asset-library-modal.tsx

@@ -3,16 +3,16 @@
 // processing 素材每 8s 轮询火山刷新状态(与基础资产送审轮询同节奏)。
 import { useCallback, useEffect, useRef, useState } from "react";
 import { createPortal } from "react-dom";
-import { Check, ChevronLeft, FolderPlus, Pencil, Trash2, Upload, Users, X } from "lucide-react";
+import { Check, CheckCircle2, ChevronLeft, CircleX, Clock3, FolderPlus, Pencil, Trash2, Upload, Users, X } from "lucide-react";
 import { api } from "../../api";
 import { useFileDrop } from "../use-file-drop";
 import type { FreeAssetGroup, FreeAssetItem, FreeVideoRef } from "../../types";
 import { useBodyScrollLock } from "../overlays";
 
-const STATUS_PILL: Record<FreeAssetItem["status"], { cls: string; label: string }> = {
-  processing: { cls: "pill-info", label: "审核中" },
-  active: { cls: "pill-ok", label: "可用" },
-  failed: { cls: "pill-err", label: "未通过" }
+const STATUS_ICON: Record<FreeAssetItem["status"], { cls: string; label: string; Icon: typeof CheckCircle2 }> = {
+  processing: { cls: "is-processing", label: "审核中，暂不可引用", Icon: Clock3 },
+  active: { cls: "is-active", label: "审核通过，可被引用", Icon: CheckCircle2 },
+  failed: { cls: "is-failed", label: "审核未通过，无法引用", Icon: CircleX }
 };
 
 export function AssetLibraryModal({ open, onClose, onPick, notify }: {
@@ -122,7 +122,7 @@ export function AssetLibraryModal({ open, onClose, onPick, notify }: {
       form.append("file", file);
       const data = await api.uploadFreeAsset(activeGroup.id, form);
       setAssets((prev) => [data.asset, ...prev]);
-      notify("success", "素材已上传,审核中");
+      notify("info", "素材已提交审核,通过后即可引用");
     } catch (error) {
       notify("error", error instanceof Error ? error.message : "上传失败");
     } finally {
@@ -149,7 +149,7 @@ export function AssetLibraryModal({ open, onClose, onPick, notify }: {
       const data = await api.quickUploadFreeAsset(form);
       setActiveGroup(data.group);
       setAssets([data.asset]);
-      notify("success", "图片已上传到默认素材组,审核中");
+      notify("info", "图片已提交审核,通过后即可引用");
       void loadGroupDetail(data.group);
     } catch (error) {
       notify("error", error instanceof Error ? error.message : "上传失败");
@@ -443,7 +443,8 @@ export function AssetLibraryModal({ open, onClose, onPick, notify }: {
               ) : (
                 <div className="fc-lib-assets">
                   {assets.map((item) => {
-                    const pill = STATUS_PILL[item.status];
+                    const statusIcon = STATUS_ICON[item.status];
+                    const StatusIcon = statusIcon.Icon;
                     const isEditing = editingAssetId === item.id;
                     const isDeleting = confirmDeleteAssetId === item.id;
                     return (
@@ -458,6 +459,9 @@ export function AssetLibraryModal({ open, onClose, onPick, notify }: {
                         <div className="fc-lib-thumb">
                           {item.thumb_url ? <img src={item.thumb_url} alt={item.name} /> : <span className="mono">{item.type === "audio" ? "♪" : item.type.toUpperCase()}</span>}
                           {item.duration ? <span className="fc-ref-dur mono">{item.duration}s</span> : null}
+                          <span className={`fc-lib-status-icon ${statusIcon.cls}`} title={statusIcon.label} aria-label={statusIcon.label}>
+                            <StatusIcon size={14} strokeWidth={1.8} />
+                          </span>
                         </div>
                         {isEditing ? (
                           <div className="fc-lib-rename-row" onClick={(event) => event.stopPropagation()}>
@@ -489,7 +493,6 @@ export function AssetLibraryModal({ open, onClose, onPick, notify }: {
                         ) : (
                           <div className="fc-lib-name" title={item.name}>{item.name}</div>
                         )}
-                        <span className={`pill pill-l3 fc-lib-status ${pill.cls}`}><span className="dot" />{pill.label}</span>
                         {item.status === "failed" && item.error_message && <div className="fc-lib-err mono" title={item.error_message}>{item.error_message}</div>}
                         <div className="fc-lib-ops">
                           <button type="button" title="重命名" onClick={(event) => { event.stopPropagation(); startRenameAsset(item); }}><Pencil size={12} /></button>