213 lines
10 KiB
Vue
213 lines
10 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import { Head, Link } from '@inertiajs/vue3';
|
||
|
|
import { dashboard, login, register } from '@/routes';
|
||
|
|
import AppLogoIcon from '@/components/AppLogoIcon.vue';
|
||
|
|
import { Button } from '@/components/ui/button';
|
||
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
|
||
|
|
import { Separator } from '@/components/ui/separator';
|
||
|
|
import {
|
||
|
|
Building2,
|
||
|
|
Calendar,
|
||
|
|
FileCheck,
|
||
|
|
Mail,
|
||
|
|
Shield,
|
||
|
|
Users,
|
||
|
|
} from 'lucide-vue-next';
|
||
|
|
|
||
|
|
withDefaults(
|
||
|
|
defineProps<{
|
||
|
|
canRegister: boolean;
|
||
|
|
}>(),
|
||
|
|
{
|
||
|
|
canRegister: true,
|
||
|
|
},
|
||
|
|
);
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<Head :title="`${$page.props.name} — Gestion des dossiers fiscaux`" />
|
||
|
|
|
||
|
|
<div class="min-h-screen bg-background">
|
||
|
|
<!-- Header -->
|
||
|
|
<header class="sticky top-0 z-50 border-b border-sidebar-border/70 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
|
||
|
|
<div class="mx-auto flex h-16 max-w-6xl items-center justify-between px-4">
|
||
|
|
<Link href="/" class="flex items-center gap-2 font-semibold">
|
||
|
|
<AppLogoIcon class="size-8 fill-current text-primary" />
|
||
|
|
<span>{{ $page.props.name }}</span>
|
||
|
|
</Link>
|
||
|
|
<nav class="flex items-center gap-4">
|
||
|
|
<template v-if="$page.props.auth.user">
|
||
|
|
<Button as-child>
|
||
|
|
<Link :href="dashboard()">Tableau de bord</Link>
|
||
|
|
</Button>
|
||
|
|
</template>
|
||
|
|
<template v-else>
|
||
|
|
<Button variant="ghost" as-child>
|
||
|
|
<Link :href="login()">Connexion</Link>
|
||
|
|
</Button>
|
||
|
|
<Button v-if="canRegister" as-child>
|
||
|
|
<Link :href="register()">Créer un compte</Link>
|
||
|
|
</Button>
|
||
|
|
</template>
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<main>
|
||
|
|
<!-- Hero -->
|
||
|
|
<section class="px-4 py-20 md:py-28">
|
||
|
|
<div class="mx-auto max-w-4xl text-center">
|
||
|
|
<h1 class="text-4xl font-bold tracking-tight sm:text-5xl lg:text-6xl">
|
||
|
|
Simplifiez la gestion des
|
||
|
|
<span class="text-primary">dossiers fiscaux</span>
|
||
|
|
</h1>
|
||
|
|
<p class="mt-6 max-w-2xl mx-auto text-lg text-muted-foreground">
|
||
|
|
Plateforme dédiée aux cabinets d'expertise comptable au Maroc.
|
||
|
|
Centralisez les documents, les demandes de pièces et les validations clients en un seul endroit.
|
||
|
|
</p>
|
||
|
|
<div class="mt-10 flex flex-wrap items-center justify-center gap-4">
|
||
|
|
<template v-if="$page.props.auth.user">
|
||
|
|
<Button size="lg" as-child>
|
||
|
|
<Link :href="dashboard()">Accéder au tableau de bord</Link>
|
||
|
|
</Button>
|
||
|
|
</template>
|
||
|
|
<template v-else>
|
||
|
|
<Button size="lg" as-child>
|
||
|
|
<Link :href="register()">Commencer gratuitement</Link>
|
||
|
|
</Button>
|
||
|
|
<Button size="lg" variant="outline" as-child>
|
||
|
|
<Link :href="login()">Se connecter</Link>
|
||
|
|
</Button>
|
||
|
|
</template>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<Separator />
|
||
|
|
|
||
|
|
<!-- Features -->
|
||
|
|
<section class="px-4 py-20">
|
||
|
|
<div class="mx-auto max-w-6xl">
|
||
|
|
<div class="text-center mb-16">
|
||
|
|
<h2 class="text-3xl font-bold tracking-tight sm:text-4xl">
|
||
|
|
Tout ce dont votre cabinet a besoin
|
||
|
|
</h2>
|
||
|
|
<p class="mt-4 max-w-2xl mx-auto text-muted-foreground">
|
||
|
|
Une solution complète pour gérer les échanges de documents fiscaux avec vos clients.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<div class="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
|
||
|
|
<Card>
|
||
|
|
<CardHeader>
|
||
|
|
<div class="mb-2 flex size-12 items-center justify-center rounded-lg bg-primary/10">
|
||
|
|
<Users class="size-6 text-primary" />
|
||
|
|
</div>
|
||
|
|
<CardTitle>Gestion des clients</CardTitle>
|
||
|
|
<CardDescription>
|
||
|
|
Gérez vos clients et leurs informations (ICE, IF, RC, CNSS…)
|
||
|
|
</CardDescription>
|
||
|
|
</CardHeader>
|
||
|
|
</Card>
|
||
|
|
<Card>
|
||
|
|
<CardHeader>
|
||
|
|
<div class="mb-2 flex size-12 items-center justify-center rounded-lg bg-primary/10">
|
||
|
|
<Calendar class="size-6 text-primary" />
|
||
|
|
</div>
|
||
|
|
<CardTitle>Dossiers par type</CardTitle>
|
||
|
|
<CardDescription>
|
||
|
|
TVA, IS, IR, CNSS, Bilan annuel — créez et suivez vos dossiers
|
||
|
|
</CardDescription>
|
||
|
|
</CardHeader>
|
||
|
|
</Card>
|
||
|
|
<Card>
|
||
|
|
<CardHeader>
|
||
|
|
<div class="mb-2 flex size-12 items-center justify-center rounded-lg bg-primary/10">
|
||
|
|
<Mail class="size-6 text-primary" />
|
||
|
|
</div>
|
||
|
|
<CardTitle>Invitations sécurisées</CardTitle>
|
||
|
|
<CardDescription>
|
||
|
|
Envoyez des liens par email pour que vos clients déposent leurs documents
|
||
|
|
</CardDescription>
|
||
|
|
</CardHeader>
|
||
|
|
</Card>
|
||
|
|
<Card>
|
||
|
|
<CardHeader>
|
||
|
|
<div class="mb-2 flex size-12 items-center justify-center rounded-lg bg-primary/10">
|
||
|
|
<FileCheck class="size-6 text-primary" />
|
||
|
|
</div>
|
||
|
|
<CardTitle>Documents centralisés</CardTitle>
|
||
|
|
<CardDescription>
|
||
|
|
Tous les documents dans un espace unique, avec historique et téléchargement
|
||
|
|
</CardDescription>
|
||
|
|
</CardHeader>
|
||
|
|
</Card>
|
||
|
|
<!-- <Card>
|
||
|
|
<CardHeader>
|
||
|
|
<div class="mb-2 flex size-12 items-center justify-center rounded-lg bg-primary/10">
|
||
|
|
<Building2 class="size-6 text-primary" />
|
||
|
|
</div>
|
||
|
|
<CardTitle>Multi-tenant</CardTitle>
|
||
|
|
<CardDescription>
|
||
|
|
Un workspace par cabinet, isolation complète des données
|
||
|
|
</CardDescription>
|
||
|
|
</CardHeader>
|
||
|
|
</Card> -->
|
||
|
|
<Card>
|
||
|
|
<CardHeader>
|
||
|
|
<div class="mb-2 flex size-12 items-center justify-center rounded-lg bg-primary/10">
|
||
|
|
<Shield class="size-6 text-primary" />
|
||
|
|
</div>
|
||
|
|
<CardTitle>Validation client</CardTitle>
|
||
|
|
<CardDescription>
|
||
|
|
Demandez une confirmation avec signature pour valider vos situations
|
||
|
|
</CardDescription>
|
||
|
|
</CardHeader>
|
||
|
|
</Card>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<Separator />
|
||
|
|
|
||
|
|
<!-- CTA -->
|
||
|
|
<section class="px-4 py-20">
|
||
|
|
<div class="mx-auto max-w-4xl text-center">
|
||
|
|
<h2 class="text-3xl font-bold tracking-tight sm:text-4xl">
|
||
|
|
Prêt à simplifier votre quotidien ?
|
||
|
|
</h2>
|
||
|
|
<p class="mt-4 text-muted-foreground">
|
||
|
|
Rejoignez les cabinets qui font confiance à {{ $page.props.name }}.
|
||
|
|
</p>
|
||
|
|
<div class="mt-8">
|
||
|
|
<template v-if="$page.props.auth.user">
|
||
|
|
<Button size="lg" as-child>
|
||
|
|
<Link :href="dashboard()">Accéder au tableau de bord</Link>
|
||
|
|
</Button>
|
||
|
|
</template>
|
||
|
|
<template v-else>
|
||
|
|
<Button size="lg" as-child>
|
||
|
|
<Link :href="register()">Créer un compte gratuit</Link>
|
||
|
|
</Button>
|
||
|
|
</template>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
</main>
|
||
|
|
|
||
|
|
<!-- Footer -->
|
||
|
|
<footer class="border-t border-sidebar-border/70 py-8">
|
||
|
|
<div class="mx-auto max-w-6xl px-4">
|
||
|
|
<div class="flex flex-col items-center justify-between gap-4 sm:flex-row">
|
||
|
|
<div class="flex items-center gap-2">
|
||
|
|
<AppLogoIcon class="size-5 fill-current text-muted-foreground" />
|
||
|
|
<span class="text-sm text-muted-foreground">{{ $page.props.name }}</span>
|
||
|
|
</div>
|
||
|
|
<p class="text-sm text-muted-foreground">
|
||
|
|
Tous droits réservés © {{ new Date().getFullYear() }} {{ $page.props.name }}.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
</template>
|