Hugging Face's logo

Spaces:
LIMATEC
/
limanet
Running

App Files Community
LIMATEC commited on
Commit
ec89954
·
verified ·
1 Parent(s): db647c5

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +257 -19
  3. prompts.txt +4 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Limanet
3
- emoji: 🏆
4
- colorFrom: indigo
5
- colorTo: red
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: limanet
3
+ emoji: 🐳
4
+ colorFrom: red
5
+ colorTo: yellow
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,257 @@
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
+ <!DOCTYPE html>
2
+ <html lang="pt-BR">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>LIMANET - Sistema de Controle</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .gradient-bg {
11
+ background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
12
+ }
13
+ .card-hover:hover {
14
+ transform: translateY(-5px);
15
+ box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
16
+ }
17
+ .transition-all {
18
+ transition: all 0.3s ease;
19
+ }
20
+ .status-active {
21
+ background-color: #d1fae5;
22
+ color: #065f46;
23
+ }
24
+ .status-overdue {
25
+ background-color: #fee2e2;
26
+ color: #b91c1c;
27
+ }
28
+ .status-blocked {
29
+ background-color: #fef3c7;
30
+ color: #92400e;
31
+ }
32
+ .status-inactive {
33
+ background-color: #e5e7eb;
34
+ color: #4b5563;
35
+ }
36
+ </style>
37
+ </head>
38
+ <body class="bg-gray-100 font-sans">
39
+ <!-- Login Screen -->
40
+ <div id="login-screen" class="min-h-screen flex items-center justify-center gradient-bg">
41
+ <div class="bg-white p-8 rounded-lg shadow-xl w-full max-w-md">
42
+ <div class="text-center mb-8">
43
+ <div class="flex justify-center mb-4">
44
+ <div class="bg-blue-600 text-white p-4 rounded-full w-24 h-24 flex items-center justify-center">
45
+ <i class="fas fa-wifi text-4xl"></i>
46
+ </div>
47
+ </div>
48
+ <h1 class="text-3xl font-bold text-gray-800">LIMANET</h1>
49
+ <p class="text-blue-600 mt-2">Internet rápida, atendimento de verdade</p>
50
+ </div>
51
+ <form id="login-form" class="space-y-6">
52
+ <div>
53
+ <label for="username" class="block text-sm font-medium text-gray-700">Usuário</label>
54
+ <input type="text" id="username" name="username" required
55
+ class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500">
56
+ </div>
57
+ <div>
58
+ <label for="password" class="block text-sm font-medium text-gray-700">Senha</label>
59
+ <input type="password" id="password" name="password" required
60
+ class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500">
61
+ </div>
62
+ <div>
63
+ <button type="submit"
64
+ class="w-full flex justify-center py-2 px-4 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 transition-all">
65
+ Entrar
66
+ </button>
67
+ </div>
68
+ </form>
69
+ </div>
70
+ </div>
71
+
72
+ <!-- Dashboard Screen (hidden by default) -->
73
+ <div id="dashboard-screen" class="hidden min-h-screen">
74
+ <!-- Header -->
75
+ <header class="bg-white shadow-sm">
76
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
77
+ <div class="flex justify-between items-center py-4">
78
+ <div class="flex items-center">
79
+ <div class="bg-blue-600 text-white p-3 rounded-full mr-3">
80
+ <i class="fas fa-wifi"></i>
81
+ </div>
82
+ <h1 class="text-xl font-bold text-gray-900">LIMANET</h1>
83
+ <span class="ml-2 text-sm text-gray-600">Internet rápida, atendimento de verdade</span>
84
+ </div>
85
+ <div class="flex items-center space-x-4">
86
+ <button id="add-client-btn" class="bg-blue-600 text-white px-4 py-2 rounded-md text-sm hover:bg-blue-700 transition-all">
87
+ <i class="fas fa-plus mr-1"></i> Novo Cliente
88
+ </button>
89
+ <span class="text-gray-600">Admin</span>
90
+ <button id="logout-btn" class="text-blue-600 hover:text-blue-800">
91
+ <i class="fas fa-sign-out-alt"></i>
92
+ </button>
93
+ </div>
94
+ </div>
95
+ </div>
96
+ </header>
97
+
98
+ <!-- Main Content -->
99
+ <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
100
+ <!-- Dashboard Stats -->
101
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-8">
102
+ <div class="bg-white rounded-lg shadow p-6 card-hover transition-all">
103
+ <div class="flex items-center justify-between">
104
+ <div>
105
+ <p class="text-sm font-medium text-gray-500">Total de Clientes</p>
106
+ <p id="total-clients-count" class="text-2xl font-semibold text-gray-900">0</p>
107
+ </div>
108
+ <div class="bg-blue-100 p-3 rounded-full">
109
+ <i class="fas fa-users text-blue-600"></i>
110
+ </div>
111
+ </div>
112
+ </div>
113
+ <div class="bg-white rounded-lg shadow p-6 card-hover transition-all">
114
+ <div class="flex items-center justify-between">
115
+ <div>
116
+ <p class="text-sm font-medium text-gray-500">Clientes Ativos</p>
117
+ <p id="active-clients" class="text-2xl font-semibold text-gray-900">0</p>
118
+ </div>
119
+ <div class="bg-green-100 p-3 rounded-full">
120
+ <i class="fas fa-user-check text-green-600"></i>
121
+ </div>
122
+ </div>
123
+ </div>
124
+ <div class="bg-white rounded-lg shadow p-6 card-hover transition-all">
125
+ <div class="flex items-center justify-between">
126
+ <div>
127
+ <p class="text-sm font-medium text-gray-500">Inadimplentes</p>
128
+ <p id="overdue-clients" class="text-2xl font-semibold text-gray-900">0</p>
129
+ </div>
130
+ <div class="bg-red-100 p-3 rounded-full">
131
+ <i class="fas fa-exclamation-triangle text-red-600"></i>
132
+ </div>
133
+ </div>
134
+ </div>
135
+ <div class="bg-white rounded-lg shadow p-6 card-hover transition-all">
136
+ <div class="flex items-center justify-between">
137
+ <div>
138
+ <p class="text-sm font-medium text-gray-500">Clientes Inativos</p>
139
+ <p id="inactive-clients" class="text-2xl font-semibold text-gray-900">0</p>
140
+ </div>
141
+ <div class="bg-gray-100 p-3 rounded-full">
142
+ <i class="fas fa-user-slash text-gray-600"></i>
143
+ </div>
144
+ </div>
145
+ </div>
146
+ </div>
147
+
148
+ <!-- Blocks Overview -->
149
+ <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4 mb-8">
150
+ <div class="bg-white rounded-lg shadow p-4 text-center card-hover transition-all">
151
+ <p class="text-sm font-medium text-gray-500">Bloco 19</p>
152
+ <p id="block-19-count" class="text-xl font-semibold">0</p>
153
+ </div>
154
+ <div class="bg-white rounded-lg shadow p-4 text-center card-hover transition-all">
155
+ <p class="text-sm font-medium text-gray-500">Bloco 20</p>
156
+ <p id="block-20-count" class="text-xl font-semibold">0</p>
157
+ </div>
158
+ <div class="bg-white rounded-lg shadow p-4 text-center card-hover transition-all">
159
+ <p class="text-sm font-medium text-gray-500">Bloco 21</p>
160
+ <p id="block-21-count" class="text-xl font-semibold">0</p>
161
+ </div>
162
+ <div class="bg-white rounded-lg shadow p-4 text-center card-hover transition-all">
163
+ <p class="text-sm font-medium text-gray-500">Bloco 22</p>
164
+ <p id="block-22-count" class="text-xl font-semibold">0</p>
165
+ </div>
166
+ <div class="bg-white rounded-lg shadow p-4 text-center card-hover transition-all">
167
+ <p class="text-sm font-medium text-gray-500">Bloco 23</p>
168
+ <p id="block-23-count" class="text-xl font-semibold">0</p>
169
+ </div>
170
+ <div class="bg-white rounded-lg shadow p-4 text-center card-hover transition-all">
171
+ <p class="text-sm font-medium text-gray-500">Bloco 24</p>
172
+ <p id="block-24-count" class="text-xl font-semibold">0</p>
173
+ </div>
174
+ </div>
175
+
176
+ <!-- Clients Table -->
177
+ <div class="bg-white shadow rounded-lg overflow-hidden">
178
+ <div class="px-6 py-4 border-b border-gray-200 flex justify-between items-center">
179
+ <h2 class="text-lg font-medium text-gray-900">Clientes - Condomínio Flores</h2>
180
+ <div class="flex space-x-2">
181
+ <select id="block-filter" class="border-gray-300 rounded-md shadow-sm focus:border-blue-500 focus:ring-blue-500">
182
+ <option value="">Todos os Blocos</option>
183
+ <option value="BLOCO19">Bloco 19</option>
184
+ <option value="BLOCO20">Bloco 20</option>
185
+ <option value="BLOCO21">Bloco 21</option>
186
+ <option value="BLOCO22">Bloco 22</option>
187
+ <option value="BLOCO23">Bloco 23</option>
188
+ <option value="BLOCO24">Bloco 24</option>
189
+ </select>
190
+ <select id="status-filter" class="border-gray-300 rounded-md shadow-sm focus:border-blue-500 focus:ring-blue-500">
191
+ <option value="">Todos os Status</option>
192
+ <option value="active">Ativos</option>
193
+ <option value="inactive">Inativos</option>
194
+ <option value="overdue">Inadimplentes</option>
195
+ </select>
196
+ <select id="plan-filter" class="border-gray-300 rounded-md shadow-sm focus:border-blue-500 focus:ring-blue-500">
197
+ <option value="">Todos os Planos</option>
198
+ <option value="100MB">100MB</option>
199
+ <option value="200MB">200MB</option>
200
+ <option value="300MB">300MB</option>
201
+ </select>
202
+ </div>
203
+ </div>
204
+ <div class="overflow-x-auto">
205
+ <table class="min-w-full divide-y divide-gray-200">
206
+ <thead class="bg-gray-50">
207
+ <tr>
208
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Nome</th>
209
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Endereço</th>
210
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Plano</th>
211
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Pagamento</th>
212
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
213
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Ações</th>
214
+ </tr>
215
+ </thead>
216
+ <tbody id="clients-table-body" class="bg-white divide-y divide-gray-200">
217
+ <!-- Clients will be inserted here by JavaScript -->
218
+ </tbody>
219
+ </table>
220
+ </div>
221
+ <div class="px-6 py-4 border-t border-gray-200 flex justify-between items-center">
222
+ <div class="text-sm text-gray-500">
223
+ Mostrando <span id="showing-from">1</span> a <span id="showing-to">10</span> de <span id="total-clients">0</span> clientes
224
+ </div>
225
+ <div class="flex space-x-2">
226
+ <button id="prev-page" class="px-3 py-1 border rounded-md text-sm font-medium disabled:opacity-50" disabled>Anterior</button>
227
+ <button id="next-page" class="px-3 py-1 border rounded-md text-sm font-medium disabled:opacity-50" disabled>Próxima</button>
228
+ </div>
229
+ </div>
230
+ </div>
231
+ </main>
232
+ </div>
233
+
234
+ <!-- Client Modal (hidden by default) -->
235
+ <div id="client-modal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center hidden z-50">
236
+ <div class="bg-white rounded-lg shadow-xl w-full max-w-md">
237
+ <div class="px-6 py-4 border-b border-gray-200 flex justify-between items-center">
238
+ <h3 class="text-lg font-medium text-gray-900" id="modal-title">Adicionar Cliente</h3>
239
+ <button id="close-modal" class="text-gray-500 hover:text-gray-700">
240
+ <i class="fas fa-times"></i>
241
+ </button>
242
+ </div>
243
+ <div class="px-6 py-4 space-y-4">
244
+ <input type="hidden" id="edit-client-id">
245
+ <div>
246
+ <label for="edit-client-name" class="block text-sm font-medium text-gray-700">Nome Completo</label>
247
+ <input type="text" id="edit-client-name" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500">
248
+ </div>
249
+ <div>
250
+ <label for="edit-client-address" class="block text-sm font-medium text-gray-700">Endereço</label>
251
+ <input type="text" id="edit-client-address" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500" placeholder="Rua, número, complemento">
252
+ </div>
253
+ <div class="grid grid-cols-2 gap-4">
254
+ <div>
255
+ <label for="edit-client-block" class="block text-sm font-medium text-gray-700">Bloco</label>
256
+ <select id="edit-client-block" class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue
257
+ </html>
prompts.txt ADDED
@@ -0,0 +1,4 @@
 
 
 
 
 
1
+ estou criando uma empresa de distribuição de internet pois o nome é LIMANET, quero um slogan profissional e chamativo o logo pode ser na construção do sistema que você vai criar pra mim, quero um sistema de controle de assinantes que tenho uma pagina principal com o logo da empresa no meio e embaixo um login e senha pra entrar no sistema quando colocar o login "admin" e a senha "1234" quando clickar uma uma nova tela com uma DASHBOARD completo com informações de clientes em dia com o pagamento e os clientes inadimplentes e bloco e apartamento o condomínio chama "FLORES" TEM 6 BLOCOS "BLOCO19","BLOCO20", "BLOCO21", "BLOCO22", "BLOCO23", "BLOCO24", configure os clientes com dados importantes como o endereço completo bloco e apto, quero também um botão na tela de informações de cliente um botão de cliente ativo ou não ativo e uma opção de qual o plano de internet o cliente possui, planos de internet como 100MB, 200MB, 300MB, pagamentos em boleto, pix, essas informações quero tudo na DASHBOARD, quero um script com todas essas informações sem código.
2
+ ✅ Nome da Empresa LIMANET ✅ Slogan Profissional e Chamativo “Conectando você com qualidade e confiança.” ou “Internet rápida, atendimento de verdade.” ou “A sua conexão, do seu jeito — com a LIMANET.” Você pode escolher o que mais combina com o estilo da empresa. ✅ Estrutura do Sistema (sem código, apenas em roteiro) 1. Tela Inicial Tela centralizada com: Logo da LIMANET Campo para login Campo para senha Botão: Entrar Autenticação: Login: admin Senha: 1234 2. Tela Principal: Dashboard da LIMANET Após o login, o sistema redireciona para uma Dashboard Administrativa com as seguintes seções: 🧭 Seções da Dashboard A. Visão Geral Quantidade total de clientes Quantidade de clientes ativos Quantidade de clientes inativos Quantidade de clientes inadimplentes Blocos do condomínio: BLOCO19, BLOCO20, BLOCO21, BLOCO22, BLOCO23, BLOCO24 B. Lista de Clientes Tabela com: Nome completo Endereço completo Bloco e Apartamento Plano de Internet (100MB, 200MB, 300MB) Forma de pagamento (Boleto, Pix) Status do cliente: Ativo / Inativo (com botão de alternância) Situação financeira: Em dia / Inadimplente C. Filtros e Ações Filtro por Bloco Filtro por Status (Ativo/Inativo) Filtro por Plano Botão "Adicionar Cliente" Botão "Editar Cliente" Botão "Remover Cliente" 🧾 Dados por Cliente (detalhado ao clicar no nome do cliente) Nome completo Endereço: Rua, número, complemento, cidade Bloco: BLOCO19 a BLOCO24 Apartamento Plano contratado: 100MB, 200MB, 300MB Forma de pagamento: Pix ou Boleto Status do Cliente: Ativo / Inativo Situação do pagamento: Em dia / Inadimplente Histórico de pagamentos (opcional)
3
+ ✅ Nome da Empresa LIMANET ✅ Slogan Profissional e Chamativo “Conectando você com qualidade e confiança.” ou “Internet rápida, atendimento de verdade.” ou “A sua conexão, do seu jeito — com a LIMANET.” Você pode escolher o que mais combina com o estilo da empresa. ✅ Estrutura do Sistema (sem código, apenas em roteiro) 1. Tela Inicial Tela centralizada com: Logo da LIMANET Campo para login Campo para senha Botão: Entrar Autenticação: Login: admin Senha: 1234 2. Tela Principal: Dashboard da LIMANET Após o login, o sistema redireciona para uma Dashboard Administrativa com as seguintes seções: 🧭 Seções da Dashboard A. Visão Geral Quantidade total de clientes Quantidade de clientes ativos Quantidade de clientes inativos Quantidade de clientes inadimplentes Blocos do condomínio: BLOCO19, BLOCO20, BLOCO21, BLOCO22, BLOCO23, BLOCO24 B. Lista de Clientes Tabela com: Nome completo Endereço completo Bloco e Apartamento Plano de Internet (100MB, 200MB, 300MB) Forma de pagamento (Boleto, Pix) Status do cliente: Ativo / Inativo (com botão de alternância) Situação financeira: Em dia / Inadimplente C. Filtros e Ações Filtro por Bloco Filtro por Status (Ativo/Inativo) Filtro por Plano Botão "Adicionar Cliente" Botão "Editar Cliente" Botão "Remover Cliente" 🧾 Dados por Cliente (detalhado ao clicar no nome do cliente) Nome completo Endereço: Rua, número, complemento, cidade Bloco: BLOCO19 a BLOCO24 Apartamento Plano contratado: 100MB, 200MB, 300MB Forma de pagamento: Pix ou Boleto Status do Cliente: Ativo / Inativo Situação do pagamento: Em dia / Inadimplente Histórico de pagamentos (opcional)
4
+ ✅ Nome da Empresa LIMANET ✅ Slogan Profissional e Chamativo “Conectando você com qualidade e confiança.” ou “Internet rápida, atendimento de verdade.” ou “A sua conexão, do seu jeito — com a LIMANET.” Você pode escolher o que mais combina com o estilo da empresa. ✅ Estrutura do Sistema (sem código, apenas em roteiro) 1. Tela Inicial Tela centralizada com: Logo da LIMANET Campo para login Campo para senha Botão: Entrar Autenticação: Login: admin Senha: 1234 2. Tela Principal: Dashboard da LIMANET Após o login, o sistema redireciona para uma Dashboard Administrativa com as seguintes seções: 🧭 Seções da Dashboard A. Visão Geral Quantidade total de clientes Quantidade de clientes ativos Quantidade de clientes inativos Quantidade de clientes inadimplentes Blocos do condomínio: BLOCO19, BLOCO20, BLOCO21, BLOCO22, BLOCO23, BLOCO24 B. Lista de Clientes Tabela com: Nome completo Endereço completo Bloco e Apartamento Plano de Internet (100MB, 200MB, 300MB) Forma de pagamento (Boleto, Pix) Status do cliente: Ativo / Inativo (com botão de alternância) Situação financeira: Em dia / Inadimplente C. Filtros e Ações Filtro por Bloco Filtro por Status (Ativo/Inativo) Filtro por Plano Botão "Adicionar Cliente" Botão "Editar Cliente" Botão "Remover Cliente" 🧾 Dados por Cliente (detalhado ao clicar no nome do cliente) Nome completo Endereço: Rua, número, complemento, cidade Bloco: BLOCO19 a BLOCO24 Apartamento Plano contratado: 100MB, 200MB, 300MB Forma de pagamento: Pix ou Boleto Status do Cliente: Ativo / Inativo Situação do pagamento: Em dia / Inadimplente Histórico de pagamentos (opcional)