Company - wszystkie moduły - wersja robocza
This commit is contained in:
257
prototype/company/app-billing.php
Normal file
257
prototype/company/app-billing.php
Normal file
@@ -0,0 +1,257 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y">
|
||||
|
||||
<h4 class="fw-bold py-3 mb-4">
|
||||
<span class="text-muted fw-light">Zarządzanie firmą /</span> Rozliczenia
|
||||
</h4>
|
||||
|
||||
<!-- Karta: Rozliczenia (Podsumowanie) -->
|
||||
<div class="card mb-4">
|
||||
<h5 class="card-header border-bottom">Rozliczenia</h5>
|
||||
<div class="card-body pt-5 pb-5">
|
||||
|
||||
<!-- Wycentrowany Alert z tłem ze screena -->
|
||||
<div class="d-flex justify-content-center mb-5">
|
||||
<div class="p-3 rounded text-white d-inline-flex align-items-center shadow-sm"
|
||||
style="background-color: #f04e76; font-weight: 500; width: 100%; max-width: 800px;">
|
||||
<i class='bx bxs-error-alt me-2 fs-5'></i>
|
||||
Dokonaj płatności aby zachować subskrypcję. Usługi pozostaną aktywne do 2026-03-31.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Parametry -->
|
||||
<div class="d-flex flex-column flex-md-row justify-content-center gap-5">
|
||||
<div class="text-start">
|
||||
<small class="text-muted text-uppercase fw-semibold" style="letter-spacing: 0.5px;">Aktualny okres
|
||||
rozliczeniowy:</small>
|
||||
<h5 class="mt-2 mb-0 fw-bold text-dark">2026-03-01 - 2026-03-31</h5>
|
||||
</div>
|
||||
|
||||
<div class="text-start">
|
||||
<small class="text-muted text-uppercase fw-semibold" style="letter-spacing: 0.5px;">Szacowane
|
||||
rozliczenie</small>
|
||||
<h3 class="mt-1 mb-1 fw-bold" style="color: #696cff;">425 zł</h3>
|
||||
<small class="text-muted">Następna płatność:: 2026-04-01</small>
|
||||
</div>
|
||||
|
||||
<div class="text-start">
|
||||
<small class="text-muted text-uppercase fw-semibold" style="letter-spacing: 0.5px;">Ilość miejsca na
|
||||
dysku</small>
|
||||
<h3 class="mt-1 mb-0 fw-bold" style="color: #696cff;">0.04 GB</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta: Historia płatności -->
|
||||
<div class="card">
|
||||
<h5 class="card-header border-bottom">Historia płatności</h5>
|
||||
<div class="table-responsive text-nowrap pb-2">
|
||||
<table class="table table-hover">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th class="fw-bold">Nr dokumentu</th>
|
||||
<th class="fw-bold">Status</th>
|
||||
<th class="fw-bold">Kwota (netto)</th>
|
||||
<th class="fw-bold">Data wystawienia</th>
|
||||
<th class="fw-bold">Faktura VAT</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="table-border-bottom-0">
|
||||
|
||||
<!-- Wiersz 1 -->
|
||||
<tr>
|
||||
<td><a href="#" class="fw-bold text-primary">5/05/2025</a></td>
|
||||
<td><span class="badge bg-label-warning px-2 py-1" style="font-size: 0.75rem;">Opóźniona</span>
|
||||
</td>
|
||||
<td class="fw-semibold">365 zł</td>
|
||||
<td class="text-dark">2025-06-01</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap disabled"
|
||||
style="background-color: #f8f9fa;"><i class="bx bx-cloud-download me-1"></i> Faktura
|
||||
VAT</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"><i
|
||||
class="bx bx-cloud-download me-1"></i> Faktura proforma</button>
|
||||
|
||||
<span class="text-muted mx-2">|</span>
|
||||
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap" data-bs-toggle="modal"
|
||||
data-bs-target="#billingDetailsModal">
|
||||
<i class="bx bx-list-ul me-1"></i> Szczegóły
|
||||
</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"
|
||||
style="background-color: #f8f9fa;">
|
||||
<i class="bx bx-credit-card me-1"></i> company.payonline
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Wiersz 2 -->
|
||||
<tr>
|
||||
<td><a href="#" class="fw-bold text-primary">5/02/2025</a></td>
|
||||
<td><span class="badge bg-label-warning px-2 py-1" style="font-size: 0.75rem;">Opóźniona</span>
|
||||
</td>
|
||||
<td class="fw-semibold">345 zł</td>
|
||||
<td class="text-dark">2025-03-10</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap disabled"
|
||||
style="background-color: #f8f9fa;"><i class="bx bx-cloud-download me-1"></i> Faktura
|
||||
VAT</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"><i
|
||||
class="bx bx-cloud-download me-1"></i> Faktura proforma</button>
|
||||
|
||||
<span class="text-muted mx-2">|</span>
|
||||
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap" data-bs-toggle="modal"
|
||||
data-bs-target="#billingDetailsModal">
|
||||
<i class="bx bx-list-ul me-1"></i> Szczegóły
|
||||
</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"
|
||||
style="background-color: #f8f9fa;">
|
||||
<i class="bx bx-credit-card me-1"></i> company.payonline
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Wiersz 3 - Przykładowy opłacony dodany dla logiki -->
|
||||
<tr>
|
||||
<td><a href="#" class="fw-bold text-muted">2/01/2025</a></td>
|
||||
<td><span class="badge bg-label-success px-2 py-1" style="font-size: 0.75rem;">Opłacona</span>
|
||||
</td>
|
||||
<td class="fw-semibold">345 zł</td>
|
||||
<td class="text-dark">2025-01-05</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap"><i
|
||||
class="bx bx-cloud-download me-1"></i> Faktura VAT</button>
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap disabled"
|
||||
style="background-color: #f8f9fa;"><i class="bx bx-cloud-download me-1"></i> Faktura
|
||||
proforma</button>
|
||||
|
||||
<span class="text-muted mx-2">|</span>
|
||||
|
||||
<button class="btn btn-sm btn-outline-secondary text-nowrap" data-bs-toggle="modal"
|
||||
data-bs-target="#billingDetailsModal">
|
||||
<i class="bx bx-list-ul me-1"></i> Szczegóły
|
||||
</button>
|
||||
<!-- Brak przycisku opłać, bo jest opłacona -->
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Modal Szczegóły Rozliczenia -->
|
||||
<div class="modal fade" id="billingDetailsModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header border-bottom pb-3">
|
||||
<h5 class="modal-title fw-bold" id="exampleModalLabel1">Szczegóły rozliczenia dla dokumentu: <span
|
||||
class="text-primary">5/05/2025</span></h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body py-4 bg-lighter">
|
||||
|
||||
<div class="card shadow-none border">
|
||||
<div class="card-body p-0">
|
||||
<ul class="list-group list-group-flush mb-0">
|
||||
<!-- Pozycja 1 -->
|
||||
<li class="list-group-item d-flex justify-content-between align-items-start py-3">
|
||||
<div>
|
||||
<h6 class="mb-1 fw-bold text-dark">Opłata podstawowa (Abonament Baza)</h6>
|
||||
<small class="text-muted mt-0 d-block">Utrzymanie rdzenia systemu. Nielimitowana
|
||||
ilość przestrzeni i kont właścicielskich.</small>
|
||||
</div>
|
||||
<span class="fw-bold text-dark fs-6 mt-1">199.00 zł</span>
|
||||
</li>
|
||||
|
||||
<!-- Pozycja 2 -->
|
||||
<li class="list-group-item d-flex justify-content-between align-items-start py-3">
|
||||
<div>
|
||||
<h6 class="mb-1 fw-bold text-dark">Aplikacja: helpdesk.magico</h6>
|
||||
<small class="text-muted mt-0 d-block">Liczba przypisanych kont pracowników w danym
|
||||
cyklu: <strong>4 stanowiska</strong><br>Opłata: 4 x 30.00 zł</small>
|
||||
</div>
|
||||
<span class="fw-bold text-dark fs-6 mt-1">120.00 zł</span>
|
||||
</li>
|
||||
|
||||
<!-- Pozycja 3 -->
|
||||
<li class="list-group-item d-flex justify-content-between align-items-start py-3">
|
||||
<div>
|
||||
<h6 class="mb-1 fw-bold text-dark">Bramka komunikacji SMS (Powiadomienia)</h6>
|
||||
<small class="text-muted mt-0 d-block">Wysłane wiadomości autoryzacyjne i systemowe:
|
||||
<strong>247 SMS</strong><br>Koszt jednostkowy API: 0.15 zł</small>
|
||||
</div>
|
||||
<span class="fw-bold text-dark fs-6 mt-1">37.05 zł</span>
|
||||
</li>
|
||||
|
||||
<!-- Pozycja 4 -->
|
||||
<li class="list-group-item d-flex justify-content-between align-items-start py-3">
|
||||
<div>
|
||||
<h6 class="mb-1 fw-bold text-dark">Aplikacja: invoice.magico</h6>
|
||||
<small class="text-muted mt-0 d-block">Moduł wbudowany bezpłatnie jako fundament
|
||||
profilu.</small>
|
||||
</div>
|
||||
<span class="fw-bold text-dark fs-6 mt-1 text-success">0.00 zł</span>
|
||||
</li>
|
||||
|
||||
<!-- Suma Rozliczenia -->
|
||||
<li
|
||||
class="list-group-item d-flex justify-content-between align-items-center py-4 bg-label-primary bg-opacity-10 border-top-2">
|
||||
<div>
|
||||
<h5 class="mb-0 fw-bold text-primary">Kwota netto dokumentu</h5>
|
||||
<small class="text-primary text-opacity-75">Suma zliczona przed nałożeniem podatku
|
||||
VAT (23%)</small>
|
||||
</div>
|
||||
<span class="fw-bold text-primary fs-3">356.05 zł</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-secondary mb-0 mt-4 d-flex align-items-center overflow-hidden">
|
||||
<i class="bx bx-info-circle fs-3 me-3 text-secondary"></i>
|
||||
<small class="lh-sm">Koszt aplikacji stanowiskowych wyliczany jest na podstawie największej liczby
|
||||
kont pracowników z uprawnieniami w trakcie całego ubiegłego cyku rozliczeniowego.</small>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer border-top pt-3">
|
||||
<button type="button" class="btn btn-label-secondary" data-bs-dismiss="modal">Zamknij podgląd</button>
|
||||
<button type="button" class="btn btn-primary"><i class="bx bx-credit-card me-2"></i> Przejdź do
|
||||
opłacenia faktury</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
|
||||
<?php include '../../footer.php'; ?>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// ...
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user