@hed-hog/finance 0.0.3 → 0.0.224
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/hedhog/data/menu.yaml +18 -23
- package/hedhog/frontend/app/_lib/formatters.ts.ejs +20 -0
- package/hedhog/frontend/app/_lib/use-finance-data.ts.ejs +87 -0
- package/hedhog/frontend/app/accounts-payable/approvals/page.tsx.ejs +265 -0
- package/hedhog/frontend/app/accounts-payable/installments/[id]/page.tsx.ejs +388 -0
- package/hedhog/frontend/app/accounts-payable/installments/page.tsx.ejs +364 -0
- package/hedhog/frontend/app/accounts-receivable/collections-default/page.tsx.ejs +388 -0
- package/hedhog/frontend/app/accounts-receivable/installments/[id]/page.tsx.ejs +385 -0
- package/hedhog/frontend/app/accounts-receivable/installments/page.tsx.ejs +364 -0
- package/hedhog/frontend/app/cash-and-banks/bank-accounts/page.tsx.ejs +274 -0
- package/hedhog/frontend/app/cash-and-banks/bank-reconciliation/page.tsx.ejs +401 -0
- package/hedhog/frontend/app/cash-and-banks/statements/page.tsx.ejs +266 -0
- package/hedhog/frontend/app/cash-and-banks/transfers/page.tsx.ejs +244 -0
- package/hedhog/frontend/app/page.tsx.ejs +313 -15
- package/hedhog/frontend/app/planning/cash-flow-forecast/page.tsx.ejs +285 -0
- package/hedhog/frontend/app/planning/receivables-calendar/page.tsx.ejs +195 -0
- package/hedhog/frontend/app/planning/scenarios/page.tsx.ejs +321 -0
- package/hedhog/query/constraints.sql +169 -0
- package/package.json +4 -4
|
@@ -0,0 +1,285 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { Button } from '@/components/ui/button';
|
|
4
|
+
import {
|
|
5
|
+
Card,
|
|
6
|
+
CardContent,
|
|
7
|
+
CardDescription,
|
|
8
|
+
CardHeader,
|
|
9
|
+
CardTitle,
|
|
10
|
+
} from '@/components/ui/card';
|
|
11
|
+
import { Money } from '@/components/ui/money';
|
|
12
|
+
import { PageHeader } from '@/components/ui/page-header';
|
|
13
|
+
import {
|
|
14
|
+
Select,
|
|
15
|
+
SelectContent,
|
|
16
|
+
SelectItem,
|
|
17
|
+
SelectTrigger,
|
|
18
|
+
SelectValue,
|
|
19
|
+
} from '@/components/ui/select';
|
|
20
|
+
import {
|
|
21
|
+
Table,
|
|
22
|
+
TableBody,
|
|
23
|
+
TableCell,
|
|
24
|
+
TableHead,
|
|
25
|
+
TableHeader,
|
|
26
|
+
TableRow,
|
|
27
|
+
} from '@/components/ui/table';
|
|
28
|
+
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
|
29
|
+
import { Download, TrendingDown, TrendingUp, Wallet } from 'lucide-react';
|
|
30
|
+
import { useState } from 'react';
|
|
31
|
+
import {
|
|
32
|
+
Area,
|
|
33
|
+
AreaChart,
|
|
34
|
+
CartesianGrid,
|
|
35
|
+
Legend,
|
|
36
|
+
ResponsiveContainer,
|
|
37
|
+
Tooltip,
|
|
38
|
+
XAxis,
|
|
39
|
+
YAxis,
|
|
40
|
+
} from 'recharts';
|
|
41
|
+
import { formatarData, formatarMoeda } from '../../_lib/formatters';
|
|
42
|
+
import { useFinanceData } from '../../_lib/use-finance-data';
|
|
43
|
+
|
|
44
|
+
export default function FluxoCaixaPage() {
|
|
45
|
+
const { data } = useFinanceData();
|
|
46
|
+
const { fluxoCaixaPrevisto, kpis, entradasPrevistas, saidasPrevistas } = data;
|
|
47
|
+
|
|
48
|
+
const [horizonte, setHorizonte] = useState('90');
|
|
49
|
+
const [cenario, setCenario] = useState('base');
|
|
50
|
+
|
|
51
|
+
const chartData = fluxoCaixaPrevisto.map((item) => ({
|
|
52
|
+
...item,
|
|
53
|
+
data: formatarData(item.data),
|
|
54
|
+
}));
|
|
55
|
+
|
|
56
|
+
const totalEntradas = entradasPrevistas.reduce((acc, e) => acc + e.valor, 0);
|
|
57
|
+
const totalSaidas = saidasPrevistas.reduce((acc, s) => acc + s.valor, 0);
|
|
58
|
+
const saldoFinal = kpis.saldoCaixa + totalEntradas - totalSaidas;
|
|
59
|
+
|
|
60
|
+
return (
|
|
61
|
+
<div className="space-y-6">
|
|
62
|
+
<PageHeader
|
|
63
|
+
title="Fluxo de Caixa Previsto"
|
|
64
|
+
description="Projeção de entradas e saídas"
|
|
65
|
+
breadcrumbs={[
|
|
66
|
+
{ label: 'Planejamento', href: '/finance/planning/cash-flow-forecast' },
|
|
67
|
+
{ label: 'Fluxo de Caixa Previsto' },
|
|
68
|
+
]}
|
|
69
|
+
actions={
|
|
70
|
+
<Button variant="outline">
|
|
71
|
+
<Download className="mr-2 h-4 w-4" />
|
|
72
|
+
Exportar
|
|
73
|
+
</Button>
|
|
74
|
+
}
|
|
75
|
+
/>
|
|
76
|
+
|
|
77
|
+
<div className="flex flex-col gap-4 sm:flex-row sm:items-center">
|
|
78
|
+
<Select value={horizonte} onValueChange={setHorizonte}>
|
|
79
|
+
<SelectTrigger className="w-[180px]">
|
|
80
|
+
<SelectValue placeholder="Horizonte" />
|
|
81
|
+
</SelectTrigger>
|
|
82
|
+
<SelectContent>
|
|
83
|
+
<SelectItem value="30">30 dias</SelectItem>
|
|
84
|
+
<SelectItem value="60">60 dias</SelectItem>
|
|
85
|
+
<SelectItem value="90">90 dias</SelectItem>
|
|
86
|
+
<SelectItem value="180">180 dias</SelectItem>
|
|
87
|
+
<SelectItem value="365">365 dias</SelectItem>
|
|
88
|
+
</SelectContent>
|
|
89
|
+
</Select>
|
|
90
|
+
<Select value={cenario} onValueChange={setCenario}>
|
|
91
|
+
<SelectTrigger className="w-[180px]">
|
|
92
|
+
<SelectValue placeholder="Cenário" />
|
|
93
|
+
</SelectTrigger>
|
|
94
|
+
<SelectContent>
|
|
95
|
+
<SelectItem value="base">Base</SelectItem>
|
|
96
|
+
<SelectItem value="pessimista">Pessimista</SelectItem>
|
|
97
|
+
<SelectItem value="otimista">Otimista</SelectItem>
|
|
98
|
+
</SelectContent>
|
|
99
|
+
</Select>
|
|
100
|
+
</div>
|
|
101
|
+
|
|
102
|
+
<div className="grid gap-4 md:grid-cols-4">
|
|
103
|
+
<Card>
|
|
104
|
+
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
|
105
|
+
<CardTitle className="text-sm font-medium">Saldo Atual</CardTitle>
|
|
106
|
+
<Wallet className="h-4 w-4 text-muted-foreground" />
|
|
107
|
+
</CardHeader>
|
|
108
|
+
<CardContent>
|
|
109
|
+
<div className="text-2xl font-bold">
|
|
110
|
+
<Money value={kpis.saldoCaixa} />
|
|
111
|
+
</div>
|
|
112
|
+
</CardContent>
|
|
113
|
+
</Card>
|
|
114
|
+
<Card>
|
|
115
|
+
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
|
116
|
+
<CardTitle className="text-sm font-medium">
|
|
117
|
+
Entradas Previstas
|
|
118
|
+
</CardTitle>
|
|
119
|
+
<TrendingUp className="h-4 w-4 text-green-500" />
|
|
120
|
+
</CardHeader>
|
|
121
|
+
<CardContent>
|
|
122
|
+
<div className="text-2xl font-bold text-green-600">
|
|
123
|
+
<Money value={totalEntradas} />
|
|
124
|
+
</div>
|
|
125
|
+
</CardContent>
|
|
126
|
+
</Card>
|
|
127
|
+
<Card>
|
|
128
|
+
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
|
129
|
+
<CardTitle className="text-sm font-medium">
|
|
130
|
+
Saídas Previstas
|
|
131
|
+
</CardTitle>
|
|
132
|
+
<TrendingDown className="h-4 w-4 text-red-500" />
|
|
133
|
+
</CardHeader>
|
|
134
|
+
<CardContent>
|
|
135
|
+
<div className="text-2xl font-bold text-red-600">
|
|
136
|
+
<Money value={totalSaidas} />
|
|
137
|
+
</div>
|
|
138
|
+
</CardContent>
|
|
139
|
+
</Card>
|
|
140
|
+
<Card>
|
|
141
|
+
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
|
142
|
+
<CardTitle className="text-sm font-medium">
|
|
143
|
+
Saldo Projetado
|
|
144
|
+
</CardTitle>
|
|
145
|
+
</CardHeader>
|
|
146
|
+
<CardContent>
|
|
147
|
+
<div
|
|
148
|
+
className={`text-2xl font-bold ${saldoFinal >= 0 ? 'text-green-600' : 'text-red-600'}`}
|
|
149
|
+
>
|
|
150
|
+
<Money value={saldoFinal} />
|
|
151
|
+
</div>
|
|
152
|
+
</CardContent>
|
|
153
|
+
</Card>
|
|
154
|
+
</div>
|
|
155
|
+
|
|
156
|
+
<Card>
|
|
157
|
+
<CardHeader>
|
|
158
|
+
<CardTitle>Projeção de Saldo</CardTitle>
|
|
159
|
+
<CardDescription>Evolução do saldo ao longo do tempo</CardDescription>
|
|
160
|
+
</CardHeader>
|
|
161
|
+
<CardContent>
|
|
162
|
+
<ResponsiveContainer width="100%" height={350}>
|
|
163
|
+
<AreaChart data={chartData}>
|
|
164
|
+
<CartesianGrid strokeDasharray="3 3" className="stroke-muted" />
|
|
165
|
+
<XAxis dataKey="data" tick={{ fontSize: 12 }} />
|
|
166
|
+
<YAxis
|
|
167
|
+
tick={{ fontSize: 12 }}
|
|
168
|
+
tickFormatter={(value) => `${(value / 1000).toFixed(0)}k`}
|
|
169
|
+
/>
|
|
170
|
+
<Tooltip
|
|
171
|
+
formatter={(value: number) => formatarMoeda(value)}
|
|
172
|
+
contentStyle={{
|
|
173
|
+
backgroundColor: 'hsl(var(--background))',
|
|
174
|
+
border: '1px solid hsl(var(--border))',
|
|
175
|
+
borderRadius: '8px',
|
|
176
|
+
}}
|
|
177
|
+
/>
|
|
178
|
+
<Legend />
|
|
179
|
+
<Area
|
|
180
|
+
type="monotone"
|
|
181
|
+
dataKey="saldoPrevisto"
|
|
182
|
+
name="Saldo Previsto"
|
|
183
|
+
stroke="hsl(var(--primary))"
|
|
184
|
+
fill="hsl(var(--primary))"
|
|
185
|
+
fillOpacity={0.2}
|
|
186
|
+
/>
|
|
187
|
+
<Area
|
|
188
|
+
type="monotone"
|
|
189
|
+
dataKey="saldoRealizado"
|
|
190
|
+
name="Saldo Realizado"
|
|
191
|
+
stroke="hsl(var(--chart-2))"
|
|
192
|
+
fill="hsl(var(--chart-2))"
|
|
193
|
+
fillOpacity={0.2}
|
|
194
|
+
connectNulls
|
|
195
|
+
/>
|
|
196
|
+
</AreaChart>
|
|
197
|
+
</ResponsiveContainer>
|
|
198
|
+
</CardContent>
|
|
199
|
+
</Card>
|
|
200
|
+
|
|
201
|
+
<Tabs defaultValue="entradas">
|
|
202
|
+
<TabsList>
|
|
203
|
+
<TabsTrigger value="entradas">Entradas Previstas</TabsTrigger>
|
|
204
|
+
<TabsTrigger value="saidas">Saídas Previstas</TabsTrigger>
|
|
205
|
+
</TabsList>
|
|
206
|
+
|
|
207
|
+
<TabsContent value="entradas" className="mt-4">
|
|
208
|
+
<Card>
|
|
209
|
+
<CardContent className="pt-6">
|
|
210
|
+
<Table>
|
|
211
|
+
<TableHeader>
|
|
212
|
+
<TableRow>
|
|
213
|
+
<TableHead>Categoria</TableHead>
|
|
214
|
+
<TableHead>Vencimento</TableHead>
|
|
215
|
+
<TableHead className="text-right">Valor</TableHead>
|
|
216
|
+
</TableRow>
|
|
217
|
+
</TableHeader>
|
|
218
|
+
<TableBody>
|
|
219
|
+
{entradasPrevistas.map((entrada, i) => (
|
|
220
|
+
<TableRow key={i}>
|
|
221
|
+
<TableCell className="font-medium">
|
|
222
|
+
{entrada.categoria}
|
|
223
|
+
</TableCell>
|
|
224
|
+
<TableCell>{formatarData(entrada.vencimento)}</TableCell>
|
|
225
|
+
<TableCell className="text-right text-green-600 font-semibold">
|
|
226
|
+
<Money value={entrada.valor} />
|
|
227
|
+
</TableCell>
|
|
228
|
+
</TableRow>
|
|
229
|
+
))}
|
|
230
|
+
<TableRow className="bg-muted/50">
|
|
231
|
+
<TableCell className="font-bold" colSpan={2}>
|
|
232
|
+
Total
|
|
233
|
+
</TableCell>
|
|
234
|
+
<TableCell className="text-right font-bold text-green-600">
|
|
235
|
+
<Money value={totalEntradas} />
|
|
236
|
+
</TableCell>
|
|
237
|
+
</TableRow>
|
|
238
|
+
</TableBody>
|
|
239
|
+
</Table>
|
|
240
|
+
</CardContent>
|
|
241
|
+
</Card>
|
|
242
|
+
</TabsContent>
|
|
243
|
+
|
|
244
|
+
<TabsContent value="saidas" className="mt-4">
|
|
245
|
+
<Card>
|
|
246
|
+
<CardContent className="pt-6">
|
|
247
|
+
<Table>
|
|
248
|
+
<TableHeader>
|
|
249
|
+
<TableRow>
|
|
250
|
+
<TableHead>Categoria</TableHead>
|
|
251
|
+
<TableHead>Vencimento</TableHead>
|
|
252
|
+
<TableHead className="text-right">Valor</TableHead>
|
|
253
|
+
</TableRow>
|
|
254
|
+
</TableHeader>
|
|
255
|
+
<TableBody>
|
|
256
|
+
{saidasPrevistas.map((saida, i) => (
|
|
257
|
+
<TableRow key={i}>
|
|
258
|
+
<TableCell className="font-medium">
|
|
259
|
+
{saida.categoria}
|
|
260
|
+
</TableCell>
|
|
261
|
+
<TableCell>{formatarData(saida.vencimento)}</TableCell>
|
|
262
|
+
<TableCell className="text-right text-red-600 font-semibold">
|
|
263
|
+
<Money value={saida.valor} />
|
|
264
|
+
</TableCell>
|
|
265
|
+
</TableRow>
|
|
266
|
+
))}
|
|
267
|
+
<TableRow className="bg-muted/50">
|
|
268
|
+
<TableCell className="font-bold" colSpan={2}>
|
|
269
|
+
Total
|
|
270
|
+
</TableCell>
|
|
271
|
+
<TableCell className="text-right font-bold text-red-600">
|
|
272
|
+
<Money value={totalSaidas} />
|
|
273
|
+
</TableCell>
|
|
274
|
+
</TableRow>
|
|
275
|
+
</TableBody>
|
|
276
|
+
</Table>
|
|
277
|
+
</CardContent>
|
|
278
|
+
</Card>
|
|
279
|
+
</TabsContent>
|
|
280
|
+
</Tabs>
|
|
281
|
+
</div>
|
|
282
|
+
);
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
|
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { Badge } from '@/components/ui/badge';
|
|
4
|
+
import {
|
|
5
|
+
Card,
|
|
6
|
+
CardContent,
|
|
7
|
+
CardDescription,
|
|
8
|
+
CardHeader,
|
|
9
|
+
CardTitle,
|
|
10
|
+
} from '@/components/ui/card';
|
|
11
|
+
import { Money } from '@/components/ui/money';
|
|
12
|
+
import { PageHeader } from '@/components/ui/page-header';
|
|
13
|
+
import {
|
|
14
|
+
Table,
|
|
15
|
+
TableBody,
|
|
16
|
+
TableCell,
|
|
17
|
+
TableHead,
|
|
18
|
+
TableHeader,
|
|
19
|
+
TableRow,
|
|
20
|
+
} from '@/components/ui/table';
|
|
21
|
+
import { Building2, CalendarDays, CreditCard, Smartphone } from 'lucide-react';
|
|
22
|
+
import { formatarData } from '../../_lib/formatters';
|
|
23
|
+
import { useFinanceData } from '../../_lib/use-finance-data';
|
|
24
|
+
|
|
25
|
+
const statusConfig = {
|
|
26
|
+
confirmado: { label: 'Confirmado', className: 'bg-green-100 text-green-700' },
|
|
27
|
+
pendente: { label: 'Pendente', className: 'bg-yellow-100 text-yellow-700' },
|
|
28
|
+
liquidado: { label: 'Liquidado', className: 'bg-blue-100 text-blue-700' },
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
export default function RecebiveisPage() {
|
|
32
|
+
const { data } = useFinanceData();
|
|
33
|
+
const { recebiveis, adquirentes } = data;
|
|
34
|
+
|
|
35
|
+
const totalBruto = recebiveis.reduce((acc, r) => acc + r.bruto, 0);
|
|
36
|
+
const totalTaxas = recebiveis.reduce((acc, r) => acc + r.taxas, 0);
|
|
37
|
+
const totalLiquido = recebiveis.reduce((acc, r) => acc + r.liquido, 0);
|
|
38
|
+
|
|
39
|
+
return (
|
|
40
|
+
<div className="space-y-6">
|
|
41
|
+
<PageHeader
|
|
42
|
+
title="Agenda de Recebíveis"
|
|
43
|
+
description="Previsão de recebimentos por canal"
|
|
44
|
+
breadcrumbs={[
|
|
45
|
+
{ label: 'Planejamento', href: '/finance/planning/cash-flow-forecast' },
|
|
46
|
+
{ label: 'Agenda de Recebíveis' },
|
|
47
|
+
]}
|
|
48
|
+
/>
|
|
49
|
+
|
|
50
|
+
<div className="grid gap-4 md:grid-cols-4">
|
|
51
|
+
<Card>
|
|
52
|
+
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
|
53
|
+
<CardTitle className="text-sm font-medium">Total Bruto</CardTitle>
|
|
54
|
+
<CalendarDays className="h-4 w-4 text-muted-foreground" />
|
|
55
|
+
</CardHeader>
|
|
56
|
+
<CardContent>
|
|
57
|
+
<div className="text-2xl font-bold">
|
|
58
|
+
<Money value={totalBruto} />
|
|
59
|
+
</div>
|
|
60
|
+
<p className="text-xs text-muted-foreground">
|
|
61
|
+
{recebiveis.length} recebíveis
|
|
62
|
+
</p>
|
|
63
|
+
</CardContent>
|
|
64
|
+
</Card>
|
|
65
|
+
<Card>
|
|
66
|
+
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
|
67
|
+
<CardTitle className="text-sm font-medium">Taxas</CardTitle>
|
|
68
|
+
</CardHeader>
|
|
69
|
+
<CardContent>
|
|
70
|
+
<div className="text-2xl font-bold text-red-600">
|
|
71
|
+
- <Money value={totalTaxas} />
|
|
72
|
+
</div>
|
|
73
|
+
<p className="text-xs text-muted-foreground">
|
|
74
|
+
{((totalTaxas / totalBruto) * 100).toFixed(2)}% do bruto
|
|
75
|
+
</p>
|
|
76
|
+
</CardContent>
|
|
77
|
+
</Card>
|
|
78
|
+
<Card>
|
|
79
|
+
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
|
80
|
+
<CardTitle className="text-sm font-medium">Total Líquido</CardTitle>
|
|
81
|
+
</CardHeader>
|
|
82
|
+
<CardContent>
|
|
83
|
+
<div className="text-2xl font-bold text-green-600">
|
|
84
|
+
<Money value={totalLiquido} />
|
|
85
|
+
</div>
|
|
86
|
+
</CardContent>
|
|
87
|
+
</Card>
|
|
88
|
+
<Card>
|
|
89
|
+
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
|
90
|
+
<CardTitle className="text-sm font-medium">Confirmados</CardTitle>
|
|
91
|
+
</CardHeader>
|
|
92
|
+
<CardContent>
|
|
93
|
+
<div className="text-2xl font-bold">
|
|
94
|
+
{recebiveis.filter((r) => r.status === 'confirmado').length}
|
|
95
|
+
</div>
|
|
96
|
+
<p className="text-xs text-muted-foreground">
|
|
97
|
+
de {recebiveis.length} total
|
|
98
|
+
</p>
|
|
99
|
+
</CardContent>
|
|
100
|
+
</Card>
|
|
101
|
+
</div>
|
|
102
|
+
|
|
103
|
+
<div className="grid gap-6 lg:grid-cols-3">
|
|
104
|
+
{adquirentes.map((adquirente) => {
|
|
105
|
+
const Icon =
|
|
106
|
+
adquirente.nome === 'PagSeguro'
|
|
107
|
+
? Smartphone
|
|
108
|
+
: adquirente.nome === 'Cielo'
|
|
109
|
+
? CreditCard
|
|
110
|
+
: Building2;
|
|
111
|
+
return (
|
|
112
|
+
<Card key={adquirente.nome}>
|
|
113
|
+
<CardHeader>
|
|
114
|
+
<div className="flex items-center gap-3">
|
|
115
|
+
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-muted">
|
|
116
|
+
<Icon className="h-5 w-5" />
|
|
117
|
+
</div>
|
|
118
|
+
<div>
|
|
119
|
+
<CardTitle className="text-base">
|
|
120
|
+
{adquirente.nome}
|
|
121
|
+
</CardTitle>
|
|
122
|
+
<CardDescription>
|
|
123
|
+
{adquirente.transacoes} transações
|
|
124
|
+
</CardDescription>
|
|
125
|
+
</div>
|
|
126
|
+
</div>
|
|
127
|
+
</CardHeader>
|
|
128
|
+
<CardContent>
|
|
129
|
+
<div className="text-2xl font-bold">
|
|
130
|
+
<Money value={adquirente.total} />
|
|
131
|
+
</div>
|
|
132
|
+
<p className="text-xs text-muted-foreground">a receber</p>
|
|
133
|
+
</CardContent>
|
|
134
|
+
</Card>
|
|
135
|
+
);
|
|
136
|
+
})}
|
|
137
|
+
</div>
|
|
138
|
+
|
|
139
|
+
<Card>
|
|
140
|
+
<CardHeader>
|
|
141
|
+
<CardTitle>Detalhamento de Recebíveis</CardTitle>
|
|
142
|
+
<CardDescription>Todos os recebíveis previstos</CardDescription>
|
|
143
|
+
</CardHeader>
|
|
144
|
+
<CardContent>
|
|
145
|
+
<Table>
|
|
146
|
+
<TableHeader>
|
|
147
|
+
<TableRow>
|
|
148
|
+
<TableHead>Canal</TableHead>
|
|
149
|
+
<TableHead>Adquirente</TableHead>
|
|
150
|
+
<TableHead>Data Prevista</TableHead>
|
|
151
|
+
<TableHead className="text-right">Bruto</TableHead>
|
|
152
|
+
<TableHead className="text-right">Taxas</TableHead>
|
|
153
|
+
<TableHead className="text-right">Líquido</TableHead>
|
|
154
|
+
<TableHead>Status</TableHead>
|
|
155
|
+
</TableRow>
|
|
156
|
+
</TableHeader>
|
|
157
|
+
<TableBody>
|
|
158
|
+
{recebiveis.map((recebivel) => {
|
|
159
|
+
const status =
|
|
160
|
+
statusConfig[recebivel.status as keyof typeof statusConfig];
|
|
161
|
+
return (
|
|
162
|
+
<TableRow key={recebivel.id}>
|
|
163
|
+
<TableCell className="font-medium">
|
|
164
|
+
{recebivel.canal}
|
|
165
|
+
</TableCell>
|
|
166
|
+
<TableCell>{recebivel.adquirente}</TableCell>
|
|
167
|
+
<TableCell>
|
|
168
|
+
{formatarData(recebivel.dataPrevista)}
|
|
169
|
+
</TableCell>
|
|
170
|
+
<TableCell className="text-right">
|
|
171
|
+
<Money value={recebivel.bruto} />
|
|
172
|
+
</TableCell>
|
|
173
|
+
<TableCell className="text-right text-red-600">
|
|
174
|
+
- <Money value={recebivel.taxas} />
|
|
175
|
+
</TableCell>
|
|
176
|
+
<TableCell className="text-right font-semibold">
|
|
177
|
+
<Money value={recebivel.liquido} />
|
|
178
|
+
</TableCell>
|
|
179
|
+
<TableCell>
|
|
180
|
+
<Badge className={status.className} variant="outline">
|
|
181
|
+
{status.label}
|
|
182
|
+
</Badge>
|
|
183
|
+
</TableCell>
|
|
184
|
+
</TableRow>
|
|
185
|
+
);
|
|
186
|
+
})}
|
|
187
|
+
</TableBody>
|
|
188
|
+
</Table>
|
|
189
|
+
</CardContent>
|
|
190
|
+
</Card>
|
|
191
|
+
</div>
|
|
192
|
+
);
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
|