diff --git a/video-gen-admin/dist/index.html b/video-gen-admin/dist/index.html index e038d429..fde75f89 100644 --- a/video-gen-admin/dist/index.html +++ b/video-gen-admin/dist/index.html @@ -1,37 +1,37 @@ - - - - - - - - - - 后台管理 - + + + + + + + + + + 后台管理 + - - -
- - + + +
+ + \ No newline at end of file diff --git a/video-gen-admin/src/App.tsx b/video-gen-admin/src/App.tsx index 6aeb7fc6..43e75890 100644 --- a/video-gen-admin/src/App.tsx +++ b/video-gen-admin/src/App.tsx @@ -34,6 +34,9 @@ import AdminReplicationProjectDetail from './pages/AdminReplicationProjectDetail import AdminVideoPromptSchemaConfig from './pages/AdminVideoPromptSchemaConfig'; import AdminContactRequests from './pages/AdminContactRequests'; import AdminHomeMaterials from './pages/AdminHomeMaterials'; +import AdminPreTestTemplates from './pages/AdminPreTestTemplates'; +import AdminOAuthList from './pages/AdminOAuthList'; +import AdminMaterialList from './pages/AdminMaterialList'; import { useAdminStore } from './store'; @@ -109,6 +112,9 @@ const App = () => { } /> } /> } /> + } /> + } /> + } /> } /> diff --git a/video-gen-admin/src/pages/AdminMaterialList.tsx b/video-gen-admin/src/pages/AdminMaterialList.tsx new file mode 100644 index 00000000..86b0a6e7 --- /dev/null +++ b/video-gen-admin/src/pages/AdminMaterialList.tsx @@ -0,0 +1,197 @@ +import React, { useEffect, useState } from 'react'; +import { Button, Input, Select, Table, Pagination, Tag, Typography } from 'antd'; +import { FileTextOutlined, SearchOutlined } from '@ant-design/icons'; + +const { Text } = Typography; + +const AdminMaterialList: React.FC = () => { + const [tableData, setTableData] = useState([]); + const [loading, setLoading] = useState(false); + const [currentPage, setCurrentPage] = useState(1); + const [pageSize, setPageSize] = useState(10); + const [total, setTotal] = useState(0); + const [searchMaterialId, setSearchMaterialId] = useState(''); + const [searchUploadId, setSearchUploadId] = useState(''); + const [searchFileName, setSearchFileName] = useState(''); + const [searchResourceType, setSearchResourceType] = useState(''); + + const columns = [ + { + title: '序号', + dataIndex: 'index', + key: 'index', + width: 60, + render: (text: number) => {text}, + }, + { + title: '素材ID', + dataIndex: 'materialId', + key: 'materialId', + width: 180, + }, + { + title: '上传ID', + dataIndex: 'uploadId', + key: 'uploadId', + width: 160, + }, + { + title: '文件名', + dataIndex: 'fileName', + key: 'fileName', + width: 200, + }, + { + title: '资源类型', + dataIndex: 'resourceType', + key: 'resourceType', + width: 100, + render: (text: string) => ( + + {text === 'video' ? '视频' : '图片'} + + ), + }, + { + title: '状态', + dataIndex: 'status', + key: 'status', + width: 100, + render: (text: string) => ( + + {text === 'SUCCESS' ? '成功' : text === 'PENDING' ? '处理中' : '失败'} + + ), + }, + { + title: '文件大小', + dataIndex: 'fileSize', + key: 'fileSize', + width: 120, + render: (text: string) => {text}, + }, + { + title: '创建时间', + dataIndex: 'createdAt', + key: 'createdAt', + width: 180, + render: (text: string) => {text}, + }, + ]; + + const loadMaterialList = async () => { + setLoading(true); + try { + const mockData = { + items: Array.from({ length: pageSize }, (_, i) => ({ + id: `${currentPage}-${i}`, + index: (currentPage - 1) * pageSize + i + 1, + materialId: `MAT-${(currentPage - 1) * pageSize + i + 1}`, + uploadId: `UP-${(currentPage - 1) * pageSize + i + 1}`, + fileName: `file_${(currentPage - 1) * pageSize + i + 1}.mp4`, + resourceType: ['video', 'image'][i % 2], + status: ['SUCCESS', 'PENDING', 'FAILED'][i % 3], + fileSize: `${(Math.random() * 50 + 10).toFixed(1)} MB`, + createdAt: '2026-07-01 10:00:00', + })), + total: 120, + }; + setTableData(mockData.items); + setTotal(mockData.total); + } catch (error) { + console.error('加载数据失败:', error); + } finally { + setLoading(false); + } + }; + + useEffect(() => { + loadMaterialList(); + }, [currentPage, pageSize]); + + const handleSearch = () => { + setCurrentPage(1); + loadMaterialList(); + }; + + return ( +
+
+ + 素材ID列表 +
+
+
+ setSearchMaterialId(e.target.value)} + style={{ width: 160 }} + allowClear + onPressEnter={handleSearch} + /> + setSearchUploadId(e.target.value)} + style={{ width: 160 }} + allowClear + onPressEnter={handleSearch} + /> + setSearchFileName(e.target.value)} + style={{ width: 140 }} + allowClear + onPressEnter={handleSearch} + /> + setSearchAccountId(e.target.value)} + style={{ width: 180 }} + allowClear + onPressEnter={handleSearch} + /> + setSearchUserId(e.target.value)} + style={{ width: 180 }} + allowClear + onPressEnter={handleSearch} + /> + setSearchName(e.target.value)} + style={{ width: 180 }} + allowClear + onPressEnter={handleSearch} + /> +