Spaces:

Antoni09
/

Test_DB

Sleeping

App Files Files Community

Upload index.html

by Antoni09 - opened Nov 14, 2025

base: refs/heads/main

←

from: refs/pr/7

Discussion Files changed

+348

-209

Files changed (1) hide show

templates/index.html +348 -209

templates/index.html CHANGED Viewed

@@ -1,209 +1,348 @@
-<!DOCTYPE html>
-<html lang="pl">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Generator faktur</title>
-  <link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}">
-</head>
-<body>
-  <main class="container">
-    <h1>Generator faktur</h1>
-    <section id="setup-section" class="panel hidden">
-      <h2>Konfiguracja danych firmy</h2>
-      <form id="setup-form" class="form">
-        <div class="field-grid">
-          <label>
-            Nazwa firmy
-            <input type="text" name="company_name" required>
-          </label>
-          <label>
-            Imie i nazwisko wlasciciela
-            <input type="text" name="owner_name" required>
-          </label>
-          <label>
-            Ulica i numer
-            <input type="text" name="address_line" required>
-          </label>
-          <label>
-            Kod pocztowy
-            <input type="text" name="postal_code" required>
-          </label>
-          <label>
-            Miejscowosc
-            <input type="text" name="city" required>
-          </label>
-          <label>
-            NIP
-            <input type="text" name="tax_id" required>
-          </label>
-          <label>
-            Numer konta bankowego
-            <input type="text" name="bank_account" required>
-          </label>
-          <label>
-            Haslo
-            <input type="password" name="password" required>
-          </label>
-          <label>
-            Powtorz haslo
-            <input type="password" name="confirm_password" required>
-          </label>
-        </div>
-        <button type="submit">Zapisz dane</button>
-        <p class="hint">Dane przechowywane sa na serwerze lokalnym.</p>
-      </form>
-      <p id="setup-feedback" class="feedback"></p>
-    </section>
-    <section id="login-section" class="panel hidden">
-      <h2>Logowanie</h2>
-      <form id="login-form" class="form">
-        <label>
-          Haslo
-          <input type="password" name="password" required>
-        </label>
-        <button type="submit">Zaloguj</button>
-      </form>
-      <p id="login-feedback" class="feedback"></p>
-    </section>
-    <section id="app-section" class="panel hidden">
-      <header class="invoice-header">
-        <h2>Panel faktur</h2>
-        <button id="logout-button" type="button" class="link-button">Wyloguj</button>
-      </header>
-      <section class="business-section">
-        <div class="business-section-header">
-          <h3>Dane sprzedawcy</h3>
-          <button id="toggle-business-form" type="button" class="link-button">Edytuj dane</button>
-        </div>
-        <div id="business-display" class="business-display"></div>
-        <form id="business-form" class="form hidden">
-          <div class="field-grid">
-            <label>
-              Nazwa firmy
-              <input type="text" name="company_name" required>
-            </label>
-            <label>
-              Imie i nazwisko wlasciciela
-              <input type="text" name="owner_name" required>
-            </label>
-            <label>
-              Ulica i numer
-              <input type="text" name="address_line" required>
-            </label>
-            <label>
-              Kod pocztowy
-              <input type="text" name="postal_code" required>
-            </label>
-            <label>
-              Miejscowosc
-              <input type="text" name="city" required>
-            </label>
-            <label>
-              NIP
-              <input type="text" name="tax_id" required>
-            </label>
-            <label>
-              Numer konta bankowego
-              <input type="text" name="bank_account" required>
-            </label>
-          </div>
-          <div class="form-actions">
-            <button type="submit">Zapisz</button>
-            <button id="cancel-business-update" type="button" class="link-button">Anuluj</button>
-          </div>
-          <p id="business-feedback" class="feedback"></p>
-        </form>
-      </section>
-      <form id="invoice-form" class="form">
-        <fieldset>
-          <legend>Informacje o fakturze</legend>
-          <label>
-            Data sprzedazy / wykonania uslugi
-            <input type="date" name="saleDate">
-          </label>
-        </fieldset>
-        <fieldset>
-          <legend>Dane nabywcy</legend>
-          <div class="field-grid">
-            <label>
-              Nazwa / Imie i nazwisko
-              <input type="text" name="clientName">
-            </label>
-            <label>
-              NIP
-              <input type="text" name="clientTaxId">
-            </label>
-            <label>
-              Ulica i numer
-              <input type="text" name="clientAddress">
-            </label>
-            <label>
-              Kod pocztowy
-              <input type="text" name="clientPostalCode">
-            </label>
-            <label>
-              Miejscowosc
-              <input type="text" name="clientCity">
-            </label>
-          </div>
-        </fieldset>
-        <section class="items-section">
-          <header class="items-header">
-            <h3>Pozycje faktury</h3>
-            <button type="button" id="add-item-button">Dodaj pozycje</button>
-          </header>
-          <div class="items-table-wrapper">
-            <table class="items-table">
-              <thead>
-                <tr>
-                  <th>Nazwa towaru/uslugi</th>
-                  <th>Ilosc</th>
-                  <th>Cena jedn. brutto (PLN)</th>
-                  <th>Stawka VAT</th>
-                  <th>Wartosc brutto (PLN)</th>
-                  <th></th>
-                </tr>
-              </thead>
-              <tbody id="items-body"></tbody>
-            </table>
-          </div>
-        </section>
-        <div id="totals-container" class="totals">
-          <span id="total-net">Suma netto: 0.00 PLN</span>
-          <span id="total-vat">Kwota VAT: 0.00 PLN</span>
-          <span id="total-gross">Suma brutto: 0.00 PLN</span>
-        </div>
-        <section id="rate-summary" class="rate-summary"></section>
-        <div id="exemption-note-wrapper" class="hidden">
-          <label>
-            Podstawa prawna zwolnienia (stosowana dla pozycji ZW)
-            <textarea id="exemption-note" rows="3" placeholder="np. Art. 43 ust. 1 pkt 19 ustawy o VAT"></textarea>
-          </label>
-        </div>
-        <button type="submit">Generuj fakture</button>
-      </form>
-      <section id="invoice-result" class="panel hidden">
-        <h3>Podglad faktury</h3>
-        <div id="invoice-output" class="invoice-preview"></div>
-        <button id="download-button" type="button">Pobierz jako plik PDF</button>
-      </section>
-    </section>
-  </main>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js" defer></script>
-  <script src="{{ url_for('static', filename='js/main.js') }}" defer></script>
-</body>
-</html>

+<!DOCTYPE html>
+<html lang="pl">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Generator faktur</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+  <main class="container">
+    <div class="header-section">
+      <div class="logo-container">
+        <img src="small_logotyp do strony.jpg" alt="Logotyp FakturON!" class="logo">
+        <h1 class="app-title">Generator faktur</h1>
+      </div>
+      <p class="app-description">
+        Strona internetowa, gdzie możesz zupełnie bezpłatnie wystawić fakturę, edytować ją,
+        przeglądać swoje faktury oraz śledzić przychody.
+      </p>
+    </div>
+    <section id="auth-section" class="panel">
+      <div class="auth-login">
+        <div class="auth-card login-card">
+          <h3>Zaloguj się</h3>
+          <form id="login-form" class="form">
+            <label>
+              Email
+              <input type="email" name="email" autocomplete="email" required>
+            </label>
+            <label>
+              Hasło
+              <input type="password" name="password" autocomplete="current-password" required>
+            </label>
+            <button type="submit">Zaloguj</button>
+            <hr class="form-divider">
+          </form>
+          <p id="login-feedback" class="feedback" aria-live="polite"></p>
+          <div class="auth-actions">
+            <span>Nie masz konta?</span>
+            <button id="show-register-button" type="button" class="ghost-button">Stwórz konto</button>
+          </div>
+          <p id="legacy-login-hint" class="hint hidden"></p>
+        </div>
+      </div>
+    </section>
+    <section id="register-section" class="panel hidden">
+      <div class="auth-card register-card">
+        <div class="register-header">
+          <h3>Załóż konto</h3>
+          <button id="back-to-login" type="button" class="link-button">Wróć do logowania</button>
+        </div>
+        <form id="register-form" class="form">
+          <div class="register-fields">
+            <div class="field-grid register-credentials">
+              <label>
+                Email
+                <input type="email" name="email" autocomplete="email" required>
+              </label>
+              <label>
+                Hasło
+                <input type="password" name="password" autocomplete="new-password" required>
+              </label>
+              <label>
+                Powtórz hasło
+                <input type="password" name="confirm_password" autocomplete="new-password" required>
+              </label>
+            </div>
+            <div class="field-grid register-company">
+              <label>
+                Nazwa firmy
+                <input type="text" name="company_name" required>
+              </label>
+              <label>
+                Imię i nazwisko właściciela
+                <input type="text" name="owner_name" required>
+              </label>
+              <label>
+                Ulica i numer
+                <input type="text" name="address_line" required>
+              </label>
+              <label>
+                Kod pocztowy
+                <input type="text" name="postal_code" required>
+              </label>
+              <label>
+                Miejscowość
+                <input type="text" name="city" required>
+              </label>
+              <label>
+                NIP
+                <input type="text" name="tax_id" required>
+              </label>
+              <label>
+                Numer konta bankowego
+                <input type="text" name="bank_account" required>
+              </label>
+            </div>
+          </div>
+          <div class="form-actions">
+            <button type="submit">Utwórz konto</button>
+            <button id="cancel-register" type="button" class="link-button">Anuluj</button>
+          </div>
+        </form>
+        <p id="register-feedback" class="feedback"></p>
+        <p class="hint">Dane konta przechowywane są lokalnie na serwerze.</p>
+      </div>
+    </section>
+    <section id="app-section" class="panel hidden">
+      <header class="app-header">
+        <div>
+          <h2>Panel faktur</h2>
+          <p id="current-login-label" class="app-subtitle"></p>
+        </div>
+        <nav class="app-nav">
+          <button type="button" class="app-nav-button active" data-view="invoice-builder">Nowa faktura</button>
+          <button type="button" class="app-nav-button" data-view="dashboard">Dashboard</button>
+        </nav>
+        <button id="logout-button" type="button" class="link-button">Wyloguj</button>
+      </header>
+      <section id="invoice-builder-section" class="app-view">
+        <section class="business-section">
+          <div class="business-section-header">
+            <h3>Dane sprzedawcy</h3>
+            <div class="business-actions">
+              <button id="toggle-business-form" type="button" class="link-button">Edycja danych</button>
+              <label for="logo-input" class="button secondary">
+                <input id="logo-input" type="file" accept="image/png,image/jpeg" hidden>
+                Wgraj logo
+              </label>
+              <button id="remove-logo-button" type="button" class="link-button hidden">Usuń logo</button>
+            </div>
+          </div>
+          <div id="business-display" class="business-display"></div>
+          <div id="logo-preview" class="logo-preview hidden">
+            <span class="logo-preview-label">Logo sprzedawcy</span>
+            <img id="logo-preview-image" alt="Logo firmy">
+          </div>
+          <p id="logo-feedback" class="feedback"></p>
+          <form id="business-form" class="form hidden">
+            <div class="field-grid">
+              <label>
+                Nazwa firmy
+                <input type="text" name="company_name" required>
+              </label>
+              <label>
+                Imię i nazwisko właściciela
+                <input type="text" name="owner_name" required>
+              </label>
+              <label>
+                Ulica i numer
+                <input type="text" name="address_line" required>
+              </label>
+              <label>
+                Kod pocztowy
+                <input type="text" name="postal_code" required>
+              </label>
+              <label>
+                Miejscowość
+                <input type="text" name="city" required>
+              </label>
+              <label>
+                NIP
+                <input type="text" name="tax_id" required>
+              </label>
+              <label>
+                Numer konta bankowego
+                <input type="text" name="bank_account" required>
+              </label>
+            </div>
+            <div class="form-actions">
+              <button type="submit">Zapisz</button>
+              <button id="cancel-business-update" type="button" class="link-button">Anuluj</button>
+            </div>
+            <p id="business-feedback" class="feedback"></p>
+          </form>
+        </section>
+        <form id="invoice-form" class="form">
+          <fieldset>
+            <legend>Informacje o fakturze</legend>
+            <div class="field-grid">
+              <label>
+                Data sprzedaży / wykonania usługi
+                <input type="date" name="saleDate">
+              </label>
+              <label>
+                Termin płatności (dni)
+                <input type="number" name="paymentTerm" min="1" step="1" value="14">
+              </label>
+            </div>
+          </fieldset>
+          <fieldset>
+            <legend>Dane nabywcy</legend>
+            <div class="field-grid">
+              <label>
+                Nazwa / Imię i nazwisko
+                <input type="text" name="clientName">
+              </label>
+              <label>
+                NIP
+                <input type="text" name="clientTaxId">
+              </label>
+              <label>
+                Ulica i numer
+                <input type="text" name="clientAddress">
+              </label>
+              <label>
+                Kod pocztowy
+                <input type="text" name="clientPostalCode">
+              </label>
+              <label>
+                Miejscowość
+                <input type="text" name="clientCity">
+              </label>
+              <label>
+                Numer telefonu
+                <input type="tel" name="clientPhone">
+              </label>
+            </div>
+          </fieldset>
+          <section class="items-section">
+            <header class="items-header">
+              <h3>Pozycje faktury</h3>
+              <button type="button" id="add-item-button">Dodaj pozycję</button>
+            </header>
+            <div class="items-table-wrapper">
+              <table class="items-table">
+                <thead>
+                  <tr>
+                    <th>Nazwa towaru/usługi</th>
+                    <th>Ilość</th>
+                    <th>Jednostka</th>
+                    <th>Cena jedn. brutto (PLN)</th>
+                    <th>Stawka VAT</th>
+                    <th>Wartość brutto (PLN)</th>
+                    <th></th>
+                  </tr>
+                </thead>
+                <tbody id="items-body"></tbody>
+              </table>
+            </div>
+          </section>
+          <div id="totals-container" class="totals">
+            <span id="total-net">Suma netto: 0.00 PLN</span>
+            <span id="total-vat">Kwota VAT: 0.00 PLN</span>
+            <span id="total-gross">Suma brutto: 0.00 PLN</span>
+          </div>
+          <section id="rate-summary" class="rate-summary"></section>
+          <div id="exemption-note-wrapper" class="hidden">
+            <label for="exemption-reason">Powód zastosowania stawki ZW/0%</label>
+            <select id="exemption-reason" class="form-select">
+              <option value="">Wybierz podstawę zwolnienia...</option>
+            </select>
+            <label for="exemption-note" id="exemption-note-label">Podstawa prawna zwolnienia</label>
+            <textarea id="exemption-note" rows="3" placeholder="np. Art. 43 ust. 1 pkt 19 ustawy o VAT"></textarea>
+          </div>
+          <div class="form-actions">
+            <button type="submit" id="save-invoice-button">Generuj fakturę</button>
+            <button id="cancel-edit-invoice" type="button" class="link-button hidden">Anuluj edycję</button>
+          </div>
+        </form>
+        <section id="invoice-result" class="panel hidden">
+          <h3>Podgląd faktury</h3>
+          <div id="invoice-output" class="invoice-preview"></div>
+          <button id="download-button" type="button">Pobierz jako plik PDF</button>
+        </section>
+      </section>
+      <section id="dashboard-section" class="app-view hidden">
+        <header class="dashboard-header">
+          <div class="filters">
+            <label>
+              Od
+              <input type="date" id="filter-start-date">
+            </label>
+            <label>
+              Do
+              <input type="date" id="filter-end-date">
+            </label>
+            <button type="button" id="clear-filters" class="button secondary">Wyczyść</button>
+          </div>
+          <p id="dashboard-feedback" class="feedback"></p>
+        </header>
+        <section class="dashboard-summary">
+          <div class="summary-card">
+            <span class="summary-label">Ostatnie 30 dni</span>
+            <span id="summary-month-count" class="summary-count">0 faktur</span>
+            <span id="summary-month-amount" class="summary-amount">0.00 PLN</span>
+          </div>
+          <div class="summary-card">
+            <span class="summary-label">Bieżący kwartał</span>
+            <span id="summary-quarter-count" class="summary-count">0 faktur</span>
+            <span id="summary-quarter-amount" class="summary-amount">0.00 PLN</span>
+          </div>
+          <div class="summary-card">
+            <span class="summary-label">Bieżący rok</span>
+            <span id="summary-year-count" class="summary-count">0 faktur</span>
+            <span id="summary-year-amount" class="summary-amount">0.00 PLN</span>
+          </div>
+        </section>
+        <section class="dashboard-chart">
+          <canvas id="invoices-chart" aria-label="Podsumowanie faktur"></canvas>
+        </section>
+        <section class="dashboard-table">
+          <div class="items-table-wrapper">
+            <table class="items-table">
+              <thead>
+                <tr>
+                  <th>Numer</th>
+                  <th>Data wystawienia</th>
+                  <th>Nabywca</th>
+                  <th>Suma brutto</th>
+                  <th>Akcje</th>
+                </tr>
+              </thead>
+              <tbody id="invoices-table-body"></tbody>
+            </table>
+            <p id="invoices-empty" class="hint hidden">Brak faktur do wyświetlenia.</p>
+          </div>
+        </section>
+      </section>
+    </section>
+  </main>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js" defer></script>
+  <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.6/dist/chart.umd.min.js" defer></script>
+  <script src="main.js" defer></script>
+</body>
+</html>