This commit is contained in:
Samandar Turgunboyev
2025-11-02 21:49:06 +05:00
parent 68f371db08
commit 9803edc478
7 changed files with 97 additions and 58 deletions

View File

@@ -245,28 +245,49 @@ const SupportAgency = () => {
{selected.travel_agency_documents &&
selected.travel_agency_documents.length > 0 ? (
<div className="grid grid-cols-2 sm:grid-cols-3 gap-3">
{selected.travel_agency_documents.map((doc, i) => (
<a
key={i}
href={doc.file}
target="_blank"
rel="noopener noreferrer"
className="group relative aspect-square border-2 border-gray-200 rounded-lg overflow-hidden hover:border-blue-500 transition"
>
<img
src={doc.file}
alt={`Hujjat ${i + 1}`}
className="w-full h-full object-cover"
/>
<div className="absolute inset-0 bg-black/0 group-hover:bg-black/10 transition flex items-end">
<div className="w-full bg-gradient-to-t from-black/70 to-transparent p-2">
<span className="text-white text-xs font-medium">
{t("Hujjat")} {i + 1}
</span>
{selected.travel_agency_documents.map((doc, i) => {
const isImage = /\.(jpg|jpeg|png|gif|webp)$/i.test(
doc.file,
);
const fileName = doc.file.split("/").pop();
return (
<a
key={i}
href={doc.file}
target="_blank"
rel="noopener noreferrer"
className="group relative aspect-square border-2 border-gray-200 rounded-lg overflow-hidden hover:border-blue-500 transition"
>
{isImage ? (
<img
src={doc.file}
alt={`Hujjat ${i + 1}`}
className="w-full h-full object-cover"
/>
) : (
<div className="w-full h-full flex flex-col items-center justify-center bg-gray-800 text-gray-300">
{/* <img
src="/icons/document-placeholder.png"
alt="Document icon"
className="w-10 h-10 mb-2 opacity-70"
/> */}
<span className="text-xl text-center truncate px-2">
{fileName}
</span>
</div>
)}
<div className="absolute inset-0 bg-black/0 group-hover:bg-black/10 transition flex items-end">
<div className="w-full bg-gradient-to-t from-black/70 to-transparent p-2">
<span className="text-white text-xs font-medium">
{t("Hujjat")} {i + 1}
</span>
</div>
</div>
</div>
</a>
))}
</a>
);
})}
</div>
) : (
<div className="text-gray-500">{t("Hujjat topilmadi")}</div>