40 lines
1.5 KiB
JavaScript
40 lines
1.5 KiB
JavaScript
import List from "./List";
|
|
import Slider from "./Slider";
|
|
import Image from "next/image";
|
|
import CustomLoading from "@/app/component/loading/Custom";
|
|
import { imageUrl } from "@/helper";
|
|
|
|
function Images({ data }) {
|
|
const images_clinic = data?.images_clinic || [];
|
|
|
|
// کلینیک بدون عکس، بلوک تصویر ندارد — تصویر پیشفرض بهجای «عکسی ثبت نشده»
|
|
// خوانده میشود و کاربر آن را عکس واقعی کلینیک فرض میکند.
|
|
if (images_clinic.length === 0) return null;
|
|
|
|
return (
|
|
<div
|
|
className=" flex flex-col md:flex-row items-center mb-[8px] justify-center w-full gap-[12px] md:gap-[18px] lg:gap-[24px] overflow-hidden "
|
|
>
|
|
<div className="w-full">
|
|
<div
|
|
className={`grid grid-cols-1 grid-rows-1 gap-[12px] md:gap-[18px] lg:gap-[24px] h-[290px] max-h-[290px] ${images_clinic.length === 1 ? "md:grid-cols-1 h-[350px] max-h-[350px]" : "md:grid-cols-2"}`}
|
|
>
|
|
<CustomLoading width={600} height={400}>
|
|
<Image
|
|
className="rounded-[8px] overflow-hidden w-full h-full object-cover"
|
|
src={imageUrl(images_clinic[0]?.url, "/assets/images/clinic-img.png")}
|
|
alt="img clinic"
|
|
height={432}
|
|
width={600}
|
|
/>
|
|
</CustomLoading>
|
|
<List data={data} />
|
|
</div>
|
|
</div>
|
|
<Slider data={data} />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Images;
|