zmiany

app/static/index.html

@@ -18,8 +18,11 @@
         <div class="d-flex gap-2 flex-wrap justify-content-end">
           <button id="themeToggle" class="btn btn-outline-secondary btn-sm" type="button" aria-label="Przełącz motyw">☀️ Jasny</button>
           <button id="loadNbp" class="btn btn-outline-primary btn-sm">Pobierz stopę NBP</button>
+          <button id="exportJson" class="btn btn-outline-secondary btn-sm">Eksport JSON</button>
+          <button id="importJson" class="btn btn-outline-secondary btn-sm">Import JSON</button>
           <button id="exportCsv" class="btn btn-outline-secondary btn-sm">CSV</button>
           <button id="exportPdf" class="btn btn-primary btn-sm">PDF</button>
+          <input id="jsonFile" type="file" accept="application/json,.json" hidden>
         </div>
       </div>
     </header>
@@ -60,6 +63,20 @@
                   <option value="lower_payment">Zmniejszenie raty</option>
                 </select>
               </div>
+              <div class="col-6">
+                <label class="form-label">Data startu kredytu</label>
+                <input id="loanStartDate" type="date" class="form-control form-control-sm">
+              </div>
+              <div class="col-6">
+                <label class="form-label">Dzień spłaty raty</label>
+                <input id="dueDay" type="number" min="1" max="28" class="form-control form-control-sm" value="5">
+              </div>
+              <div class="col-12">
+                <label class="form-check small mb-0">
+                  <input id="moveDueDate" class="form-check-input" type="checkbox" checked>
+                  <span class="form-check-label">Przesuwaj spłatę na pierwszy dzień roboczy, jeśli wypada w dzień wolny</span>
+                </label>
+              </div>
             </div>
 
             <hr>
@@ -75,6 +92,16 @@
               <button id="addOverpayment" class="btn btn-sm btn-outline-primary">+</button>
             </div>
             <div id="overpayments" class="stack"></div>
+
+            <hr>
+            <div class="d-flex justify-content-between align-items-center mb-2">
+              <div>
+                <h3 class="h6 mb-0">Kredyt historyczny</h3>
+                <div class="text-muted small">Miesięczne oprocentowanie, karencja i faktyczne nadpłaty</div>
+              </div>
+              <button id="addHistorical" class="btn btn-sm btn-outline-primary">+</button>
+            </div>
+            <div id="historicalMonths" class="stack"></div>
           </div>
         </div>
       </section>
@@ -106,6 +133,14 @@
               </div>
             </div>
           </div>
+          <div class="col-12">
+            <div class="card shadow-sm border-0 chart-card">
+              <div class="card-body">
+                <h2 class="h6">Podział raty i koszt narastająco</h2>
+                <canvas id="detailChart"></canvas>
+              </div>
+            </div>
+          </div>
           <div class="col-12">
             <div class="card shadow-sm border-0">
               <div class="card-body">
@@ -119,7 +154,7 @@
               <div class="card-body table-responsive">
                 <h2 class="h6">Harmonogram</h2>
                 <table class="table table-sm align-middle mb-0">
-                  <thead><tr><th>Mies.</th><th>Oproc.</th><th>Rata</th><th>Kapitał</th><th>Odsetki</th><th>Nadpłata</th><th>Saldo</th></tr></thead>
+                  <thead><tr><th>Mies.</th><th>Data</th><th>Dni</th><th>Oproc.</th><th>Rata</th><th>Kapitał</th><th>Odsetki</th><th>Nadpłata</th><th>Prow.</th><th>Koszt nar.</th><th>Saldo</th></tr></thead>
                   <tbody id="scheduleTable"></tbody>
                 </table>
               </div>