105 lines
4.0 KiB
TypeScript
105 lines
4.0 KiB
TypeScript
"use client";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { Card } from "@/components/ui/card";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const utilities = [
|
|
{
|
|
title: "تاریخچه مشتری",
|
|
description: "پاسخ‌های پرتکرار را ذخیره کنید و با یک کلیک ارسال کنید.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-1.svg",
|
|
imageAlt: "مدیریت تیکت",
|
|
},
|
|
{
|
|
title: "صندوق یکپارچه",
|
|
description:
|
|
"همه کانال‌های ارتباطی را در یک محیط مدیریت کنید و هیچ پیامی گم نشود.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-2.svg",
|
|
imageAlt: "داشبورد رضایت",
|
|
},
|
|
{
|
|
title: "اولویت‌بندی تیکت",
|
|
description:
|
|
"تیکت‌های مهم بر اساس قرارداد یا شدت مسئله در صف بالاتر قرار می‌گیرند.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-3.svg",
|
|
imageAlt: "مرکز پشتیبانی مشتری",
|
|
},
|
|
{
|
|
title: "پایگاه دانش",
|
|
description: "مشتریان و تیم با مقالات راهنما سریع‌تر به پاسخ می‌رسند.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-4.svg",
|
|
imageAlt: "مدیریت تیکت",
|
|
},
|
|
{
|
|
title: "پاسخ آماده",
|
|
description: "پاسخ‌های پرتکرار را ذخیره کنید و با یک کلیک ارسال کنید.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-5.svg",
|
|
imageAlt: "داشبورد رضایت",
|
|
},
|
|
{
|
|
title: "SLA هوشمند",
|
|
description:
|
|
"همه کانال‌های ارتباطی را در یک محیط مدیریت کنید و هیچ پیامی گم نشود.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-6.svg",
|
|
imageAlt: "مرکز پشتیبانی مشتری",
|
|
},
|
|
];
|
|
|
|
interface Feature148Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Feature148 = ({ className }: Feature148Props) => {
|
|
return (
|
|
<section
|
|
dir="rtl"
|
|
lang="fa"
|
|
className={cn(
|
|
"relative w-full max-w-full overflow-hidden py-32",
|
|
className,
|
|
)}
|
|
>
|
|
<div className="container min-w-0 max-w-full">
|
|
<div className="mx-auto mb-16 flex w-full min-w-0 max-w-xl flex-col items-center text-center md:mb-24">
|
|
<h2 className="mb-6 max-w-full text-3xl font-semibold text-balance break-words lg:text-2xll">
|
|
زمان حل مسئله را کوتاه کنید
|
|
</h2>
|
|
<p className="mx-auto max-w-full text-lg text-pretty break-words lg:text-xl">
|
|
کیفیت پاسخگویی را قابل اندازه‌گیری کنید
|
|
</p>
|
|
<p className="mt-4 max-w-full text-sm text-pretty break-words text-muted-foreground md:text-base">
|
|
تیکت‌های مهم بر اساس قرارداد یا شدت مسئله در صف بالاتر قرار
|
|
می‌گیرند.
|
|
</p>
|
|
<Button asChild className="mt-8 max-w-full rounded-xl" size="lg">
|
|
<a href="#">مشاهده امکانات</a>
|
|
</Button>
|
|
</div>
|
|
<div className="mt-11 grid w-full min-w-0 grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
|
|
{utilities.map((utility) => (
|
|
<Card
|
|
key={utility.title}
|
|
className="min-w-0 max-w-full overflow-hidden border-0 pt-0"
|
|
>
|
|
<img
|
|
src={utility.image}
|
|
alt={utility.imageAlt}
|
|
className="aspect-video w-full max-w-full rounded-t-xl object-cover"
|
|
/>
|
|
<div className="min-w-0 p-5 text-start">
|
|
<p className="mb-1 font-medium break-words">{utility.title}</p>
|
|
<p className="text-pretty break-words text-muted-foreground">
|
|
{utility.description}
|
|
</p>
|
|
</div>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature148 };
|