61 lines
1.8 KiB
TypeScript
61 lines
1.8 KiB
TypeScript
'use client'
|
||
|
||
import React from 'react'
|
||
import ObjectCard, { ObjectData } from './ObjectCard'
|
||
|
||
interface ObjectGalleryProps {
|
||
objects: ObjectData[]
|
||
title?: string
|
||
onObjectSelect?: (objectId: string) => void
|
||
selectedObjectId?: string | null
|
||
className?: string
|
||
}
|
||
|
||
const ObjectGallery: React.FC<ObjectGalleryProps> = ({
|
||
objects,
|
||
title = 'Объекты',
|
||
onObjectSelect,
|
||
selectedObjectId,
|
||
className = ''
|
||
}) => {
|
||
|
||
const handleObjectSelect = (objectId: string) => {
|
||
if (onObjectSelect) {
|
||
onObjectSelect(objectId)
|
||
}
|
||
}
|
||
|
||
return (
|
||
<div className={`w-full ${className}`}>
|
||
{/* Галерея объектов */}
|
||
{objects.length > 0 ? (
|
||
<section className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-[18px] w-full">
|
||
{objects.map((object) => (
|
||
<ObjectCard
|
||
key={object.object_id}
|
||
object={object}
|
||
onSelect={handleObjectSelect}
|
||
isSelected={selectedObjectId === object.object_id}
|
||
/>
|
||
))}
|
||
</section>
|
||
) : (
|
||
<div className="flex items-center justify-center h-64 w-full">
|
||
<div className="text-center">
|
||
<div className="text-[#71717a] mb-2">
|
||
<svg className="w-12 h-12 mx-auto" fill="currentColor" viewBox="0 0 24 24">
|
||
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" />
|
||
</svg>
|
||
</div>
|
||
<h3 className="text-lg font-medium text-white mb-2">Объекты не найдены</h3>
|
||
<p className="text-[#71717a]">Нет доступных объектов</p>
|
||
</div>
|
||
</div>
|
||
)}
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default ObjectGallery
|
||
export type { ObjectGalleryProps }
|