Hugging Face's logo

Spaces:
EraDigital
/
cashflow-commander-pro
Running

App Files Community
EraDigital commited on
Commit
f9896f9
·
verified ·
1 Parent(s): 93dbe50

refazer

Browse files
Files changed (2) hide show
  1. README.md +8 -5
  2. index.html +162 -19
README.md CHANGED
@@ -1,10 +1,13 @@
1
  ---
2
- title: Cashflow Commander Pro
3
- emoji: 😻
4
- colorFrom: gray
5
- colorTo: gray
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
 
1
  ---
2
+ title: CashFlow Commander Pro 💸
3
+ colorFrom: yellow
4
+ colorTo: purple
5
+ emoji: 🐳
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite-v3
10
  ---
11
 
12
+ # Welcome to your new DeepSite project!
13
+ This project was created with [DeepSite](https://huggingface.co/deepsite).
index.html CHANGED
@@ -1,19 +1,162 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+
2
+ <!DOCTYPE html>
3
+ <html lang="pt-BR">
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <title>CashFlow Commander Pro | Gestão Financeira Inteligente</title>
8
+ <link rel="stylesheet" href="style.css">
9
+ <script src="https://cdn.tailwindcss.com"></script>
10
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
11
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
12
+ <script src="https://unpkg.com/feather-icons"></script>
13
+ <script src="components/navbar.js"></script>
14
+ <script src="components/footer.js"></script>
15
+ </head>
16
+ <body class="bg-gradient-to-br from-blue-50 to-gray-50">
17
+ <custom-navbar></custom-navbar>
18
+
19
+ <main class="container mx-auto px-4 py-8">
20
+ <div class="flex flex-col md:flex-row gap-6 mb-8">
21
+ <!-- DRE Section -->
22
+ <div class="bg-white rounded-xl shadow-lg p-6 flex-1 transition-all hover:shadow-xl">
23
+ <h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
24
+ <i data-feather="trending-up" class="mr-2 text-blue-600"></i> Demonstração de Resultados
25
+ </h2>
26
+ <div class="mb-4 flex justify-between">
27
+ <div class="relative">
28
+ <select class="appearance-none bg-white border border-gray-300 rounded-md px-4 py-2 pr-8 focus:outline-none focus:ring-2 focus:ring-blue-500">
29
+ <option>Outubro 2023</option>
30
+ <option>Setembro 2023</option>
31
+ <option>Agosto 2023</option>
32
+ </select>
33
+ <i data-feather="chevron-down" class="absolute right-2 top-2 text-gray-500"></i>
34
+ </div>
35
+ <button class="flex items-center text-blue-600 hover:text-blue-800">
36
+ <i data-feather="download" class="mr-1"></i> Exportar DRE
37
+ </button>
38
+ </div>
39
+
40
+ <div class="overflow-x-auto">
41
+ <table class="w-full text-sm">
42
+ <thead class="bg-blue-50">
43
+ <tr>
44
+ <th class="py-3 px-4 text-left font-medium text-blue-800">Item</th>
45
+ <th class="py-3 px-4 text-right font-medium text-blue-800">Valor (R$)</th>
46
+ </tr>
47
+ </thead>
48
+ <tbody>
49
+ <tr class="border-b border-gray-200 hover:bg-blue-50">
50
+ <td class="py-3 px-4 font-semibold text-gray-700">Receita Operacional Bruta</td>
51
+ <td class="py-3 px-4 text-right font-medium">55.340,00</td>
52
+ </tr>
53
+ <tr class="border-b border-gray-200 hover:bg-blue-50">
54
+ <td class="py-3 px-4 pl-6 text-gray-600">(-) Deduções da Receita</td>
55
+ <td class="py-3 px-4 text-right text-red-600 font-medium">-4.406,00</td>
56
+ </tr>
57
+ <tr class="border-b border-gray-200 bg-blue-100">
58
+ <td class="py-3 px-4 font-semibold text-blue-800">Receita Líquida</td>
59
+ <td class="py-3 px-4 text-right font-semibold text-blue-800">50.934,00</td>
60
+ </tr>
61
+ <tr class="border-b border-gray-200 hover:bg-blue-50">
62
+ <td class="py-3 px-4 text-gray-600">(-) Custo Operacional</td>
63
+ <td class="py-3 px-4 text-right text-red-600 font-medium">-17.319,00</td>
64
+ </tr>
65
+ <tr class="border-b border-gray-200 bg-blue-100">
66
+ <td class="py-3 px-4 font-semibold text-blue-800">Lucro Bruto</td>
67
+ <td class="py-3 px-4 text-right font-semibold text-blue-800">33.615,00</td>
68
+ </tr>
69
+ <tr class="border-b border-gray-200 hover:bg-blue-50">
70
+ <td class="py-3 px-4 text-gray-600">(-) Despesas Operacionais</td>
71
+ <td class="py-3 px-4 text-right text-red-600 font-medium">-31.331,00</td>
72
+ </tr>
73
+ <tr class="border-b border-gray-200 bg-blue-100">
74
+ <td class="py-3 px-4 font-semibold text-blue-800">Lucro Operacional</td>
75
+ <td class="py-3 px-4 text-right font-semibold text-blue-800">2.284,00</td>
76
+ </tr>
77
+ <tr class="border-b border-gray-200">
78
+ <td class="py-3 px-4">(+/-) Resultado Financeiro</td>
79
+ <td class="py-3 px-4 text-right">0,00</td>
80
+ </tr>
81
+ <tr class="bg-green-50">
82
+ <td class="py-3 px-4 font-bold">Lucro Líquido</td>
83
+ <td class="py-3 px-4 text-right font-bold">2.284,00</td>
84
+ </tr>
85
+ </tbody>
86
+ </table>
87
+ </div>
88
+ <div class="mt-6">
89
+ <h3 class="text-lg font-semibold mb-2">Margens</h3>
90
+ <div class="grid grid-cols-2 gap-4">
91
+ <div class="bg-blue-50 p-3 rounded-lg">
92
+ <p class="text-sm text-gray-600">Margem Bruta</p>
93
+ <p class="text-xl font-bold">66.0%</p>
94
+ </div>
95
+ <div class="bg-green-50 p-3 rounded-lg">
96
+ <p class="text-sm text-gray-600">Margem Líquida</p>
97
+ <p class="text-xl font-bold">4.1%</p>
98
+ </div>
99
+ </div>
100
+ </div>
101
+ </div>
102
+
103
+ <!-- Fluxo de Caixa Section -->
104
+ <div class="bg-white rounded-lg shadow-md p-6 flex-1">
105
+ <h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
106
+ <i data-feather="dollar-sign" class="mr-2"></i> Fluxo de Caixa (Outubro)
107
+ </h2>
108
+ <div class="mb-6">
109
+ <div class="grid grid-cols-2 gap-4 mb-4">
110
+ <div class="bg-green-100 p-4 rounded-lg">
111
+ <p class="text-sm text-gray-600">Total Recebimentos</p>
112
+ <p class="text-xl font-bold text-green-800">R$ 53.356,00</p>
113
+ </div>
114
+ <div class="bg-red-100 p-4 rounded-lg">
115
+ <p class="text-sm text-gray-600">Total Pagamentos</p>
116
+ <p class="text-xl font-bold text-red-800">R$ 60.699,00</p>
117
+ </div>
118
+ </div>
119
+ <div class="bg-blue-100 p-4 rounded-lg mb-4">
120
+ <p class="text-sm text-gray-600">Geração de Caixa</p>
121
+ <p class="text-xl font-bold text-blue-800">-R$ 7.344,00</p>
122
+ </div>
123
+ <div class="bg-indigo-100 p-4 rounded-lg">
124
+ <p class="text-sm text-gray-600">Saldo Final</p>
125
+ <p class="text-xl font-bold text-indigo-800">R$ 12.728,00</p>
126
+ </div>
127
+ </div>
128
+ <div>
129
+ <h3 class="text-lg font-semibold mb-2">Distribuição de Despesas</h3>
130
+ <div class="h-64">
131
+ <canvas id="expenseChart"></canvas>
132
+ </div>
133
+ </div>
134
+ </div>
135
+ </div>
136
+
137
+ <!-- Análise Mensal Section -->
138
+ <div class="bg-white rounded-lg shadow-md p-6 mb-8">
139
+ <h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
140
+ <i data-feather="bar-chart-2" class="mr-2"></i> Análise Mensal (2023)
141
+ </h2>
142
+ <div class="h-96">
143
+ <canvas id="monthlyTrendChart"></canvas>
144
+ </div>
145
+ </div>
146
+
147
+ <!-- Pontos de Atenção Section -->
148
+ <div class="bg-white rounded-lg shadow-md p-6">
149
+ <h2 class="text-2xl font-bold text-gray-800 mb-4 flex items-center">
150
+ <i data-feather="alert-triangle" class="mr-2"></i> Pontos de Atenção e Diretrizes
151
+ </h2>
152
+ <div class="grid md:grid-cols-2 gap-6">
153
+ <div class="bg-yellow-50 p-4 rounded-lg border-l-4 border-yellow-400">
154
+ <h3 class="font-bold text-yellow-800 mb-2">Despesas Operacionais</h3>
155
+ <p class="text-gray-700">As despesas operacionais representam 61.4% da receita líquida. Recomenda-se revisão de custos fixos e busca por eficiência operacional.</p>
156
+ </div>
157
+ <div class="bg-red-50 p-4 rounded-lg border-l-4 border-red-400">
158
+ <h3 class="font-bold text-red-800 mb-2">Geração de Caixa Negativa</h3>
159
+ <p class="text-gray-700">Em outubro, o
160
+ <script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
161
+ </body>
162
+ </html>