mirror of
https://github.com/x1xhlol/system-prompts-and-models-of-ai-tools.git
synced 2026-06-18 15:29:36 +00:00
feat: 4 new frontend pages — partners, use-cases, pricing, trust
Visual identity consistent with existing premium dark theme: - /partners: 4 partner models + revenue calculator + founder direct - /use-cases: 6 sectors (agencies, real estate, clinics, ecommerce, websites, B2B) - /pricing: 4 offers (audit free, pilot 499, starter 990, agency 1499-2999) + bank details - /trust: 6 safety principles + platform rules + opt-out policy All pages: Arabic RTL, Tailwind, same color system (navy/teal/amber/emerald), consistent footer navigation, Calendly CTAs, founder phone 0597788539 https://claude.ai/code/session_01W1rJthWDkasijTdXCfxVHs
This commit is contained in:
Claude
parent
2f376ed97a
commit
59f33d0dc3
201
salesflow-saas/frontend/src/app/partners/page.tsx
Normal file
201
salesflow-saas/frontend/src/app/partners/page.tsx
Normal file
@ -0,0 +1,201 @@
|
|||||||
|
import Link from "next/link";
|
||||||
|
import {
|
||||||
|
Users,
|
||||||
|
Briefcase,
|
||||||
|
Zap,
|
||||||
|
Shield,
|
||||||
|
CheckCircle,
|
||||||
|
Calendar,
|
||||||
|
DollarSign,
|
||||||
|
ArrowLeft,
|
||||||
|
Building2,
|
||||||
|
Handshake,
|
||||||
|
} from "lucide-react";
|
||||||
|
|
||||||
|
export const metadata = {
|
||||||
|
title: "Dealix — شراكة الوكالات والشركاء",
|
||||||
|
description:
|
||||||
|
"كن شريك Dealix. أضف خدمة متابعة وتحويل leads لعملائك واربح من أول اشتراك مدفوع.",
|
||||||
|
};
|
||||||
|
|
||||||
|
const CALENDLY = "https://calendly.com/sami-assiri11/dealix-demo";
|
||||||
|
|
||||||
|
const partnerModels = [
|
||||||
|
{
|
||||||
|
icon: Users,
|
||||||
|
name: "شريك إحالة",
|
||||||
|
desc: "عرّفنا على شركة مناسبة. Dealix يتولى الديمو والتشغيل. تستحق عمولتك بعد الدفع المؤكد.",
|
||||||
|
earn: "10-20% من أول فاتورة",
|
||||||
|
color: "emerald",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Briefcase,
|
||||||
|
name: "شريك بيع / وكالة",
|
||||||
|
desc: "بيع Dealix ضمن خدماتك التسويقية. احتفظ بهامش خدمتك وDealix يشغّل طبقة المتابعة والحجز.",
|
||||||
|
earn: "20% MRR + 50% setup fee",
|
||||||
|
color: "amber",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Handshake,
|
||||||
|
name: "تبادل خدمات",
|
||||||
|
desc: "ساعد بالمحتوى أو الإحالات أو الوصول لعملاء. Dealix يدعمك بتجربة وتشغيل مشترك لمدة 30 يوم.",
|
||||||
|
earn: "pilot مجاني + co-selling",
|
||||||
|
color: "blue",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Building2,
|
||||||
|
name: "شريك تنفيذ",
|
||||||
|
desc: "أنت تساعد بالـ setup والتكامل. Dealix يوفّر المنتج والـ playbook. العميل يدفع باقة مشتركة.",
|
||||||
|
earn: "implementation fee",
|
||||||
|
color: "purple",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function PartnersPage() {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-gradient-to-b from-slate-950 via-slate-900 to-slate-950 text-slate-100">
|
||||||
|
{/* Hero */}
|
||||||
|
<section className="mx-auto max-w-4xl px-6 pb-16 pt-20 text-center">
|
||||||
|
<span className="inline-block rounded-full bg-emerald-500/10 px-4 py-1.5 text-sm font-medium text-emerald-400 ring-1 ring-emerald-500/20">
|
||||||
|
برنامج الشراكات
|
||||||
|
</span>
|
||||||
|
<h1 className="mt-6 text-4xl font-extrabold leading-tight lg:text-5xl">
|
||||||
|
اربح من{" "}
|
||||||
|
<span className="bg-gradient-to-l from-emerald-400 to-teal-500 bg-clip-text text-transparent">
|
||||||
|
أول اشتراك مدفوع
|
||||||
|
</span>
|
||||||
|
</h1>
|
||||||
|
<p className="mx-auto mt-6 max-w-2xl text-lg leading-relaxed text-slate-300">
|
||||||
|
أنت تجيب العملاء. Dealix يشغّل طبقة المتابعة والحجز والتقارير. اربح من
|
||||||
|
أول اشتراك مدفوع مؤهل يأتي عن طريقك.
|
||||||
|
</p>
|
||||||
|
<div className="mt-8 flex flex-wrap justify-center gap-4">
|
||||||
|
<a
|
||||||
|
href={CALENDLY}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="inline-flex items-center gap-2 rounded-xl bg-emerald-500 px-8 py-3.5 text-base font-bold text-white transition hover:bg-emerald-400"
|
||||||
|
>
|
||||||
|
<Calendar className="h-5 w-5" />
|
||||||
|
احجز مكالمة شراكة
|
||||||
|
</a>
|
||||||
|
<Link
|
||||||
|
href="/marketers"
|
||||||
|
className="inline-flex items-center gap-2 rounded-xl border border-white/20 px-8 py-3.5 text-base font-medium transition hover:bg-white/10"
|
||||||
|
>
|
||||||
|
صفحة المسوّقين
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Partner Models */}
|
||||||
|
<section className="border-y border-white/10 bg-slate-900/50 py-16">
|
||||||
|
<div className="mx-auto max-w-5xl px-6">
|
||||||
|
<h2 className="text-center text-2xl font-bold">4 نماذج شراكة</h2>
|
||||||
|
<div className="mt-10 grid gap-6 sm:grid-cols-2">
|
||||||
|
{partnerModels.map((m) => (
|
||||||
|
<div
|
||||||
|
key={m.name}
|
||||||
|
className="rounded-2xl border border-white/10 bg-white/5 p-6"
|
||||||
|
>
|
||||||
|
<m.icon className="h-8 w-8 text-emerald-400" />
|
||||||
|
<h3 className="mt-4 text-lg font-semibold">{m.name}</h3>
|
||||||
|
<p className="mt-2 text-sm text-slate-400">{m.desc}</p>
|
||||||
|
<div className="mt-4 inline-block rounded-lg bg-emerald-500/10 px-3 py-1 text-sm font-medium text-emerald-400">
|
||||||
|
{m.earn}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* How It Works */}
|
||||||
|
<section className="py-16">
|
||||||
|
<div className="mx-auto max-w-3xl px-6 text-center">
|
||||||
|
<h2 className="text-2xl font-bold">كيف تبدأ</h2>
|
||||||
|
<div className="mt-8 grid gap-6 sm:grid-cols-3">
|
||||||
|
{[
|
||||||
|
{ step: "١", title: "اختر عميل", desc: "عميل واحد عندك يعاني من ضياع leads" },
|
||||||
|
{ step: "٢", title: "نسوي pilot", desc: "7 أيام مجاناً لأول عميل — نثبت القيمة" },
|
||||||
|
{ step: "٣", title: "نكمّل ونربح", desc: "لو اشتغل → خدمة شهرية. أنت العلاقة، أنا التشغيل" },
|
||||||
|
].map((s) => (
|
||||||
|
<div key={s.step} className="rounded-xl border border-white/10 bg-white/5 p-6">
|
||||||
|
<div className="mx-auto flex h-10 w-10 items-center justify-center rounded-full bg-emerald-500 text-lg font-bold text-white">
|
||||||
|
{s.step}
|
||||||
|
</div>
|
||||||
|
<h3 className="mt-4 font-semibold">{s.title}</h3>
|
||||||
|
<p className="mt-2 text-sm text-slate-400">{s.desc}</p>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Revenue Calculator */}
|
||||||
|
<section className="border-y border-white/10 bg-slate-900/50 py-16">
|
||||||
|
<div className="mx-auto max-w-3xl px-6 text-center">
|
||||||
|
<DollarSign className="mx-auto h-10 w-10 text-amber-400" />
|
||||||
|
<h2 className="mt-4 text-2xl font-bold">كم تقدر تربح كشريك؟</h2>
|
||||||
|
<div className="mt-6 grid gap-4 sm:grid-cols-3">
|
||||||
|
<div className="rounded-xl border border-white/10 bg-white/5 p-4">
|
||||||
|
<div className="text-3xl font-extrabold text-amber-400">14,880</div>
|
||||||
|
<div className="mt-1 text-sm text-slate-400">ريال/سنة من عميل واحد</div>
|
||||||
|
</div>
|
||||||
|
<div className="rounded-xl border border-white/10 bg-white/5 p-4">
|
||||||
|
<div className="text-3xl font-extrabold text-amber-400">74,400</div>
|
||||||
|
<div className="mt-1 text-sm text-slate-400">ريال/سنة من 5 عملاء</div>
|
||||||
|
</div>
|
||||||
|
<div className="rounded-xl border border-white/10 bg-white/5 p-4">
|
||||||
|
<div className="text-3xl font-extrabold text-amber-400">223,800</div>
|
||||||
|
<div className="mt-1 text-sm text-slate-400">ريال/سنة كشريك نشط</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Founder Direct */}
|
||||||
|
<section className="py-10">
|
||||||
|
<div className="mx-auto max-w-2xl px-6 text-center">
|
||||||
|
<p className="text-lg text-slate-300">أي سؤال؟ تواصل مع المؤسس مباشرة:</p>
|
||||||
|
<a href="tel:+966597788539" className="mt-3 inline-block text-2xl font-bold text-amber-400 hover:text-amber-300" dir="ltr">0597788539</a>
|
||||||
|
<p className="mt-1 text-sm text-slate-500">سامي العسيري — مؤسس Dealix</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* CTA */}
|
||||||
|
<section className="border-t border-white/10 py-20">
|
||||||
|
<div className="mx-auto max-w-2xl px-6 text-center">
|
||||||
|
<h2 className="text-3xl font-extrabold">
|
||||||
|
ابدأ بعميل واحد — <span className="text-emerald-400">مجاناً</span>
|
||||||
|
</h2>
|
||||||
|
<p className="mt-4 text-lg text-slate-300">
|
||||||
|
أول عميل عندك = pilot 7 أيام مجاناً. لو اشتغل تبدأ تحصّل. لو ما اشتغل لا التزام.
|
||||||
|
</p>
|
||||||
|
<a
|
||||||
|
href={CALENDLY}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="mt-8 inline-flex items-center gap-2 rounded-xl bg-emerald-500 px-8 py-4 text-lg font-bold text-white transition hover:bg-emerald-400"
|
||||||
|
>
|
||||||
|
<Handshake className="h-5 w-5" />
|
||||||
|
كن شريك Dealix
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Footer */}
|
||||||
|
<footer className="border-t border-white/10 py-8">
|
||||||
|
<div className="mx-auto flex max-w-4xl flex-wrap items-center justify-center gap-6 px-6 text-sm text-slate-500">
|
||||||
|
<Link href="/" className="hover:text-teal-400">الرئيسية</Link>
|
||||||
|
<Link href="/marketers" className="hover:text-teal-400">المسوّقين</Link>
|
||||||
|
<Link href="/pricing" className="hover:text-teal-400">الباقات</Link>
|
||||||
|
<Link href="/use-cases" className="hover:text-teal-400">حالات الاستخدام</Link>
|
||||||
|
<Link href="/trust" className="hover:text-teal-400">الأمان</Link>
|
||||||
|
<Link href="/privacy" className="hover:text-teal-400">الخصوصية</Link>
|
||||||
|
<span>© {new Date().getFullYear()} Dealix</span>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
174
salesflow-saas/frontend/src/app/pricing/page.tsx
Normal file
174
salesflow-saas/frontend/src/app/pricing/page.tsx
Normal file
@ -0,0 +1,174 @@
|
|||||||
|
import Link from "next/link";
|
||||||
|
import { CheckCircle, Calendar, Star, Zap, Building2, Handshake } from "lucide-react";
|
||||||
|
|
||||||
|
export const metadata = {
|
||||||
|
title: "Dealix — الباقات والأسعار",
|
||||||
|
description: "من audit مجاني لـ pilot 499 ريال لـ starter 990/شهر. ابدأ بعميل واحد.",
|
||||||
|
};
|
||||||
|
|
||||||
|
const CALENDLY = "https://calendly.com/sami-assiri11/dealix-demo";
|
||||||
|
|
||||||
|
const plans = [
|
||||||
|
{
|
||||||
|
name: "Speed-to-Lead Audit",
|
||||||
|
price: "مجاني",
|
||||||
|
period: "",
|
||||||
|
desc: "تحليل أين تضيع leads عندك — يفتح الباب",
|
||||||
|
features: [
|
||||||
|
"تحليل سرعة الرد الحالية",
|
||||||
|
"تقييم follow-up",
|
||||||
|
"توصية flow بسيط",
|
||||||
|
"اقتراح pilot مخصص",
|
||||||
|
],
|
||||||
|
cta: "اطلب Audit مجاني",
|
||||||
|
highlight: false,
|
||||||
|
icon: Zap,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Pilot",
|
||||||
|
price: "499",
|
||||||
|
period: "ريال — 7 أيام",
|
||||||
|
desc: "أول تجربة حقيقية — ضمان استرداد كامل",
|
||||||
|
features: [
|
||||||
|
"قناة واحدة (واتساب أو إيميل أو نماذج)",
|
||||||
|
"حد 20 lead",
|
||||||
|
"رسائل متابعة مخصصة",
|
||||||
|
"تصنيف ردود (7 categories)",
|
||||||
|
"تقرير نهاية التجربة",
|
||||||
|
"ضمان استرداد كامل",
|
||||||
|
],
|
||||||
|
cta: "ابدأ Pilot",
|
||||||
|
highlight: true,
|
||||||
|
icon: Star,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Starter",
|
||||||
|
price: "990",
|
||||||
|
period: "ريال/شهر",
|
||||||
|
desc: "للشركات الجادة — واتساب + إيميل + تقارير",
|
||||||
|
features: [
|
||||||
|
"واتساب + إيميل",
|
||||||
|
"follow-up sequences",
|
||||||
|
"lead tracker",
|
||||||
|
"booking CTA",
|
||||||
|
"تقرير أسبوعي",
|
||||||
|
"بدون عقد سنوي",
|
||||||
|
],
|
||||||
|
cta: "اشترك بـ Starter",
|
||||||
|
highlight: false,
|
||||||
|
icon: Building2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Agency Add-on",
|
||||||
|
price: "1,499 — 2,999",
|
||||||
|
period: "ريال",
|
||||||
|
desc: "للوكالات — خدمة جديدة تبيعونها لعملائكم",
|
||||||
|
features: [
|
||||||
|
"إعداد لعميل واحد",
|
||||||
|
"سكريبتات متابعة مخصصة",
|
||||||
|
"tracker + تقارير",
|
||||||
|
"تدريب بسيط للوكالة",
|
||||||
|
"قوالب بيع للعميل",
|
||||||
|
"20% MRR + 50% setup fee لكم",
|
||||||
|
],
|
||||||
|
cta: "كن شريك وكالة",
|
||||||
|
highlight: false,
|
||||||
|
icon: Handshake,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function PricingPage() {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-gradient-to-b from-slate-950 via-slate-900 to-slate-950 text-slate-100">
|
||||||
|
{/* Hero */}
|
||||||
|
<section className="mx-auto max-w-4xl px-6 pb-12 pt-20 text-center">
|
||||||
|
<h1 className="text-4xl font-extrabold lg:text-5xl">
|
||||||
|
باقات{" "}
|
||||||
|
<span className="bg-gradient-to-l from-amber-400 to-amber-600 bg-clip-text text-transparent">
|
||||||
|
بسيطة وواضحة
|
||||||
|
</span>
|
||||||
|
</h1>
|
||||||
|
<p className="mx-auto mt-6 max-w-2xl text-lg text-slate-300">
|
||||||
|
ابدأ بـ audit مجاني أو pilot بـ 499 ريال. لا عقود طويلة. ضمان استرداد.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Plans */}
|
||||||
|
<section className="pb-20">
|
||||||
|
<div className="mx-auto max-w-5xl px-6">
|
||||||
|
<div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-4">
|
||||||
|
{plans.map((plan) => (
|
||||||
|
<div
|
||||||
|
key={plan.name}
|
||||||
|
className={`relative flex flex-col rounded-2xl border p-6 ${
|
||||||
|
plan.highlight
|
||||||
|
? "border-amber-500/50 bg-amber-500/5 ring-1 ring-amber-500/20"
|
||||||
|
: "border-white/10 bg-white/5"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
{plan.highlight && (
|
||||||
|
<span className="absolute -top-3 start-4 rounded-full bg-amber-500 px-3 py-0.5 text-xs font-bold text-slate-900">
|
||||||
|
الأكثر طلباً
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
<plan.icon className={`h-7 w-7 ${plan.highlight ? "text-amber-400" : "text-teal-400"}`} />
|
||||||
|
<h3 className="mt-3 text-lg font-bold">{plan.name}</h3>
|
||||||
|
<div className="mt-2">
|
||||||
|
<span className="text-3xl font-extrabold text-white">{plan.price}</span>
|
||||||
|
{plan.period && <span className="text-sm text-slate-400"> {plan.period}</span>}
|
||||||
|
</div>
|
||||||
|
<p className="mt-2 text-sm text-slate-400">{plan.desc}</p>
|
||||||
|
<ul className="mt-4 flex-1 space-y-2">
|
||||||
|
{plan.features.map((f) => (
|
||||||
|
<li key={f} className="flex items-start gap-2 text-sm text-slate-300">
|
||||||
|
<CheckCircle className="mt-0.5 h-4 w-4 shrink-0 text-emerald-500" />
|
||||||
|
{f}
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
<a
|
||||||
|
href={CALENDLY}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className={`mt-6 block rounded-xl py-3 text-center font-bold transition ${
|
||||||
|
plan.highlight
|
||||||
|
? "bg-amber-500 text-slate-900 hover:bg-amber-400"
|
||||||
|
: "border border-white/20 text-white hover:bg-white/10"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
{plan.cta}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Bank Transfer */}
|
||||||
|
<section className="border-y border-white/10 bg-slate-900/50 py-12">
|
||||||
|
<div className="mx-auto max-w-2xl px-6 text-center">
|
||||||
|
<h2 className="text-xl font-bold">الدفع عبر تحويل بنكي</h2>
|
||||||
|
<div className="mt-4 rounded-xl border border-white/10 bg-white/5 p-6 text-start" dir="rtl">
|
||||||
|
<p className="text-sm text-slate-300">البنك: <strong className="text-white">مصرف الإنماء</strong></p>
|
||||||
|
<p className="mt-1 text-sm text-slate-300">الاسم: <strong className="text-white">سامي محمد زايد عسيري — ذكاء الاعمال</strong></p>
|
||||||
|
<p className="mt-1 text-sm text-slate-300">IBAN: <strong className="text-white font-mono" dir="ltr">SA3305000068207328877000</strong></p>
|
||||||
|
</div>
|
||||||
|
<p className="mt-4 text-sm text-slate-500">بعد التحويل أرسل الإيصال ونفعّل النظام خلال 24 ساعة</p>
|
||||||
|
<p className="mt-2 text-sm text-slate-400">أي سؤال: <a href="tel:+966597788539" className="text-amber-400 hover:text-amber-300" dir="ltr">0597788539</a></p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Footer */}
|
||||||
|
<footer className="border-t border-white/10 py-8">
|
||||||
|
<div className="mx-auto flex max-w-4xl flex-wrap items-center justify-center gap-6 px-6 text-sm text-slate-500">
|
||||||
|
<Link href="/" className="hover:text-teal-400">الرئيسية</Link>
|
||||||
|
<Link href="/marketers" className="hover:text-teal-400">المسوّقين</Link>
|
||||||
|
<Link href="/partners" className="hover:text-teal-400">الشراكات</Link>
|
||||||
|
<Link href="/use-cases" className="hover:text-teal-400">حالات الاستخدام</Link>
|
||||||
|
<Link href="/trust" className="hover:text-teal-400">الأمان</Link>
|
||||||
|
<span>© {new Date().getFullYear()} Dealix</span>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
152
salesflow-saas/frontend/src/app/trust/page.tsx
Normal file
152
salesflow-saas/frontend/src/app/trust/page.tsx
Normal file
@ -0,0 +1,152 @@
|
|||||||
|
import Link from "next/link";
|
||||||
|
import { Shield, CheckCircle, Calendar, Lock, Eye, UserCheck, Ban } from "lucide-react";
|
||||||
|
|
||||||
|
export const metadata = {
|
||||||
|
title: "Dealix — الأمان والثقة",
|
||||||
|
description: "كيف Dealix يحمي بياناتك ويلتزم بسياسات المنصات وأنظمة حماية البيانات.",
|
||||||
|
};
|
||||||
|
|
||||||
|
const CALENDLY = "https://calendly.com/sami-assiri11/dealix-demo";
|
||||||
|
|
||||||
|
const principles = [
|
||||||
|
{
|
||||||
|
icon: UserCheck,
|
||||||
|
title: "إرسال بموافقة بشرية",
|
||||||
|
desc: "AI يجهّز ويصيغ ويقترح. الإنسان يوافق ويرسل. لا رسائل تلقائية بدون موافقة.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Ban,
|
||||||
|
title: "لا Spam ولا Scraping",
|
||||||
|
desc: "لا نكشط LinkedIn. لا نرسل WhatsApp عشوائي. لا mass DMs. لا fake engagement.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Shield,
|
||||||
|
title: "احترام سياسات المنصات",
|
||||||
|
desc: "نلتزم بقواعد LinkedIn وX وInstagram وWhatsApp. يدوي + human-approved فقط.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Eye,
|
||||||
|
title: "شفافية كاملة",
|
||||||
|
desc: "كل رسالة فيها هوية واضحة + سبب التواصل + خيار إيقاف.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Lock,
|
||||||
|
title: "حماية البيانات (PDPL)",
|
||||||
|
desc: "نحترم نظام حماية البيانات الشخصية السعودي. بياناتك ما تُشارك مع أطراف ثالثة.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: CheckCircle,
|
||||||
|
title: "ادعاءات مثبتة فقط",
|
||||||
|
desc: "لا نقول 'مضمون' ولا 'أفضل' ولا '100%'. نقول 'مصمم لـ' و'يساعد في' و'pilot لقياس النتائج'.",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const platformRules = [
|
||||||
|
{ platform: "LinkedIn", rule: "لا bots / لا scraping / لا automated DMs / يدوي فقط" },
|
||||||
|
{ platform: "X / Twitter", rule: "لا automated mass mentions / replies / محتوى + ردود يدوية" },
|
||||||
|
{ platform: "Instagram", rule: "لا mass cold DMs / inbound + warm فقط" },
|
||||||
|
{ platform: "WhatsApp", rule: "warm + opted-in فقط / opt-out إلزامي / stop فوري" },
|
||||||
|
{ platform: "Email", rule: "targeted + هوية واضحة + opt-out / max 3 في sequence" },
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function TrustPage() {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-gradient-to-b from-slate-950 via-slate-900 to-slate-950 text-slate-100">
|
||||||
|
{/* Hero */}
|
||||||
|
<section className="mx-auto max-w-4xl px-6 pb-12 pt-20 text-center">
|
||||||
|
<Shield className="mx-auto h-12 w-12 text-emerald-400" />
|
||||||
|
<h1 className="mt-6 text-4xl font-extrabold lg:text-5xl">
|
||||||
|
الأمان{" "}
|
||||||
|
<span className="bg-gradient-to-l from-emerald-400 to-teal-500 bg-clip-text text-transparent">
|
||||||
|
والثقة
|
||||||
|
</span>
|
||||||
|
</h1>
|
||||||
|
<p className="mx-auto mt-6 max-w-2xl text-lg text-slate-300">
|
||||||
|
Dealix مبني على مبدأ: الذكاء يجهّز، الإنسان يوافق، النظام يتتبّع. لا spam. لا scraping. لا ادعاءات كاذبة.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Principles */}
|
||||||
|
<section className="border-y border-white/10 bg-slate-900/50 py-16">
|
||||||
|
<div className="mx-auto max-w-5xl px-6">
|
||||||
|
<h2 className="text-center text-2xl font-bold">6 مبادئ أساسية</h2>
|
||||||
|
<div className="mt-10 grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
|
||||||
|
{principles.map((p) => (
|
||||||
|
<div key={p.title} className="rounded-2xl border border-white/10 bg-white/5 p-6">
|
||||||
|
<p.icon className="h-8 w-8 text-emerald-400" />
|
||||||
|
<h3 className="mt-4 font-semibold">{p.title}</h3>
|
||||||
|
<p className="mt-2 text-sm text-slate-400">{p.desc}</p>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Platform Rules */}
|
||||||
|
<section className="py-16">
|
||||||
|
<div className="mx-auto max-w-3xl px-6">
|
||||||
|
<h2 className="text-center text-2xl font-bold">قواعد كل منصة</h2>
|
||||||
|
<div className="mt-8 space-y-3">
|
||||||
|
{platformRules.map((r) => (
|
||||||
|
<div key={r.platform} className="flex items-start gap-4 rounded-xl border border-white/10 bg-white/5 p-4">
|
||||||
|
<span className="shrink-0 rounded-lg bg-emerald-500/10 px-3 py-1 text-sm font-bold text-emerald-400">
|
||||||
|
{r.platform}
|
||||||
|
</span>
|
||||||
|
<span className="text-sm text-slate-300">{r.rule}</span>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Opt-out */}
|
||||||
|
<section className="border-y border-white/10 bg-slate-900/50 py-12">
|
||||||
|
<div className="mx-auto max-w-2xl px-6 text-center">
|
||||||
|
<h2 className="text-xl font-bold">حق الإيقاف</h2>
|
||||||
|
<p className="mt-4 text-slate-300">
|
||||||
|
كل رسالة أولى من Dealix تنتهي بـ:
|
||||||
|
</p>
|
||||||
|
<div className="mt-4 rounded-xl border border-white/10 bg-white/5 p-4 text-slate-300">
|
||||||
|
“إذا ما يناسبكم هالنوع من الرسائل، ردوا <strong className="text-amber-400">“إيقاف”</strong> وما بنتواصل مرة ثانية.”
|
||||||
|
</div>
|
||||||
|
<p className="mt-4 text-sm text-slate-500">
|
||||||
|
لو أحد قال “إيقاف” أو “لا” أو “stop” — نوقف فوراً. بدون استثناء.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* CTA */}
|
||||||
|
<section className="py-16">
|
||||||
|
<div className="mx-auto max-w-2xl px-6 text-center">
|
||||||
|
<p className="text-lg text-slate-300">
|
||||||
|
أي سؤال عن الأمان؟ تواصل مع المؤسس مباشرة:
|
||||||
|
</p>
|
||||||
|
<a href="tel:+966597788539" className="mt-3 inline-block text-2xl font-bold text-amber-400" dir="ltr">0597788539</a>
|
||||||
|
<p className="mt-1 text-sm text-slate-500">سامي العسيري — مؤسس Dealix</p>
|
||||||
|
<a
|
||||||
|
href={CALENDLY}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="mt-6 inline-flex items-center gap-2 rounded-xl bg-emerald-500 px-8 py-3.5 text-base font-bold text-white transition hover:bg-emerald-400"
|
||||||
|
>
|
||||||
|
<Calendar className="h-5 w-5" />
|
||||||
|
احجز ديمو آمن
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Footer */}
|
||||||
|
<footer className="border-t border-white/10 py-8">
|
||||||
|
<div className="mx-auto flex max-w-4xl flex-wrap items-center justify-center gap-6 px-6 text-sm text-slate-500">
|
||||||
|
<Link href="/" className="hover:text-teal-400">الرئيسية</Link>
|
||||||
|
<Link href="/marketers" className="hover:text-teal-400">المسوّقين</Link>
|
||||||
|
<Link href="/partners" className="hover:text-teal-400">الشراكات</Link>
|
||||||
|
<Link href="/pricing" className="hover:text-teal-400">الباقات</Link>
|
||||||
|
<Link href="/use-cases" className="hover:text-teal-400">حالات الاستخدام</Link>
|
||||||
|
<Link href="/privacy" className="hover:text-teal-400">الخصوصية</Link>
|
||||||
|
<span>© {new Date().getFullYear()} Dealix</span>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
168
salesflow-saas/frontend/src/app/use-cases/page.tsx
Normal file
168
salesflow-saas/frontend/src/app/use-cases/page.tsx
Normal file
@ -0,0 +1,168 @@
|
|||||||
|
import Link from "next/link";
|
||||||
|
import {
|
||||||
|
Building2,
|
||||||
|
Heart,
|
||||||
|
ShoppingCart,
|
||||||
|
Globe,
|
||||||
|
Briefcase,
|
||||||
|
GraduationCap,
|
||||||
|
Calendar,
|
||||||
|
CheckCircle,
|
||||||
|
ArrowLeft,
|
||||||
|
} from "lucide-react";
|
||||||
|
|
||||||
|
export const metadata = {
|
||||||
|
title: "Dealix — حالات الاستخدام",
|
||||||
|
description: "كيف Dealix يساعد كل قطاع يحوّل الاستفسارات لإيراد.",
|
||||||
|
};
|
||||||
|
|
||||||
|
const CALENDLY = "https://calendly.com/sami-assiri11/dealix-demo";
|
||||||
|
|
||||||
|
const useCases = [
|
||||||
|
{
|
||||||
|
icon: Briefcase,
|
||||||
|
sector: "وكالات التسويق",
|
||||||
|
pain: "عملاؤكم يصرفون على إعلانات والـ leads تضيع بعد الكلك",
|
||||||
|
solution: "Dealix يصير خدمة جديدة تبيعونها: متابعة + حجز + تقارير",
|
||||||
|
offer: "Agency Partner Pilot",
|
||||||
|
color: "amber",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Building2,
|
||||||
|
sector: "العقارات",
|
||||||
|
pain: "60% من استفسارات الأسعار والمواقع ما تُتابع خلال ساعة",
|
||||||
|
solution: "رد خلال 45 ثانية + فرز الجاد + حجز موعد معاينة",
|
||||||
|
offer: "Speed-to-Lead Pilot — 499 ريال",
|
||||||
|
color: "teal",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Heart,
|
||||||
|
sector: "العيادات والمراكز",
|
||||||
|
pain: "استفسارات واتساب كثيرة ما تتحول لمواعيد",
|
||||||
|
solution: "فرز الاستفسارات + متابعة المتردد + حجز الموعد تلقائياً",
|
||||||
|
offer: "Booking Follow-up Pilot — 499 ريال",
|
||||||
|
color: "rose",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: ShoppingCart,
|
||||||
|
sector: "المتاجر الإلكترونية",
|
||||||
|
pain: "محادثات واتساب/إنستغرام مهجورة بدون إغلاق",
|
||||||
|
solution: "رد فوري على 'هل متوفر؟' و'كم التوصيل؟' + تحويل للشراء",
|
||||||
|
offer: "Inquiry-to-Order Pilot — 499 ريال",
|
||||||
|
color: "violet",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Globe,
|
||||||
|
sector: "وكالات المواقع والبرمجة",
|
||||||
|
pain: "المشروع ينتهي عند تسليم الموقع — لا recurring revenue",
|
||||||
|
solution: "أضف Dealix كخدمة بعد الموقع: نماذج → متابعة → حجز → تقرير",
|
||||||
|
offer: "Website-to-Lead Add-on",
|
||||||
|
color: "cyan",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: GraduationCap,
|
||||||
|
sector: "خدمات B2B والتدريب",
|
||||||
|
pain: "طلبات عروض وأسعار بدون متابعة منظمة",
|
||||||
|
solution: "تنظيم المتابعة بعد العرض: تذكير + سؤال + حجز موعد مناقشة",
|
||||||
|
offer: "Quote Follow-up Pilot — 499 ريال",
|
||||||
|
color: "orange",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const colorMap: Record<string, string> = {
|
||||||
|
amber: "border-amber-500/20 bg-amber-500/5",
|
||||||
|
teal: "border-teal-500/20 bg-teal-500/5",
|
||||||
|
rose: "border-rose-500/20 bg-rose-500/5",
|
||||||
|
violet: "border-violet-500/20 bg-violet-500/5",
|
||||||
|
cyan: "border-cyan-500/20 bg-cyan-500/5",
|
||||||
|
orange: "border-orange-500/20 bg-orange-500/5",
|
||||||
|
};
|
||||||
|
|
||||||
|
const iconColorMap: Record<string, string> = {
|
||||||
|
amber: "text-amber-400",
|
||||||
|
teal: "text-teal-400",
|
||||||
|
rose: "text-rose-400",
|
||||||
|
violet: "text-violet-400",
|
||||||
|
cyan: "text-cyan-400",
|
||||||
|
orange: "text-orange-400",
|
||||||
|
};
|
||||||
|
|
||||||
|
export default function UseCasesPage() {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-gradient-to-b from-slate-950 via-slate-900 to-slate-950 text-slate-100">
|
||||||
|
{/* Hero */}
|
||||||
|
<section className="mx-auto max-w-4xl px-6 pb-12 pt-20 text-center">
|
||||||
|
<h1 className="text-4xl font-extrabold leading-tight lg:text-5xl">
|
||||||
|
كل قطاع عنده{" "}
|
||||||
|
<span className="bg-gradient-to-l from-teal-400 to-emerald-500 bg-clip-text text-transparent">
|
||||||
|
leads تضيع
|
||||||
|
</span>
|
||||||
|
</h1>
|
||||||
|
<p className="mx-auto mt-6 max-w-2xl text-lg text-slate-300">
|
||||||
|
Dealix يحوّل الاستفسارات من واتساب، الإيميل، النماذج، والحملات إلى متابعة وحجز وإيراد — لكل قطاع.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Use Cases Grid */}
|
||||||
|
<section className="pb-20">
|
||||||
|
<div className="mx-auto max-w-5xl px-6">
|
||||||
|
<div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
|
||||||
|
{useCases.map((uc) => (
|
||||||
|
<div
|
||||||
|
key={uc.sector}
|
||||||
|
className={`flex flex-col rounded-2xl border p-6 ${colorMap[uc.color]}`}
|
||||||
|
>
|
||||||
|
<uc.icon className={`h-8 w-8 ${iconColorMap[uc.color]}`} />
|
||||||
|
<h3 className="mt-4 text-lg font-bold">{uc.sector}</h3>
|
||||||
|
<p className="mt-2 text-sm text-slate-400">
|
||||||
|
<strong className="text-red-400">الألم:</strong> {uc.pain}
|
||||||
|
</p>
|
||||||
|
<p className="mt-2 text-sm text-slate-400">
|
||||||
|
<strong className="text-emerald-400">الحل:</strong> {uc.solution}
|
||||||
|
</p>
|
||||||
|
<div className="mt-auto pt-4">
|
||||||
|
<span className="inline-block rounded-lg bg-white/10 px-3 py-1 text-xs font-medium text-slate-300">
|
||||||
|
{uc.offer}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* CTA */}
|
||||||
|
<section className="border-t border-white/10 py-16">
|
||||||
|
<div className="mx-auto max-w-2xl px-6 text-center">
|
||||||
|
<h2 className="text-2xl font-bold">
|
||||||
|
قطاعك موجود؟ <span className="text-teal-400">جرّب Dealix</span>
|
||||||
|
</h2>
|
||||||
|
<p className="mt-4 text-slate-300">
|
||||||
|
Pilot 7 أيام بـ 499 ريال. ضمان استرداد كامل.
|
||||||
|
</p>
|
||||||
|
<a
|
||||||
|
href={CALENDLY}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="mt-8 inline-flex items-center gap-2 rounded-xl bg-teal-500 px-8 py-3.5 text-base font-bold text-white transition hover:bg-teal-400"
|
||||||
|
>
|
||||||
|
<Calendar className="h-5 w-5" />
|
||||||
|
احجز ديمو 10 دقائق
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Footer */}
|
||||||
|
<footer className="border-t border-white/10 py-8">
|
||||||
|
<div className="mx-auto flex max-w-4xl flex-wrap items-center justify-center gap-6 px-6 text-sm text-slate-500">
|
||||||
|
<Link href="/" className="hover:text-teal-400">الرئيسية</Link>
|
||||||
|
<Link href="/marketers" className="hover:text-teal-400">المسوّقين</Link>
|
||||||
|
<Link href="/partners" className="hover:text-teal-400">الشراكات</Link>
|
||||||
|
<Link href="/pricing" className="hover:text-teal-400">الباقات</Link>
|
||||||
|
<Link href="/trust" className="hover:text-teal-400">الأمان</Link>
|
||||||
|
<span>© {new Date().getFullYear()} Dealix</span>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user