refactor: 移除个人形象图片收藏功能

- 移除ModelImageGallery组件中的收藏按钮和心形图标
- 移除ModelImagePreviewModal组件中的收藏功能
- 移除ModelDetail页面中的handleTogglePhotoFavorite函数
- 简化照片管理界面,专注于基本的上传、删除、预览功能
- 移除Heart图标导入和onToggleFavorite相关属性

优化目标:
- 界面更加简洁清爽
- 减少不必要的功能复杂度
- 提升用户体验的专注度
This commit is contained in:
imeepos 2025-07-30 14:59:31 +08:00
parent abe9cfac94
commit e4c49126f5
3 changed files with 4 additions and 78 deletions

View File

@ -2,7 +2,6 @@ import React, { useState, useCallback } from 'react';
import { import {
Eye, Eye,
Trash2, Trash2,
Heart,
Plus, Plus,
Grid3X3, Grid3X3,
List, List,
@ -18,7 +17,6 @@ interface ModelImageGalleryProps {
photos: ModelPhoto[]; photos: ModelPhoto[];
onUpload: (imagePaths: string[], photoType: PhotoType) => Promise<void>; onUpload: (imagePaths: string[], photoType: PhotoType) => Promise<void>;
onDelete: (photo: ModelPhoto) => Promise<void>; onDelete: (photo: ModelPhoto) => Promise<void>;
onToggleFavorite?: (photo: ModelPhoto) => Promise<void>;
isUploading?: boolean; isUploading?: boolean;
className?: string; className?: string;
} }
@ -34,7 +32,6 @@ export const ModelImageGallery: React.FC<ModelImageGalleryProps> = ({
photos, photos,
onUpload, onUpload,
onDelete, onDelete,
onToggleFavorite,
isUploading = false, isUploading = false,
className = '' className = ''
}) => { }) => {
@ -295,19 +292,7 @@ export const ModelImageGallery: React.FC<ModelImageGalleryProps> = ({
> >
<Eye className="w-4 h-4" /> <Eye className="w-4 h-4" />
</button> </button>
{onToggleFavorite && (
<button
onClick={() => onToggleFavorite(photo)}
className={`p-2 rounded-full transition-colors ${
photo.is_cover
? 'bg-red-500 text-white hover:bg-red-600'
: 'bg-white text-gray-700 hover:bg-gray-100'
}`}
title="收藏"
>
<Heart className={`w-4 h-4 ${photo.is_cover ? 'fill-current' : ''}`} />
</button>
)}
<button <button
onClick={() => handleDeleteClick(photo)} onClick={() => handleDeleteClick(photo)}
className="p-2 bg-white text-red-600 rounded-full hover:bg-red-50 transition-colors" className="p-2 bg-white text-red-600 rounded-full hover:bg-red-50 transition-colors"
@ -324,9 +309,6 @@ export const ModelImageGallery: React.FC<ModelImageGalleryProps> = ({
<span className={`px-2 py-1 text-xs rounded-full ${getPhotoTypeColor(photo.photo_type)}`}> <span className={`px-2 py-1 text-xs rounded-full ${getPhotoTypeColor(photo.photo_type)}`}>
{getPhotoTypeLabel(photo.photo_type)} {getPhotoTypeLabel(photo.photo_type)}
</span> </span>
{photo.is_cover && (
<Heart className="w-4 h-4 text-red-500 fill-current" />
)}
</div> </div>
<p className="text-sm font-medium text-gray-900 truncate" title={photo.file_name}> <p className="text-sm font-medium text-gray-900 truncate" title={photo.file_name}>
{photo.file_name} {photo.file_name}
@ -363,9 +345,6 @@ export const ModelImageGallery: React.FC<ModelImageGalleryProps> = ({
<span className={`px-2 py-1 text-xs rounded-full ${getPhotoTypeColor(photo.photo_type)}`}> <span className={`px-2 py-1 text-xs rounded-full ${getPhotoTypeColor(photo.photo_type)}`}>
{getPhotoTypeLabel(photo.photo_type)} {getPhotoTypeLabel(photo.photo_type)}
</span> </span>
{photo.is_cover && (
<Heart className="w-4 h-4 text-red-500 fill-current" />
)}
</div> </div>
<p className="text-sm text-gray-500"> <p className="text-sm text-gray-500">
{formatFileSize(photo.file_size)} {new Date(photo.created_at).toLocaleDateString()} {formatFileSize(photo.file_size)} {new Date(photo.created_at).toLocaleDateString()}
@ -386,19 +365,7 @@ export const ModelImageGallery: React.FC<ModelImageGalleryProps> = ({
> >
<Eye className="w-4 h-4" /> <Eye className="w-4 h-4" />
</button> </button>
{onToggleFavorite && (
<button
onClick={() => onToggleFavorite(photo)}
className={`p-2 rounded-lg transition-colors ${
photo.is_cover
? 'text-red-500 hover:bg-red-50'
: 'text-gray-600 hover:bg-gray-100'
}`}
title="收藏"
>
<Heart className={`w-4 h-4 ${photo.is_cover ? 'fill-current' : ''}`} />
</button>
)}
<button <button
onClick={() => handleDeleteClick(photo)} onClick={() => handleDeleteClick(photo)}
className="p-2 text-red-600 hover:bg-red-50 rounded-lg transition-colors" className="p-2 text-red-600 hover:bg-red-50 rounded-lg transition-colors"
@ -421,7 +388,6 @@ export const ModelImageGallery: React.FC<ModelImageGalleryProps> = ({
isOpen={previewModal.isOpen} isOpen={previewModal.isOpen}
onClose={closePreview} onClose={closePreview}
onDelete={handleDeleteClick} onDelete={handleDeleteClick}
onToggleFavorite={onToggleFavorite}
/> />
{/* 删除确认对话框 */} {/* 删除确认对话框 */}

View File

@ -10,7 +10,6 @@ import {
Maximize2, Maximize2,
Minimize2, Minimize2,
Trash2, Trash2,
Heart,
Info, Info,
Calendar, Calendar,
FileImage, FileImage,
@ -25,7 +24,6 @@ interface ModelImagePreviewModalProps {
isOpen: boolean; isOpen: boolean;
onClose: () => void; onClose: () => void;
onDelete?: (photo: ModelPhoto) => void; onDelete?: (photo: ModelPhoto) => void;
onToggleFavorite?: (photo: ModelPhoto) => void;
title?: string; title?: string;
} }
@ -39,7 +37,6 @@ export const ModelImagePreviewModal: React.FC<ModelImagePreviewModalProps> = ({
isOpen, isOpen,
onClose, onClose,
onDelete, onDelete,
onToggleFavorite,
title = "图片预览" title = "图片预览"
}) => { }) => {
const [currentIndex, setCurrentIndex] = useState(initialIndex); const [currentIndex, setCurrentIndex] = useState(initialIndex);
@ -144,11 +141,7 @@ export const ModelImagePreviewModal: React.FC<ModelImagePreviewModalProps> = ({
} }
}, [currentPhoto, onDelete]); }, [currentPhoto, onDelete]);
const handleToggleFavorite = useCallback(() => {
if (currentPhoto && onToggleFavorite) {
onToggleFavorite(currentPhoto);
}
}, [currentPhoto, onToggleFavorite]);
const getPhotoTypeLabel = (photoType: PhotoType): string => { const getPhotoTypeLabel = (photoType: PhotoType): string => {
switch (photoType) { switch (photoType) {
@ -222,18 +215,7 @@ export const ModelImagePreviewModal: React.FC<ModelImagePreviewModalProps> = ({
<Info className="w-5 h-5" /> <Info className="w-5 h-5" />
</button> </button>
{/* 收藏按钮 */}
{onToggleFavorite && (
<button
onClick={handleToggleFavorite}
className={`p-2 rounded-lg transition-colors ${
currentPhoto.is_cover ? 'text-red-500 hover:bg-red-50' : 'text-gray-600 hover:bg-gray-100'
}`}
title="收藏"
>
<Heart className={`w-5 h-5 ${currentPhoto.is_cover ? 'fill-current' : ''}`} />
</button>
)}
{/* 缩放控制 */} {/* 缩放控制 */}
<button <button

View File

@ -160,28 +160,7 @@ const ModelDetail: React.FC = () => {
} }
}; };
// 切换照片收藏状态(新的图片画廊组件使用)
const handleTogglePhotoFavorite = async (photo: ModelPhoto) => {
if (!id) return;
try {
if (!photo.is_cover) {
// 设置为封面照片
await videoGenerationService.setCoverPhoto(id, photo.id);
} else {
// 取消封面照片这里需要设置另一张照片为封面或者实现取消封面的API
console.log('取消封面照片功能待实现');
// TODO: 实现取消封面照片的功能
}
// 重新加载模特详情以获取最新的照片列表
await loadModelDetail();
await loadDashboardStats(); // 更新统计信息
} catch (err) {
console.error('切换照片收藏状态失败:', err);
setError(err as string);
}
};
// 加载穿搭图片生成记录 // 加载穿搭图片生成记录
const loadOutfitRecords = async () => { const loadOutfitRecords = async () => {
@ -495,7 +474,6 @@ const ModelDetail: React.FC = () => {
photos={model.photos} photos={model.photos}
onUpload={handleBatchUploadPhotos} onUpload={handleBatchUploadPhotos}
onDelete={handleDeletePhoto} onDelete={handleDeletePhoto}
onToggleFavorite={handleTogglePhotoFavorite}
isUploading={uploadingPhotos} isUploading={uploadingPhotos}
/> />
</div> </div>