import { View, Image } from '@tarojs/components';
import './index.css';

interface UploadCardProps {
  imageUrl: string;
  title: string;
  onUpload: () => void;
  className?: string;
}

export default function UploadCard({ imageUrl, title, onUpload, className = '' }: UploadCardProps) {
  return (
    <View className={`upload-card ${className}`} onClick={onUpload}>
      <View className="upload-content">
        {imageUrl ? (
          <Image src={imageUrl} className="upload-image" mode="aspectFill" />
        ) : (
          <View className="upload-placeholder">
            <Image src="/assets/icons/photo.png" className="upload-icon" mode="aspectFit" />
            <View className="upload-title">{title}</View>
          </View>
        )}
      </View>
    </View>
  );
}