真人素材库本地完成

2026-07-06 15:13:41 +08:00
parent 75d1f7a428
commit ab67bdf19e
52 changed files with 4131 additions and 137 deletions
@@ -0,0 +1,61 @@
+import React, { useState } from 'react';
+import { Button, Input, Modal, Upload, message } from 'antd';
+import { UploadOutlined } from '@ant-design/icons';
+import type { UploadFile } from 'antd/es/upload/interface';
+import { createPrivatePortraitAsset, uploadImage } from '../../../api';
+
+interface Props {
+  projectId: string;
+  open: boolean;
+  onClose: () => void;
+  onSuccess: () => void;
+}
+
+const PrivatePortraitAssetUpload: React.FC<Props> = ({ projectId, open, onClose, onSuccess }) => {
+  const [fileList, setFileList] = useState<UploadFile[]>([]);
+  const [name, setName] = useState('');
+  const [loading, setLoading] = useState(false);
+
+  const handleSubmit = async () => {
+    const file = fileList[0]?.originFileObj as File | undefined;
+    if (!file) {
+      message.warning('请先选择图片素材');
+      return;
+    }
+    setLoading(true);
+    try {
+      const uploaded = await uploadImage(file);
+      await createPrivatePortraitAsset(projectId, { url: uploaded.url, assetType: 'Image', name: name || file.name });
+      message.success('素材已提交入库，处理中');
+      setFileList([]);
+      setName('');
+      onSuccess();
+      onClose();
+    } catch (e: any) {
+      message.error(e?.message || '上传素材失败');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Modal title="上传真人素材" open={open} onCancel={onClose} onOk={handleSubmit} confirmLoading={loading} okText="提交入库">
+      <div style={{ display: 'grid', gap: 12 }}>
+        <Input value={name} onChange={(e) => setName(e.target.value)} placeholder="素材名称，默认使用文件名" />
+        <Upload
+          accept="image/*"
+          maxCount={1}
+          fileList={fileList}
+          beforeUpload={() => false}
+          onChange={({ fileList }) => setFileList(fileList)}
+          listType="picture"
+        >
+          <Button icon={<UploadOutlined />}>选择图片</Button>
+        </Upload>
+        <div style={{ color: '#64748b', fontSize: 12 }}>建议上传真人正脸、全身或同人妆造图。入库后会经过火山真人一致性校验，Active 后才可用于 AI 创作。</div>
+      </div>
+    </Modal>
+  );
+};
+
+export default PrivatePortraitAssetUpload;