'use client';
import React from 'react';
import { Carousel } from 'antd';

const CarouselDemo: React.FC = () => {
	// 轮播图数据
	const slides = [
		{
			id: 1,
			image: '/header.png',
			content: '两会闭幕 从春天出发',
		},
		{
			id: 2,
			image: '/header.png',
			content: '习近平主席重要讲话',
		},
		{
			id: 3,
			image: '/header.png',
			content: '全国人大代表步出人民大会堂',
		},
	];

	return (
		<div >
			<Carousel 
				autoplay 
				style={{ height: '100%' }}
				className="h-full"
			>
				{slides.map((slide) => (
					<div key={slide.id} >
						<img 
            className='bg-cover bg-center'
							src={slide.image} 
							alt={slide.content} 
							style={{ height: '540px', width: '100%', objectFit: 'fill' }}
						/>
					</div>
				))}
			</Carousel>
		</div>
	);
};

export default CarouselDemo;