From 383ac946af1da2d54b487e551fb84b71fae9348b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AD=99=E4=BD=B3=E8=89=BA?= Date: Wed, 10 Jun 2026 15:30:48 +0800 Subject: [PATCH] =?UTF-8?q?=E6=8B=86=E9=95=9C=E5=A4=8D=E5=88=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- video-gen-app/private-folder-alias.json | 21 +- video-gen-app/src/App.tsx | 2 + video-gen-app/src/pages/GeneratedRecord.tsx | 4 +- video-gen-app/src/pages/InitialInfo.tsx | 2 +- video-gen-app/src/pages/RemoveInfo.tsx | 419 +++++++ video-gen-app/src/pages/RemoveLens.tsx | 1119 ++++++++++--------- 6 files changed, 1056 insertions(+), 511 deletions(-) create mode 100644 video-gen-app/src/pages/RemoveInfo.tsx diff --git a/video-gen-app/private-folder-alias.json b/video-gen-app/private-folder-alias.json index 9e26dfee..5a0fdfb6 100644 --- a/video-gen-app/private-folder-alias.json +++ b/video-gen-app/private-folder-alias.json @@ -1 +1,20 @@ -{} \ No newline at end of file +{ + "src/pages/GenerateConver.tsx": { + "description": "ai创建" + }, + "src/pages/GeneratedRecord.tsx": { + "description": "生成历史" + }, + "src/pages/GeneratePage.tsx": { + "description": "生成记录" + }, + "src/pages/ProjectsPage.tsx": { + "description": "我的项目" + }, + "src/pages/RemoveLens.tsx": { + "description": "拆镜复刻" + }, + "src/pages/InitialReplication.tsx": { + "description": "爆款开头复刻" + } +} \ No newline at end of file diff --git a/video-gen-app/src/App.tsx b/video-gen-app/src/App.tsx index 1f867562..751f3f72 100644 --- a/video-gen-app/src/App.tsx +++ b/video-gen-app/src/App.tsx @@ -14,6 +14,7 @@ import InitialInfo from './pages/InitialInfo'; import RemoveLens from './pages/RemoveLens'; import GeneratedRecord from './pages/GeneratedRecord'; import AuthorizationPage from './pages/AuthorizationPage'; +import RemoveInfo from './pages/RemoveInfo'; @@ -96,6 +97,7 @@ const App = () => { } /> } /> } /> + } /> } /> } /> diff --git a/video-gen-app/src/pages/GeneratedRecord.tsx b/video-gen-app/src/pages/GeneratedRecord.tsx index b54deefd..bd4446f6 100644 --- a/video-gen-app/src/pages/GeneratedRecord.tsx +++ b/video-gen-app/src/pages/GeneratedRecord.tsx @@ -1066,10 +1066,10 @@ const GeneratedRecord: React.FC = () => {
diff --git a/video-gen-app/src/pages/InitialInfo.tsx b/video-gen-app/src/pages/InitialInfo.tsx index 807093dd..577511de 100644 --- a/video-gen-app/src/pages/InitialInfo.tsx +++ b/video-gen-app/src/pages/InitialInfo.tsx @@ -61,7 +61,7 @@ function InitialInfo() { return (
-
+
diff --git a/video-gen-app/src/pages/RemoveInfo.tsx b/video-gen-app/src/pages/RemoveInfo.tsx new file mode 100644 index 00000000..ec24e62f --- /dev/null +++ b/video-gen-app/src/pages/RemoveInfo.tsx @@ -0,0 +1,419 @@ +import React, { useState } from 'react'; +import { useParams, useNavigate } from 'react-router-dom'; +import { Button, Table, Tag, Drawer, Input, Upload, message } from 'antd'; +import { ArrowLeftOutlined, PlayCircleOutlined, XOutlined, PlusOutlined, UploadOutlined } from '@ant-design/icons'; +import type { UploadFile } from 'antd'; + +const { TextArea } = Input; + +function RemoveInfo() { + const { creatID } = useParams<{ creatID: string }>(); + const navigate = useNavigate(); + const [drawerVisible, setDrawerVisible] = useState(false); + const [currentSegment, setCurrentSegment] = useState(null); + const [productName, setProductName] = useState(''); + const [productSellingPoint, setProductSellingPoint] = useState(''); + const [productImage, setProductImage] = useState(''); + const [detailImage, setDetailImage] = useState(''); + + const handleGenerate = (segmentId: number) => { + setCurrentSegment(segmentId); + setDrawerVisible(true); + }; + + const handleCloseDrawer = () => { + setDrawerVisible(false); + setCurrentSegment(null); + setProductName(''); + setProductSellingPoint(''); + setProductImage(''); + setDetailImage(''); + }; + + const handleProductImageChange: any = (info: any) => { + if (info.fileList.length > 0) { + const file = info.fileList[0]; + if (file.originFileObj) { + const reader = new FileReader(); + reader.onload = (e) => { + setProductImage(e.target?.result as string); + }; + reader.readAsDataURL(file.originFileObj); + } + } else { + setProductImage(''); + } + }; + + const handleDetailImageChange: any = (info: any) => { + if (info.fileList.length > 0) { + const file = info.fileList[0]; + if (file.originFileObj) { + const reader = new FileReader(); + reader.onload = (e) => { + setDetailImage(e.target?.result as string); + }; + reader.readAsDataURL(file.originFileObj); + } + } else { + setDetailImage(''); + } + }; + + const handleManualGenerate = () => { + // 必填校验 + if (!productImage) { + message.warning('请上传产品图'); + return; + } + if (!productName.trim()) { + message.warning('请输入产品名称'); + return; + } + if (!productSellingPoint.trim()) { + message.warning('请输入产品卖点'); + return; + } + + // 输出内容 + console.log('手动生成 - 片段', currentSegment); + console.log('产品图:', productImage); + console.log('细节图:', detailImage); + console.log('产品名称:', productName); + console.log('产品卖点:', productSellingPoint); + + message.success(`手动生成成功！片段: ${currentSegment}`); + }; + + const mockData = { + productName: '返回', + uploadTime: '2026-06-09 09:01:16', + sellingPoints: ['一键匹配', '连麦聊天'], + audience: '123123', + audienceAnalysis: '123123', + videoUrl: 'https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=320&h=180&fit=crop', + segments: [ + { + key: '1', + id: 1, + timeRange: '00:00 - 00:03', + thumbnail: 'https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=120&h=80&fit=crop', + content: '11111', + lines: 'qqqqqqqqqqq', + contentStrategy: '展示礼盒' + }, + { + key: '2', + id: 2, + timeRange: '00:03 - 00:06', + thumbnail: 'https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=120&h=80&fit=crop', + content: '1231231231', + lines: 'qqqqqqqqqqq', + contentStrategy: '开箱展示' + }, + { + key: '3', + id: 3, + timeRange: '00:06 - 00:09', + thumbnail: 'https://images.unsplash.com/photo-1522202176988-66273c2fd55f?w=120&h=80&fit=crop', + content: '123123', + lines: 'qqqqqqqqqqq', + contentStrategy: '取出产品' + }, + ] + }; + + const columns = [ + { + title: '片段', + width: 100, + render: (text: any, record: any) => ( +
+
片段{record.id}
+
{record.timeRange}
+
+ ) + }, + { + title: '片段视频', + width: 120, + render: (text: any, record: any) => ( +
+ {`片段${record.id}`} +
+ +
+
+ ) + }, + { + title: '画面内容', + width: 250, + + render: (text: any, record: any) => ( +
+ {record.content} +
+ ) + }, + { + title: '台词', + width: 250, + + render: (text: any, record: any) => ( +
+ {record.lines} +
+ ) + }, + { + title: '内容策略', + width: 120, + align: 'left' as const, + render: (text: any, record: any) => ( +
+ {record.contentStrategy || '-'} +
+ ) + }, + { + title: '素材', + width: 140, + align: 'center' as const, + render: (text: any, record: any) => ( +
+
+ 等待生成 +
+ +
+ ) + } + ]; + + return ( + +
+
+
+
+
+ +
+
+
+
+ 视频缩略图 +
+ +
+
+ +
+
+
+

视频总结

+
+ 上传时间: {mockData.uploadTime} +
+ +
+
+ 产品名称: + {mockData.productName} +
+
+ 卖点词: +
+ {mockData.sellingPoints.map((point, index) => ( + + {point} + + ))} +
+
+
+ 受众群体: + {mockData.audience} +
+
+ 受众分析: + {mockData.audienceAnalysis} +
+
+ + +
+
+
+ +
+ + + + + + + + 智能视频复刻 + -片段{currentSegment} + +