diff --git a/src/components/ProjectMaterialsCenter.tsx b/src/components/ProjectMaterialsCenter.tsx index 7acf263..e85ac4e 100644 --- a/src/components/ProjectMaterialsCenter.tsx +++ b/src/components/ProjectMaterialsCenter.tsx @@ -21,6 +21,7 @@ const ProjectMaterialsCenter: React.FC = ({ const [searchTerm, setSearchTerm] = useState('') const [selectedModelIds, setSelectedModelIds] = useState([]) const [filterType, setFilterType] = useState<'all' | 'original' | 'segmented'>('all') + const [usageFilter, setUsageFilter] = useState<'all' | 'used' | 'unused'>('all') const [selectedMaterial, setSelectedMaterial] = useState(null) const [showVideoPlayer, setShowVideoPlayer] = useState(false) @@ -29,14 +30,14 @@ const ProjectMaterialsCenter: React.FC = ({ // 搜索过滤 const matchesSearch = material.filename.toLowerCase().includes(searchTerm.toLowerCase()) || (material.tags || []).some(tag => tag.toLowerCase().includes(searchTerm.toLowerCase())) - + // 模特过滤(如果选择了模特) - const matchesModel = selectedModelIds.length === 0 || + const matchesModel = selectedModelIds.length === 0 || selectedModelIds.some(modelId => { const model = models.find(m => m.id === modelId) return model && (material.tags || []).includes(model.model_number) }) - + // 类型过滤 let matchesType = true if (filterType === 'original') { @@ -44,16 +45,27 @@ const ProjectMaterialsCenter: React.FC = ({ } else if (filterType === 'segmented') { matchesType = material.segment_index > 0 } - - return matchesSearch && matchesModel && matchesType + + // 使用状态过滤 + let matchesUsage = true + if (usageFilter === 'used') { + matchesUsage = material.use_count > 0 + } else if (usageFilter === 'unused') { + matchesUsage = material.use_count === 0 + } + + return matchesSearch && matchesModel && matchesType && matchesUsage }) const handleModelToggle = (modelId: string) => { - setSelectedModelIds(prev => - prev.includes(modelId) - ? prev.filter(id => id !== modelId) - : [...prev, modelId] - ) + setSelectedModelIds(prev => { + // 如果当前模特已选中,则取消选择 + if (prev.includes(modelId)) { + return prev.filter(id => id !== modelId) + } + // 如果当前模特未选中,则添加到选择列表 + return [...prev, modelId] + }) } const handleUseMaterial = async (material: VideoSegment) => { @@ -113,6 +125,33 @@ const ProjectMaterialsCenter: React.FC = ({ {/* 筛选器 - 紧凑布局 */}
+ {/* 使用状态筛选 */} +
+
+ + 使用状态: +
+
+ {[ + { value: 'all', label: '全部' }, + { value: 'unused', label: '未使用' }, + { value: 'used', label: '已使用' } + ].map((option) => ( + + ))} +
+
+ {/* 模特筛选 */} {models.length > 0 && (
@@ -121,6 +160,16 @@ const ProjectMaterialsCenter: React.FC = ({ 模特:
+ {models.map((model) => ( ))} - {selectedModelIds.length > 0 && ( - - )}
)} @@ -181,13 +222,13 @@ const ProjectMaterialsCenter: React.FC = ({