Faktury - Dialog podglądu faktury
This commit is contained in:
@@ -4,6 +4,24 @@ include '../../header-invoice.php';
|
||||
?>
|
||||
|
||||
<link rel="stylesheet" href="../../assets/vendor/libs/fullcalendar/fullcalendar.css" />
|
||||
<style>
|
||||
/* Custom darker event colors for white text contrast */
|
||||
.fc-event-dark-success {
|
||||
background-color: #1b5e20 !important;
|
||||
border-color: #1b5e20 !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.fc-event-dark-danger {
|
||||
background-color: #b71c1c !important;
|
||||
border-color: #b71c1c !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.fc-event-dark-warning {
|
||||
background-color: #e65100 !important;
|
||||
border-color: #e65100 !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="container-fluid flex-grow-1 container-p-y">
|
||||
|
||||
@@ -11,6 +29,18 @@ include '../../header-invoice.php';
|
||||
<span class="text-muted fw-light">Faktury i sprzedaż /</span> Kalendarz płatności
|
||||
</h4>
|
||||
|
||||
<div class="d-flex mb-3 gap-2 align-items-center flex-nowrap overflow-auto pb-2">
|
||||
<button type="button" class="btn btn-label-primary text-nowrap tab-filter-btn" data-filter="all">
|
||||
Wszystkie
|
||||
</button>
|
||||
<button type="button" class="btn btn-label-secondary text-nowrap tab-filter-btn" data-filter="paid">
|
||||
Zapłacone
|
||||
</button>
|
||||
<button type="button" class="btn btn-label-secondary text-nowrap tab-filter-btn" data-filter="unpaid">
|
||||
Do zapłaty
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="card app-calendar-wrapper">
|
||||
<div class="row g-0">
|
||||
<!-- Calendar Sidebar -->
|
||||
@@ -22,23 +52,6 @@ include '../../header-invoice.php';
|
||||
<!-- Calendar & Tabs -->
|
||||
<div class="col app-calendar-content">
|
||||
<div class="card shadow-none border-0">
|
||||
<div class="card-header border-bottom d-flex justify-content-between align-items-center">
|
||||
<h5 class="mb-0">Kalendarz płatności</h5>
|
||||
<ul class="nav nav-pills" role="tablist">
|
||||
<li class="nav-item">
|
||||
<button type="button" class="nav-link active" role="tab" data-bs-toggle="tab"
|
||||
data-filter="all">Wszystkie</button>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<button type="button" class="nav-link" role="tab" data-bs-toggle="tab"
|
||||
data-filter="paid">Zapłacone</button>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<button type="button" class="nav-link" role="tab" data-bs-toggle="tab"
|
||||
data-filter="unpaid">Do zapłaty</button>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="card-body pb-0">
|
||||
<div id="calendar"></div>
|
||||
</div>
|
||||
@@ -72,7 +85,7 @@ include '../../header-invoice.php';
|
||||
start: new Date(y, m, 5),
|
||||
allDay: true,
|
||||
extendedProps: { status: 'paid', amount: '1230.00 PLN' },
|
||||
className: 'bg-label-success'
|
||||
className: 'fc-event-dark-success'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
@@ -80,7 +93,7 @@ include '../../header-invoice.php';
|
||||
start: new Date(y, m, 10),
|
||||
allDay: true,
|
||||
extendedProps: { status: 'paid', amount: '50.00 USD' },
|
||||
className: 'bg-label-success'
|
||||
className: 'fc-event-dark-success'
|
||||
},
|
||||
|
||||
// UNPAID (Future / Current)
|
||||
@@ -90,7 +103,7 @@ include '../../header-invoice.php';
|
||||
start: new Date(y, m, 24), // Due date
|
||||
allDay: true,
|
||||
extendedProps: { status: 'unpaid', amount: '553.50 PLN' },
|
||||
className: 'bg-label-danger'
|
||||
className: 'fc-event-dark-danger'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
@@ -98,7 +111,7 @@ include '../../header-invoice.php';
|
||||
start: new Date(y, m, 28), // Due date
|
||||
allDay: true,
|
||||
extendedProps: { status: 'unpaid', amount: '120.00 PLN' },
|
||||
className: 'bg-label-warning'
|
||||
className: 'fc-event-dark-warning'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
@@ -106,7 +119,7 @@ include '../../header-invoice.php';
|
||||
start: new Date(y, m + 1, 5), // Next month
|
||||
allDay: true,
|
||||
extendedProps: { status: 'unpaid', amount: '1500.00 PLN' },
|
||||
className: 'bg-label-warning'
|
||||
className: 'fc-event-dark-warning'
|
||||
}
|
||||
];
|
||||
|
||||
@@ -118,6 +131,13 @@ include '../../header-invoice.php';
|
||||
center: 'title',
|
||||
right: 'dayGridMonth,listMonth'
|
||||
},
|
||||
buttonText: {
|
||||
today: 'Dzisiaj',
|
||||
month: 'Miesiąc',
|
||||
week: 'Tydzień',
|
||||
day: 'Dzień',
|
||||
list: 'Lista'
|
||||
},
|
||||
events: allEvents,
|
||||
locale: 'pl',
|
||||
firstDay: 1, // Start week on Monday
|
||||
@@ -137,10 +157,19 @@ include '../../header-invoice.php';
|
||||
calendar.render();
|
||||
|
||||
// Tabs Filtering
|
||||
const tabBtns = document.querySelectorAll('[data-bs-toggle="tab"]');
|
||||
const tabBtns = document.querySelectorAll('.tab-filter-btn');
|
||||
tabBtns.forEach(btn => {
|
||||
btn.addEventListener('shown.bs.tab', function (e) {
|
||||
const filter = e.target.getAttribute('data-filter');
|
||||
btn.addEventListener('click', function (e) {
|
||||
// Remove active class from all
|
||||
tabBtns.forEach(b => {
|
||||
b.classList.remove('btn-label-primary');
|
||||
b.classList.add('btn-label-secondary');
|
||||
});
|
||||
// Add active class to clicked
|
||||
this.classList.remove('btn-label-secondary');
|
||||
this.classList.add('btn-label-primary');
|
||||
|
||||
const filter = this.getAttribute('data-filter');
|
||||
console.log("Filtering by:", filter);
|
||||
|
||||
// Remove all events first
|
||||
|
||||
Reference in New Issue
Block a user