79 lines
3.9 KiB
TypeScript
79 lines
3.9 KiB
TypeScript
|
|
import React from 'react';
|
|
import { Eye, Star } from 'lucide-react';
|
|
import { Business } from '../../types';
|
|
|
|
const MousePointerClick = ({className}: {className?:string}) => (
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className={className}>
|
|
<path d="M14 4.1 12 6" /><path d="m5.1 8-2.9-.8" /><path d="m6 12-1.9 2" /><path d="M7.2 2.2 8 5.1" /><path d="M9.037 9.69a.498.498 0 0 1 .653-.653l11 4.5a.5.5 0 0 1-.074.949l-4.349 1.041a1 1 0 0 0-.74.739l-1.04 4.35a.5.5 0 0 1-.95.074z" />
|
|
</svg>
|
|
);
|
|
|
|
const DashboardOverview = ({ business }: { business: Business }) => (
|
|
<div className="space-y-6">
|
|
<h2 className="text-2xl font-bold font-serif text-gray-900">Tableau de bord</h2>
|
|
<div className="grid grid-cols-1 gap-5 sm:grid-cols-3">
|
|
<div className="bg-white overflow-hidden shadow rounded-lg">
|
|
<div className="p-5">
|
|
<div className="flex items-center">
|
|
<div className="flex-shrink-0 bg-brand-100 rounded-md p-3">
|
|
<Eye className="h-6 w-6 text-brand-600" />
|
|
</div>
|
|
<div className="ml-5 w-0 flex-1">
|
|
<dl>
|
|
<dt className="text-sm font-medium text-gray-500 truncate">Vues de la fiche</dt>
|
|
<dd>
|
|
<div className="text-lg font-medium text-gray-900">{business.viewCount}</div>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="bg-white overflow-hidden shadow rounded-lg">
|
|
<div className="p-5">
|
|
<div className="flex items-center">
|
|
<div className="flex-shrink-0 bg-blue-100 rounded-md p-3">
|
|
<MousePointerClick className="h-6 w-6 text-blue-600" />
|
|
</div>
|
|
<div className="ml-5 w-0 flex-1">
|
|
<dl>
|
|
<dt className="text-sm font-medium text-gray-500 truncate">Clics Contact</dt>
|
|
<dd>
|
|
<div className="text-lg font-medium text-gray-900">42</div>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="bg-white overflow-hidden shadow rounded-lg">
|
|
<div className="p-5">
|
|
<div className="flex items-center">
|
|
<div className="flex-shrink-0 bg-yellow-100 rounded-md p-3">
|
|
<Star className="h-6 w-6 text-yellow-600" />
|
|
</div>
|
|
<div className="ml-5 w-0 flex-1">
|
|
<dl>
|
|
<dt className="text-sm font-medium text-gray-500 truncate">Note moyenne</dt>
|
|
<dd>
|
|
<div className="text-lg font-medium text-gray-900">{business.rating}/5</div>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="bg-white shadow rounded-lg p-6">
|
|
<h3 className="text-lg leading-6 font-medium text-gray-900 mb-4">Performances 30 derniers jours</h3>
|
|
<div className="h-64 bg-gray-50 rounded border border-dashed border-gray-200 flex items-center justify-center text-gray-400">
|
|
Graphique des visites (À venir en Phase 2)
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
|
|
export default DashboardOverview;
|