develop #83
@ -103,7 +103,7 @@ export default function AgendamentoPage() {
|
|||||||
</Button>
|
</Button>
|
||||||
</Link> */}
|
</Link> */}
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownMenuTrigger className="bg-blue-600 hover:bg-blue-700 px-5 py-1 text-white rounded-sm">
|
<DropdownMenuTrigger className="bg-primary hover:bg-primary/90 px-5 py-1 text-primary-foreground rounded-sm">
|
||||||
Opções »
|
Opções »
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
<DropdownMenuContent>
|
<DropdownMenuContent>
|
||||||
|
|||||||
@ -41,14 +41,14 @@ export default function RelatoriosPage() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-6">
|
<div className="p-6 bg-background min-h-screen">
|
||||||
<h1 className="text-2xl font-bold mb-6">Relatórios</h1>
|
<h1 className="text-2xl font-bold mb-6 text-foreground">Relatórios</h1>
|
||||||
|
|
||||||
<div className="grid grid-cols-3 gap-6">
|
<div className="grid grid-cols-3 gap-6">
|
||||||
{/* Card Consultas */}
|
{/* Card Consultas */}
|
||||||
<div className="p-4 border rounded-lg shadow">
|
<div className="p-4 border border-border rounded-lg shadow bg-card">
|
||||||
<h2 className="font-semibold text-lg">Relatório de Consultas</h2>
|
<h2 className="font-semibold text-lg text-foreground">Relatório de Consultas</h2>
|
||||||
<p className="text-sm text-gray-500">Resumo das consultas realizadas.</p>
|
<p className="text-sm text-muted-foreground">Resumo das consultas realizadas.</p>
|
||||||
{/* PASSO 4 - Botão chama a função */}
|
{/* PASSO 4 - Botão chama a função */}
|
||||||
<Button onClick={exportConsultasPDF} className="mt-4">
|
<Button onClick={exportConsultasPDF} className="mt-4">
|
||||||
<FileDown className="mr-2 h-4 w-4" /> Exportar PDF
|
<FileDown className="mr-2 h-4 w-4" /> Exportar PDF
|
||||||
@ -56,17 +56,17 @@ export default function RelatoriosPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Card Pacientes */}
|
{/* Card Pacientes */}
|
||||||
<div className="p-4 border rounded-lg shadow">
|
<div className="p-4 border border-border rounded-lg shadow bg-card">
|
||||||
<h2 className="font-semibold text-lg">Relatório de Pacientes</h2>
|
<h2 className="font-semibold text-lg text-foreground">Relatório de Pacientes</h2>
|
||||||
<p className="text-sm text-gray-500">Informações gerais dos pacientes cadastrados.</p>
|
<p className="text-sm text-muted-foreground">Informações gerais dos pacientes cadastrados.</p>
|
||||||
<Button onClick={exportPacientesPDF} className="mt-4">
|
<Button onClick={exportPacientesPDF} className="mt-4">
|
||||||
<FileDown className="mr-2 h-4 w-4" /> Exportar PDF
|
<FileDown className="mr-2 h-4 w-4" /> Exportar PDF
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Card Financeiro com gráfico */}
|
{/* Card Financeiro com gráfico */}
|
||||||
<div className="p-4 border rounded-lg shadow col-span-3 md:col-span-3">
|
<div className="p-4 border border-border rounded-lg shadow col-span-3 md:col-span-3 bg-card">
|
||||||
<h2 className="font-semibold text-lg mb-2">Relatório Financeiro</h2>
|
<h2 className="font-semibold text-lg mb-2 text-foreground">Relatório Financeiro</h2>
|
||||||
<ResponsiveContainer width="100%" height={300}>
|
<ResponsiveContainer width="100%" height={300}>
|
||||||
<BarChart data={financeiro} margin={{ top: 20, right: 30, left: 20, bottom: 5 }}>
|
<BarChart data={financeiro} margin={{ top: 20, right: 30, left: 20, bottom: 5 }}>
|
||||||
<CartesianGrid strokeDasharray="3 3" />
|
<CartesianGrid strokeDasharray="3 3" />
|
||||||
|
|||||||
@ -19,7 +19,7 @@ export default function NovoAgendamentoPage() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen flex flex-col bg-white">
|
<div className="min-h-screen flex flex-col bg-background">
|
||||||
<HeaderAgenda />
|
<HeaderAgenda />
|
||||||
<main className="flex-1 mx-auto w-full max-w-7xl px-8 py-8">
|
<main className="flex-1 mx-auto w-full max-w-7xl px-8 py-8">
|
||||||
<CalendarRegistrationForm
|
<CalendarRegistrationForm
|
||||||
|
|||||||
148
susconecta/app/financeiro/page.tsx
Normal file
148
susconecta/app/financeiro/page.tsx
Normal file
@ -0,0 +1,148 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import Link from "next/link";
|
||||||
|
import { usePathname, useRouter } from "next/navigation";
|
||||||
|
import { useState } from "react";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { Input } from "@/components/ui/input";
|
||||||
|
import { Label } from "@/components/ui/label";
|
||||||
|
import { Switch } from "@/components/ui/switch";
|
||||||
|
import { Search, ChevronDown, Calculator, DollarSign } from "lucide-react";
|
||||||
|
import { Plus } from "lucide-react";
|
||||||
|
import HeaderAgenda from "@/components/agenda/HeaderAgenda";
|
||||||
|
import FooterAgenda from "@/components/agenda/FooterAgenda";
|
||||||
|
|
||||||
|
export default function FinanceiroPage() {
|
||||||
|
const pathname = usePathname();
|
||||||
|
const router = useRouter();
|
||||||
|
const [bloqueio, setBloqueio] = useState(false);
|
||||||
|
|
||||||
|
const isAg = pathname?.startsWith("/agendamento");
|
||||||
|
const isPr = pathname?.startsWith("/procedimento");
|
||||||
|
const isFi = pathname?.startsWith("/financeiro");
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="w-full min-h-screen flex flex-col bg-background">
|
||||||
|
{/* HEADER */}
|
||||||
|
<HeaderAgenda />
|
||||||
|
|
||||||
|
{/* CORPO */}
|
||||||
|
<main className="mx-auto w-full max-w-7xl px-8 py-6 space-y-6 flex-grow">
|
||||||
|
{/* INFORMAÇÕES FINANCEIRAS */}
|
||||||
|
<section className="space-y-6">
|
||||||
|
{/* Selo Financeiro */}
|
||||||
|
<div className="inline-flex items-center gap-2 border border-border px-3 py-1.5 bg-card text-[12px] rounded-md cursor-pointer hover:bg-muted">
|
||||||
|
<span className="flex h-5 w-5 items-center justify-center rounded-full border border-border bg-muted text-muted-foreground">
|
||||||
|
<DollarSign className="h-3 w-3" strokeWidth={2} />
|
||||||
|
</span>
|
||||||
|
<span className="text-foreground">Informações Financeiras</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Traço separador */}
|
||||||
|
<div className="border-b border-border" />
|
||||||
|
|
||||||
|
{/* VALOR DO ATENDIMENTO */}
|
||||||
|
<div className="space-y-4">
|
||||||
|
<Label className="text-[13px] text-foreground/80">
|
||||||
|
Valor do Atendimento
|
||||||
|
</Label>
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||||
|
<div className="space-y-2">
|
||||||
|
<Label className="text-xs text-muted-foreground">Valor Particular</Label>
|
||||||
|
<div className="relative">
|
||||||
|
<DollarSign className="pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
||||||
|
<Input
|
||||||
|
placeholder="R$ 0,00"
|
||||||
|
className="h-10 w-full rounded-md pl-8 pr-4 border-input focus-visible:ring-1 focus-visible:ring-sky-500 focus-visible:border-sky-500"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<Label className="text-xs text-muted-foreground">Valor Convênio</Label>
|
||||||
|
<div className="relative">
|
||||||
|
<DollarSign className="pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
||||||
|
<Input
|
||||||
|
placeholder="R$ 0,00"
|
||||||
|
className="h-10 w-full rounded-md pl-8 pr-4 border-input focus-visible:ring-1 focus-visible:ring-sky-500 focus-visible:border-sky-500"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Traço separador */}
|
||||||
|
<div className="border-b border-border" />
|
||||||
|
|
||||||
|
{/* FORMA DE PAGAMENTO */}
|
||||||
|
<div className="space-y-4">
|
||||||
|
<Label className="text-[13px] text-foreground/80">
|
||||||
|
Forma de Pagamento
|
||||||
|
</Label>
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||||
|
<div className="space-y-2">
|
||||||
|
<Label className="text-xs text-muted-foreground">Tipo</Label>
|
||||||
|
<select className="h-10 w-full rounded-md border border-input bg-background text-foreground pr-8 pl-3 text-[13px] appearance-none">
|
||||||
|
<option value="">Selecionar</option>
|
||||||
|
<option value="dinheiro">Dinheiro</option>
|
||||||
|
<option value="cartao">Cartão</option>
|
||||||
|
<option value="pix">PIX</option>
|
||||||
|
<option value="convenio">Convênio</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<Label className="text-xs text-muted-foreground">Parcelas</Label>
|
||||||
|
<select className="h-10 w-full rounded-md border border-input bg-background text-foreground pr-8 pl-3 text-[13px] appearance-none">
|
||||||
|
<option value="1">1x</option>
|
||||||
|
<option value="2">2x</option>
|
||||||
|
<option value="3">3x</option>
|
||||||
|
<option value="4">4x</option>
|
||||||
|
<option value="5">5x</option>
|
||||||
|
<option value="6">6x</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<Label className="text-xs text-muted-foreground">Desconto</Label>
|
||||||
|
<div className="relative">
|
||||||
|
<Calculator className="pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
||||||
|
<Input
|
||||||
|
placeholder="0%"
|
||||||
|
className="h-10 w-full rounded-md pl-8 pr-4 border-input focus-visible:ring-1 focus-visible:ring-sky-500 focus-visible:border-sky-500"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Traço separador */}
|
||||||
|
<div className="border-b border-border" />
|
||||||
|
|
||||||
|
{/* RESUMO FINANCEIRO */}
|
||||||
|
<div className="space-y-4">
|
||||||
|
<Label className="text-[13px] text-foreground/80">
|
||||||
|
Resumo Financeiro
|
||||||
|
</Label>
|
||||||
|
<div className="bg-muted/30 rounded-lg p-4 space-y-3">
|
||||||
|
<div className="flex justify-between items-center">
|
||||||
|
<span className="text-sm text-muted-foreground">Subtotal:</span>
|
||||||
|
<span className="text-sm font-medium text-foreground">R$ 0,00</span>
|
||||||
|
</div>
|
||||||
|
<div className="flex justify-between items-center">
|
||||||
|
<span className="text-sm text-muted-foreground">Desconto:</span>
|
||||||
|
<span className="text-sm font-medium text-foreground">- R$ 0,00</span>
|
||||||
|
</div>
|
||||||
|
<div className="border-t border-border pt-2">
|
||||||
|
<div className="flex justify-between items-center">
|
||||||
|
<span className="text-base font-medium text-foreground">Total:</span>
|
||||||
|
<span className="text-lg font-bold text-primary">R$ 0,00</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
{/* RODAPÉ FIXO */}
|
||||||
|
<FooterAgenda />
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -23,12 +23,12 @@ export default function ProcedimentoPage() {
|
|||||||
const tab = (active: boolean, extra = "") =>
|
const tab = (active: boolean, extra = "") =>
|
||||||
`px-4 py-1.5 text-[13px] border ${
|
`px-4 py-1.5 text-[13px] border ${
|
||||||
active
|
active
|
||||||
? "border-sky-500 bg-sky-50 text-sky-700 font-medium"
|
? "border-sky-500 bg-sky-50 dark:bg-sky-900/30 text-sky-700 dark:text-sky-300 font-medium"
|
||||||
: "text-gray-700 hover:bg-gray-100"
|
: "text-muted-foreground hover:bg-muted border-border"
|
||||||
} ${extra}`;
|
} ${extra}`;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="w-full min-h-screen flex flex-col bg-white">
|
<div className="w-full min-h-screen flex flex-col bg-background">
|
||||||
{/* HEADER */}
|
{/* HEADER */}
|
||||||
<HeaderAgenda />
|
<HeaderAgenda />
|
||||||
|
|
||||||
@ -37,15 +37,15 @@ export default function ProcedimentoPage() {
|
|||||||
{/* ATENDIMENTOS */}
|
{/* ATENDIMENTOS */}
|
||||||
<section className="space-y-6">
|
<section className="space-y-6">
|
||||||
{/* Selo Atendimento com + dentro da bolinha */}
|
{/* Selo Atendimento com + dentro da bolinha */}
|
||||||
<div className="inline-flex items-center gap-2 border px-3 py-1.5 bg-white text-[12px] rounded-md cursor-pointer hover:bg-gray-50">
|
<div className="inline-flex items-center gap-2 border border-border px-3 py-1.5 bg-card text-[12px] rounded-md cursor-pointer hover:bg-muted">
|
||||||
<span className="flex h-5 w-5 items-center justify-center rounded-full border border-gray-400 bg-gray-100 text-gray-700">
|
<span className="flex h-5 w-5 items-center justify-center rounded-full border border-border bg-muted text-muted-foreground">
|
||||||
<Plus className="h-3 w-3" strokeWidth={2} />
|
<Plus className="h-3 w-3" strokeWidth={2} />
|
||||||
</span>
|
</span>
|
||||||
Atendimento
|
<span className="text-foreground">Atendimento</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Traço separador */}
|
{/* Traço separador */}
|
||||||
<div className="border-b border-gray-200" />
|
<div className="border-b border-border" />
|
||||||
|
|
||||||
{/* PROCEDIMENTOS */}
|
{/* PROCEDIMENTOS */}
|
||||||
<div className="space-y-1">
|
<div className="space-y-1">
|
||||||
@ -56,14 +56,14 @@ export default function ProcedimentoPage() {
|
|||||||
<Search className="pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
<Search className="pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
||||||
<Input
|
<Input
|
||||||
placeholder="Buscar"
|
placeholder="Buscar"
|
||||||
className="h-10 w-full rounded-md pl-8 pr-8 border border-gray-300 focus-visible:ring-1 focus-visible:ring-sky-500 focus-visible:border-sky-500"
|
className="h-10 w-full rounded-md pl-8 pr-8 border-input focus-visible:ring-1 focus-visible:ring-sky-500 focus-visible:border-sky-500"
|
||||||
/>
|
/>
|
||||||
<ChevronDown className="pointer-events-none absolute right-2 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
|
<ChevronDown className="pointer-events-none absolute right-2 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Traço separador */}
|
{/* Traço separador */}
|
||||||
<div className="border-b border-gray-200" />
|
<div className="border-b border-border" />
|
||||||
|
|
||||||
{/* OUTRAS DESPESAS */}
|
{/* OUTRAS DESPESAS */}
|
||||||
<div className="space-y-1">
|
<div className="space-y-1">
|
||||||
@ -74,7 +74,7 @@ export default function ProcedimentoPage() {
|
|||||||
<Search className="pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
<Search className="pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
||||||
<Input
|
<Input
|
||||||
placeholder="Buscar"
|
placeholder="Buscar"
|
||||||
className="h-10 w-full rounded-md pl-8 pr-8 border border-gray-300 focus-visible:ring-1 focus-visible:ring-sky-500 focus-visible:border-sky-500"
|
className="h-10 w-full rounded-md pl-8 pr-8 border-input focus-visible:ring-1 focus-visible:ring-sky-500 focus-visible:border-sky-500"
|
||||||
/>
|
/>
|
||||||
<ChevronDown className="pointer-events-none absolute right-2 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
|
<ChevronDown className="pointer-events-none absolute right-2 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -11,15 +11,15 @@ export default function FooterAgenda() {
|
|||||||
const [bloqueio, setBloqueio] = useState(false);
|
const [bloqueio, setBloqueio] = useState(false);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="sticky bottom-0 left-0 right-0 border-t bg-white">
|
<div className="sticky bottom-0 left-0 right-0 border-t border-border bg-background">
|
||||||
<div className="mx-auto w-full max-w-7xl px-8 py-3 flex items-center justify-between">
|
<div className="mx-auto w-full max-w-7xl px-8 py-3 flex items-center justify-between">
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<Switch checked={bloqueio} onCheckedChange={setBloqueio} />
|
<Switch checked={bloqueio} onCheckedChange={setBloqueio} />
|
||||||
<Label className="text-sm">Bloqueio de Agenda</Label>
|
<Label className="text-sm text-foreground">Bloqueio de Agenda</Label>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex gap-2">
|
<div className="flex gap-2">
|
||||||
<Link href={"/calendar"}>
|
<Link href={"/calendar"}>
|
||||||
<Button variant="ghost" className="hover:bg-blue-100 hover:text-foreground">Cancelar</Button>
|
<Button variant="ghost" className="hover:bg-muted hover:text-foreground">Cancelar</Button>
|
||||||
</Link>
|
</Link>
|
||||||
<Link href={"/calendar"}>
|
<Link href={"/calendar"}>
|
||||||
<Button>
|
<Button>
|
||||||
|
|||||||
@ -15,14 +15,14 @@ export default function HeaderAgenda() {
|
|||||||
const tabCls = (active: boolean, extra = "") =>
|
const tabCls = (active: boolean, extra = "") =>
|
||||||
`px-4 py-1.5 text-[13px] border ${
|
`px-4 py-1.5 text-[13px] border ${
|
||||||
active
|
active
|
||||||
? "border-blue-500 bg-blue-50 text-blue-700 font-medium"
|
? "border-blue-500 bg-blue-50 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300 font-medium"
|
||||||
: "text-gray-700 hover:bg-gray-100"
|
: "text-muted-foreground hover:bg-muted border-border"
|
||||||
} ${extra}`;
|
} ${extra}`;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<header className="border-b bg-white">
|
<header className="border-b bg-background border-border">
|
||||||
<div className="mx-auto w-full max-w-7xl px-8 py-3 flex items-center justify-between">
|
<div className="mx-auto w-full max-w-7xl px-8 py-3 flex items-center justify-between">
|
||||||
<h1 className="text-[18px] font-semibold">Novo Agendamento</h1>
|
<h1 className="text-[18px] font-semibold text-foreground">Novo Agendamento</h1>
|
||||||
|
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<nav
|
<nav
|
||||||
@ -60,7 +60,7 @@ export default function HeaderAgenda() {
|
|||||||
type="button"
|
type="button"
|
||||||
aria-label="Histórico"
|
aria-label="Histórico"
|
||||||
onClick={() => router.back()}
|
onClick={() => router.back()}
|
||||||
className="inline-flex h-8 w-8 items-center justify-center rounded-md border bg-white text-gray-700 hover:bg-gray-100"
|
className="inline-flex h-8 w-8 items-center justify-center rounded-md border border-border bg-background text-muted-foreground hover:bg-muted"
|
||||||
>
|
>
|
||||||
<RotateCcw className="h-4 w-4" />
|
<RotateCcw className="h-4 w-4" />
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
@ -38,21 +38,21 @@ export default function ListaEspera({ patients, onNotify, onAddToWaitlist }: Lis
|
|||||||
|
|
||||||
const getPriorityColor = (priority: string) => {
|
const getPriorityColor = (priority: string) => {
|
||||||
switch (priority) {
|
switch (priority) {
|
||||||
case 'high': return 'bg-red-100 text-red-800';
|
case 'high': return 'bg-red-100 dark:bg-red-900/30 text-red-800 dark:text-red-300';
|
||||||
case 'medium': return 'bg-yellow-100 text-yellow-800';
|
case 'medium': return 'bg-yellow-100 dark:bg-yellow-900/30 text-yellow-800 dark:text-yellow-300';
|
||||||
case 'low': return 'bg-green-100 text-green-800';
|
case 'low': return 'bg-green-100 dark:bg-green-900/30 text-green-800 dark:text-green-300';
|
||||||
default: return 'bg-gray-100 text-gray-800';
|
default: return 'bg-muted text-muted-foreground';
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="bg-white rounded-lg shadow">
|
<div className="bg-card border border-border rounded-lg shadow">
|
||||||
<div className="p-4 border-b border-gray-200">
|
<div className="p-4 border-b border-border">
|
||||||
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between">
|
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between">
|
||||||
<h2 className="text-xl font-semibold text-gray-900 mb-4 sm:mb-0">Lista de Espera Inteligente</h2>
|
<h2 className="text-xl font-semibold text-foreground mb-4 sm:mb-0">Lista de Espera Inteligente</h2>
|
||||||
<button
|
<button
|
||||||
onClick={onAddToWaitlist}
|
onClick={onAddToWaitlist}
|
||||||
className="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
|
className="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-primary-foreground bg-primary hover:bg-primary/90 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary"
|
||||||
>
|
>
|
||||||
<Plus className="h-4 w-4 mr-2" />
|
<Plus className="h-4 w-4 mr-2" />
|
||||||
Adicionar à Lista
|
Adicionar à Lista
|
||||||
@ -60,7 +60,7 @@ export default function ListaEspera({ patients, onNotify, onAddToWaitlist }: Lis
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="p-4 border-b border-gray-200">
|
<div className="p-4 border-b border-border">
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
|
<div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
|
||||||
<span className="text-gray-500">🔍</span>
|
<span className="text-gray-500">🔍</span>
|
||||||
@ -70,14 +70,14 @@ export default function ListaEspera({ patients, onNotify, onAddToWaitlist }: Lis
|
|||||||
placeholder="Buscar paciente..."
|
placeholder="Buscar paciente..."
|
||||||
value={searchTerm}
|
value={searchTerm}
|
||||||
onChange={(e) => setSearchTerm(e.target.value)}
|
onChange={(e) => setSearchTerm(e.target.value)}
|
||||||
className="block w-full pl-10 pr-3 py-2 border border-gray-300 rounded-md leading-5 bg-white placeholder-gray-500 focus:outline-none focus:placeholder-gray-400 focus:ring-1 focus:ring-blue-500 focus:border-blue-500"
|
className="block w-full pl-10 pr-3 py-2 border border-input rounded-md leading-5 bg-background text-foreground placeholder-muted-foreground focus:outline-none focus:ring-1 focus:ring-primary focus:border-primary"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="overflow-x-auto">
|
<div className="overflow-x-auto">
|
||||||
<table className="min-w-full divide-y divide-gray-200">
|
<table className="min-w-full divide-y divide-border">
|
||||||
<thead className="bg-gray-50">
|
<thead className="bg-muted/50">
|
||||||
<tr>
|
<tr>
|
||||||
<th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
<th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||||
Paciente
|
Paciente
|
||||||
@ -99,16 +99,16 @@ export default function ListaEspera({ patients, onNotify, onAddToWaitlist }: Lis
|
|||||||
</th>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody className="bg-white divide-y divide-gray-200">
|
<tbody className="bg-card divide-y divide-border">
|
||||||
{filteredPatients.map((patient) => (
|
{filteredPatients.map((patient) => (
|
||||||
<tr key={patient.id}>
|
<tr key={patient.id}>
|
||||||
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">
|
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-foreground">
|
||||||
{patient.name}
|
{patient.name}
|
||||||
</td>
|
</td>
|
||||||
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
|
<td className="px-6 py-4 whitespace-nowrap text-sm text-muted-foreground">
|
||||||
{patient.specialty}
|
{patient.specialty}
|
||||||
</td>
|
</td>
|
||||||
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
|
<td className="px-6 py-4 whitespace-nowrap text-sm text-muted-foreground">
|
||||||
{new Date(patient.preferredDate).toLocaleDateString('pt-BR')}
|
{new Date(patient.preferredDate).toLocaleDateString('pt-BR')}
|
||||||
</td>
|
</td>
|
||||||
<td className="px-6 py-4 whitespace-nowrap">
|
<td className="px-6 py-4 whitespace-nowrap">
|
||||||
@ -116,13 +116,13 @@ export default function ListaEspera({ patients, onNotify, onAddToWaitlist }: Lis
|
|||||||
{getPriorityLabel(patient.priority)}
|
{getPriorityLabel(patient.priority)}
|
||||||
</span>
|
</span>
|
||||||
</td>
|
</td>
|
||||||
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
|
<td className="px-6 py-4 whitespace-nowrap text-sm text-muted-foreground">
|
||||||
{patient.contact}
|
{patient.contact}
|
||||||
</td>
|
</td>
|
||||||
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium">
|
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium">
|
||||||
<button
|
<button
|
||||||
onClick={() => onNotify(patient.id)}
|
onClick={() => onNotify(patient.id)}
|
||||||
className="text-blue-600 hover:text-blue-900 mr-3"
|
className="text-primary hover:text-primary/80 mr-3"
|
||||||
title="Notificar paciente"
|
title="Notificar paciente"
|
||||||
>
|
>
|
||||||
<Bell className="h-4 w-4" />
|
<Bell className="h-4 w-4" />
|
||||||
@ -135,7 +135,7 @@ export default function ListaEspera({ patients, onNotify, onAddToWaitlist }: Lis
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{filteredPatients.length === 0 && (
|
{filteredPatients.length === 0 && (
|
||||||
<div className="text-center py-8 text-gray-500">
|
<div className="text-center py-8 text-muted-foreground">
|
||||||
Nenhum paciente encontrado na lista de espera
|
Nenhum paciente encontrado na lista de espera
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@ -74,8 +74,8 @@ export function Sidebar() {
|
|||||||
<SidebarGroupContent>
|
<SidebarGroupContent>
|
||||||
<SidebarMenu>
|
<SidebarMenu>
|
||||||
{navigation.map((item) => {
|
{navigation.map((item) => {
|
||||||
const isActive =
|
const isActive = pathname === item.href ||
|
||||||
pathname === item.href || pathname.startsWith(item.href + "/")
|
(pathname.startsWith(item.href + "/") && item.href !== "/dashboard")
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SidebarMenuItem key={item.name}>
|
<SidebarMenuItem key={item.name}>
|
||||||
|
|||||||
@ -26,13 +26,13 @@ export function CalendarRegistrationForm({ initialData, onSave, onCancel }: any)
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<form onSubmit={handleSubmit} className="space-y-8">
|
<form onSubmit={handleSubmit} className="space-y-8">
|
||||||
<div className="border rounded-md p-6 space-y-4 bg-white">
|
<div className="border border-border rounded-md p-6 space-y-4 bg-card">
|
||||||
<h2 className="font-medium">Informações do paciente</h2>
|
<h2 className="font-medium text-foreground">Informações do paciente</h2>
|
||||||
<div className="grid grid-cols-1 md:grid-cols-12 gap-4">
|
<div className="grid grid-cols-1 md:grid-cols-12 gap-4">
|
||||||
<div className="md:col-span-6">
|
<div className="md:col-span-6">
|
||||||
<Label>Nome *</Label>
|
<Label>Nome *</Label>
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<Search className="pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-gray-400" />
|
<Search className="pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
|
||||||
<Input
|
<Input
|
||||||
name="patientName"
|
name="patientName"
|
||||||
placeholder="Digite o nome do paciente"
|
placeholder="Digite o nome do paciente"
|
||||||
@ -50,23 +50,19 @@ export function CalendarRegistrationForm({ initialData, onSave, onCancel }: any)
|
|||||||
<Label>RG</Label>
|
<Label>RG</Label>
|
||||||
<Input name="rg" placeholder="Número do RG" className="h-10" value={formData.rg || ''} onChange={handleChange} />
|
<Input name="rg" placeholder="Número do RG" className="h-10" value={formData.rg || ''} onChange={handleChange} />
|
||||||
</div>
|
</div>
|
||||||
<div className="md:col-span-6">
|
<div className="md:col-span-3">
|
||||||
<div className="grid grid-cols-12 gap-3">
|
<Label>Data de nascimento *</Label>
|
||||||
<div className="col-span-5">
|
<Input name="birthDate" type="date" className="h-10" value={formData.birthDate || ''} onChange={handleChange} />
|
||||||
<Label>Data de nascimento *</Label>
|
</div>
|
||||||
<Input name="birthDate" type="date" className="h-10" value={formData.birthDate || ''} onChange={handleChange} />
|
<div className="md:col-span-3">
|
||||||
</div>
|
<Label>Telefone</Label>
|
||||||
<div className="col-span-7">
|
<div className="flex gap-2">
|
||||||
<Label>Telefone</Label>
|
<select name="phoneCode" className="h-10 w-20 rounded-md border border-input bg-background text-foreground px-2 text-[13px]" value={formData.phoneCode || '+55'} onChange={handleChange}>
|
||||||
<div className="grid grid-cols-[86px_1fr] gap-2">
|
<option value="+55">+55</option>
|
||||||
<select name="phoneCode" className="h-10 rounded-md border border-input bg-background px-2 text-[13px]" value={formData.phoneCode || '+55'} onChange={handleChange}>
|
<option value="+351">+351</option>
|
||||||
<option value="+55">+55</option>
|
<option value="+1">+1</option>
|
||||||
<option value="+351">+351</option>
|
</select>
|
||||||
<option value="+1">+1</option>
|
<Input name="phoneNumber" placeholder="(99) 99999-9999" className="h-10 flex-1" value={formData.phoneNumber || ''} onChange={handleChange} />
|
||||||
</select>
|
|
||||||
<Input name="phoneNumber" placeholder="(99) 99999-9999" className="h-10" value={formData.phoneNumber || ''} onChange={handleChange} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="md:col-span-6">
|
<div className="md:col-span-6">
|
||||||
@ -77,10 +73,10 @@ export function CalendarRegistrationForm({ initialData, onSave, onCancel }: any)
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{}
|
{}
|
||||||
<div className="border rounded-md p-6 space-y-4 bg-white">
|
<div className="border border-border rounded-md p-6 space-y-4 bg-card">
|
||||||
<h2 className="font-medium">Informações do atendimento</h2>
|
<h2 className="font-medium text-foreground">Informações do atendimento</h2>
|
||||||
<div className="grid grid-cols-1 md:grid-cols-12 gap-6">
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||||
<div className="md:col-span-6 space-y-3">
|
<div className="space-y-4">
|
||||||
<div>
|
<div>
|
||||||
<Label className="text-[13px]">Nome do profissional *</Label>
|
<Label className="text-[13px]">Nome do profissional *</Label>
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
@ -91,7 +87,7 @@ export function CalendarRegistrationForm({ initialData, onSave, onCancel }: any)
|
|||||||
<div className="grid grid-cols-2 gap-3">
|
<div className="grid grid-cols-2 gap-3">
|
||||||
<div>
|
<div>
|
||||||
<Label className="text-[13px]">Unidade *</Label>
|
<Label className="text-[13px]">Unidade *</Label>
|
||||||
<select name="unit" className="h-10 w-full rounded-md border border-input bg-background pr-8 pl-3 text-[13px] appearance-none" value={formData.unit || 'nei'} onChange={handleChange}>
|
<select name="unit" className="h-10 w-full rounded-md border border-input bg-background text-foreground pr-8 pl-3 text-[13px] appearance-none" value={formData.unit || 'nei'} onChange={handleChange}>
|
||||||
<option value="nei">Núcleo de Especialidades Integradas</option>
|
<option value="nei">Núcleo de Especialidades Integradas</option>
|
||||||
<option value="cc">Clínica Central</option>
|
<option value="cc">Clínica Central</option>
|
||||||
</select>
|
</select>
|
||||||
@ -104,19 +100,19 @@ export function CalendarRegistrationForm({ initialData, onSave, onCancel }: any)
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="grid grid-cols-12 gap-3 items-end">
|
<div className="grid grid-cols-2 gap-3">
|
||||||
<div className="col-span-12 md:col-span-3">
|
<div>
|
||||||
<Label className="text-[13px]">Início *</Label>
|
<Label className="text-[13px]">Início *</Label>
|
||||||
<Input name="startTime" type="time" className="h-10 w-full rounded-md border border-input px-3 text-[13px]" value={formData.startTime || ''} onChange={handleChange} />
|
<Input name="startTime" type="time" className="h-10 w-full rounded-md border border-input px-3 text-[13px]" value={formData.startTime || ''} onChange={handleChange} />
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-12 md:col-span-3">
|
<div>
|
||||||
<Label className="text-[13px]">Término *</Label>
|
<Label className="text-[13px]">Término *</Label>
|
||||||
<Input name="endTime" type="time" className="h-10 w-full rounded-md border border-input px-3 text-[13px]" value={formData.endTime || ''} onChange={handleChange} />
|
<Input name="endTime" type="time" className="h-10 w-full rounded-md border border-input px-3 text-[13px]" value={formData.endTime || ''} onChange={handleChange} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="md:col-span-6">
|
<div className="space-y-4">
|
||||||
<div className="mb-2">
|
<div>
|
||||||
<Label className="text-[13px]">Tipo de atendimento *</Label>
|
<Label className="text-[13px]">Tipo de atendimento *</Label>
|
||||||
<div className="relative mt-1">
|
<div className="relative mt-1">
|
||||||
<Search className="pointer-events-none absolute left-2 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
|
<Search className="pointer-events-none absolute left-2 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
|
||||||
@ -125,7 +121,7 @@ export function CalendarRegistrationForm({ initialData, onSave, onCancel }: any)
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<Label className="text-[13px]">Observações</Label>
|
<Label className="text-[13px]">Observações</Label>
|
||||||
<Textarea name="notes" rows={4} className="text-[13px] h-[110px] min-h-0 resize-none" value={formData.notes || ''} onChange={handleChange} />
|
<Textarea name="notes" rows={6} className="text-[13px] min-h-[120px] resize-none" value={formData.notes || ''} onChange={handleChange} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user