import React, { useState, useEffect } from 'react';
import { Input, Button, Card, Typography, Space, Alert } from 'antd';
import { useParams } from 'react-router-dom';
import {ImageViewer} from '@/components/ImageUploader';


const { Title, Text } = Typography;

const CustomerImageViewer = () => {

    const [ossKey, setOssKey] = useState('');
    const [showUploader, setShowUploader] = useState(false);
    const { key } = useParams();

    useEffect(() => {
        console.log(key);
        // const key = `temp/tour-guide/2025-6/31278`;
        setOssKey(key);
        setShowUploader(true);
    }, []);

    return (
        <div>
            <Alert
                message="信息提示"
                description="您可以在此页面查看与旅行相关的所有图片，支持点击放大等操作。"
                type="info"
                showIcon
            />
            <br/>

            {showUploader ? (
                <div>
                    <ImageViewer osskey={ossKey} type='222' />
                </div>
            ) : (
                <div>
                    <Text style={{ display: 'block', color: '#874d00', fontSize: '16px' }}>
                        无法提取客户信息
                    </Text>
                </div>
            )}
        </div>
    );
};

export default CustomerImageViewer;