230417/smartagenda_pap
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

atualizações do dashboard

Browse Source
This commit is contained in:
230417
2026-03-03 14:59:19 +00:00
parent 0518f5dd96
commit 97d62a61f1
1 changed files with 26 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
web/src/pages/Dashboard.tsx
View File

@@ -13,7 +13,7 @@ import { Tabs } from '../components/ui/tabs';
import { currency } from '../lib/format';
import { useApp } from '../context/AppContext';
import { supabase } from '../lib/supabase';
import { Product } from '../types';
import { Product, BarberShop } from '../types';
import { BarChart, Bar, CartesianGrid, ResponsiveContainer, Tooltip, XAxis } from 'recharts';
import { CalendarWeekView } from '../components/CalendarWeekView';
import {
@@ -71,12 +71,35 @@ const parseDate = (value: string) => new Date(value.replace(' ', 'T'));
type TabId = 'overview' | 'appointments' | 'history' | 'orders' | 'services' | 'products' | 'barbers' | 'settings';
export default function Dashboard() {
const { user, shops, shopsReady } = useApp();
const shop = shops.find((s) => s.id === user?.shopId);
if (!user || user.role !== 'barbearia') return <div>Área exclusiva para barbearias.</div>;
if (!shop && !shopsReady) {
return (
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', height: '60vh' }}>
<div style={{ textAlign: 'center' }}>
<div style={{
width: 40, height: 40, border: '4px solid #e2e8f0', borderTopColor: '#6366f1',
borderRadius: '50%', animation: 'spin 0.8s linear infinite', margin: '0 auto 12px'
}} />
<p style={{ color: '#64748b', fontSize: 14 }}>A carregar painel...</p>
<style>{`@keyframes spin { to { transform: rotate(360deg); } }`}</style>
</div>
</div>
);
}
if (!shop) return <div>Barbearia não encontrada.</div>;
return <DashboardInner shop={shop} />;
}
function DashboardInner({ shop }: { shop: BarberShop }) {
// Importa estado global interligado com Supabase (ex: updateAppointmentStatus reflete-se na BD)
const {
user,
users,
shops,
shopsReady,
appointments,
orders,
updateAppointmentStatus,
@@ -90,10 +113,6 @@ export default function Dashboard() {
deleteBarber,
updateShopDetails,
} = useApp();
const shop = shops.find((s) => s.id === user?.shopId);
const [activeTab, setActiveTab] = useState<TabId>('overview');
const [period, setPeriod] = useState<keyof typeof periods>('semana');
@@ -115,26 +134,6 @@ export default function Dashboard() {
const [barberName, setBarberName] = useState('');
const [barberSpecs, setBarberSpecs] = useState('');
if (!user || user.role !== 'barbearia') return <div>Área exclusiva para barbearias.</div>;
// Aguarda o refreshShops terminar antes de declarar que a loja não existe
// (Evita o erro imediatamente após o registo quando os dados ainda estão a carregar)
if (!shop && !shopsReady) {
return (
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', height: '60vh' }}>
<div style={{ textAlign: 'center' }}>
<div style={{
width: 40, height: 40, border: '4px solid #e2e8f0', borderTopColor: '#6366f1',
borderRadius: '50%', animation: 'spin 0.8s linear infinite', margin: '0 auto 12px'
}} />
<p style={{ color: '#64748b', fontSize: 14 }}>A carregar painel...</p>
<style>{`@keyframes spin { to { transform: rotate(360deg); } }`}</style>
</div>
</div>
);
}
if (!shop) return <div>Barbearia não encontrada.</div>;
const periodMatch = periods[period];
// Agendamentos filtrados pela barbearia logada e pela janela de tempo selecionada