bakery-admin/bakery-ia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Create new services: inventory, recipes, suppliers

Browse Source
This commit is contained in:
Urtzi Alfaro
2025-08-13 17:39:35 +02:00
parent fbe7470ad9
commit 16b8a9d50c
151 changed files with 35799 additions and 857 deletions
Download Patch File Download Diff File Expand all files Collapse all files

203
frontend/src/pages/sales/SalesPage.tsx Normal file
View File

@@ -0,0 +1,203 @@
import React, { useState } from 'react';
import {
BarChart3,
ShoppingCart,
TrendingUp,
Package
} from 'lucide-react';
import { SalesAnalyticsDashboard, SalesManagementPage } from '../../components/sales';
import Button from '../../components/ui/Button';
type SalesPageView = 'overview' | 'analytics' | 'management';
const SalesPage: React.FC = () => {
const [activeView, setActiveView] = useState<SalesPageView>('overview');
const renderContent = () => {
switch (activeView) {
case 'analytics':
return <SalesAnalyticsDashboard />;
case 'management':
return <SalesManagementPage />;
case 'overview':
default:
return (
<div className="space-y-6">
{/* Overview Header */}
<div className="bg-gradient-to-r from-blue-600 to-blue-700 rounded-xl p-8 text-white">
<div className="flex items-center justify-between">
<div>
<h1 className="text-3xl font-bold mb-2">Panel de Ventas</h1>
<p className="text-blue-100">
Gestiona, analiza y optimiza tus ventas con insights inteligentes
</p>
</div>
<div className="w-16 h-16 bg-white bg-opacity-20 rounded-full flex items-center justify-center">
<ShoppingCart className="w-8 h-8 text-white" />
</div>
</div>
</div>
{/* Quick Actions */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
<div
onClick={() => setActiveView('analytics')}
className="bg-white rounded-xl p-6 border border-gray-200 hover:shadow-md transition-shadow cursor-pointer group"
>
<div className="flex items-center justify-between mb-4">
<div className="w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center group-hover:bg-blue-200 transition-colors">
<BarChart3 className="w-6 h-6 text-blue-600" />
</div>
<TrendingUp className="w-5 h-5 text-green-500" />
</div>
<h3 className="text-lg font-semibold text-gray-900 mb-2">
Análisis de Ventas
</h3>
<p className="text-gray-600 text-sm mb-4">
Explora métricas detalladas, tendencias y insights de rendimiento
</p>
<div className="flex items-center text-blue-600 text-sm font-medium">
Ver Analytics
<svg className="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 5l7 7-7 7" />
</svg>
</div>
</div>
<div
onClick={() => setActiveView('management')}
className="bg-white rounded-xl p-6 border border-gray-200 hover:shadow-md transition-shadow cursor-pointer group"
>
<div className="flex items-center justify-between mb-4">
<div className="w-12 h-12 bg-green-100 rounded-lg flex items-center justify-center group-hover:bg-green-200 transition-colors">
<Package className="w-6 h-6 text-green-600" />
</div>
<ShoppingCart className="w-5 h-5 text-blue-500" />
</div>
<h3 className="text-lg font-semibold text-gray-900 mb-2">
Gestión de Ventas
</h3>
<p className="text-gray-600 text-sm mb-4">
Administra, filtra y exporta todos tus registros de ventas
</p>
<div className="flex items-center text-green-600 text-sm font-medium">
Gestionar Ventas
<svg className="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 5l7 7-7 7" />
</svg>
</div>
</div>
<div className="bg-white rounded-xl p-6 border border-gray-200 hover:shadow-md transition-shadow cursor-pointer group">
<div className="flex items-center justify-between mb-4">
<div className="w-12 h-12 bg-purple-100 rounded-lg flex items-center justify-center group-hover:bg-purple-200 transition-colors">
<TrendingUp className="w-6 h-6 text-purple-600" />
</div>
<div className="text-xs bg-purple-100 text-purple-800 px-2 py-1 rounded-full">
Próximamente
</div>
</div>
<h3 className="text-lg font-semibold text-gray-900 mb-2">
Predicciones IA
</h3>
<p className="text-gray-600 text-sm mb-4">
Predicciones inteligentes y recomendaciones de ventas
</p>
<div className="flex items-center text-purple-600 text-sm font-medium opacity-50">
En Desarrollo
</div>
</div>
</div>
{/* Quick Insights */}
<div className="bg-white rounded-xl p-6 border border-gray-200">
<h2 className="text-xl font-semibold text-gray-900 mb-6">Insights Rápidos</h2>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
<div className="text-center">
<div className="w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-3">
<TrendingUp className="w-8 h-8 text-green-600" />
</div>
<div className="text-2xl font-bold text-gray-900 mb-1">+12.5%</div>
<div className="text-sm text-gray-600">Crecimiento mensual</div>
</div>
<div className="text-center">
<div className="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-3">
<ShoppingCart className="w-8 h-8 text-blue-600" />
</div>
<div className="text-2xl font-bold text-gray-900 mb-1">247</div>
<div className="text-sm text-gray-600">Pedidos este mes</div>
</div>
<div className="text-center">
<div className="w-16 h-16 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-3">
<Package className="w-8 h-8 text-purple-600" />
</div>
<div className="text-2xl font-bold text-gray-900 mb-1">18.50€</div>
<div className="text-sm text-gray-600">Valor promedio pedido</div>
</div>
<div className="text-center">
<div className="w-16 h-16 bg-orange-100 rounded-full flex items-center justify-center mx-auto mb-3">
<BarChart3 className="w-8 h-8 text-orange-600" />
</div>
<div className="text-2xl font-bold text-gray-900 mb-1">4.2</div>
<div className="text-sm text-gray-600">Puntuación satisfacción</div>
</div>
</div>
</div>
{/* Getting Started */}
<div className="bg-gradient-to-r from-indigo-50 to-purple-50 rounded-xl p-6 border border-indigo-200">
<h2 className="text-xl font-semibold text-gray-900 mb-4">¿Primera vez aquí?</h2>
<p className="text-gray-700 mb-6">
Comienza explorando tus análisis de ventas para descubrir insights valiosos
sobre el rendimiento de tu panadería.
</p>
<div className="flex flex-col sm:flex-row gap-3">
<Button
onClick={() => setActiveView('analytics')}
className="bg-indigo-600 hover:bg-indigo-700 text-white"
>
<BarChart3 className="w-4 h-4 mr-2" />
Ver Analytics
</Button>
<Button
variant="outline"
onClick={() => setActiveView('management')}
>
<Package className="w-4 h-4 mr-2" />
Gestionar Ventas
</Button>
</div>
</div>
</div>
);
}
};
return (
<div className="p-4 md:p-6 space-y-6">
{/* Navigation */}
{activeView !== 'overview' && (
<div className="flex items-center justify-between mb-6">
<nav className="flex items-center space-x-4">
<button
onClick={() => setActiveView('overview')}
className="text-gray-600 hover:text-gray-900 text-sm font-medium"
>
← Volver al Panel
</button>
</nav>
</div>
)}
{/* Content */}
{renderContent()}
</div>
);
};
export default SalesPage;