51 lines
1.6 KiB
JavaScript
51 lines
1.6 KiB
JavaScript
"use client";
|
|
import { useEffect, useState } from "react";
|
|
import Image from "next/image";
|
|
import Services from "./Services";
|
|
import Address from "./Address";
|
|
import Telefon from "./Telefon";
|
|
import ImageProfile from "./ImageProfile";
|
|
import QrImg from "./QrImg";
|
|
import { getStateInfoClient } from "@/lib/getStateInfoClient";
|
|
|
|
function Poster({ data, onQrReady }) {
|
|
const [siteName, setSiteName] = useState("");
|
|
|
|
useEffect(() => {
|
|
const { matchedCity, host } = getStateInfoClient();
|
|
setSiteName(matchedCity?.domain || host || "");
|
|
}, []);
|
|
|
|
return (
|
|
<div className="bg-poster overflow-hidden !pt-[32px] p-[24px] relative flex justify-between items-start">
|
|
<div>
|
|
<div className="flex items-center justify-start gap-[5px]">
|
|
<Image src="/assets/images/logo.png" width={30} height={30} alt="logo" />
|
|
<p className="text-[#E7EEF6] text-[16px] font-bold !-translate-y-1">
|
|
{siteName}
|
|
</p>
|
|
</div>
|
|
<p className="mt-[40px] text-[#E7EEF6] text-[20px] font-bold text-right">
|
|
{data?.name}
|
|
</p>
|
|
<p className="text-[24px] mt-[20px] text-[#E7EEF6] font-bold text-right">
|
|
تخصص:
|
|
{data?.specialties?.map(
|
|
(item, idx) =>
|
|
`${item.name} ${data.specialties.length === idx + 1 ? "" : "|"} `
|
|
)}
|
|
</p>
|
|
<Services data={data} />
|
|
<Address data={data} />
|
|
<Telefon data={data} />
|
|
</div>
|
|
<div className="flex flex-col justify-between items-end min-w-[200px]">
|
|
<ImageProfile data={data} />
|
|
<QrImg onReady={onQrReady} />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Poster;
|