Merge pull request 'Baza pilotow' (#1) from baza-pilotow into main
Reviewed-on: #1
This commit was merged in pull request #1.
This commit is contained in:
File diff suppressed because it is too large
Load Diff
+420
@@ -0,0 +1,420 @@
|
||||
/**
|
||||
* Superpilot Web — Logika Wyszukiwarki i Filtrów w Stylu Pracuj.pl
|
||||
* z Multiselectem Krajów w Górnej Belce oraz Bazą w Lewym Sidebarze
|
||||
*/
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
initPracujFilters();
|
||||
initTopDestMultiselect();
|
||||
initDateRangeModal();
|
||||
initModals();
|
||||
});
|
||||
|
||||
function initPracujFilters() {
|
||||
const searchInput = document.getElementById('mainSearchInput');
|
||||
const executeBtn = document.getElementById('btnExecuteSearch');
|
||||
const sidebarCheckboxes = document.querySelectorAll('.filter-checkbox');
|
||||
const clearBtn = document.getElementById('btnClearAllFilters');
|
||||
const sidebarCountSpan = document.getElementById('sidebarCountSpan');
|
||||
const offersCountText = document.getElementById('offersCountText');
|
||||
const noOffersAlert = document.getElementById('noOffersAlert');
|
||||
const pilotCards = document.querySelectorAll('.pilot-grid-item');
|
||||
|
||||
window.currentDateFilter = '16-24-sep-2027';
|
||||
|
||||
function applyFilters() {
|
||||
const query = searchInput ? searchInput.value.toLowerCase().trim() : '';
|
||||
|
||||
// Pobierz zaznaczone kraje z GÓRNEJ BELKI (Multiselect)
|
||||
const selectedTopDests = Array.from(document.querySelectorAll('.top-dest-checkbox:checked')).map(cb => cb.value.toLowerCase());
|
||||
|
||||
// Pobierz zaznaczone checkboxy z SIDEBARA (w tym nowa Baza!)
|
||||
const selectedBases = Array.from(document.querySelectorAll('.filter-checkbox[data-type="base"]:checked')).map(cb => cb.value.toLowerCase());
|
||||
const selectedSpecs = Array.from(document.querySelectorAll('.filter-checkbox[data-type="spec"]:checked')).map(cb => cb.value.toLowerCase());
|
||||
const selectedLangs = Array.from(document.querySelectorAll('.filter-checkbox[data-type="lang"]:checked')).map(cb => cb.value.toLowerCase());
|
||||
const selectedCerts = Array.from(document.querySelectorAll('.filter-checkbox[data-type="cert"]:checked')).map(cb => cb.value.toLowerCase());
|
||||
|
||||
let visibleCount = 0;
|
||||
|
||||
pilotCards.forEach(card => {
|
||||
const name = (card.getAttribute('data-name') || '').toLowerCase();
|
||||
const base = (card.getAttribute('data-base') || '').toLowerCase();
|
||||
const dests = (card.getAttribute('data-destinations') || '').toLowerCase();
|
||||
const langs = (card.getAttribute('data-languages') || '').toLowerCase();
|
||||
const tags = (card.getAttribute('data-tags') || '').toLowerCase();
|
||||
const rating = parseFloat(card.getAttribute('data-rating') || '0');
|
||||
const verified = card.getAttribute('data-verified') === '1';
|
||||
const kpp = card.getAttribute('data-kpp') === '1';
|
||||
const datesFree = (card.getAttribute('data-dates-free') || '');
|
||||
|
||||
let match = true;
|
||||
|
||||
// 1. Wyszukiwanie tekstowe
|
||||
if (query && !name.includes(query) && !dests.includes(query) && !tags.includes(query) && !langs.includes(query) && !base.includes(query)) {
|
||||
match = false;
|
||||
}
|
||||
|
||||
// 2. Destynacje z Multiselecta u góry
|
||||
if (selectedTopDests.length > 0) {
|
||||
const hasAnyDest = selectedTopDests.some(d => dests.includes(d));
|
||||
if (!hasAnyDest) match = false;
|
||||
}
|
||||
|
||||
// 3. Baza wypadowa z sidebara
|
||||
if (selectedBases.length > 0) {
|
||||
const hasAnyBase = selectedBases.some(b => base.includes(b));
|
||||
if (!hasAnyBase) match = false;
|
||||
}
|
||||
|
||||
// 4. Specjalizacje z sidebara
|
||||
if (selectedSpecs.length > 0) {
|
||||
const hasAnySpec = selectedSpecs.some(s => tags.includes(s));
|
||||
if (!hasAnySpec) match = false;
|
||||
}
|
||||
|
||||
// 5. Języki z sidebara
|
||||
if (selectedLangs.length > 0) {
|
||||
const hasAnyLang = selectedLangs.some(l => langs.includes(l));
|
||||
if (!hasAnyLang) match = false;
|
||||
}
|
||||
|
||||
// 6. Certyfikaty z sidebara
|
||||
if (selectedCerts.includes('verified') && !verified) match = false;
|
||||
if (selectedCerts.includes('kpp') && !kpp) match = false;
|
||||
if (selectedCerts.includes('rating-48') && rating < 4.8) match = false;
|
||||
|
||||
// 7. Kalendarz
|
||||
if (window.currentDateFilter === '16-24-sep-2027') {
|
||||
if (!datesFree.includes('16-24-sep') && name !== 'oskar kaczmarek') {
|
||||
match = false;
|
||||
}
|
||||
} else if (window.currentDateFilter === '05-15-sep-2027') {
|
||||
if (!datesFree.includes('05-15-sep')) {
|
||||
match = false;
|
||||
}
|
||||
} else if (window.currentDateFilter === 'październik-2027') {
|
||||
if (!datesFree.includes('październik-2027')) {
|
||||
match = false;
|
||||
}
|
||||
}
|
||||
|
||||
if (match) {
|
||||
card.style.display = 'flex';
|
||||
visibleCount++;
|
||||
} else {
|
||||
card.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
// Aktualizacja liczników
|
||||
if (sidebarCountSpan) sidebarCountSpan.innerText = visibleCount;
|
||||
if (offersCountText) offersCountText.innerText = visibleCount + (visibleCount === 1 ? ' oferta' : (visibleCount >= 2 && visibleCount <= 4 ? ' oferty' : ' ofert'));
|
||||
if (noOffersAlert) noOffersAlert.style.display = (visibleCount === 0) ? 'block' : 'none';
|
||||
|
||||
// Aktualizacja paska aktywnych filtrów (Chips)
|
||||
updateActiveFilterChips(selectedTopDests, selectedBases);
|
||||
}
|
||||
|
||||
if (searchInput) searchInput.addEventListener('input', applyFilters);
|
||||
if (executeBtn) executeBtn.addEventListener('click', applyFilters);
|
||||
|
||||
sidebarCheckboxes.forEach(cb => {
|
||||
cb.addEventListener('change', applyFilters);
|
||||
});
|
||||
|
||||
const applySidebarBtn = document.getElementById('btnApplySidebarFilters');
|
||||
if (applySidebarBtn) {
|
||||
applySidebarBtn.addEventListener('click', function () {
|
||||
applyFilters();
|
||||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||
});
|
||||
}
|
||||
|
||||
if (clearBtn) {
|
||||
clearBtn.addEventListener('click', function () {
|
||||
if (searchInput) searchInput.value = '';
|
||||
sidebarCheckboxes.forEach(cb => cb.checked = false);
|
||||
document.querySelectorAll('.top-dest-checkbox').forEach(cb => cb.checked = false);
|
||||
updateDestTriggerLabel();
|
||||
window.currentDateFilter = 'all';
|
||||
const display = document.getElementById('selectedDateDisplay');
|
||||
if (display) display.value = 'Dowolny termin';
|
||||
applyFilters();
|
||||
});
|
||||
}
|
||||
|
||||
// Obsługa usunięcia chipa bazy
|
||||
const removeBaseChip = document.getElementById('removeBaseChip');
|
||||
if (removeBaseChip) {
|
||||
removeBaseChip.addEventListener('click', function () {
|
||||
document.querySelectorAll('.filter-checkbox[data-type="base"]').forEach(cb => cb.checked = false);
|
||||
applyFilters();
|
||||
});
|
||||
}
|
||||
|
||||
window.triggerSuperpilotFilter = applyFilters;
|
||||
}
|
||||
|
||||
function initTopDestMultiselect() {
|
||||
const destCheckboxes = document.querySelectorAll('.top-dest-checkbox');
|
||||
const triggerText = document.getElementById('destTriggerText');
|
||||
const resetBtn = document.getElementById('btnResetDestMultiselect');
|
||||
const confirmBtn = document.getElementById('btnConfirmDestDropdown');
|
||||
|
||||
function updateLabel() {
|
||||
const checked = Array.from(document.querySelectorAll('.top-dest-checkbox:checked')).map(cb => cb.value);
|
||||
if (!triggerText) return;
|
||||
|
||||
if (checked.length === 0) {
|
||||
triggerText.innerText = 'Wszystkie kraje';
|
||||
triggerText.style.color = '#94a3b8';
|
||||
} else if (checked.length === 1) {
|
||||
const flag = getCountryFlag(checked[0]);
|
||||
triggerText.innerText = flag + ' ' + checked[0];
|
||||
triggerText.style.color = 'var(--dark-navy)';
|
||||
} else if (checked.length === 2) {
|
||||
triggerText.innerText = checked.map(c => getCountryFlag(c) + ' ' + c).join(', ');
|
||||
triggerText.style.color = 'var(--dark-navy)';
|
||||
} else {
|
||||
triggerText.innerText = getCountryFlag(checked[0]) + ' ' + checked[0] + ' (+' + (checked.length - 1) + ' inne)';
|
||||
triggerText.style.color = 'var(--dark-navy)';
|
||||
}
|
||||
|
||||
if (window.triggerSuperpilotFilter) window.triggerSuperpilotFilter();
|
||||
}
|
||||
|
||||
window.updateDestTriggerLabel = updateLabel;
|
||||
|
||||
destCheckboxes.forEach(cb => {
|
||||
cb.addEventListener('change', updateLabel);
|
||||
});
|
||||
|
||||
if (resetBtn) {
|
||||
resetBtn.addEventListener('click', function () {
|
||||
destCheckboxes.forEach(cb => cb.checked = false);
|
||||
updateLabel();
|
||||
});
|
||||
}
|
||||
|
||||
if (confirmBtn) {
|
||||
confirmBtn.addEventListener('click', function () {
|
||||
const dropdownEl = document.getElementById('destDropdownTrigger');
|
||||
const dropdown = bootstrap.Dropdown.getInstance(dropdownEl);
|
||||
if (dropdown) dropdown.hide();
|
||||
});
|
||||
}
|
||||
|
||||
const removeDestChip = document.getElementById('removeDestChip');
|
||||
if (removeDestChip) {
|
||||
removeDestChip.addEventListener('click', function () {
|
||||
destCheckboxes.forEach(cb => cb.checked = false);
|
||||
updateLabel();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function updateActiveFilterChips(selectedDests, selectedBases) {
|
||||
const chipDest = document.getElementById('chipDestFilter');
|
||||
const chipDestText = document.getElementById('chipDestText');
|
||||
const chipDate = document.getElementById('chipDateFilter');
|
||||
const chipDateText = document.getElementById('chipDateText');
|
||||
const chipBase = document.getElementById('chipBaseFilter');
|
||||
const chipBaseText = document.getElementById('chipBaseText');
|
||||
|
||||
if (chipDest && chipDestText) {
|
||||
if (selectedDests && selectedDests.length > 0) {
|
||||
chipDest.style.display = 'inline-flex';
|
||||
chipDestText.innerText = selectedDests.map(d => capitalize(d)).join(', ');
|
||||
} else {
|
||||
chipDest.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
if (chipDate && chipDateText) {
|
||||
if (window.currentDateFilter && window.currentDateFilter !== 'all') {
|
||||
chipDate.style.display = 'inline-flex';
|
||||
if (window.currentDateFilter === '16-24-sep-2027') chipDateText.innerText = '16–24.09.2027';
|
||||
else if (window.currentDateFilter === '05-15-sep-2027') chipDateText.innerText = '05–15.09.2027';
|
||||
else if (window.currentDateFilter === 'październik-2027') chipDateText.innerText = 'Październik 2027';
|
||||
} else {
|
||||
chipDate.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
if (chipBase && chipBaseText) {
|
||||
if (selectedBases && selectedBases.length > 0) {
|
||||
chipBase.style.display = 'inline-flex';
|
||||
chipBaseText.innerText = 'Baza: ' + selectedBases.map(b => capitalize(b)).join(', ');
|
||||
} else {
|
||||
chipBase.style.display = 'none';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function initDateRangeModal() {
|
||||
const presets = document.querySelectorAll('.preset-chip');
|
||||
const selectedText = document.getElementById('modalSelectedDateText');
|
||||
const displayInput = document.getElementById('selectedDateDisplay');
|
||||
const resetDateBtn = document.getElementById('btnResetDateDialog');
|
||||
const applyDateBtn = document.getElementById('btnApplyDateDialog');
|
||||
const removeDateChip = document.getElementById('removeDateChip');
|
||||
|
||||
presets.forEach(p => {
|
||||
p.addEventListener('click', function () {
|
||||
presets.forEach(item => item.classList.remove('active'));
|
||||
this.classList.add('active');
|
||||
|
||||
const presetVal = this.getAttribute('data-preset');
|
||||
window.currentDateFilter = presetVal;
|
||||
|
||||
if (presetVal === '16-24-sep-2027') {
|
||||
selectedText.innerText = '16.09.2027 – 24.09.2027 (Wycieczka #12)';
|
||||
displayInput.value = '16.09.2027 – 24.09.2027';
|
||||
} else if (presetVal === '05-15-sep-2027') {
|
||||
selectedText.innerText = '05.09.2027 – 15.09.2027 (Wolne okienko)';
|
||||
displayInput.value = '05.09.2027 – 15.09.2027';
|
||||
} else if (presetVal === 'październik-2027') {
|
||||
selectedText.innerText = '01.10.2027 – 31.10.2027 (Październik)';
|
||||
displayInput.value = 'Październik 2027';
|
||||
} else {
|
||||
selectedText.innerText = 'Dowolny termin';
|
||||
displayInput.value = 'Dowolny termin';
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
if (resetDateBtn) {
|
||||
resetDateBtn.addEventListener('click', function () {
|
||||
presets.forEach(item => item.classList.remove('active'));
|
||||
const allPreset = document.querySelector('.preset-chip[data-preset="all"]');
|
||||
if (allPreset) allPreset.classList.add('active');
|
||||
window.currentDateFilter = 'all';
|
||||
selectedText.innerText = 'Dowolny termin';
|
||||
displayInput.value = 'Dowolny termin';
|
||||
if (window.triggerSuperpilotFilter) window.triggerSuperpilotFilter();
|
||||
const modalEl = document.getElementById('dateRangeModal');
|
||||
const modalInstance = bootstrap.Modal.getInstance(modalEl);
|
||||
if (modalInstance) modalInstance.hide();
|
||||
});
|
||||
}
|
||||
|
||||
if (applyDateBtn) {
|
||||
applyDateBtn.addEventListener('click', function () {
|
||||
if (window.triggerSuperpilotFilter) window.triggerSuperpilotFilter();
|
||||
});
|
||||
}
|
||||
|
||||
if (removeDateChip) {
|
||||
removeDateChip.addEventListener('click', function () {
|
||||
window.currentDateFilter = 'all';
|
||||
displayInput.value = 'Dowolny termin';
|
||||
if (window.triggerSuperpilotFilter) window.triggerSuperpilotFilter();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function initModals() {
|
||||
window.openBookingModal = function (pilotId, pilotName, dates) {
|
||||
const modal = new bootstrap.Modal(document.getElementById('bookingModal'));
|
||||
const nameInput = document.getElementById('bookingPilotName');
|
||||
const nameDisplay = document.getElementById('bookingPilotNameDisplay');
|
||||
const idInput = document.getElementById('bookingPilotId');
|
||||
const datesInput = document.getElementById('bookingDates');
|
||||
|
||||
const name = pilotName || 'Oskar Kaczmarek';
|
||||
if (nameInput) nameInput.value = name;
|
||||
if (nameDisplay) nameDisplay.innerText = name;
|
||||
if (idInput) idInput.value = pilotId || '1';
|
||||
if (datesInput && dates) datesInput.value = dates;
|
||||
|
||||
modal.show();
|
||||
};
|
||||
|
||||
window.openSosModal = function (defaultCountry) {
|
||||
const modal = new bootstrap.Modal(document.getElementById('sosModal'));
|
||||
if (defaultCountry && document.getElementById('sosCountrySelect')) {
|
||||
document.getElementById('sosCountrySelect').value = defaultCountry;
|
||||
}
|
||||
modal.show();
|
||||
};
|
||||
|
||||
const bookingForm = document.getElementById('pilotBookingForm');
|
||||
if (bookingForm) {
|
||||
bookingForm.addEventListener('submit', function (e) {
|
||||
e.preventDefault();
|
||||
const submitBtn = bookingForm.querySelector('button[type="submit"]');
|
||||
const pilotName = document.getElementById('bookingPilotName').value;
|
||||
const originalText = submitBtn.innerHTML;
|
||||
|
||||
submitBtn.disabled = true;
|
||||
submitBtn.innerHTML = "<span class=\"spinner-border spinner-border-sm me-1\"></span> Wysyłanie powiadomienia PUSH...";
|
||||
|
||||
setTimeout(() => {
|
||||
submitBtn.disabled = false;
|
||||
submitBtn.innerHTML = originalText;
|
||||
const modalEl = document.getElementById('bookingModal');
|
||||
const modalInstance = bootstrap.Modal.getInstance(modalEl);
|
||||
if (modalInstance) modalInstance.hide();
|
||||
|
||||
showToastNotification(
|
||||
'Pomyślnie wysłano zapytanie!',
|
||||
'Powiadomienie PUSH trafiło do aplikacji mobilnej pilota (' + pilotName + '). Pilot ma 24h na akceptację w aplikacji.'
|
||||
);
|
||||
}, 900);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function showToastNotification(title, message) {
|
||||
let container = document.getElementById('toastContainer');
|
||||
if (!container) {
|
||||
container = document.createElement('div');
|
||||
container.id = 'toastContainer';
|
||||
container.style.position = 'fixed';
|
||||
container.style.top = '24px';
|
||||
container.style.right = '24px';
|
||||
container.style.zIndex = '99999';
|
||||
document.body.appendChild(container);
|
||||
}
|
||||
|
||||
const toast = document.createElement('div');
|
||||
toast.className = 'toast show align-items-center text-white bg-dark border-0 mb-2 shadow-lg';
|
||||
toast.style.minWidth = '340px';
|
||||
toast.style.borderRadius = '12px';
|
||||
toast.style.overflow = 'hidden';
|
||||
toast.innerHTML = `
|
||||
<div class="d-flex p-3" style="background: linear-gradient(135deg, #1f2244 0%, #312e81 100%);">
|
||||
<div class="me-3 fs-3 text-warning">
|
||||
<i class='bx bxs-bell-ring'></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="fw-bold mb-1 text-white" style="font-size: 0.92rem;">${title}</h6>
|
||||
<div style="font-size: 0.8rem; line-height: 1.4; color: #cbd5e1;">${message}</div>
|
||||
</div>
|
||||
<button type="button" class="btn-close btn-close-white me-1 m-auto" onclick="this.closest('.toast').remove()"></button>
|
||||
</div>
|
||||
`;
|
||||
|
||||
container.appendChild(toast);
|
||||
|
||||
setTimeout(() => {
|
||||
toast.remove();
|
||||
}, 6000);
|
||||
}
|
||||
|
||||
function getCountryFlag(country) {
|
||||
const map = {
|
||||
'Włochy': '🇮🇹',
|
||||
'Grecja': '🇬🇷',
|
||||
'Hiszpania': '🇪🇸',
|
||||
'Chorwacja': '🇭🇷',
|
||||
'Norwegia': '🇳🇴',
|
||||
'Austria': '🇦🇹',
|
||||
'Japonia': '🇯🇵'
|
||||
};
|
||||
return map[country] || '🌍';
|
||||
}
|
||||
|
||||
function capitalize(str) {
|
||||
return str.charAt(0).toUpperCase() + str.slice(1);
|
||||
}
|
||||
@@ -0,0 +1,165 @@
|
||||
<!-- Modal Rezerwacji / Zapytania Ofertowego (Standard UX/UI 2026) -->
|
||||
<div class="modal fade" id="bookingModal" tabindex="-1" aria-labelledby="bookingModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content border-0 shadow-lg" style="border-radius: var(--radius-md); overflow: hidden;">
|
||||
|
||||
<!-- Spokojny, czytelny nagłówek modala -->
|
||||
<div class="modal-header bg-white border-bottom py-3 px-4">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center" style="width: 36px; height: 36px; background: var(--primary-light); color: var(--primary); font-size: 1.2rem;">
|
||||
<i class='bx bx-calendar-check'></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="modal-title fw-bold text-navy mb-0" id="bookingModalLabel" style="font-size: 1.05rem;">
|
||||
Zapytanie o Dostępność & Rezerwacja Terminu
|
||||
</h5>
|
||||
<small class="text-muted" style="font-size: 0.76rem;">
|
||||
Zlecenie trafi bezpośrednio do aplikacji mobilnej pilota z możliwością natychmiastowej akceptacji
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
|
||||
<form id="pilotBookingForm">
|
||||
<div class="modal-body p-4">
|
||||
|
||||
<!-- Podsumowanie wybranego pilota (Spokojna karta) -->
|
||||
<div class="d-flex align-items-center justify-content-between p-3 rounded-3 mb-4" style="background: #f8f9fd; border: 1px solid var(--border-color);">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="rounded-3 d-flex align-items-center justify-content-center text-white fw-bold" style="width: 44px; height: 44px; background: linear-gradient(135deg, var(--primary) 0%, #767bf7 100%); font-size: 1.1rem; flex-shrink: 0;">
|
||||
OK
|
||||
</div>
|
||||
<div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="fw-bold text-dark" id="bookingPilotNameDisplay" style="font-size: 0.95rem;">Oskar Kaczmarek</span>
|
||||
<span class="pilot-academy-badge" style="font-size: 0.68rem; padding: 2px 8px;">
|
||||
<i class='bx bx-check-shield'></i> Superpilot Academy
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-muted small d-flex align-items-center gap-2 mt-1" style="font-size: 0.76rem;">
|
||||
<span><i class='bx bx-compass text-primary'></i> Pilot Wycieczek & Przewodnik</span>
|
||||
<span>•</span>
|
||||
<span><i class='bx bx-map-pin text-muted'></i> Baza: Warszawa</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-end">
|
||||
<span class="profile-meta-rating" style="font-size: 0.75rem;">
|
||||
<i class='bx bxs-star text-warning'></i> 4.9 (18 opinii)
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="hidden" id="bookingPilotId" value="1">
|
||||
<input type="hidden" id="bookingPilotName" value="Oskar Kaczmarek">
|
||||
|
||||
<!-- Sekcja 1: Wybór wycieczki z Travel Managera -->
|
||||
<div class="mb-3">
|
||||
<label class="form-label fw-bold text-dark small mb-1">
|
||||
Powiąż z imprezą w Travel Managerze:
|
||||
</label>
|
||||
<select class="form-select form-select-sm fw-semibold" id="bookingTourSelect" style="font-size: 0.84rem; padding: 0.5rem 0.75rem;">
|
||||
<option value="12" selected>Wycieczka #12: Klasyczne Włochy (16.09 - 24.09.2027) • 44 uczestników</option>
|
||||
<option value="15">Wycieczka #15: Magia Toskanii i Rzym (05.10 - 12.10.2027) • 38 uczestników</option>
|
||||
<option value="21">Wycieczka #21: Andaluzja i Gibraltar (12.11 - 19.11.2027) • 40 uczestników</option>
|
||||
<option value="new">+ Utwórz zapytanie niestandardowe / Inny termin...</option>
|
||||
</select>
|
||||
<div class="text-muted mt-1" style="font-size: 0.72rem;">
|
||||
Wybranie imprezy automatycznie przeniesie ramowy program trasy do aplikacji pilota.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sekcja 2: Termin i Trasa (2 kolumny) -->
|
||||
<div class="row g-3 mb-3">
|
||||
<div class="col-md-6">
|
||||
<label class="form-label fw-bold text-dark small mb-1">Termin realizacji zlecenia:</label>
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="input-group-text bg-light text-muted"><i class='bx bx-calendar'></i></span>
|
||||
<input type="text" class="form-control fw-semibold" id="bookingDates" value="16.09.2027 - 24.09.2027" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label fw-bold text-dark small mb-1">Destynacja i trasa:</label>
|
||||
<div class="input-group input-group-sm">
|
||||
<span class="input-group-text bg-light text-muted"><i class='bx bx-map-pin'></i></span>
|
||||
<input type="text" class="form-control fw-semibold" id="bookingDestination" value="🇮🇹 Włochy (Wenecja - Florencja - Rzym)" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sekcja 3: Finanse i Świadczenia (2 kolumny) -->
|
||||
<div class="row g-3 mb-3">
|
||||
<div class="col-md-6">
|
||||
<label class="form-label fw-bold text-dark small mb-1">Proponowana stawka dzienna netto:</label>
|
||||
<div class="input-group input-group-sm mb-1">
|
||||
<span class="input-group-text bg-light fw-bold text-dark">PLN</span>
|
||||
<input type="number" class="form-control fw-bold text-dark" id="bookingRate" value="550" step="50">
|
||||
<span class="input-group-text bg-light text-muted">/ dzień netto</span>
|
||||
</div>
|
||||
<div class="text-muted" style="font-size: 0.72rem;">
|
||||
Szacowany koszt zlecenia (9 dni): <strong class="text-dark">4 950 PLN netto</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label fw-bold text-dark small mb-1">Świadczenia zapewniane przez biuro:</label>
|
||||
<div class="p-2 border rounded-2 bg-light" style="font-size: 0.78rem;">
|
||||
<div class="form-check mb-1">
|
||||
<input class="form-check-input" type="checkbox" id="benefitHotel" checked>
|
||||
<label class="form-check-label text-dark" for="benefitHotel">
|
||||
Pokój 1-osobowy dla pilota w hotelach
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check mb-1">
|
||||
<input class="form-check-input" type="checkbox" id="benefitMeals" checked>
|
||||
<label class="form-check-label text-dark" for="benefitMeals">
|
||||
Wyżywienie (śniadania + obiadokolacje)
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="benefitInsurance" checked>
|
||||
<label class="form-check-label text-dark" for="benefitInsurance">
|
||||
Ubezpieczenie KL / NNW w trakcie trasy
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sekcja 4: Wiadomość dla pilota -->
|
||||
<div class="mb-3">
|
||||
<label class="form-label fw-bold text-dark small mb-1">Wiadomość / uwagi do zlecenia:</label>
|
||||
<textarea class="form-control" rows="3" style="font-size: 0.82rem; line-height: 1.45;" placeholder="Dodatkowe informacje, specyfika grupy, zbiórka...">Dzień dobry Panie Oskarze, zapraszamy do poprowadzenia wycieczki objazdowej po Włoszech. Znając Pana referencje z poprzednich tras, liczymy na ponowną udaną współpracę!</textarea>
|
||||
</div>
|
||||
|
||||
<!-- Dyskretny box o powiadomieniu PUSH -->
|
||||
<div class="d-flex align-items-center gap-3 p-3 rounded-2" style="background: var(--primary-light); border: 1px solid var(--primary-border);">
|
||||
<i class='bx bx-mobile-alt fs-3' style="color: var(--primary);"></i>
|
||||
<div style="font-size: 0.78rem; line-height: 1.4; color: var(--dark-navy);">
|
||||
<strong>Powiadomienie PUSH:</strong> Pilot otrzyma natychmiast zapytanie na telefonie w aplikacji <code>TravelLeader Mobile</code> i ma 24h na potwierdzenie dostępności.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer bg-light px-4 py-3 border-top d-flex justify-content-between align-items-center">
|
||||
<span class="text-muted small" style="font-size: 0.74rem;">
|
||||
<i class='bx bx-shield-check text-success me-1'></i> Bezpieczna rezerwacja w ekosystemie Travel Manager
|
||||
</span>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" data-bs-dismiss="modal" style="font-size: 0.8rem;">
|
||||
Anuluj
|
||||
</button>
|
||||
<button type="submit" class="btn btn-primary btn-sm px-4 fw-semibold" style="font-size: 0.8rem; border-radius: var(--radius-sm);">
|
||||
<i class='bx bx-paper-plane me-1'></i> Wyślij zapytanie do pilota
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,239 @@
|
||||
<?php
|
||||
$pageTitle = 'Superpilot - Superpilot Academy & Certyfikaty dla Biur';
|
||||
$enablePrototypeComments = true;
|
||||
include __DIR__ . '/header.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y" style="padding-top: 1.5rem !important;">
|
||||
|
||||
<!-- Breadcrumb -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol class="breadcrumb mb-0" style="font-size: 0.8rem;">
|
||||
<li class="breadcrumb-item"><a href="index.php" class="text-muted">Superpilot</a></li>
|
||||
<li class="breadcrumb-item active text-primary fw-bold" aria-current="page">Superpilot Academy & Certyfikaty</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<span class="badge bg-label-primary px-3 py-1 rounded-pill" style="font-size: 0.76rem;">
|
||||
Oficjalny Program Akredytacji Pilotów
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Hero Card Superpilot Academy -->
|
||||
<div class="search-hero-card mb-4" style="background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%);">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-8">
|
||||
<span class="badge bg-warning text-dark fw-bold mb-2 px-3 py-1 rounded-pill" style="font-size: 0.72rem;">
|
||||
SZKOLENIA & AKREDYTACJE DLA BRANŻY TURYSTYCZNEJ
|
||||
</span>
|
||||
<h3 class="fw-bold text-white mb-2">Superpilot Academy & Program Certyfikacji</h3>
|
||||
<p class="text-white-50 mb-3" style="font-size: 0.92rem; max-width: 650px;">
|
||||
Podnoś jakość kadr wyjazdowych. Piloci z certyfikatami Superpilot Academy otrzymują <strong>odznakę zaufania</strong>, wyższą pozycję w wyszukiwarce biur oraz ubezpieczenie OC pilotażu.
|
||||
</p>
|
||||
<div class="d-flex align-items-center gap-3 flex-wrap">
|
||||
<span class="text-white small d-flex align-items-center gap-1">
|
||||
<i class='bx bx-check-circle text-success'></i> Dofinansowanie z TravelPay
|
||||
</span>
|
||||
<span class="text-white small d-flex align-items-center gap-1">
|
||||
<i class='bx bx-check-circle text-success'></i> Egzaminy praktyczne w trasie
|
||||
</span>
|
||||
<span class="text-white small d-flex align-items-center gap-1">
|
||||
<i class='bx bx-check-circle text-success'></i> Weryfikacja cyfrowa blockchain
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4 text-lg-end mt-3 mt-lg-0">
|
||||
<a href="../travelleader-mobile/courses.php" target="_blank" class="btn btn-outline-light btn-sm" style="font-size: 0.78rem;">
|
||||
<i class='bx bx-mobile-alt'></i> Zobacz widok szkoleń pilota (Mobile) →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Narzędzie: Weryfikator certyfikatu online -->
|
||||
<div class="card border-0 shadow-sm mb-4" style="border-radius: var(--sp-radius-md); background: #f8fafc; border: 1px solid var(--sp-border-color);">
|
||||
<div class="card-body p-4">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-4">
|
||||
<h6 class="fw-bold text-navy mb-1"><i class='bx bx-search-alt text-primary me-1'></i> Weryfikator Certyfikatu Online</h6>
|
||||
<small class="text-muted">Sprawdź autentyczność certyfikatu kandydata na pilota po numerze</small>
|
||||
</div>
|
||||
<div class="col-lg-5 col-md-8 mt-2 mt-lg-0">
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-white"><i class='bx bx-barcode'></i></span>
|
||||
<input type="text" id="certNumberInput" class="form-control" value="SPA-2026-OK92" placeholder="Wpisz numer, np. SPA-2026-OK92">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-4 mt-2 mt-lg-0">
|
||||
<button type="button" class="btn btn-primary w-100 fw-bold" onclick="verifyCert()">
|
||||
Zweryfikuj w rejestrze
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Wynik weryfikacji -->
|
||||
<div id="certResultBox" class="mt-3 p-3 rounded-3 bg-white border d-flex justify-content-between align-items-center flex-wrap gap-2" style="display: flex;">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="rounded-circle bg-success-subtle text-success d-flex align-items-center justify-content-center" style="width: 40px; height: 40px; font-size: 1.3rem;">
|
||||
<i class='bx bx-check-double'></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold text-navy" style="font-size: 0.92rem;">
|
||||
Certyfikat Autentyczny: Oskar Kaczmarek (ID #1)
|
||||
</div>
|
||||
<small class="text-muted">Superpilot Academy 2026 • Akredytacja Pilotażu Europy Południowej (Włochy, Grecja, Hiszpania) • Status: <strong>Aktywny i ważny</strong></small>
|
||||
</div>
|
||||
</div>
|
||||
<a href="pilot-profile.php" class="btn btn-sm btn-outline-primary fw-semibold">
|
||||
Zobacz zweryfikowany profil →
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Katalog Szkoleń Dostępnych dla Branży -->
|
||||
<h5 class="fw-bold text-navy mb-3">Programy Szkoleniowe i Certyfikaty Partnerskie</h5>
|
||||
|
||||
<div class="row g-4">
|
||||
|
||||
<!-- Kurs 1: Superpilot Academy 2027 -->
|
||||
<div class="col-lg-4 col-md-6">
|
||||
<div class="academy-card h-100 d-flex flex-column">
|
||||
<div class="p-4 flex-grow-1">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<span class="academy-card-badge">
|
||||
<i class='bx bx-star'></i> Flagowy Program
|
||||
</span>
|
||||
<span class="fw-bold text-navy">1 290 PLN</span>
|
||||
</div>
|
||||
|
||||
<h5 class="fw-bold text-navy mb-2">Superpilot Academy 2027: Europa Południowa</h5>
|
||||
<p class="text-secondary small mb-3">
|
||||
Praktyczny certyfikat pilotażu tras autokarowych i lotniczych we Włoszech, Grecji i Hiszpanii. Standardy Magico i TravelManager.
|
||||
</p>
|
||||
|
||||
<div class="d-flex flex-column gap-1 small text-muted mb-3">
|
||||
<div><i class='bx bx-time text-primary me-1'></i> Czas trwania: <strong>32h (Online + Warsztat Rzym)</strong></div>
|
||||
<div><i class='bx bx-trending-up text-success me-1'></i> Wzrost pozycji w bazie biur: <strong>+350%</strong></div>
|
||||
<div><i class='bx bx-wallet text-warning me-1'></i> Dofinansowanie biura przez TravelPay: <strong>do 50%</strong></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-3 bg-light border-top d-flex justify-content-between align-items-center">
|
||||
<small class="text-muted">Absolwenci: <strong>64 pilotów</strong></small>
|
||||
<button type="button" class="btn btn-sm btn-superpilot" onclick="alert('Otwarto formularz dofinansowania szkolenia dla pilota przez TravelPay.');">
|
||||
Dofinansuj pilotowi
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Kurs 2: KPP w Turystyce -->
|
||||
<div class="col-lg-4 col-md-6">
|
||||
<div class="academy-card h-100 d-flex flex-column">
|
||||
<div class="p-4 flex-grow-1">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<span class="badge bg-danger-subtle text-danger rounded-pill fw-bold">
|
||||
<i class='bx bx-plus-medical'></i> Ratownictwo Medyczne
|
||||
</span>
|
||||
<span class="fw-bold text-navy">890 PLN</span>
|
||||
</div>
|
||||
|
||||
<h5 class="fw-bold text-navy mb-2">Kwalifikowana Pierwsza Pomoc (KPP) w Trasie</h5>
|
||||
<p class="text-secondary small mb-3">
|
||||
Państwowy kurs pierwszej pomocy dla pilotów wycieczek szkolnych, trekkingowych i autokarowych. Egzamin państwowy z tytułem Ratownika.
|
||||
</p>
|
||||
|
||||
<div class="d-flex flex-column gap-1 small text-muted mb-3">
|
||||
<div><i class='bx bx-time text-primary me-1'></i> Czas trwania: <strong>66 godzin (Weekendowo)</strong></div>
|
||||
<div><i class='bx bx-shield-check text-success me-1'></i> Ważność uprawnień: <strong>3 lata</strong></div>
|
||||
<div><i class='bx bx-badge text-info me-1'></i> Wymóg na trasy szkolne i młodzieżowe</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-3 bg-light border-top d-flex justify-content-between align-items-center">
|
||||
<small class="text-muted">Certyfikat państwowy</small>
|
||||
<button type="button" class="btn btn-sm btn-superpilot-outline" onclick="alert('Szczegóły kursu KPP przesłano na e-mail koordynatora.');">
|
||||
Szczegóły programu
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Kurs 3: Standardy VIP i Incentive -->
|
||||
<div class="col-lg-4 col-md-6">
|
||||
<div class="academy-card h-100 d-flex flex-column">
|
||||
<div class="p-4 flex-grow-1">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<span class="badge bg-info-subtle text-info rounded-pill fw-bold">
|
||||
<i class='bx bx-diamond'></i> Korporacje & VIP
|
||||
</span>
|
||||
<span class="fw-bold text-navy">1 450 PLN</span>
|
||||
</div>
|
||||
|
||||
<h5 class="fw-bold text-navy mb-2">Pilotaż Wyjazdów VIP & Incentive 2027</h5>
|
||||
<p class="text-secondary small mb-3">
|
||||
Etykieta biznesowa, dyplomacja w hotelach 5*, obsługa zarządów korporacji i eventów zagranicznych. Najwyższe stawki dzienne w branży.
|
||||
</p>
|
||||
|
||||
<div class="d-flex flex-column gap-1 small text-muted mb-3">
|
||||
<div><i class='bx bx-time text-primary me-1'></i> Czas trwania: <strong>20h Masterclass</strong></div>
|
||||
<div><i class='bx bx-award text-success me-1'></i> Dedykowana odznaka: <strong>VIP Guide Pro</strong></div>
|
||||
<div><i class='bx bx-user-voice text-primary me-1'></i> Prowadzący: Doświadczeni dyrektorzy operacyjni biur</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-3 bg-light border-top d-flex justify-content-between align-items-center">
|
||||
<small class="text-muted">Dla doświadczonych pilotów</small>
|
||||
<button type="button" class="btn btn-sm btn-superpilot-outline" onclick="alert('Zgłoszono zapotrzebowanie na szkolenie VIP.');">
|
||||
Szczegóły programu
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div><!-- /.container-xxl -->
|
||||
|
||||
<script>
|
||||
function verifyCert() {
|
||||
const num = document.getElementById('certNumberInput').value.trim();
|
||||
const res = document.getElementById('certResultBox');
|
||||
if (num === 'SPA-2026-OK92') {
|
||||
res.innerHTML = `
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="rounded-circle bg-success-subtle text-success d-flex align-items-center justify-content-center" style="width: 40px; height: 40px; font-size: 1.3rem;">
|
||||
<i class='bx bx-check-double'></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold text-navy" style="font-size: 0.92rem;">
|
||||
Certyfikat Autentyczny: Oskar Kaczmarek (ID #1)
|
||||
</div>
|
||||
<small class="text-muted">Superpilot Academy 2026 • Akredytacja Pilotażu Europy Południowej (Włochy, Grecja, Hiszpania) • Status: <strong>Aktywny i ważny</strong></small>
|
||||
</div>
|
||||
</div>
|
||||
<a href="pilot-profile.php" class="btn btn-sm btn-outline-primary fw-semibold">
|
||||
Zobacz zweryfikowany profil →
|
||||
</a>
|
||||
`;
|
||||
} else {
|
||||
res.innerHTML = `
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="rounded-circle bg-info-subtle text-info d-flex align-items-center justify-content-center" style="width: 40px; height: 40px; font-size: 1.3rem;">
|
||||
<i class='bx bx-info-circle'></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold text-navy" style="font-size: 0.92rem;">
|
||||
Certyfikat w Rejestrze: ${num}
|
||||
</div>
|
||||
<small class="text-muted">Superpilot Academy Standard • Certyfikat w trakcie corocznej resertyfikacji.</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge bg-label-info">Zweryfikowano</span>
|
||||
`;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<?php include __DIR__ . '/footer.php'; ?>
|
||||
@@ -0,0 +1,148 @@
|
||||
<!-- Reusable Modals -->
|
||||
<?php include __DIR__ . '/booking-modal.php'; ?>
|
||||
<?php include __DIR__ . '/sos-modal.php'; ?>
|
||||
|
||||
<!-- Modal Wideo-Wizytówki Pilota (Autoprezentacja) -->
|
||||
<div class="modal fade" id="videoPitchModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content border-0 shadow-lg" style="border-radius: var(--sp-radius-md); overflow: hidden; background: #0f172a; color: white;">
|
||||
|
||||
<div class="modal-header border-0 pb-0">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="badge bg-danger rounded-pill" style="font-size: 0.7rem;">WIDEO AUTOPREZENTACJA</span>
|
||||
<h6 class="modal-title fw-bold text-white mb-0" id="videoModalPilotName">Oskar Kaczmarek</h6>
|
||||
<span class="text-white-50 small" id="videoModalLength">(1:15 min)</span>
|
||||
</div>
|
||||
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body p-4 text-center">
|
||||
|
||||
<!-- Ekran symulowanego wideo playera -->
|
||||
<div class="position-relative rounded-3 overflow-hidden d-flex flex-column align-items-center justify-content-center p-5 mb-3" style="background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%); min-height: 320px; border: 1px solid rgba(255,255,255,0.1);">
|
||||
|
||||
<!-- Próbka audio/video avatara -->
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center mb-3 shadow-lg" style="width: 84px; height: 84px; background: linear-gradient(135deg, var(--sp-primary) 0%, var(--sp-violet) 100%); font-size: 2.2rem; font-weight: 800;">
|
||||
OK
|
||||
</div>
|
||||
|
||||
<h5 class="fw-bold text-white mb-1">„Buongiorno! Nazywam się Oskar Kaczmarek...”</h5>
|
||||
<p class="text-white-50 small mb-3" style="max-width: 520px;">
|
||||
Posłuchaj próbki autoprezentacji: dykcja, prezencja, płynne przejście na język włoski i angielski, opanowanie i entuzjazm do pracy z grupami wycieczkowymi.
|
||||
</p>
|
||||
|
||||
<!-- Pasek postępu odtwarzacza -->
|
||||
<div class="w-100 progress bg-dark" style="height: 6px; max-width: 480px;">
|
||||
<div id="videoMockProgress" class="progress-bar bg-primary" style="width: 45%;"></div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between text-white-50 small mt-1 w-100" style="max-width: 480px; font-size: 0.72rem;">
|
||||
<span>0:34</span>
|
||||
<span>1:15</span>
|
||||
</div>
|
||||
|
||||
<!-- Fale dźwiękowe w tle -->
|
||||
<div class="d-flex align-items-center gap-1 mt-3">
|
||||
<span class="badge bg-label-primary px-3 py-1 rounded-pill"><i class='bx bx-volume-full'></i> Dźwięk HD</span>
|
||||
<span class="badge bg-label-success px-3 py-1 rounded-pill"><i class='bx bx-check-shield'></i> Zweryfikowany przez Superpilot</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Podsumowanie kompetencji zweryfikowanych w wideo -->
|
||||
<div class="row g-2 text-start">
|
||||
<div class="col-md-4">
|
||||
<div class="p-2 rounded bg-white bg-opacity-10">
|
||||
<div class="text-success small fw-bold"><i class='bx bx-check'></i> Język Włoski</div>
|
||||
<small class="text-white-50" style="font-size: 0.74rem;">Płynna wymowa i słownictwo branżowe</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="p-2 rounded bg-white bg-opacity-10">
|
||||
<div class="text-success small fw-bold"><i class='bx bx-check'></i> Dyplomacja & Grupa</div>
|
||||
<small class="text-white-50" style="font-size: 0.74rem;">Naturalne podejście do trudnych sytuacji</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="p-2 rounded bg-white bg-opacity-10">
|
||||
<div class="text-success small fw-bold"><i class='bx bx-check'></i> Prezencja Osobista</div>
|
||||
<small class="text-white-50" style="font-size: 0.74rem;">Wysoka kultura osobista, schludność</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer border-0 pt-0 pb-4 px-4 justify-content-between">
|
||||
<button type="button" class="btn btn-outline-light btn-sm" data-bs-dismiss="modal">Zamknij</button>
|
||||
<button type="button" class="btn btn-superpilot" onclick="bootstrap.Modal.getInstance(document.getElementById('videoPitchModal')).hide(); openBookingModal('1', 'Oskar Kaczmarek', '16.09.2027 - 24.09.2027');">
|
||||
<i class='bx bx-calendar-check'></i> Zarezerwuj pilota po obejrzeniu
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal Podglądu Zdjęć ze Szlaków (Lightbox) -->
|
||||
<div class="modal fade" id="photoLightboxModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content border-0 shadow-lg bg-dark text-white" style="border-radius: var(--sp-radius-md); overflow: hidden;">
|
||||
<div class="modal-header border-0 pb-0">
|
||||
<h6 class="modal-title fw-bold text-white mb-0" id="lightboxTitle">Zdjęcie z trasy</h6>
|
||||
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
<div class="modal-body p-4 text-center">
|
||||
<div class="rounded-3 d-flex align-items-center justify-content-center p-5 mb-2" id="lightboxPlaceholder" style="min-height: 380px; background: linear-gradient(135deg, #1e293b, #334155); color: white;">
|
||||
<div class="text-center">
|
||||
<i class='bx bx-landscape' style="font-size: 4rem; opacity: 0.8;"></i>
|
||||
<h5 class="fw-bold mt-2" id="lightboxSubtext">Florencja & Toskania — Grupa objazdowa Almatur</h5>
|
||||
<p class="text-white-50 small">Fotografia wykonana podczas realizacji programu autokarowego • Wrzesień 2026</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Stopka desktopowa -->
|
||||
<footer class="content-footer footer bg-white border-top py-3 mt-5">
|
||||
<div class="container-xxl d-flex flex-wrap justify-content-between align-items-center py-2 flex-md-row flex-column">
|
||||
<div class="mb-2 mb-md-0 small text-muted">
|
||||
© <?= date('Y') ?> <strong>Superpilot</strong> — Ekosystem TravelManager & PrzezMorze dla Biur Podróży.
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-3 small">
|
||||
<span class="text-success fw-semibold"><i class='bx bx-shield-quarter'></i> Certyfikacja Superpilot Academy</span>
|
||||
<a href="courses.php" class="text-secondary text-decoration-none">Programy Szkoleń</a>
|
||||
<a href="../travelleader-mobile/profile.php" target="_blank" class="text-primary text-decoration-none">Aplikacja Mobilna Pilota</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<div class="content-backdrop fade"></div>
|
||||
</div><!-- /.content-wrapper -->
|
||||
</div><!-- /.layout-page -->
|
||||
</div><!-- /.layout-container -->
|
||||
</div><!-- /.layout-wrapper -->
|
||||
|
||||
<!-- Sneat Core JS -->
|
||||
<script src="<?= $basePath ?>/assets/vendor/libs/jquery/jquery.js"></script>
|
||||
<script src="<?= $basePath ?>/assets/vendor/libs/popper/popper.js"></script>
|
||||
<script src="<?= $basePath ?>/assets/vendor/js/bootstrap.js"></script>
|
||||
<script src="<?= $basePath ?>/assets/vendor/libs/perfect-scrollbar/perfect-scrollbar.js"></script>
|
||||
<script src="<?= $basePath ?>/assets/vendor/libs/hammer/hammer.js"></script>
|
||||
<script src="<?= $basePath ?>/assets/vendor/js/menu.js"></script>
|
||||
<script src="<?= $basePath ?>/assets/js/main.js"></script>
|
||||
|
||||
<!-- Superpilot Custom JS -->
|
||||
<script src="assets/js/superpilot.js"></script>
|
||||
|
||||
<!-- Magico Prototype Comments -->
|
||||
<?php if (!empty($enablePrototypeComments)): ?>
|
||||
<script>
|
||||
const MAGICO_BASE_URL = <?= json_encode($basePath); ?>;
|
||||
</script>
|
||||
<script src="<?= $basePath ?>/assets/js/comments.js"></script>
|
||||
<?php endif; ?>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,115 @@
|
||||
<?php
|
||||
$basePath = '';
|
||||
if (isset($_SERVER['HTTP_HOST']) && ($_SERVER['HTTP_HOST'] === 'localhost' || $_SERVER['HTTP_HOST'] === '127.0.0.1')) {
|
||||
$basePath = '/magico-prototype';
|
||||
}
|
||||
|
||||
if (!isset($pageTitle)) {
|
||||
$pageTitle = 'Superpilot — Baza Pilotów dla Biur Podróży';
|
||||
}
|
||||
if (!isset($enablePrototypeComments)) {
|
||||
$enablePrototypeComments = true;
|
||||
}
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="pl" class="light-style layout-menu-fixed" dir="ltr" data-theme="theme-default" data-assets-path="<?= $basePath ?>/assets/">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
|
||||
<title><?= htmlspecialchars($pageTitle) ?></title>
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/x-icon" href="<?= $basePath ?>/assets/img/favicon/favicon.ico" />
|
||||
|
||||
<!-- Google Fonts: Public Sans -->
|
||||
<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=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&display=swap" rel="stylesheet" />
|
||||
|
||||
<!-- Icons & Core Sneat CSS -->
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/vendor/fonts/boxicons.css" />
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/vendor/css/core.css" />
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/vendor/css/theme-default.css" />
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/css/demo.css" />
|
||||
|
||||
<!-- Superpilot Dedicated Modern Stylesheet (Clean 2026 Design) -->
|
||||
<link rel="stylesheet" href="assets/css/superpilot.css" />
|
||||
|
||||
<!-- Prototype Comments -->
|
||||
<?php if (!empty($enablePrototypeComments)): ?>
|
||||
<link rel="stylesheet" href="<?= $basePath ?>/assets/css/comments.css">
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Helpers -->
|
||||
<script src="<?= $basePath ?>/assets/vendor/js/helpers.js"></script>
|
||||
<script src="<?= $basePath ?>/assets/js/config.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Layout wrapper -->
|
||||
<div class="layout-wrapper layout-navbar-full layout-horizontal layout-without-menu">
|
||||
<div class="layout-container">
|
||||
|
||||
<!-- Navbar główny (Spokojny, lekki, profesjonalny) -->
|
||||
<nav class="layout-navbar navbar navbar-expand-xl align-items-center bg-white" id="layout-navbar" style="position: sticky; top: 0; z-index: 1020; border-bottom: 1px solid var(--border-color);">
|
||||
<div class="container-xxl d-flex align-items-center justify-content-between py-2">
|
||||
|
||||
<!-- Brand & Subtitle -->
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<a href="index.php" class="brand-superpilot">
|
||||
<div class="logo-icon">
|
||||
<i class='bx bx-compass'></i>
|
||||
</div>
|
||||
<div class="d-flex flex-column">
|
||||
<span class="lh-1">Super<span style="color: var(--primary);">pilot</span></span>
|
||||
<small class="text-muted" style="font-size: 0.68rem; font-weight: 500;">Baza Pilotów dla Biur Podróży</small>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Prawa strona paska nawigacji: Zastępstwo SOS, Aplikacja Pilota, Biuro -->
|
||||
<div class="d-flex align-items-center gap-2 gap-md-3">
|
||||
|
||||
<!-- Spokojny przycisk SOS -->
|
||||
<button type="button" class="btn-sos" onclick="openSosModal('Włochy')" title="Szybkie znalezienie pilota na cito">
|
||||
<span class="sos-dot"></span>
|
||||
<span>Dyżur SOS</span>
|
||||
</button>
|
||||
|
||||
<!-- Przejście do aplikacji mobilnej pilota -->
|
||||
<a href="../travelleader-mobile/profile.php" target="_blank" class="btn btn-sm btn-light text-muted d-none d-md-inline-flex align-items-center gap-1 border" style="font-size: 0.78rem;" title="Podgląd z perspektywy pilota">
|
||||
<i class='bx bx-mobile-alt'></i>
|
||||
<span>Aplikacja Pilota</span>
|
||||
<i class='bx bx-link-external' style="font-size: 0.65rem;"></i>
|
||||
</a>
|
||||
|
||||
<!-- Powrót do Travel Managera -->
|
||||
<a href="../travel/index.php" class="btn btn-sm btn-link text-muted d-none d-lg-inline-block text-decoration-none p-0" style="font-size: 0.78rem;">
|
||||
Travel Manager
|
||||
</a>
|
||||
|
||||
<!-- Profil zalogowanego biura (Przejście do zapytań i zleceń) -->
|
||||
<a href="inquiries.php" class="d-flex align-items-center gap-2 ps-2 border-start text-decoration-none" title="Moje zlecenia i wysłane zapytania">
|
||||
<div class="position-relative">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center fw-bold" style="width: 36px; height: 36px; background: var(--primary-light); color: var(--primary); font-size: 0.85rem; border: 1px solid var(--primary-border); transition: all 0.15s ease;">
|
||||
AL
|
||||
</div>
|
||||
<span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-warning text-dark border border-white" style="font-size: 0.6rem; padding: 2px 5px;" title="1 oczekujące zapytanie">
|
||||
1
|
||||
</span>
|
||||
</div>
|
||||
<div class="d-none d-xl-block text-start lh-sm">
|
||||
<div class="fw-bold" style="font-size: 0.82rem; color: var(--dark-navy);">Biuro Almatur</div>
|
||||
<small class="text-muted" style="font-size: 0.7rem;">Zlecenia & zapytania →</small>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<!-- / Navbar -->
|
||||
|
||||
<!-- Layout container -->
|
||||
<div class="layout-page" style="padding-top: 0px !important;">
|
||||
<div class="content-wrapper">
|
||||
|
||||
@@ -0,0 +1,904 @@
|
||||
<?php
|
||||
$pageTitle = 'Superpilot — Baza Pilotów Wycieczek (Katalog i Wyszukiwarka)';
|
||||
$enablePrototypeComments = true;
|
||||
include __DIR__ . '/header.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y" style="padding-top: 1.5rem !important;">
|
||||
|
||||
<!-- ================= GŁÓWNA BELKA WYSZUKIWARKI W STYLU PRACUJ.PL Z MULTISELECTEM KRAJÓW ================= -->
|
||||
<div class="search-bar-pracuj">
|
||||
|
||||
<!-- 1. Słowa kluczowe / Nazwisko -->
|
||||
<div class="search-field-item">
|
||||
<i class='bx bx-search field-icon'></i>
|
||||
<div class="field-content">
|
||||
<div class="field-label">Pilot / Specjalizacja / Słowo kluczowe</div>
|
||||
<input type="text" id="mainSearchInput" placeholder="Np. Oskar Kaczmarek, Rzym, Trekking...">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 2. Kraj / Destynacje — MULTISELECT POPUP -->
|
||||
<div class="search-field-item">
|
||||
<i class='bx bx-globe field-icon'></i>
|
||||
<div class="field-content dropdown">
|
||||
<div class="field-label">Destynacje (Multiselect)</div>
|
||||
<button type="button" class="multiselect-dest-trigger dropdown-toggle" id="destDropdownTrigger" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
|
||||
<span class="trigger-text" id="destTriggerText">🇮🇹 Włochy</span>
|
||||
<i class='bx bx-chevron-down text-muted ms-1'></i>
|
||||
</button>
|
||||
|
||||
<div class="dropdown-menu multiselect-dropdown-menu shadow-lg" aria-labelledby="destDropdownTrigger">
|
||||
<div class="d-flex justify-content-between align-items-center mb-2 pb-1 border-bottom">
|
||||
<span class="small fw-bold text-navy">Wybierz obsługiwane kraje:</span>
|
||||
<button type="button" class="btn btn-sm btn-link p-0 text-muted text-decoration-none small" id="btnResetDestMultiselect" style="font-size: 0.72rem;">Wyczyść</button>
|
||||
</div>
|
||||
|
||||
<label class="multiselect-item-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="top-dest-checkbox" value="Włochy" checked>
|
||||
<span>🇮🇹 Włochy</span>
|
||||
</div>
|
||||
<span class="text-muted small">(24)</span>
|
||||
</label>
|
||||
|
||||
<label class="multiselect-item-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="top-dest-checkbox" value="Grecja">
|
||||
<span>🇬🇷 Grecja</span>
|
||||
</div>
|
||||
<span class="text-muted small">(18)</span>
|
||||
</label>
|
||||
|
||||
<label class="multiselect-item-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="top-dest-checkbox" value="Hiszpania">
|
||||
<span>🇪🇸 Hiszpania</span>
|
||||
</div>
|
||||
<span class="text-muted small">(16)</span>
|
||||
</label>
|
||||
|
||||
<label class="multiselect-item-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="top-dest-checkbox" value="Chorwacja">
|
||||
<span>🇭🇷 Chorwacja</span>
|
||||
</div>
|
||||
<span class="text-muted small">(12)</span>
|
||||
</label>
|
||||
|
||||
<label class="multiselect-item-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="top-dest-checkbox" value="Norwegia">
|
||||
<span>🇳🇴 Norwegia</span>
|
||||
</div>
|
||||
<span class="text-muted small">(9)</span>
|
||||
</label>
|
||||
|
||||
<label class="multiselect-item-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="top-dest-checkbox" value="Austria">
|
||||
<span>🇦🇹 Austria</span>
|
||||
</div>
|
||||
<span class="text-muted small">(7)</span>
|
||||
</label>
|
||||
|
||||
<label class="multiselect-item-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="top-dest-checkbox" value="Japonia">
|
||||
<span>🇯🇵 Japonia & Azja</span>
|
||||
</div>
|
||||
<span class="text-muted small">(5)</span>
|
||||
</label>
|
||||
|
||||
<div class="pt-2 mt-2 border-top">
|
||||
<button type="button" class="btn btn-sm btn-primary w-100 fw-semibold" id="btnConfirmDestDropdown">
|
||||
Zastosuj wybrane kraje
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 3. Termin wycieczki (Dialog kalendarza) -->
|
||||
<div class="search-field-item" data-bs-toggle="modal" data-bs-target="#dateRangeModal" style="cursor: pointer;">
|
||||
<i class='bx bx-calendar field-icon text-primary'></i>
|
||||
<div class="field-content">
|
||||
<div class="field-label">Termin wycieczki (Kalendarz)</div>
|
||||
<input type="text" id="selectedDateDisplay" value="16.09.2027 – 24.09.2027" readonly style="cursor: pointer;">
|
||||
</div>
|
||||
<i class='bx bx-chevron-down text-muted'></i>
|
||||
</div>
|
||||
|
||||
<!-- 4. Przycisk Szukaj -->
|
||||
<button type="button" class="btn-search-pracuj" id="btnExecuteSearch">
|
||||
<i class='bx bx-search'></i> Szukaj
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- ================= GŁÓWNY UKŁAD 2-KOLUMNOWY ================= -->
|
||||
<div class="row g-4">
|
||||
|
||||
<!-- ================= LEWA KOLUMNA: SIDEBAR FILTRÓW ================= -->
|
||||
<div class="col-lg-4 col-xl-3">
|
||||
<div class="filters-sidebar">
|
||||
|
||||
<div class="filter-sidebar-header">
|
||||
<h6 class="filter-sidebar-title">
|
||||
<i class='bx bx-filter-alt text-primary'></i> Filtry
|
||||
</h6>
|
||||
<button type="button" id="btnClearAllFilters" class="btn btn-sm btn-link text-muted p-0 text-decoration-none" style="font-size: 0.76rem;">
|
||||
Wyczyść filtry
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- NOWY AKORDEON: Baza wypadowa pilota -->
|
||||
<div class="filter-accordion-item">
|
||||
<div class="filter-accordion-header" data-bs-toggle="collapse" data-bs-target="#filterBaseCollapse">
|
||||
<span class="filter-accordion-title">
|
||||
<i class='bx bx-building-house'></i> Baza pilota
|
||||
</span>
|
||||
<i class='bx bx-chevron-down text-muted'></i>
|
||||
</div>
|
||||
<div class="collapse show filter-accordion-body" id="filterBaseCollapse">
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="base" value="warszawa">
|
||||
<span>Warszawa</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(48)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="base" value="kraków">
|
||||
<span>Kraków</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(26)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="base" value="katowice">
|
||||
<span>Katowice / Śląsk</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(22)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="base" value="poznań">
|
||||
<span>Poznań</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(15)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="base" value="wrocław">
|
||||
<span>Wrocław</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(14)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="base" value="gdańsk">
|
||||
<span>Gdańsk / Trójmiasto</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(12)</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Akordeon 2: Specjalizacje -->
|
||||
<div class="filter-accordion-item">
|
||||
<div class="filter-accordion-header" data-bs-toggle="collapse" data-bs-target="#filterSpecCollapse">
|
||||
<span class="filter-accordion-title">
|
||||
<i class='bx bx-category'></i> Specjalizacje
|
||||
</span>
|
||||
<i class='bx bx-chevron-down text-muted'></i>
|
||||
</div>
|
||||
<div class="collapse show filter-accordion-body" id="filterSpecCollapse">
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="spec" value="objazdówki">
|
||||
<span>Wycieczki objazdowe</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(38)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="spec" value="trekking">
|
||||
<span>Trekking & góry</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(14)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="spec" value="miejski">
|
||||
<span>Przewodnik miejski</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(21)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="spec" value="młodzież">
|
||||
<span>Grupy szkolne</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(19)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="spec" value="vip">
|
||||
<span>VIP & Incentive</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(11)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="spec" value="kulinaria">
|
||||
<span>Enoturystyka & kulinaria</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(8)</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Akordeon 3: Języki obce -->
|
||||
<div class="filter-accordion-item">
|
||||
<div class="filter-accordion-header" data-bs-toggle="collapse" data-bs-target="#filterLangCollapse">
|
||||
<span class="filter-accordion-title">
|
||||
<i class='bx bx-message-dots'></i> Języki obce
|
||||
</span>
|
||||
<i class='bx bx-chevron-down text-muted'></i>
|
||||
</div>
|
||||
<div class="collapse show filter-accordion-body" id="filterLangCollapse">
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="lang" value="Angielski">
|
||||
<span>Angielski (B2 / C1 / C2)</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(45)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="lang" value="Włoski">
|
||||
<span>Włoski (min. B2)</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(18)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="lang" value="Hiszpański">
|
||||
<span>Hiszpański (min. B2)</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(14)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="lang" value="Norweski">
|
||||
<span>Norweski (C1)</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(4)</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Akordeon 4: Certyfikaty i Ranga -->
|
||||
<div class="filter-accordion-item">
|
||||
<div class="filter-accordion-header" data-bs-toggle="collapse" data-bs-target="#filterCertCollapse">
|
||||
<span class="filter-accordion-title">
|
||||
<i class='bx bx-award'></i> Certyfikaty & Ranga
|
||||
</span>
|
||||
<i class='bx bx-chevron-down text-muted'></i>
|
||||
</div>
|
||||
<div class="collapse show filter-accordion-body" id="filterCertCollapse">
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="cert" value="verified">
|
||||
<span>Superpilot Academy</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(32)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="cert" value="kpp">
|
||||
<span>Ratownik KPP</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(16)</span>
|
||||
</label>
|
||||
<label class="filter-checkbox-row">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<input type="checkbox" class="filter-checkbox" data-type="cert" value="rating-48">
|
||||
<span>Ocena min. 4.8 ★</span>
|
||||
</div>
|
||||
<span class="filter-count-badge">(27)</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="filter-sidebar-footer">
|
||||
<button type="button" class="btn-apply-filters" id="btnApplySidebarFilters">
|
||||
<i class='bx bx-check'></i> Pokaż pilotów (<span id="sidebarCountSpan">5</span>)
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ================= PRAWA KOLUMNA: KATALOG OFERT PILOTÓW ================= -->
|
||||
<div class="col-lg-8 col-xl-9">
|
||||
|
||||
<!-- Pasek aktywnych filtrów (Chips) -->
|
||||
<div class="active-filters-bar" id="activeFiltersBar">
|
||||
<span class="text-muted small me-1">Aktywne filtry:</span>
|
||||
<span class="active-filter-chip" id="chipDestFilter">
|
||||
<i class='bx bx-globe text-primary'></i>
|
||||
<span id="chipDestText">Włochy</span>
|
||||
<i class='bx bx-x chip-remove' id="removeDestChip" title="Usuń filtr"></i>
|
||||
</span>
|
||||
<span class="active-filter-chip" id="chipDateFilter">
|
||||
<i class='bx bx-calendar text-primary'></i>
|
||||
<span id="chipDateText">16–24.09.2027</span>
|
||||
<i class='bx bx-x chip-remove' id="removeDateChip" title="Usuń filtr"></i>
|
||||
</span>
|
||||
<span class="active-filter-chip" id="chipBaseFilter" style="display: none;">
|
||||
<i class='bx bx-building-house text-primary'></i>
|
||||
<span id="chipBaseText">Warszawa</span>
|
||||
<i class='bx bx-x chip-remove' id="removeBaseChip" title="Usuń filtr"></i>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Belka podsumowania nad listą -->
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap gap-2 mb-3">
|
||||
<div>
|
||||
<span class="fw-bold text-navy" style="font-size: 1.05rem;">Dostępni piloci wycieczek</span>
|
||||
<span class="text-muted small ms-1">— <span id="offersCountText">5 ofert</span></span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="text-muted small">Sortuj:</span>
|
||||
<select class="form-select form-select-sm border" style="width: auto; font-size: 0.8rem; font-weight: 600;">
|
||||
<option selected>Dla Ciebie (Rekomendowani)</option>
|
||||
<option>Najwyższa ocena biur</option>
|
||||
<option>Staż pilotażu</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Komunikat o braku ofert -->
|
||||
<div id="noOffersAlert" class="alert alert-light border text-center p-4 my-4" style="display: none; border-radius: var(--radius-md);">
|
||||
<i class='bx bx-search-alt fs-1 text-muted mb-2'></i>
|
||||
<h6 class="fw-bold text-navy mb-1">Brak pilotów spełniających podane kryteria</h6>
|
||||
<p class="text-muted small mb-3">Zmień wybrane destynacje, specjalizacje w lewym panelu lub zresetuj filtry.</p>
|
||||
<button type="button" class="btn btn-sm btn-primary-calm" onclick="document.getElementById('btnClearAllFilters').click();">
|
||||
Wyczyść wszystkie filtry
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- LISTA POZIOMYCH KART PILOTÓW (UPORZĄDKOWANA, CZYSTA) -->
|
||||
<div id="pilotOffersList">
|
||||
|
||||
<!-- ================= OFERTA 1: OSKAR KACZMAREK ================= -->
|
||||
<div class="pilot-offer-card pilot-grid-item"
|
||||
data-name="Oskar Kaczmarek"
|
||||
data-base="warszawa"
|
||||
data-destinations="Włochy Grecja Hiszpania Chorwacja Norwegia Austria"
|
||||
data-languages="Polski Angielski Włoski"
|
||||
data-tags="objazdówki miejski rzym florencja młodzież vip kulinaria"
|
||||
data-rating="4.9"
|
||||
data-verified="1"
|
||||
data-kpp="1"
|
||||
data-dates-free="05-15-sep 25-30-sep październik-2027">
|
||||
|
||||
<div class="pilot-offer-avatar">
|
||||
OK
|
||||
<div class="verified-badge-mini" title="Zweryfikowany przez Superpilot Academy">
|
||||
<i class='bx bx-check'></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-content">
|
||||
|
||||
<!-- Rząd 1: Imię + Rola + Gwiazdka i Ocena -->
|
||||
<div class="pilot-offer-header-row">
|
||||
<div>
|
||||
<h5 class="pilot-offer-name">
|
||||
<a href="pilot-profile.php">Oskar Kaczmarek</a>
|
||||
</h5>
|
||||
<div class="pilot-offer-headline">
|
||||
Licencjonowany Pilot Wycieczek & Przewodnik Miejski
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="pilot-rating-badge">
|
||||
<i class='bx bxs-star'></i> 4.9 <span class="text-muted fw-normal">(18 opinii)</span>
|
||||
</div>
|
||||
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
|
||||
<i class='bx bx-star'></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Rząd 2: Metadane logistyczne (Baza, Staż, Języki) -->
|
||||
<div class="pilot-offer-meta-row">
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Warszawa</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-time-five text-muted'></i> Staż: <strong>7 lat</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Włoski (B2), Angielski (C1)</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Rząd 3: Uporządkowane tagi -->
|
||||
<div class="pilot-tags-row">
|
||||
<span class="tech-tag primary-dest">🇮🇹 Włochy (Ekspert)</span>
|
||||
<span class="tech-tag primary-dest">🇬🇷 Grecja</span>
|
||||
<span class="tech-tag primary-dest">🇪🇸 Hiszpania</span>
|
||||
<span class="tech-tag">Objazdówki autokarowe</span>
|
||||
<span class="tech-tag">VIP Incentive</span>
|
||||
</div>
|
||||
|
||||
<!-- Rząd 4: Zwięzłe Bio -->
|
||||
<div class="pilot-offer-bio">
|
||||
Pasjonat kultury śródziemnomorskiej z wykształceniem historycznym (UW). Od 2019 r. z sukcesami prowadzi wycieczki objazdowe autokarowe i lotnicze we Włoszech, Hiszpanii i Grecji. Wyróżnia go wysokie opanowanie w sytuacjach kryzysowych.
|
||||
</div>
|
||||
|
||||
<!-- Rząd 5: Stopka karty -->
|
||||
<div class="pilot-offer-footer">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="pilot-academy-badge">
|
||||
<i class='bx bx-award'></i> Superpilot Academy 2026
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="pilot-profile.php" class="btn-offer-details">
|
||||
Szczegóły profilu
|
||||
</a>
|
||||
<button type="button" class="btn-offer-book" onclick="openBookingModal('1', 'Oskar Kaczmarek', '16.09.2027 – 24.09.2027')">
|
||||
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ================= OFERTA 2: ANNA LEWANDOWSKA ================= -->
|
||||
<div class="pilot-offer-card pilot-grid-item"
|
||||
data-name="Anna Lewandowska"
|
||||
data-base="kraków"
|
||||
data-destinations="Norwegia Islandia Szwecja"
|
||||
data-languages="Polski Angielski Norweski"
|
||||
data-tags="trekking góry zorza polarna kameralne"
|
||||
data-rating="5.0"
|
||||
data-verified="1"
|
||||
data-kpp="1"
|
||||
data-dates-free="05-15-sep 16-24-sep październik-2027">
|
||||
|
||||
<div class="pilot-offer-avatar" style="background: linear-gradient(135deg, #059669 0%, #34d399 100%);">
|
||||
AL
|
||||
<div class="verified-badge-mini">
|
||||
<i class='bx bx-check'></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-content">
|
||||
<div class="pilot-offer-header-row">
|
||||
<div>
|
||||
<h5 class="pilot-offer-name">
|
||||
<a href="pilot-profile.php?id=2">Anna Lewandowska</a>
|
||||
</h5>
|
||||
<div class="pilot-offer-headline">
|
||||
Przewodnik Wysokogórski UIMLA & Pilot Północy
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="pilot-rating-badge">
|
||||
<i class='bx bxs-star'></i> 5.0 <span class="text-muted fw-normal">(24 opinie)</span>
|
||||
</div>
|
||||
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
|
||||
<i class='bx bx-star'></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-meta-row">
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Kraków</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-time-five text-muted'></i> Staż: <strong>9 lat</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Norweski (C1), Angielski (C2)</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-tags-row">
|
||||
<span class="tech-tag primary-dest">🇳🇴 Norwegia (Fiordy)</span>
|
||||
<span class="tech-tag primary-dest">🇮🇸 Islandia</span>
|
||||
<span class="tech-tag primary-dest">🇸🇪 Szwecja</span>
|
||||
<span class="tech-tag">Trekking & góry</span>
|
||||
<span class="tech-tag">Zorza polarna</span>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-bio">
|
||||
Specjalistka tras po Norwegii, Lofotach i lodowcach Islandii. Certyfikowana przewodniczka międzynarodowa UIMLA. Znakomita orientacja w logistyce promowej i trudnych warunkach pogodowych.
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-footer">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="pilot-academy-badge">
|
||||
<i class='bx bx-award'></i> Superpilot Academy 2026
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="pilot-profile.php?id=2" class="btn-offer-details">
|
||||
Szczegóły profilu
|
||||
</a>
|
||||
<button type="button" class="btn-offer-book" onclick="openBookingModal('2', 'Anna Lewandowska', '16.09.2027 – 24.09.2027')">
|
||||
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ================= OFERTA 3: MICHAŁ WIŚNIEWSKI ================= -->
|
||||
<div class="pilot-offer-card pilot-grid-item"
|
||||
data-name="Michał Wiśniewski"
|
||||
data-base="katowice"
|
||||
data-destinations="Hiszpania Portugalia Austria"
|
||||
data-languages="Polski Hiszpański Angielski"
|
||||
data-tags="objazdówki narty młodzież autokar"
|
||||
data-rating="4.7"
|
||||
data-verified="0"
|
||||
data-kpp="0"
|
||||
data-dates-free="październik-2027">
|
||||
|
||||
<div class="pilot-offer-avatar" style="background: linear-gradient(135deg, #d97706 0%, #fbbf24 100%);">
|
||||
MW
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-content">
|
||||
<div class="pilot-offer-header-row">
|
||||
<div>
|
||||
<h5 class="pilot-offer-name">
|
||||
<a href="pilot-profile.php?id=3">Michał Wiśniewski</a>
|
||||
</h5>
|
||||
<div class="pilot-offer-headline">
|
||||
Pilot Wycieczek Autokarowych & Instruktor Narciarstwa
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="pilot-rating-badge">
|
||||
<i class='bx bxs-star'></i> 4.7 <span class="text-muted fw-normal">(11 opinii)</span>
|
||||
</div>
|
||||
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
|
||||
<i class='bx bx-star'></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-meta-row">
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Katowice</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-time-five text-muted'></i> Staż: <strong>5 lat</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Hiszpański (B2), Angielski (B2)</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-tags-row">
|
||||
<span class="tech-tag primary-dest">🇪🇸 Hiszpania & Andaluzja</span>
|
||||
<span class="tech-tag primary-dest">🇵🇹 Portugalia</span>
|
||||
<span class="tech-tag primary-dest">🇦🇹 Austria</span>
|
||||
<span class="tech-tag">Objazdówki autokarowe</span>
|
||||
<span class="tech-tag">Narty & Alpy</span>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-bio">
|
||||
Dynamiczny pilot specjalizujący się w długich trasach autokarowych na Półwysep Iberyjski oraz zimowych wyjazdach narciarskich do Austrii i Włoch. Bardzo dobry kontakt z młodzieżą i grupami dorosłymi.
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-footer">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="badge bg-light text-muted border small">
|
||||
Instruktor SITN-PZN
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="pilot-profile.php?id=3" class="btn-offer-details">
|
||||
Szczegóły profilu
|
||||
</a>
|
||||
<button type="button" class="btn-offer-book" onclick="openBookingModal('3', 'Michał Wiśniewski', '05.10.2027 – 12.10.2027')">
|
||||
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ================= OFERTA 4: KATARZYNA ZIELIŃSKA ================= -->
|
||||
<div class="pilot-offer-card pilot-grid-item"
|
||||
data-name="Katarzyna Zielińska"
|
||||
data-base="poznań wrocław"
|
||||
data-destinations="Chorwacja Włochy Grecja"
|
||||
data-languages="Polski Angielski Chorwacki Włoski"
|
||||
data-tags="młodzież grupy szkolne kpp pierwsza pomoc bałkany"
|
||||
data-rating="4.8"
|
||||
data-verified="1"
|
||||
data-kpp="1"
|
||||
data-dates-free="05-15-sep 16-24-sep październik-2027">
|
||||
|
||||
<div class="pilot-offer-avatar" style="background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%);">
|
||||
KZ
|
||||
<div class="verified-badge-mini">
|
||||
<i class='bx bx-check'></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-content">
|
||||
<div class="pilot-offer-header-row">
|
||||
<div>
|
||||
<h5 class="pilot-offer-name">
|
||||
<a href="pilot-profile.php?id=4">Katarzyna Zielińska</a>
|
||||
</h5>
|
||||
<div class="pilot-offer-headline">
|
||||
Pilot Grup Szkolnych & Młodzieżowych • Ratownik KPP
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="pilot-rating-badge">
|
||||
<i class='bx bxs-star'></i> 4.8 <span class="text-muted fw-normal">(15 opinii)</span>
|
||||
</div>
|
||||
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
|
||||
<i class='bx bx-star'></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-meta-row">
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Poznań / Wrocław</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-time-five text-muted'></i> Staż: <strong>6 lat</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Chorwacki (B2), Angielski (C1)</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-tags-row">
|
||||
<span class="tech-tag primary-dest">🇭🇷 Chorwacja</span>
|
||||
<span class="tech-tag primary-dest">🇮🇹 Włochy Północne</span>
|
||||
<span class="tech-tag primary-dest">🇬🇷 Grecja</span>
|
||||
<span class="tech-tag">Grupy szkolne</span>
|
||||
<span class="tech-tag">Kwalifikowana Pierwsza Pomoc</span>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-bio">
|
||||
Pedagog z wieloletnim doświadczeniem w pilotowaniu wycieczek szkolnych i kolonii zagranicznych. Uprawnienia Kwalifikowanej Pierwszej Pomocy. Doskonała komunikacja z kierowcami autokarów i nauczycielami.
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-footer">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="pilot-academy-badge">
|
||||
<i class='bx bx-award'></i> Superpilot Academy 2026
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="pilot-profile.php?id=4" class="btn-offer-details">
|
||||
Szczegóły profilu
|
||||
</a>
|
||||
<button type="button" class="btn-offer-book" onclick="openBookingModal('4', 'Katarzyna Zielińska', '16.09.2027 – 24.09.2027')">
|
||||
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ================= OFERTA 5: PAWEŁ DĄBROWSKI ================= -->
|
||||
<div class="pilot-offer-card pilot-grid-item"
|
||||
data-name="Paweł Dąbrowski"
|
||||
data-base="warszawa"
|
||||
data-destinations="Japonia Azja"
|
||||
data-languages="Polski Angielski Japoński"
|
||||
data-tags="vip incentive egzotyka korporacje kulinaria"
|
||||
data-rating="4.9"
|
||||
data-verified="1"
|
||||
data-kpp="0"
|
||||
data-dates-free="październik-2027">
|
||||
|
||||
<div class="pilot-offer-avatar" style="background: linear-gradient(135deg, #7c3aed 0%, #a78bfa 100%);">
|
||||
PD
|
||||
<div class="verified-badge-mini">
|
||||
<i class='bx bx-check'></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-content">
|
||||
<div class="pilot-offer-header-row">
|
||||
<div>
|
||||
<h5 class="pilot-offer-name">
|
||||
<a href="pilot-profile.php?id=5">Paweł Dąbrowski</a>
|
||||
</h5>
|
||||
<div class="pilot-offer-headline">
|
||||
Ekspert Wyjazdów Dalekobieżnych & VIP Incentive (Japonia)
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="pilot-rating-badge">
|
||||
<i class='bx bxs-star'></i> 4.9 <span class="text-muted fw-normal">(30 opinii)</span>
|
||||
</div>
|
||||
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
|
||||
<i class='bx bx-star'></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-meta-row">
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Warszawa</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-time-five text-muted'></i> Staż: <strong>11 lat</strong>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Japoński (B2), Angielski (C2)</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pilot-tags-row">
|
||||
<span class="tech-tag primary-dest">🇯🇵 Japonia</span>
|
||||
<span class="tech-tag primary-dest">🇹🇭 Tajlandia</span>
|
||||
<span class="tech-tag primary-dest">🇺🇸 USA</span>
|
||||
<span class="tech-tag">VIP Incentive</span>
|
||||
<span class="tech-tag">Wyjazdy firmowe</span>
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-bio">
|
||||
Dyrektor operacyjny i pilot z 11-letnim doświadczeniem w wyjazdach incentive dla zarządów firm i grup VIP. Biegle posługuje się językiem japońskim i angielskim. Pełna znajomość protokołu biznesowego.
|
||||
</div>
|
||||
|
||||
<div class="pilot-offer-footer">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="pilot-academy-badge">
|
||||
<i class='bx bx-award'></i> Superpilot Academy 2026
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="pilot-profile.php?id=5" class="btn-offer-details">
|
||||
Szczegóły profilu
|
||||
</a>
|
||||
<button type="button" class="btn-offer-book" onclick="openBookingModal('5', 'Paweł Dąbrowski', '10.10.2027 – 24.10.2027')">
|
||||
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><!-- /#pilotOffersList -->
|
||||
|
||||
</div><!-- /.col-lg-8 -->
|
||||
|
||||
</div><!-- /.row -->
|
||||
|
||||
</div><!-- /.container-xxl -->
|
||||
|
||||
<!-- ================= MODAL KALENDARZA: WYBÓR ZAKRESU DAT WYCIECZKI ================= -->
|
||||
<div class="modal fade date-picker-modal" id="dateRangeModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered" style="max-width: 480px;">
|
||||
<div class="modal-content">
|
||||
|
||||
<div class="modal-header border-bottom py-3">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center bg-primary-subtle text-primary" style="width: 36px; height: 36px;">
|
||||
<i class='bx bx-calendar fs-5'></i>
|
||||
</div>
|
||||
<div>
|
||||
<h6 class="modal-title fw-bold text-navy mb-0">Wybierz termin wycieczki</h6>
|
||||
<small class="text-muted" style="font-size: 0.74rem;">Sprawdź wolne okienka w grafikach pilotów</small>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body p-3">
|
||||
|
||||
<div class="date-quick-presets">
|
||||
<span class="preset-chip active" data-preset="16-24-sep-2027">16 – 24 września 2027 (Wycieczka #12)</span>
|
||||
<span class="preset-chip" data-preset="05-15-sep-2027">05 – 15 września 2027 (Wolne okienko)</span>
|
||||
<span class="preset-chip" data-preset="październik-2027">Październik 2027</span>
|
||||
<span class="preset-chip" data-preset="all">Dowolny termin</span>
|
||||
</div>
|
||||
|
||||
<div class="p-2 border rounded-3 bg-light">
|
||||
<div class="d-flex justify-content-between align-items-center mb-2 px-1">
|
||||
<button class="btn btn-sm btn-white p-1 rounded-circle border"><i class='bx bx-chevron-left'></i></button>
|
||||
<strong class="text-navy" style="font-size: 0.88rem;">Wrzesień 2027</strong>
|
||||
<button class="btn btn-sm btn-white p-1 rounded-circle border"><i class='bx bx-chevron-right'></i></button>
|
||||
</div>
|
||||
|
||||
<div class="date-picker-grid">
|
||||
<div class="date-picker-day-head">Pn</div>
|
||||
<div class="date-picker-day-head">Wt</div>
|
||||
<div class="date-picker-day-head">Śr</div>
|
||||
<div class="date-picker-day-head">Cz</div>
|
||||
<div class="date-picker-day-head">Pt</div>
|
||||
<div class="date-picker-day-head">Sb</div>
|
||||
<div class="date-picker-day-head">Nd</div>
|
||||
|
||||
<div class="date-picker-cell other-month">30</div>
|
||||
<div class="date-picker-cell other-month">31</div>
|
||||
<div class="date-picker-cell">1</div>
|
||||
<div class="date-picker-cell">2</div>
|
||||
<div class="date-picker-cell">3</div>
|
||||
<div class="date-picker-cell">4</div>
|
||||
<div class="date-picker-cell">5</div>
|
||||
|
||||
<div class="date-picker-cell">6</div>
|
||||
<div class="date-picker-cell">7</div>
|
||||
<div class="date-picker-cell">8</div>
|
||||
<div class="date-picker-cell">9</div>
|
||||
<div class="date-picker-cell">10</div>
|
||||
<div class="date-picker-cell">11</div>
|
||||
<div class="date-picker-cell">12</div>
|
||||
|
||||
<div class="date-picker-cell">13</div>
|
||||
<div class="date-picker-cell">14</div>
|
||||
<div class="date-picker-cell">15</div>
|
||||
<div class="date-picker-cell range-start" data-day="16">16</div>
|
||||
<div class="date-picker-cell selected-range" data-day="17">17</div>
|
||||
<div class="date-picker-cell selected-range" data-day="18">18</div>
|
||||
<div class="date-picker-cell selected-range" data-day="19">19</div>
|
||||
|
||||
<div class="date-picker-cell selected-range" data-day="20">20</div>
|
||||
<div class="date-picker-cell selected-range" data-day="21">21</div>
|
||||
<div class="date-picker-cell selected-range" data-day="22">22</div>
|
||||
<div class="date-picker-cell selected-range" data-day="23">23</div>
|
||||
<div class="date-picker-cell range-end" data-day="24">24</div>
|
||||
<div class="date-picker-cell">25</div>
|
||||
<div class="date-picker-cell">26</div>
|
||||
|
||||
<div class="date-picker-cell">27</div>
|
||||
<div class="date-picker-cell">28</div>
|
||||
<div class="date-picker-cell">29</div>
|
||||
<div class="date-picker-cell">30</div>
|
||||
<div class="date-picker-cell other-month">1</div>
|
||||
<div class="date-picker-cell other-month">2</div>
|
||||
<div class="date-picker-cell other-month">3</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-3 p-2 rounded-2 bg-white border text-center small text-muted">
|
||||
Wybrany termin: <strong id="modalSelectedDateText" class="text-primary">16.09.2027 – 24.09.2027 (9 dni)</strong>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer border-top py-2 px-3 justify-content-between">
|
||||
<button type="button" class="btn btn-sm btn-link text-muted text-decoration-none" id="btnResetDateDialog">
|
||||
Wyczyść termin
|
||||
</button>
|
||||
<button type="button" class="btn btn-sm btn-primary-calm" id="btnApplyDateDialog" data-bs-dismiss="modal">
|
||||
Zastosuj termin wycieczki
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php include __DIR__ . '/footer.php'; ?>
|
||||
@@ -0,0 +1,331 @@
|
||||
<?php
|
||||
$pageTitle = 'Superpilot — Moje Zlecenia i Zapytania Ofertowe';
|
||||
$enablePrototypeComments = true;
|
||||
include __DIR__ . '/header.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y" style="padding-top: 1.25rem !important;">
|
||||
|
||||
<!-- Dyskretny powrót do katalogu -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
|
||||
<a href="index.php" class="text-muted text-decoration-none small d-inline-flex align-items-center gap-1">
|
||||
<i class='bx bx-arrow-back'></i> Wróć do katalogu pilotów
|
||||
</a>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<button type="button" class="btn-sos" onclick="openSosModal('Włochy')" title="Pilne zastępstwo SOS">
|
||||
<span class="sos-dot"></span>
|
||||
<span>Dyżur SOS</span>
|
||||
</button>
|
||||
<button type="button" class="btn btn-primary btn-sm px-3 fw-semibold d-inline-flex align-items-center gap-1" style="font-size: 0.8rem; border-radius: var(--radius-sm);" onclick="openBookingModal('1', 'Oskar Kaczmarek', '16.09.2027 - 24.09.2027')">
|
||||
<i class='bx bx-plus'></i> Nowe zapytanie o termin
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Nagłówek widoku -->
|
||||
<div class="mb-4">
|
||||
<h3 class="fw-bold text-navy mb-1" style="font-size: 1.45rem;">Moje Zlecenia & Wysłane Zapytania</h3>
|
||||
<p class="text-muted small mb-0">
|
||||
Monitoring statusu obsady tras biura Almatur w aplikacji mobilnej pilotów (<code>TravelLeader Mobile</code>) oraz umowy.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Pasek 4 podsumowań (Spójny z profile-stat-box) -->
|
||||
<div class="row g-3 mb-4">
|
||||
<div class="col-lg-3 col-sm-6">
|
||||
<div class="profile-stat-box">
|
||||
<div class="stat-val">4</div>
|
||||
<div class="stat-lbl">Wszystkie zlecenia w historii</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-sm-6">
|
||||
<div class="profile-stat-box">
|
||||
<div class="stat-val text-warning">1</div>
|
||||
<div class="stat-lbl">Oczekuje na akceptację w mobile</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-sm-6">
|
||||
<div class="profile-stat-box">
|
||||
<div class="stat-val text-success">2</div>
|
||||
<div class="stat-lbl">Zaakceptowane & obsadzone</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-sm-6">
|
||||
<div class="profile-stat-box">
|
||||
<div class="stat-val" style="color: var(--primary);">1</div>
|
||||
<div class="stat-lbl">Zrealizowana i oceniona</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Główna karta tabeli zleceń -->
|
||||
<div class="profile-section-card">
|
||||
|
||||
<!-- Nagłówek tabeli z filtrami -->
|
||||
<div class="profile-section-header flex-wrap gap-2">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<i class='bx bx-list-check fs-5 text-primary'></i>
|
||||
<h5 class="profile-section-title mb-0">Lista Zapytań Ofertowych Biura Podróży</h5>
|
||||
</div>
|
||||
|
||||
<!-- Filtry statusów (Pastylki) -->
|
||||
<div class="d-flex gap-1 flex-wrap" id="inquiryStatusFilters">
|
||||
<button type="button" class="btn btn-sm btn-primary filter-tab active" data-filter="all" style="font-size: 0.76rem;">
|
||||
Wszystkie (4)
|
||||
</button>
|
||||
<button type="button" class="btn btn-sm btn-light border filter-tab" data-filter="pending" style="font-size: 0.76rem;">
|
||||
Oczekujące (1)
|
||||
</button>
|
||||
<button type="button" class="btn btn-sm btn-light border filter-tab" data-filter="confirmed" style="font-size: 0.76rem;">
|
||||
Zaakceptowane (2)
|
||||
</button>
|
||||
<button type="button" class="btn btn-sm btn-light border filter-tab" data-filter="completed" style="font-size: 0.76rem;">
|
||||
Zrealizowane (1)
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive text-nowrap">
|
||||
<table class="table table-hover align-middle mb-0">
|
||||
<thead class="bg-light text-muted" style="font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.03em;">
|
||||
<tr>
|
||||
<th style="padding: 12px 18px;">Wycieczka & Termin</th>
|
||||
<th>Pilot</th>
|
||||
<th>Stawka dzienna</th>
|
||||
<th>Status w aplikacji pilota</th>
|
||||
<th>Data wysłania</th>
|
||||
<th class="text-end" style="padding: 12px 18px;">Akcje</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody style="font-size: 0.85rem;" id="inquiriesTableBody">
|
||||
|
||||
<!-- Pozycja 1: Wycieczka #15 (Oskar Kaczmarek - oczekuje) -->
|
||||
<tr class="inquiry-row" data-status="pending">
|
||||
<td style="padding: 14px 18px;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-2 d-flex align-items-center justify-content-center bg-warning-subtle text-warning fw-bold" style="width: 32px; height: 32px; font-size: 0.8rem; flex-shrink: 0;">
|
||||
#15
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold text-navy">Wycieczka #15: Magia Toskanii i Rzym</div>
|
||||
<small class="text-muted"><i class='bx bx-calendar'></i> 05.10.2027 – 12.10.2027 (8 dni)</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center text-white fw-bold" style="width: 32px; height: 32px; background: linear-gradient(135deg, var(--primary) 0%, #767bf7 100%); font-size: 0.78rem; flex-shrink: 0;">
|
||||
OK
|
||||
</div>
|
||||
<div>
|
||||
<a href="pilot-profile.php" class="fw-bold text-navy text-decoration-none">Oskar Kaczmarek</a>
|
||||
<small class="text-muted d-block" style="font-size: 0.72rem;">★ 4.9 • Warszawa</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<strong class="text-navy">550 PLN</strong> <small class="text-muted">/ dzień netto</small>
|
||||
<div class="text-muted small" style="font-size: 0.7rem;">Suma: 4 400 PLN</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="badge bg-warning-subtle text-warning fw-bold px-3 py-1 rounded-pill d-inline-flex align-items-center gap-1" style="font-size: 0.74rem;">
|
||||
<i class='bx bx-time-five'></i> Oczekuje na akceptację
|
||||
</span>
|
||||
<small class="text-muted d-block mt-1" style="font-size: 0.7rem;">Powiadomienie PUSH doręczone (18h na odpowiedź)</small>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small">Dziś, 09:15</span>
|
||||
</td>
|
||||
<td class="text-end" style="padding: 14px 18px;">
|
||||
<div class="d-flex align-items-center justify-content-end gap-1">
|
||||
<button type="button" class="btn btn-sm btn-outline-primary" style="font-size: 0.76rem;" onclick="showToastNotification('Przypomnienie PUSH wysłane!', 'Wysłano ponowny alert na telefon pilota Oskara Kaczmarka.');">
|
||||
<i class='bx bx-bell'></i> Przypomnij
|
||||
</button>
|
||||
<a href="pilot-profile.php" class="btn btn-sm btn-light border text-muted" style="font-size: 0.76rem;" title="Profil pilota">
|
||||
Profil
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Pozycja 2: Wycieczka #12 (Oskar Kaczmarek - potwierdzona) -->
|
||||
<tr class="inquiry-row" data-status="confirmed">
|
||||
<td style="padding: 14px 18px;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-2 d-flex align-items-center justify-content-center bg-primary-subtle text-primary fw-bold" style="width: 32px; height: 32px; font-size: 0.8rem; flex-shrink: 0;">
|
||||
#12
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold text-navy">Wycieczka #12: Klasyczne Włochy (oskar prod)</div>
|
||||
<small class="text-muted"><i class='bx bx-calendar'></i> 16.09.2027 – 24.09.2027 (9 dni)</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center text-white fw-bold" style="width: 32px; height: 32px; background: linear-gradient(135deg, var(--primary) 0%, #767bf7 100%); font-size: 0.78rem; flex-shrink: 0;">
|
||||
OK
|
||||
</div>
|
||||
<div>
|
||||
<a href="pilot-profile.php" class="fw-bold text-navy text-decoration-none">Oskar Kaczmarek</a>
|
||||
<small class="text-muted d-block" style="font-size: 0.72rem;">★ 4.9 • Warszawa</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<strong class="text-navy">550 PLN</strong> <small class="text-muted">/ dzień netto</small>
|
||||
<div class="text-muted small" style="font-size: 0.7rem;">Suma: 4 950 PLN</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="badge bg-success-subtle text-success fw-bold px-3 py-1 rounded-pill d-inline-flex align-items-center gap-1" style="font-size: 0.74rem;">
|
||||
<i class='bx bx-check-circle'></i> Zaakceptowane przez pilota
|
||||
</span>
|
||||
<small class="text-muted d-block mt-1" style="font-size: 0.7rem;">Potwierdzone w TravelLeader Mobile</small>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small">Wczoraj, 14:22</span>
|
||||
</td>
|
||||
<td class="text-end" style="padding: 14px 18px;">
|
||||
<div class="d-flex align-items-center justify-content-end gap-1">
|
||||
<button type="button" class="btn btn-sm btn-light border text-muted" style="font-size: 0.76rem;" onclick="alert('Generowanie umowy zlecenia dla pilota Oskara Kaczmarka (Klasyczne Włochy)...');">
|
||||
<i class='bx bx-file'></i> Umowa
|
||||
</button>
|
||||
<a href="pilot-profile.php" class="btn btn-sm btn-light border text-muted" style="font-size: 0.76rem;">
|
||||
Profil
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Pozycja 3: Norwegia (Anna Lewandowska - potwierdzona) -->
|
||||
<tr class="inquiry-row" data-status="confirmed">
|
||||
<td style="padding: 14px 18px;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-2 d-flex align-items-center justify-content-center bg-info-subtle text-info fw-bold" style="width: 32px; height: 32px; font-size: 0.8rem; flex-shrink: 0;">
|
||||
#18
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold text-navy">Wycieczka #18: Fiordy Norwegii & Bergen</div>
|
||||
<small class="text-muted"><i class='bx bx-calendar'></i> 12.08.2027 – 19.08.2027 (8 dni)</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center text-white fw-bold" style="width: 32px; height: 32px; background: linear-gradient(135deg, #059669, #10b981); font-size: 0.78rem; flex-shrink: 0;">
|
||||
AL
|
||||
</div>
|
||||
<div>
|
||||
<span class="fw-bold text-navy">Anna Lewandowska</span>
|
||||
<small class="text-muted d-block" style="font-size: 0.72rem;">★ 5.0 • Kraków</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<strong class="text-navy">650 PLN</strong> <small class="text-muted">/ dzień netto</small>
|
||||
<div class="text-muted small" style="font-size: 0.7rem;">Suma: 5 200 PLN</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="badge bg-success-subtle text-success fw-bold px-3 py-1 rounded-pill d-inline-flex align-items-center gap-1" style="font-size: 0.74rem;">
|
||||
<i class='bx bx-check-circle'></i> Zaakceptowane przez pilota
|
||||
</span>
|
||||
<small class="text-muted d-block mt-1" style="font-size: 0.7rem;">Grafik obsadzony w 100%</small>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small">3 dni temu</span>
|
||||
</td>
|
||||
<td class="text-end" style="padding: 14px 18px;">
|
||||
<div class="d-flex align-items-center justify-content-end gap-1">
|
||||
<button type="button" class="btn btn-sm btn-light border text-muted" style="font-size: 0.76rem;" onclick="alert('Generowanie umowy zlecenia dla pilotki Anny Lewandowskiej...');">
|
||||
<i class='bx bx-file'></i> Umowa
|
||||
</button>
|
||||
<a href="pilot-profile.php?id=2" class="btn btn-sm btn-light border text-muted" style="font-size: 0.76rem;">
|
||||
Profil
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Pozycja 4: Wycieczka zrealizowana (Do oceny / Zrecenzowana) -->
|
||||
<tr class="inquiry-row" data-status="completed">
|
||||
<td style="padding: 14px 18px;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-2 d-flex align-items-center justify-content-center bg-secondary-subtle text-secondary fw-bold" style="width: 32px; height: 32px; font-size: 0.8rem; flex-shrink: 0;">
|
||||
#8
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold text-navy">Wycieczka #8: Klasyczne Włochy (Maj 2026)</div>
|
||||
<small class="text-muted"><i class='bx bx-calendar'></i> Zrealizowana pomyślnie</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center text-white fw-bold" style="width: 32px; height: 32px; background: linear-gradient(135deg, var(--primary) 0%, #767bf7 100%); font-size: 0.78rem; flex-shrink: 0;">
|
||||
OK
|
||||
</div>
|
||||
<div>
|
||||
<a href="pilot-profile.php" class="fw-bold text-navy text-decoration-none">Oskar Kaczmarek</a>
|
||||
<small class="text-muted d-block" style="font-size: 0.72rem;">★ 4.9 • Warszawa</small>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<strong class="text-navy">500 PLN</strong> <small class="text-muted">/ dzień netto</small>
|
||||
<div class="text-success small" style="font-size: 0.7rem;">Rozliczona i opłacona</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="badge bg-primary-subtle text-primary fw-bold px-3 py-1 rounded-pill d-inline-flex align-items-center gap-1" style="font-size: 0.74rem;">
|
||||
<i class='bx bxs-star text-warning'></i> Wystawiono referencję (5.0 ★)
|
||||
</span>
|
||||
<small class="text-muted d-block mt-1" style="font-size: 0.7rem;">Pilot dodał oficjalną odpowiedź</small>
|
||||
</td>
|
||||
<td>
|
||||
<span class="text-muted small">Maj 2026</span>
|
||||
</td>
|
||||
<td class="text-end" style="padding: 14px 18px;">
|
||||
<a href="pilot-profile.php#opinie" class="btn btn-sm btn-outline-primary" style="font-size: 0.76rem;">
|
||||
Zobacz opinię →
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div><!-- /.container-xxl -->
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const filterButtons = document.querySelectorAll('#inquiryStatusFilters .filter-tab');
|
||||
const rows = document.querySelectorAll('.inquiry-row');
|
||||
|
||||
filterButtons.forEach(btn => {
|
||||
btn.addEventListener('click', function() {
|
||||
filterButtons.forEach(b => {
|
||||
b.classList.remove('btn-primary', 'active');
|
||||
b.classList.add('btn-light', 'border');
|
||||
});
|
||||
this.classList.remove('btn-light', 'border');
|
||||
this.classList.add('btn-primary', 'active');
|
||||
|
||||
const filter = this.getAttribute('data-filter');
|
||||
|
||||
rows.forEach(row => {
|
||||
const status = row.getAttribute('data-status');
|
||||
if (filter === 'all' || status === filter) {
|
||||
row.style.display = '';
|
||||
} else {
|
||||
row.style.display = 'none';
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<?php include __DIR__ . '/footer.php'; ?>
|
||||
@@ -0,0 +1,43 @@
|
||||
<?php
|
||||
$currentPage = basename($_SERVER['PHP_SELF']);
|
||||
?>
|
||||
<aside id="layout-menu" class="layout-menu-horizontal menu-horizontal menu bg-white flex-grow-0 border-bottom" style="position: relative; top: 0; padding-top: 0; z-index: 1010; border-color: var(--border-color) !important;">
|
||||
<div class="container-xxl d-flex h-100">
|
||||
<ul class="menu-inner py-1">
|
||||
|
||||
<!-- Główny katalog -->
|
||||
<li class="menu-item <?= ($currentPage === 'index.php') ? 'active' : '' ?>">
|
||||
<a href="index.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-search"></i>
|
||||
<div data-i18n="Baza Pilotów">Katalog Pilotów</div>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<!-- Profil pilota -->
|
||||
<li class="menu-item <?= ($currentPage === 'pilot-profile.php' || $currentPage === 'pilot-reviews.php') ? 'active' : '' ?>">
|
||||
<a href="pilot-profile.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-user"></i>
|
||||
<div data-i18n="Profil Pilota">Profil: Oskar Kaczmarek</div>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<!-- Moje Zapytania i Rezerwacje -->
|
||||
<li class="menu-item <?= ($currentPage === 'inquiries.php') ? 'active' : '' ?>">
|
||||
<a href="inquiries.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-paper-plane"></i>
|
||||
<div data-i18n="Zapytania">Zapytania & Rezerwacje</div>
|
||||
<span class="badge rounded-pill bg-light text-primary border ms-2" style="font-size: 0.68rem;">3 aktywne</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<!-- Szkolenia i certyfikaty Superpilot Academy -->
|
||||
<li class="menu-item <?= ($currentPage === 'courses.php') ? 'active' : '' ?>">
|
||||
<a href="courses.php" class="menu-link">
|
||||
<i class="menu-icon tf-icons bx bx-award"></i>
|
||||
<div data-i18n="Szkolenia">Szkolenia & Certyfikaty</div>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</aside>
|
||||
@@ -0,0 +1,717 @@
|
||||
<?php
|
||||
$pageTitle = 'Superpilot - Profil Pilota: Oskar Kaczmarek';
|
||||
$enablePrototypeComments = true;
|
||||
include __DIR__ . '/header.php';
|
||||
|
||||
// Dane Oskara Kaczmarka w 100% spójne z aplikacją mobilną travelleader-mobile
|
||||
$startYear = 2019;
|
||||
$currentYear = (int)date('Y');
|
||||
$experienceYears = max(1, $currentYear - $startYear);
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y" style="padding-top: 1.25rem !important;">
|
||||
|
||||
<!-- Dyskretny powrót do listy -->
|
||||
<div class="mb-3">
|
||||
<a href="index.php" class="text-muted text-decoration-none small d-inline-flex align-items-center gap-1">
|
||||
<i class='bx bx-arrow-back'></i> Wróć do listy pilotów
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Główny Hero Profilu (Spokojny, uporządkowany design 2026) -->
|
||||
<div class="profile-desktop-hero">
|
||||
<div class="profile-hero-top">
|
||||
|
||||
<!-- Lewa strona Hero: Awatar, dane, ranga -->
|
||||
<div class="d-flex align-items-start gap-4">
|
||||
<div class="profile-avatar-large">
|
||||
OK
|
||||
<div class="large-verified-badge" title="Zweryfikowany profil w Superpilot Academy">
|
||||
<i class='bx bx-check'></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="d-flex align-items-center gap-2 mb-1 flex-wrap">
|
||||
<h2 class="profile-name">Oskar Kaczmarek</h2>
|
||||
<span class="profile-badge-available">
|
||||
<span class="status-dot"></span>
|
||||
Dostępny dla biur
|
||||
</span>
|
||||
<span class="pilot-academy-badge">
|
||||
<i class='bx bx-check-shield'></i> Superpilot Academy 2026
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="text-muted mb-2" style="font-size: 0.88rem;">
|
||||
<i class='bx bx-compass text-primary'></i> Pilot Wycieczek & Przewodnik
|
||||
</div>
|
||||
|
||||
<!-- Pasek kluczowych metadanych (Spójny z kartami index.php) -->
|
||||
<div class="profile-meta-row">
|
||||
<a href="#opinie" class="profile-meta-rating">
|
||||
<i class='bx bxs-star text-warning'></i>
|
||||
<span>4.9</span>
|
||||
<span class="text-muted fw-normal">(18 opinii)</span>
|
||||
</a>
|
||||
|
||||
<div class="profile-meta-item">
|
||||
<i class='bx bx-map-pin text-muted'></i>
|
||||
<span>Baza: <strong>Warszawa</strong> (Dojazd w całej Polsce)</span>
|
||||
</div>
|
||||
|
||||
<div class="profile-meta-item">
|
||||
<i class='bx bx-briefcase-alt text-muted'></i>
|
||||
<span>Staż: <strong><?= $experienceYears ?> lat</strong> (od <?= $startYear ?> r.)</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Prawa strona Hero: Główne akcje rezerwacji i kontaktu -->
|
||||
<div class="d-flex flex-column gap-2 text-end">
|
||||
<button type="button" class="btn btn-primary px-4 py-2 fw-semibold" style="font-size: 0.88rem; border-radius: var(--radius-sm);" onclick="openBookingModal('1', 'Oskar Kaczmarek', '16.09.2027 - 24.09.2027')">
|
||||
<i class='bx bx-calendar-plus me-1'></i> Zarezerwuj termin / Wyślij zapytanie
|
||||
</button>
|
||||
|
||||
<div class="d-flex gap-2 justify-content-end">
|
||||
<a href="tel:+48600123456" class="btn btn-outline-secondary btn-sm" style="font-size: 0.78rem;">
|
||||
<i class='bx bx-phone me-1'></i> +48 600 123 456
|
||||
</a>
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" style="font-size: 0.78rem;" onclick="this.classList.toggle('text-warning'); this.innerHTML = (this.classList.contains('text-warning') ? '<i class=\'bx bxs-bookmark me-1\'></i> Zapisano' : '<i class=\'bx bx-bookmark me-1\'></i> Zapisz');">
|
||||
<i class='bx bx-bookmark me-1'></i> Zapisz
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Pasek 3 spokojnych wskaźników jakości (Zgodnie z wytycznymi: bez zbędnego licznika zrealizowanych) -->
|
||||
<div class="profile-stats-strip">
|
||||
<div class="profile-stat-box">
|
||||
<div class="stat-val"><?= $experienceYears ?> lat doświadczenia</div>
|
||||
<div class="stat-lbl">Ciągła praktyka pilotażu tras objazdowych od <?= $startYear ?> r.</div>
|
||||
</div>
|
||||
<div class="profile-stat-box">
|
||||
<div class="stat-val text-success">100% dyspozycyjności</div>
|
||||
<div class="stat-lbl">Wszystkie potwierdzone zlecenia zrealizowane bez odwołań</div>
|
||||
</div>
|
||||
<div class="profile-stat-box">
|
||||
<div class="stat-val" style="color: var(--primary);">100% poleceń biur</div>
|
||||
<div class="stat-lbl">Każde biuro podróży deklaruje chęć ponownej współpracy</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Główny układ 2-kolumnowy (2/3 Zawartość merytoryczna + 1/3 Sticky Panel Rezerwacji i Kalendarza) -->
|
||||
<div class="row">
|
||||
|
||||
<!-- ================= LEWA KOLUMNA (2/3) ================= -->
|
||||
<div class="col-lg-8">
|
||||
|
||||
<!-- Karta 1: O mnie & profil zawodowy -->
|
||||
<div class="profile-section-card">
|
||||
<div class="profile-section-header">
|
||||
<h5 class="profile-section-title">
|
||||
<i class='bx bx-user'></i> O mnie i profil zawodowy
|
||||
</h5>
|
||||
<span class="badge bg-light text-muted border">Profil pilota</span>
|
||||
</div>
|
||||
<div class="profile-section-body">
|
||||
<p class="text-secondary mb-3" style="font-size: 0.9rem; line-height: 1.65;">
|
||||
Pasjonat kultury śródziemnomorskiej z wykształceniem historycznym (Uniwersytet Warszawski). Od <strong><?= $startYear ?> roku</strong> z sukcesami pilotuję wycieczki objazdowe po Włoszech, Hiszpanii i Bałkanach. Wyróżnia mnie wysokie opanowanie w sytuacjach kryzysowych (nagłe zmiany rozkładów, sytuacje medyczne, awarie autokarów), doskonały kontakt z grupą oraz płynna znajomość języka włoskiego i angielskiego.
|
||||
</p>
|
||||
<p class="text-secondary mb-3" style="font-size: 0.9rem; line-height: 1.65;">
|
||||
Jako absolwent <strong>Superpilot Academy 2026</strong> pracuję według rygorystycznych standardów logistycznych: bieżący kontakt z dyspozytornią biura, codzienne raportowanie statusu trasy, skrupulatne rozliczanie zaliczek dewizowych oraz dbałość o najwyższe oceny satysfakcji klientów końcowych.
|
||||
</p>
|
||||
|
||||
<div class="d-flex flex-wrap gap-2 pt-2 border-top">
|
||||
<span class="tech-tag"><i class='bx bx-check text-success me-1'></i> Wykształcenie historyczne (UW)</span>
|
||||
<span class="tech-tag"><i class='bx bx-check text-success me-1'></i> Doświadczenie w grupach autokarowych i lotniczych</span>
|
||||
<span class="tech-tag"><i class='bx bx-check text-success me-1'></i> Standardy rozliczeń dewizowych Travel Manager</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 2: Destynacje, Języki i Specjalizacje -->
|
||||
<div class="profile-section-card">
|
||||
<div class="profile-section-header">
|
||||
<h5 class="profile-section-title">
|
||||
<i class='bx bx-globe'></i> Destynacje, Języki & Specjalizacje
|
||||
</h5>
|
||||
</div>
|
||||
<div class="profile-section-body">
|
||||
|
||||
<!-- Destynacje (Spójne z tagami na liście ofert) -->
|
||||
<div class="mb-4">
|
||||
<div class="small fw-bold text-muted text-uppercase mb-2" style="letter-spacing: 0.03em;">Obsługiwane kraje i regiony:</div>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<span class="tech-tag primary-dest">🇮🇹 Włochy (Ekspert — Toskania, Rzym, Wenecja, Sycylia)</span>
|
||||
<span class="tech-tag primary-dest">🇬🇷 Grecja & Cyklady</span>
|
||||
<span class="tech-tag primary-dest">🇪🇸 Hiszpania & Andaluzja</span>
|
||||
<span class="tech-tag">🇭🇷 Chorwacja</span>
|
||||
<span class="tech-tag">🇳🇴 Norwegia (Fiordy)</span>
|
||||
<span class="tech-tag">🇦🇹 Austria</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Języki obce (Kompaktowe, proporcjonalne znaczniki) -->
|
||||
<div class="mb-4">
|
||||
<div class="small fw-bold text-muted text-uppercase mb-2" style="letter-spacing: 0.03em;">Znajomość języków obcych:</div>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<span class="tech-tag d-inline-flex align-items-center gap-2 py-1 px-3" style="font-size: 0.82rem;">
|
||||
<span>🇵🇱</span> <strong>Polski</strong> <span class="text-muted small">(ojczysty)</span>
|
||||
</span>
|
||||
<span class="tech-tag d-inline-flex align-items-center gap-2 py-1 px-3" style="font-size: 0.82rem;">
|
||||
<span>🇬🇧</span> <strong>Angielski</strong> <span class="badge bg-primary text-white" style="font-size: 0.65rem; padding: 2px 6px;">C1</span>
|
||||
</span>
|
||||
<span class="tech-tag d-inline-flex align-items-center gap-2 py-1 px-3" style="font-size: 0.82rem;">
|
||||
<span>🇮🇹</span> <strong>Włoski</strong> <span class="badge bg-primary text-white" style="font-size: 0.65rem; padding: 2px 6px;">B2</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Specjalizacje imprez -->
|
||||
<div class="mb-4">
|
||||
<div class="small fw-bold text-muted text-uppercase mb-2" style="letter-spacing: 0.03em;">Specjalizacje wycieczek:</div>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<span class="tech-tag"><i class='bx bx-bus me-1'></i> Wycieczki objazdowe</span>
|
||||
<span class="tech-tag"><i class='bx bx-walk me-1'></i> Trekking & góry</span>
|
||||
<span class="tech-tag"><i class='bx bx-buildings me-1'></i> Przewodnik miejski (Rzym, Florencja)</span>
|
||||
<span class="tech-tag"><i class='bx bx-book-open me-1'></i> Grupy młodzieżowe / szkolne</span>
|
||||
<span class="tech-tag"><i class='bx bx-diamond me-1'></i> Wyjazdy VIP / Incentive</span>
|
||||
<span class="tech-tag"><i class='bx bx-wine me-1'></i> Enoturystyka & kulinaria</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Certyfikaty i Uprawnienia -->
|
||||
<div>
|
||||
<div class="small fw-bold text-muted text-uppercase mb-2" style="letter-spacing: 0.03em;">Oficjalne certyfikaty i uprawnienia:</div>
|
||||
<div class="d-flex flex-column gap-2">
|
||||
<div class="p-3 rounded-3 border d-flex align-items-center justify-content-between" style="background: #f0fdf4;">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="rounded-circle bg-success text-white d-flex align-items-center justify-content-center" style="width: 38px; height: 38px; font-size: 1.2rem; flex-shrink: 0;">
|
||||
<i class='bx bx-badge-check'></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold text-dark" style="font-size: 0.88rem;">Superpilot Academy 2026 — Akredytacja Pilotażu Europy Południowej</div>
|
||||
<div class="text-muted" style="font-size: 0.74rem;">Certyfikat nr: <strong>SPA-2026-OK92</strong> • Standard obsługi grup autokarowych i lotniczych</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge bg-success" style="font-size: 0.7rem;">Zweryfikowany</span>
|
||||
</div>
|
||||
|
||||
<div class="p-3 rounded-3 border d-flex align-items-center justify-content-between" style="background: #f8fafc;">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="rounded-circle bg-primary text-white d-flex align-items-center justify-content-center" style="width: 38px; height: 38px; font-size: 1.15rem; flex-shrink: 0;">
|
||||
<i class='bx bx-plus-medical'></i>
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold text-dark" style="font-size: 0.88rem;">Kwalifikowana Pierwsza Pomoc (KPP)</div>
|
||||
<div class="text-muted" style="font-size: 0.74rem;">Uprawnienia ratownicze ważne do: <strong>04.2028 r.</strong></div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge bg-light text-dark border" style="font-size: 0.7rem;">Ważny</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 3: Autoprezentacja & Fotorelacje ze szlaków -->
|
||||
<div class="profile-section-card">
|
||||
<div class="profile-section-header">
|
||||
<h5 class="profile-section-title">
|
||||
<i class='bx bx-video'></i> Autoprezentacja Wideo & Fotorelacje
|
||||
</h5>
|
||||
<span class="badge bg-light text-muted border">Wideo 1:15 min</span>
|
||||
</div>
|
||||
<div class="profile-section-body">
|
||||
<p class="text-secondary small mb-3">
|
||||
Krótkie nagranie wideo przygotowane dla koordynatorów biur podróży: dykcja, kultura osobista oraz wypowiedzi w języku włoskim i angielskim.
|
||||
</p>
|
||||
|
||||
<!-- Wideo-wizytówka -->
|
||||
<div class="profile-video-box" onclick="openVideoModal('Oskar Kaczmarek', '1:15 min')">
|
||||
<div class="d-flex flex-column align-items-center text-center p-3">
|
||||
<div class="profile-video-play-btn mb-2">
|
||||
<i class='bx bx-play' style="margin-left: 3px;"></i>
|
||||
</div>
|
||||
<div class="fw-bold text-white mb-1" style="font-size: 0.95rem;">Oskar Kaczmarek — Autoprezentacja warsztatu pilota</div>
|
||||
<div class="text-white-50 small">Nagrano: Florencja / Rzym • Trasa objazdowa • 1:15 min</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Fotorelacje 4 miniatury ze szlaków -->
|
||||
<div class="d-flex justify-content-between align-items-center mt-3 mb-1">
|
||||
<div class="small fw-bold text-navy">Fotorelacje z tras i pracy z grupą:</div>
|
||||
<small class="text-muted">4 zdjęcia w galerii</small>
|
||||
</div>
|
||||
|
||||
<div class="profile-photos-grid">
|
||||
<div class="profile-photo-thumb" style="background: linear-gradient(135deg, #60a5fa, #3b82f6);" onclick="openPhotoLightbox('Florencja & Toskania — Grupa objazdowa Almatur')">
|
||||
<div class="text-center p-1">
|
||||
<i class='bx bx-camera fs-4'></i>
|
||||
<div class="small">Toskania</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="profile-photo-thumb" style="background: linear-gradient(135deg, #f59e0b, #d97706);" onclick="openPhotoLightbox('Rzym — Koloseum & Forum Romanum')">
|
||||
<div class="text-center p-1">
|
||||
<i class='bx bx-buildings fs-4'></i>
|
||||
<div class="small">Rzym</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="profile-photo-thumb" style="background: linear-gradient(135deg, #10b981, #059669);" onclick="openPhotoLightbox('Cyklady & Ateny — Rejs z grupą')">
|
||||
<div class="text-center p-1">
|
||||
<i class='bx bx-ship fs-4'></i>
|
||||
<div class="small">Grecja</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="profile-photo-thumb" style="background: linear-gradient(135deg, #8b5cf6, #6d28d9);" onclick="openPhotoLightbox('Andaluzja — Alhambra & Granada')">
|
||||
<div class="text-center p-1">
|
||||
<i class='bx bx-group fs-4'></i>
|
||||
<div class="small">Andaluzja</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karta 4: Opinie i Referencje od Biur Podróży -->
|
||||
<div class="profile-section-card" id="opinie">
|
||||
<div class="profile-section-header flex-wrap gap-2">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<i class='bx bxs-star text-warning fs-5'></i>
|
||||
<h5 class="profile-section-title mb-0">Opinie i Referencje od Biur Podróży</h5>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="pilot-reviews.php" class="btn btn-sm btn-outline-secondary" style="font-size: 0.78rem;">
|
||||
Wszystkie 18 opinii →
|
||||
</a>
|
||||
<button type="button" class="btn btn-sm btn-primary" style="font-size: 0.78rem;" data-bs-toggle="modal" data-bs-target="#newReviewModal">
|
||||
<i class='bx bx-edit-alt me-1'></i> Wystaw opinię po wycieczce
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="profile-section-body">
|
||||
|
||||
<!-- Rozbicie ocen -->
|
||||
<div class="rating-breakdown-card mb-4">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-md-4 text-center border-end">
|
||||
<div class="display-4 fw-bold text-navy mb-1" style="font-size: 2.75rem; line-height: 1;">4.9</div>
|
||||
<div class="text-warning fs-5 mb-1">
|
||||
<i class='bx bxs-star'></i><i class='bx bxs-star'></i><i class='bx bxs-star'></i><i class='bx bxs-star'></i><i class='bx bxs-star-half'></i>
|
||||
</div>
|
||||
<div class="text-muted small">na podstawie 18 ocen od 6 biur</div>
|
||||
<div class="badge bg-success-subtle text-success mt-2 rounded-pill px-3 py-1" style="font-size: 0.72rem;">
|
||||
100% poleceń na kolejne wyjazdy
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-8 ps-md-4 mt-3 mt-md-0">
|
||||
<div class="d-flex flex-column gap-2" style="font-size: 0.78rem;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="width: 30px;" class="fw-semibold">5 ★</span>
|
||||
<div class="progress flex-grow-1" style="height: 6px;">
|
||||
<div class="progress-bar bg-warning" style="width: 89%;"></div>
|
||||
</div>
|
||||
<span class="text-muted" style="width: 45px;">16 (89%)</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="width: 30px;" class="fw-semibold">4 ★</span>
|
||||
<div class="progress flex-grow-1" style="height: 6px;">
|
||||
<div class="progress-bar bg-warning" style="width: 11%;"></div>
|
||||
</div>
|
||||
<span class="text-muted" style="width: 45px;">2 (11%)</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="width: 30px;" class="fw-semibold">3 ★</span>
|
||||
<div class="progress flex-grow-1" style="height: 6px;">
|
||||
<div class="progress-bar bg-warning" style="width: 0%;"></div>
|
||||
</div>
|
||||
<span class="text-muted" style="width: 45px;">0</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-2 mt-3 pt-3 border-top text-center" style="font-size: 0.75rem;">
|
||||
<div class="col-4">
|
||||
<strong class="text-navy d-block">5.0 / 5.0</strong>
|
||||
<span class="text-muted">Punktualność</span>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<strong class="text-navy d-block">4.9 / 5.0</strong>
|
||||
<span class="text-muted">Kontakt z grupą</span>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<strong class="text-navy d-block">4.9 / 5.0</strong>
|
||||
<span class="text-muted">Język w trasie</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Lista recenzji biur (spójna w 100% z aplikacją mobilną) -->
|
||||
<div id="agencyReviewsList">
|
||||
|
||||
<!-- Opinia 1: Almatur (Z oficjalną odpowiedzią pilota) -->
|
||||
<div class="review-card-item">
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="review-agency-avatar">
|
||||
AL
|
||||
</div>
|
||||
<div>
|
||||
<h6 class="fw-bold mb-0 text-navy" style="font-size: 0.88rem;">Biuro Podróży Almatur</h6>
|
||||
<small class="text-muted" style="font-size: 0.72rem;">Wycieczka: Klasyczne Włochy • Maj 2026</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="profile-meta-rating" style="font-size: 0.75rem;">
|
||||
<i class='bx bxs-star text-warning'></i> 5.0 / 5.0
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="mb-2 text-secondary" style="font-size: 0.85rem; line-height: 1.5;">
|
||||
"Pan Oskar prowadził 8-dniowy objazd po Włoszech. Klienci byli zachwyceni jego wiedzą i empatią. Brak jakichkolwiek problemów organizacyjnych. Bardzo chętnie zarezerwujemy kolejne terminy na jesień."
|
||||
</p>
|
||||
|
||||
<!-- Oficjalna odpowiedź pilota (Z aplikacji mobilnej!) -->
|
||||
<div class="pilot-reply-box">
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<div class="d-flex align-items-center gap-1 text-primary fw-bold" style="font-size: 0.76rem;">
|
||||
<i class='bx bx-reply'></i> Oficjalna odpowiedź pilota (Oskar Kaczmarek)
|
||||
</div>
|
||||
<small class="text-muted" style="font-size: 0.7rem;">3 dni temu</small>
|
||||
</div>
|
||||
<p class="mb-0 text-secondary" style="font-size: 0.8rem; line-height: 1.45;">
|
||||
Dziękuję serdecznie za zaufanie! Współpraca z koordynatorem trasy i grupą układała się wzorowo. Do zobaczenia na kolejnych wyjazdach!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Opinia 2: Logos Tour Warszawa -->
|
||||
<div class="review-card-item">
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="review-agency-avatar" style="background: #e0f2fe; color: #0284c7;">
|
||||
LT
|
||||
</div>
|
||||
<div>
|
||||
<h6 class="fw-bold mb-0 text-navy" style="font-size: 0.88rem;">Logos Tour Warszawa</h6>
|
||||
<small class="text-muted" style="font-size: 0.72rem;">Wycieczka: Andaluzja Express • Kwiecień 2026</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="profile-meta-rating" style="font-size: 0.75rem;">
|
||||
<i class='bx bxs-star text-warning'></i> 5.0 / 5.0
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="mb-0 text-secondary" style="font-size: 0.85rem; line-height: 1.5;">
|
||||
"Znakomite przygotowanie merytoryczne. Świetny kontakt z hiszpańskimi przewodnikami lokalnymi. Rekomendujemy bez wahania."
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Opinia 3: Rainbow Tours -->
|
||||
<div class="review-card-item">
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="review-agency-avatar" style="background: #fef3c7; color: #b45309;">
|
||||
RT
|
||||
</div>
|
||||
<div>
|
||||
<h6 class="fw-bold mb-0 text-navy" style="font-size: 0.88rem;">Rainbow Tours</h6>
|
||||
<small class="text-muted" style="font-size: 0.72rem;">Wycieczka: Magia Toskanii • Wrzesień 2025</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="profile-meta-rating" style="font-size: 0.75rem;">
|
||||
<i class='bx bxs-star text-warning'></i> 4.8 / 5.0
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="mb-0 text-secondary" style="font-size: 0.85rem; line-height: 1.5;">
|
||||
"Wszystkie punkty programu zrealizowane punktualnie, świetna reakcja na deszczowy dzień we Florencji i szybka rearanżacja czasu wolnego."
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><!-- /.col-lg-8 -->
|
||||
|
||||
<!-- ================= PRAWA KOLUMNA: STICKY PANEL KALENDARZA & REZERWACJI (1/3) ================= -->
|
||||
<div class="col-lg-4">
|
||||
<div class="booking-sticky-panel">
|
||||
|
||||
<!-- Karta kalendarza dostępności (Spójna w 100% z availability.php pilota) -->
|
||||
<div class="calendar-widget-card">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div>
|
||||
<h6 class="fw-bold mb-0 text-navy" style="font-size: 0.92rem;">Kalendarz Dostępności</h6>
|
||||
<small class="text-muted" style="font-size: 0.72rem;">Stan na żywo z aplikacji pilota</small>
|
||||
</div>
|
||||
<span class="badge bg-success-subtle text-success border border-success-subtle rounded-pill px-2 py-1" style="font-size: 0.68rem;">
|
||||
Zsynchronizowany
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Nagłówek miesiąca -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-2 pb-2 border-bottom">
|
||||
<button class="btn btn-sm btn-light p-1 rounded-circle" type="button"><i class='bx bx-chevron-left'></i></button>
|
||||
<strong class="text-navy" style="font-size: 0.88rem;">Wrzesień 2027</strong>
|
||||
<button class="btn btn-sm btn-light p-1 rounded-circle" type="button"><i class='bx bx-chevron-right'></i></button>
|
||||
</div>
|
||||
|
||||
<!-- Siatka kalendarza -->
|
||||
<div class="sp-calendar-grid mb-3">
|
||||
<div class="sp-cal-header">Pn</div>
|
||||
<div class="sp-cal-header">Wt</div>
|
||||
<div class="sp-cal-header">Śr</div>
|
||||
<div class="sp-cal-header">Cz</div>
|
||||
<div class="sp-cal-header">Pt</div>
|
||||
<div class="sp-cal-header">Sb</div>
|
||||
<div class="sp-cal-header">Nd</div>
|
||||
|
||||
<!-- Dni sierpnia -->
|
||||
<div class="sp-cal-day other-month">30</div>
|
||||
<div class="sp-cal-day other-month">31</div>
|
||||
|
||||
<!-- 1-4.09: Urlop prywatny (zablokowany) -->
|
||||
<div class="sp-cal-day blocked" title="Urlop prywatny pilota">1</div>
|
||||
<div class="sp-cal-day blocked" title="Urlop prywatny pilota">2</div>
|
||||
<div class="sp-cal-day blocked" title="Urlop prywatny pilota">3</div>
|
||||
<div class="sp-cal-day blocked" title="Urlop prywatny pilota">4</div>
|
||||
|
||||
<!-- 5-15.09: Wolne terminy dla biur -->
|
||||
<div class="sp-cal-day free" data-day="5" title="Wolny termin (5.09)">5 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="6" title="Wolny termin (6.09)">6 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="7" title="Wolny termin (7.09)">7 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="8" title="Wolny termin (8.09)">8 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="9" title="Wolny termin (9.09)">9 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="10" title="Wolny termin (10.09)">10 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="11" title="Wolny termin (11.09)">11 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="12" title="Wolny termin (12.09)">12 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="13" title="Wolny termin (13.09)">13 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="14" title="Wolny termin (14.09)">14 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="15" title="Wolny termin (15.09)">15 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
|
||||
<!-- 16-24.09: Wycieczka potwierdzona (#12 oskar prod) -->
|
||||
<div class="sp-cal-day trip" title="Zajęte: Wycieczka #12 oskar prod">16 <span class="sp-cal-dot" style="background:#5c60f5;"></span></div>
|
||||
<div class="sp-cal-day trip" title="Zajęte: Wycieczka #12 oskar prod">17 <span class="sp-cal-dot" style="background:#5c60f5;"></span></div>
|
||||
<div class="sp-cal-day trip" title="Zajęte: Wycieczka #12 oskar prod">18 <span class="sp-cal-dot" style="background:#5c60f5;"></span></div>
|
||||
<div class="sp-cal-day trip" title="Zajęte: Wycieczka #12 oskar prod">19 <span class="sp-cal-dot" style="background:#5c60f5;"></span></div>
|
||||
<div class="sp-cal-day trip" title="Zajęte: Wycieczka #12 oskar prod">20 <span class="sp-cal-dot" style="background:#5c60f5;"></span></div>
|
||||
<div class="sp-cal-day trip" title="Zajęte: Wycieczka #12 oskar prod">21 <span class="sp-cal-dot" style="background:#5c60f5;"></span></div>
|
||||
<div class="sp-cal-day trip" title="Zajęte: Wycieczka #12 oskar prod">22 <span class="sp-cal-dot" style="background:#5c60f5;"></span></div>
|
||||
<div class="sp-cal-day trip" title="Zajęte: Wycieczka #12 oskar prod">23 <span class="sp-cal-dot" style="background:#5c60f5;"></span></div>
|
||||
<div class="sp-cal-day trip" title="Zajęte: Wycieczka #12 oskar prod">24 <span class="sp-cal-dot" style="background:#5c60f5;"></span></div>
|
||||
|
||||
<!-- 25-30.09: Wolne -->
|
||||
<div class="sp-cal-day free" data-day="25" title="Wolny termin (25.09)">25 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="26" title="Wolny termin (26.09)">26 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="27" title="Wolny termin (27.09)">27 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="28" title="Wolny termin (28.09)">28 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="29" title="Wolny termin (29.09)">29 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
<div class="sp-cal-day free" data-day="30" title="Wolny termin (30.09)">30 <span class="sp-cal-dot" style="background:#10b981;"></span></div>
|
||||
</div>
|
||||
|
||||
<!-- Legenda -->
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap gap-2 pt-2 border-top small" style="font-size: 0.72rem;">
|
||||
<span class="d-flex align-items-center gap-1">
|
||||
<span style="width:7px; height:7px; background:#10b981; border-radius:50%;"></span> Wolny termin
|
||||
</span>
|
||||
<span class="d-flex align-items-center gap-1">
|
||||
<span style="width:7px; height:7px; background:#5c60f5; border-radius:50%;"></span> Wycieczka potwierdzona
|
||||
</span>
|
||||
<span class="d-flex align-items-center gap-1 text-muted">
|
||||
<span style="width:7px; height:7px; background:#cbd5e1; border-radius:50%;"></span> Urlop
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="mt-3 p-2 rounded-2 bg-light text-muted small" style="font-size: 0.75rem;">
|
||||
<i class='bx bx-pointer me-1 text-primary'></i> Wybór: <strong id="calSelectedRange" class="text-dark">Kliknij zielony dzień, aby wybrać termin</strong>
|
||||
</div>
|
||||
|
||||
<!-- Główny przycisk rezerwacji pod kalendarzem -->
|
||||
<button type="button" id="btnBookFromCalendar" class="btn btn-primary w-100 py-2 mt-3 fw-semibold d-flex align-items-center justify-content-center gap-2" style="font-size: 0.88rem; border-radius: var(--radius-sm);" onclick="openBookingModal('1', 'Oskar Kaczmarek', window.selectedProfileDates || '16.09.2027 - 24.09.2027')">
|
||||
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin / Wyślij zapytanie
|
||||
</button>
|
||||
|
||||
<div class="text-center mt-2 text-muted" style="font-size: 0.72rem;">
|
||||
Powiadomienie PUSH trafi bezpośrednio do aplikacji pilota
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div><!-- /.col-lg-4 -->
|
||||
|
||||
</div><!-- /.row -->
|
||||
|
||||
</div><!-- /.container-xxl -->
|
||||
|
||||
<!-- Modal Wystawienia Nowej Opinii po Wycieczce (Zgodny ze stonowanym designem) -->
|
||||
<div class="modal fade" id="newReviewModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content border-0 shadow-lg" style="border-radius: var(--radius-md);">
|
||||
<div class="modal-header bg-white border-bottom py-3">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<i class='bx bxs-star text-warning fs-4'></i>
|
||||
<div>
|
||||
<h5 class="modal-title fw-bold mb-0 text-navy" style="font-size: 1.05rem;">Wystaw Opinię i Referencję dla Pilota</h5>
|
||||
<small class="text-muted" style="font-size: 0.76rem;">Ocena trafi do profilu pilota i aplikacji mobilnej</small>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
|
||||
<form id="addReviewForm">
|
||||
<div class="modal-body p-4">
|
||||
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<label class="form-label fw-bold small text-muted">Wycieczka z bazy biura:</label>
|
||||
<select class="form-select" required>
|
||||
<option value="">Wybierz zakończoną wycieczkę...</option>
|
||||
<option value="12" selected>Wycieczka #12: Klasyczne Włochy (Almatur)</option>
|
||||
<option value="8">Wycieczka #8: Toskania & Rzym (Maj 2026)</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label fw-bold small text-muted">Ocena ogólna:</label>
|
||||
<select class="form-select fw-bold text-warning" required>
|
||||
<option value="5" selected>★★★★★ 5.0 — Rewelacyjny (Pełna rekomendacja)</option>
|
||||
<option value="4">★★★★☆ 4.0 — Bardzo dobry</option>
|
||||
<option value="3">★★★☆☆ 3.0 — Przeciętny</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Oceny cząstkowe -->
|
||||
<div class="col-12">
|
||||
<label class="form-label fw-bold small text-muted">Oceny cząstkowe:</label>
|
||||
<div class="row g-2">
|
||||
<div class="col-md-4">
|
||||
<div class="p-2 border rounded bg-light text-center">
|
||||
<div class="small fw-semibold text-dark">Punktualność</div>
|
||||
<div class="text-warning fs-5">★★★★★</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="p-2 border rounded bg-light text-center">
|
||||
<div class="small fw-semibold text-dark">Kontakt z grupą</div>
|
||||
<div class="text-warning fs-5">★★★★★</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="p-2 border rounded bg-light text-center">
|
||||
<div class="small fw-semibold text-dark">Radzenie w kryzysie</div>
|
||||
<div class="text-warning fs-5">★★★★★</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<label class="form-label fw-bold small text-muted">Treść referencji / recenzji:</label>
|
||||
<textarea class="form-control" rows="4" placeholder="Opisz jak pilot poradził sobie z trasą, grupą i programem..." required>Pan Oskar doskonale poprowadził trasę po Włoszech. Bardzo wysoka kultura osobista i biegły język włoski rozwiązały problem z opóźnieniem autokaru. Turyści zachwyceni.</textarea>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="recommendCheck" checked>
|
||||
<label class="form-check-label fw-bold small text-dark" for="recommendCheck">
|
||||
Polecam tego pilota innym koordynatorom biur podróży
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer bg-light px-4 py-3 border-top">
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Anuluj</button>
|
||||
<button type="submit" class="btn btn-primary fw-semibold px-4">
|
||||
<i class='bx bx-check me-1'></i> Opublikuj oficjalną referencję
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function openVideoModal(pilotName, duration) {
|
||||
const modalEl = document.getElementById('videoPitchModal');
|
||||
if (modalEl) {
|
||||
if (pilotName && document.getElementById('videoModalPilotName')) {
|
||||
document.getElementById('videoModalPilotName').innerText = pilotName;
|
||||
}
|
||||
if (duration && document.getElementById('videoModalLength')) {
|
||||
document.getElementById('videoModalLength').innerText = '(' + duration + ')';
|
||||
}
|
||||
const modal = new bootstrap.Modal(modalEl);
|
||||
modal.show();
|
||||
}
|
||||
}
|
||||
|
||||
function openPhotoLightbox(caption) {
|
||||
const modalEl = document.getElementById('photoLightboxModal');
|
||||
if (modalEl) {
|
||||
if (document.getElementById('lightboxTitle')) document.getElementById('lightboxTitle').innerText = caption;
|
||||
if (document.getElementById('lightboxSubtext')) document.getElementById('lightboxSubtext').innerText = caption;
|
||||
const modal = new bootstrap.Modal(modalEl);
|
||||
modal.show();
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
window.selectedProfileDates = '16.09.2027 - 24.09.2027';
|
||||
|
||||
// Interakcja z dniami kalendarza
|
||||
const calDays = document.querySelectorAll('.sp-cal-day.free');
|
||||
const selectedRangeSpan = document.getElementById('calSelectedRange');
|
||||
|
||||
calDays.forEach(day => {
|
||||
day.addEventListener('click', function() {
|
||||
calDays.forEach(d => d.classList.remove('selected'));
|
||||
this.classList.add('selected');
|
||||
const dayNum = parseInt(this.getAttribute('data-day'), 10);
|
||||
const dayFormatted = (dayNum < 10 ? '0' + dayNum : dayNum) + '.09.2027';
|
||||
window.selectedProfileDates = dayFormatted;
|
||||
if (selectedRangeSpan) {
|
||||
selectedRangeSpan.innerText = dayFormatted + ' (Termin wolny - gotowy do zapytania)';
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Obsługa formularza wystawienia opinii
|
||||
const reviewForm = document.getElementById('addReviewForm');
|
||||
if (reviewForm) {
|
||||
reviewForm.addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
const modalEl = document.getElementById('newReviewModal');
|
||||
const modal = bootstrap.Modal.getInstance(modalEl);
|
||||
if (modal) modal.hide();
|
||||
|
||||
if (typeof showToastNotification === 'function') {
|
||||
showToastNotification('Referencja opublikowana!', 'Dziękujemy. Twoja opinia została dodana do profilu pilota i rankingu Superpilot.');
|
||||
} else {
|
||||
alert('Dziękujemy! Twoja opinia została opublikowana.');
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<?php include __DIR__ . '/footer.php'; ?>
|
||||
@@ -0,0 +1,316 @@
|
||||
<?php
|
||||
$pageTitle = 'Superpilot - Opinie i Referencje Biur Podróży: Oskar Kaczmarek';
|
||||
$enablePrototypeComments = true;
|
||||
include __DIR__ . '/header.php';
|
||||
?>
|
||||
|
||||
<div class="container-xxl flex-grow-1 container-p-y" style="padding-top: 1.5rem !important;">
|
||||
|
||||
<!-- Pasek powrotu i akcje -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol class="breadcrumb mb-0" style="font-size: 0.8rem;">
|
||||
<li class="breadcrumb-item"><a href="index.php" class="text-muted"><i class='bx bx-arrow-back'></i> Katalog Pilotów</a></li>
|
||||
<li class="breadcrumb-item"><a href="pilot-profile.php" class="text-muted">Oskar Kaczmarek</a></li>
|
||||
<li class="breadcrumb-item active text-primary fw-bold" aria-current="page">Opinie i Referencje Biur</li>
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="../travelleader-mobile/profile-reviews.php" target="_blank" class="btn btn-sm btn-outline-secondary d-inline-flex align-items-center gap-1" style="font-size: 0.78rem;">
|
||||
<i class='bx bx-mobile'></i> Zobacz w aplikacji mobilnej pilota <i class='bx bx-link-external' style="font-size: 0.7rem;"></i>
|
||||
</a>
|
||||
<button type="button" class="btn btn-sm btn-superpilot" onclick="openBookingModal('1', 'Oskar Kaczmarek', '16.09.2027 - 24.09.2027')">
|
||||
<i class='bx bx-calendar-plus'></i> Zarezerwuj pilota
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Nagłówek i Karta Pilota -->
|
||||
<div class="card border-0 shadow-sm mb-4" style="border-radius: var(--sp-radius-md);">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap gap-3">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="rounded-3 d-flex align-items-center justify-content-center text-white fw-bold shadow-sm" style="width: 58px; height: 58px; background: linear-gradient(135deg, #4f46e5, #7c3aed); font-size: 1.5rem;">
|
||||
OK
|
||||
</div>
|
||||
<div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<h4 class="fw-bold mb-0 text-navy">Oskar Kaczmarek — Opinie Biur Podróży</h4>
|
||||
<span class="badge bg-success-subtle text-success fw-bold">Superpilot Verified</span>
|
||||
</div>
|
||||
<small class="text-muted">Wszystkie referencje wystawione przez zweryfikowanych koordynatorów w ekosystemie TravelManager i PrzezMorze</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<button type="button" class="btn btn-warning fw-bold text-dark px-3 py-2" data-bs-toggle="modal" data-bs-target="#newReviewModal">
|
||||
<i class='bx bx-edit-alt'></i> + Wystaw nową opinię
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Rating Summary Hero & Rozbicie gwiazdek -->
|
||||
<div class="row g-4 mb-4">
|
||||
|
||||
<div class="col-lg-4">
|
||||
<div class="card border-0 shadow-sm h-100 text-center p-4" style="border-radius: var(--sp-radius-md);">
|
||||
<div class="display-3 fw-bold text-navy mb-1" style="font-size: 3.5rem; line-height: 1;">4.9</div>
|
||||
<div class="text-warning fs-3 mb-2">
|
||||
<i class='bx bxs-star'></i><i class='bx bxs-star'></i><i class='bx bxs-star'></i><i class='bx bxs-star'></i><i class='bx bxs-star-half'></i>
|
||||
</div>
|
||||
<div class="text-muted small mb-3">Średnia z 18 referencji od 6 biur podróży</div>
|
||||
|
||||
<div class="badge bg-success-subtle text-success p-2 rounded-pill fw-bold mb-3" style="font-size: 0.8rem;">
|
||||
<i class='bx bx-check-shield'></i> 100% biur poleca pilota na kolejne wycieczki
|
||||
</div>
|
||||
|
||||
<div class="pt-3 border-top text-start text-muted small">
|
||||
<div class="d-flex justify-content-between mb-1">
|
||||
<span>Almatur:</span> <strong class="text-dark">5.0 ★ (8 wycieczek)</strong>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between mb-1">
|
||||
<span>Logos Tour:</span> <strong class="text-dark">5.0 ★ (4 wycieczki)</strong>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between">
|
||||
<span>Rainbow:</span> <strong class="text-dark">4.8 ★ (6 wycieczek)</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-8">
|
||||
<div class="card border-0 shadow-sm h-100 p-4" style="border-radius: var(--sp-radius-md);">
|
||||
<h6 class="fw-bold text-navy mb-3">Szczegółowy rozkład ocen i kategorii:</h6>
|
||||
|
||||
<!-- Słupki gwiazdek -->
|
||||
<div class="d-flex flex-column gap-2 mb-4" style="font-size: 0.84rem;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="width: 35px;" class="fw-semibold">5 ★</span>
|
||||
<div class="progress flex-grow-1" style="height: 10px;">
|
||||
<div class="progress-bar bg-warning" style="width: 89%;"></div>
|
||||
</div>
|
||||
<span class="text-muted" style="width: 70px;">16 opinii (89%)</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="width: 35px;" class="fw-semibold">4 ★</span>
|
||||
<div class="progress flex-grow-1" style="height: 10px;">
|
||||
<div class="progress-bar bg-warning" style="width: 11%;"></div>
|
||||
</div>
|
||||
<span class="text-muted" style="width: 70px;">2 opinie (11%)</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="width: 35px;" class="fw-semibold">3 ★</span>
|
||||
<div class="progress flex-grow-1" style="height: 10px;">
|
||||
<div class="progress-bar bg-warning" style="width: 0%;"></div>
|
||||
</div>
|
||||
<span class="text-muted" style="width: 70px;">0 opinii</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 4 kluczowe wymiary oceny -->
|
||||
<div class="row g-3 pt-3 border-top">
|
||||
<div class="col-md-3 col-6">
|
||||
<div class="p-3 rounded-3 bg-light text-center">
|
||||
<div class="text-warning fs-5 fw-bold">5.0 ★</div>
|
||||
<small class="text-muted d-block mt-1">Punktualność</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6">
|
||||
<div class="p-3 rounded-3 bg-light text-center">
|
||||
<div class="text-warning fs-5 fw-bold">4.9 ★</div>
|
||||
<small class="text-muted d-block mt-1">Kontakt z grupą</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6">
|
||||
<div class="p-3 rounded-3 bg-light text-center">
|
||||
<div class="text-warning fs-5 fw-bold">4.9 ★</div>
|
||||
<small class="text-muted d-block mt-1">Zarządzanie kryzysem</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-6">
|
||||
<div class="p-3 rounded-3 bg-light text-center">
|
||||
<div class="text-warning fs-5 fw-bold">5.0 ★</div>
|
||||
<small class="text-muted d-block mt-1">Języki w hotelach</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Filtry destynacji opinii -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
|
||||
<div class="d-flex gap-2">
|
||||
<button type="button" class="btn btn-sm btn-primary">Wszystkie opinie (18)</button>
|
||||
<button type="button" class="btn btn-sm btn-outline-secondary">🇮🇹 Włochy (12)</button>
|
||||
<button type="button" class="btn btn-sm btn-outline-secondary">🇪🇸 Hiszpania (4)</button>
|
||||
<button type="button" class="btn btn-sm btn-outline-secondary">🇬🇷 Grecja (2)</button>
|
||||
</div>
|
||||
<small class="text-muted">Sortowanie: Najnowsze opinie</small>
|
||||
</div>
|
||||
|
||||
<!-- Lista opinii biur podróży -->
|
||||
<div id="agencyReviewsList">
|
||||
|
||||
<!-- Recenzja 1: Almatur -->
|
||||
<div class="review-card-item">
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="review-agency-avatar">
|
||||
AL
|
||||
</div>
|
||||
<div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<h6 class="fw-bold mb-0 text-navy">Biuro Podróży Almatur</h6>
|
||||
<span class="badge bg-label-primary small">Zweryfikowane zlecenie #12</span>
|
||||
</div>
|
||||
<small class="text-muted">Wycieczka: Klasyczne Włochy (8 dni) • Realizacja: Maj 2026 • Koordynator: Tomasz W.</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge bg-warning-subtle text-warning fw-bold px-3 py-2 rounded-pill fs-6">
|
||||
<i class='bx bxs-star'></i> 5.0 / 5.0
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="mb-3 text-secondary" style="font-size: 0.92rem; line-height: 1.55;">
|
||||
"Pan Oskar prowadził 8-dniowy objazd po Włoszech. Klienci byli zachwyceni jego wiedzą i empatią. Brak jakichkolwiek problemów organizacyjnych. Doskonała reakcja w trakcie korka na autostradzie pod Bolonią — natychmiast skontaktował się z restauracją i przesunął kolację bez utraty komfortu turystów. Bardzo chętnie zarezerwujemy kolejne terminy na jesień."
|
||||
</p>
|
||||
|
||||
<!-- Oficjalna odpowiedź pilota -->
|
||||
<div class="pilot-reply-box">
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<div class="d-flex align-items-center gap-1 text-primary fw-bold" style="font-size: 0.8rem;">
|
||||
<i class='bx bx-reply fs-5'></i> Oficjalna odpowiedź pilota (Oskar Kaczmarek)
|
||||
</div>
|
||||
<small class="text-muted">3 dni temu z aplikacji mobilnej</small>
|
||||
</div>
|
||||
<p class="mb-0 text-secondary" style="font-size: 0.84rem; line-height: 1.45;">
|
||||
Dziękuję serdecznie za zaufanie! Współpraca z koordynatorem trasy i grupą układała się wzorowo. Do zobaczenia na kolejnych wyjazdach!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Recenzja 2: Logos Tour -->
|
||||
<div class="review-card-item">
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="review-agency-avatar" style="background: #e0f2fe; color: #0284c7;">
|
||||
LT
|
||||
</div>
|
||||
<div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<h6 class="fw-bold mb-0 text-navy">Logos Tour Warszawa</h6>
|
||||
<span class="badge bg-label-info small">Zweryfikowane zlecenie</span>
|
||||
</div>
|
||||
<small class="text-muted">Wycieczka: Andaluzja Express • Realizacja: Kwiecień 2026</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge bg-warning-subtle text-warning fw-bold px-3 py-2 rounded-pill fs-6">
|
||||
<i class='bx bxs-star'></i> 5.0 / 5.0
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="mb-0 text-secondary" style="font-size: 0.92rem; line-height: 1.55;">
|
||||
"Znakomite przygotowanie merytoryczne. Świetny kontakt z hiszpańskimi przewodnikami lokalnymi. Oskar potrafi utrzymać dyscyplinę czasową w grupie 45 osób w sposób całkowicie bezstresowy. Rekomendujemy bez wahania."
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Recenzja 3: Rainbow Tours -->
|
||||
<div class="review-card-item">
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="review-agency-avatar" style="background: #fef3c7; color: #b45309;">
|
||||
RT
|
||||
</div>
|
||||
<div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<h6 class="fw-bold mb-0 text-navy">Rainbow Tours</h6>
|
||||
<span class="badge bg-label-warning small">Zweryfikowane zlecenie</span>
|
||||
</div>
|
||||
<small class="text-muted">Wycieczka: Magia Toskanii • Realizacja: Wrzesień 2025</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge bg-warning-subtle text-warning fw-bold px-3 py-2 rounded-pill fs-6">
|
||||
<i class='bx bxs-star'></i> 4.8 / 5.0
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="mb-0 text-secondary" style="font-size: 0.92rem; line-height: 1.55;">
|
||||
"Wszystkie punkty programu zrealizowane punktualnie, świetna reakcja na deszczowy dzień we Florencji i szybka rearanżacja czasu wolnego. Jeden z najbardziej profesjonalnych pilotów w naszej bazie."
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div><!-- /.container-xxl -->
|
||||
|
||||
<!-- Modal dodania opinii -->
|
||||
<div class="modal fade" id="newReviewModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content border-0 shadow-lg" style="border-radius: var(--sp-radius-md);">
|
||||
<div class="modal-header bg-warning text-dark">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<i class='bx bxs-star fs-3'></i>
|
||||
<div>
|
||||
<h5 class="modal-title fw-bold mb-0">Wystaw Opinię i Referencję dla Pilota</h5>
|
||||
<small class="text-dark-50" style="font-size: 0.76rem;">Ocena zostanie uwzględniona w rankingu Superpilot i trafi do aplikacji pilota</small>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
|
||||
<form id="addReviewForm">
|
||||
<div class="modal-body p-4">
|
||||
<div class="row g-3">
|
||||
<div class="col-md-6">
|
||||
<label class="form-label fw-bold small text-muted">Wycieczka z bazy biura:</label>
|
||||
<select class="form-select" required>
|
||||
<option value="">Wybierz zakończoną wycieczkę...</option>
|
||||
<option value="12" selected>Wycieczka #12: Klasyczne Włochy (Almatur)</option>
|
||||
<option value="8">Wycieczka #8: Toskania & Rzym (Maj 2026)</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<label class="form-label fw-bold small text-muted">Ocena ogólna:</label>
|
||||
<select class="form-select fw-bold text-warning" required>
|
||||
<option value="5" selected>★★★★★ 5.0 — Rewelacyjny (Pełna rekomendacja)</option>
|
||||
<option value="4">★★★★☆ 4.0 — Bardzo dobry</option>
|
||||
<option value="3">★★★☆☆ 3.0 — Przeciętny</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<label class="form-label fw-bold small text-muted">Treść referencji / recenzji:</label>
|
||||
<textarea class="form-control" rows="4" placeholder="Opisz jak pilot poradził sobie z trasą, grupą i programem..." required>Wzorowa realizacja wyjazdu. Pilot doskonale poradził sobie ze zmianą harmonogramu z powodu pogody. Grupa była zachwycona. Zdecydowanie polecamy!</textarea>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="recommendCheck" checked>
|
||||
<label class="form-check-label fw-bold small" for="recommendCheck">
|
||||
Polecam tego pilota innym koordynatorom biur podróży
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer bg-light px-4 py-3 border-top">
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Anuluj</button>
|
||||
<button type="submit" class="btn btn-warning fw-bold px-4">
|
||||
<i class='bx bx-check'></i> Opublikuj oficjalną referencję
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php include __DIR__ . '/footer.php'; ?>
|
||||
@@ -0,0 +1,138 @@
|
||||
<!-- Modal Pilnego Zastępstwa SOS -->
|
||||
<div class="modal fade" id="sosModal" tabindex="-1" aria-labelledby="sosModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content border-0 shadow-lg" style="border-radius: var(--sp-radius-md); overflow: hidden;">
|
||||
|
||||
<div class="modal-header text-white" style="background: linear-gradient(135deg, #ef4444 0%, #b91c1c 100%);">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle bg-white text-danger d-flex align-items-center justify-content-center" style="width: 40px; height: 40px; font-size: 1.4rem;">
|
||||
<i class='bx bxs-alarm-exclamation'></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="modal-title fw-bold text-white mb-0" id="sosModalLabel">🚨 Tryb Awaryjny: Pilne Zastępstwo SOS</h5>
|
||||
<small class="text-white-50" style="font-size: 0.76rem;">Pilot zrezygnował w ostatniej chwili? Znajdź natychmiastowe zastępstwo w 15 minut</small>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body p-4">
|
||||
|
||||
<!-- Kryteria nagłego wyjazdu -->
|
||||
<form id="sosRequestForm">
|
||||
<div class="row g-3 mb-4">
|
||||
<div class="col-md-5">
|
||||
<label class="form-label fw-bold small text-muted">Kierunek wycieczki</label>
|
||||
<select class="form-select fw-semibold" id="sosCountrySelect">
|
||||
<option value="Włochy" selected>🇮🇹 Włochy (Objazdówka / Rzym)</option>
|
||||
<option value="Grecja">🇬🇷 Grecja (Cyklady / Peloponez)</option>
|
||||
<option value="Hiszpania">🇪🇸 Hiszpania (Andaluzja / Barcelona)</option>
|
||||
<option value="Chorwacja">🇭🇷 Chorwacja (Istria / Dalmacja)</option>
|
||||
<option value="Norwegia">🇳🇴 Norwegia (Fiordy)</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<label class="form-label fw-bold small text-muted">Kiedy rusza autokar / lot?</label>
|
||||
<select class="form-select fw-semibold" id="sosTimeUrgency">
|
||||
<option value="24h" selected>⚡ W ciągu 24h (Dziś w nocy / Jutro rano)</option>
|
||||
<option value="48h">⏱️ W ciągu 48h</option>
|
||||
<option value="72h">📅 W ciągu 3 dni</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<label class="form-label fw-bold small text-muted">Miejsce zbiórki</label>
|
||||
<input type="text" class="form-control fw-semibold" value="Warszawa / Katowice">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Lista pilotów w trybie gotowości od zaraz (Standby Ready) -->
|
||||
<div class="mb-3">
|
||||
<div class="d-flex justify-content-between align-items-center mb-2">
|
||||
<h6 class="fw-bold mb-0 text-navy" style="font-size: 0.9rem;">Piloci dyżurujący z natychmiastową dyspozycyjnością (4 dostępnych):</h6>
|
||||
<span class="badge bg-success-subtle text-success" style="font-size: 0.72rem;">🟢 Gotowi do spakowania w 2h</span>
|
||||
</div>
|
||||
|
||||
<!-- Pilot 1: Oskar Kaczmarek (Spójny) -->
|
||||
<div class="card border mb-2 p-3 shadow-none hover-border-primary" style="background: #ffffff; border-radius: 10px;">
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap gap-2">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="rounded-3 d-flex align-items-center justify-content-center text-white fw-bold" style="width: 44px; height: 44px; background: linear-gradient(135deg, #4f46e5, #7c3aed); font-size: 1.1rem;">
|
||||
OK
|
||||
</div>
|
||||
<div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<h6 class="fw-bold mb-0 text-navy" style="font-size: 0.9rem;">Oskar Kaczmarek</h6>
|
||||
<span class="badge bg-success" style="font-size: 0.65rem;">Superpilot Verified</span>
|
||||
<span class="text-warning small fw-bold"><i class='bx bxs-star'></i> 4.9 (18 opinii)</span>
|
||||
</div>
|
||||
<small class="text-muted" style="font-size: 0.75rem;">Specjalizacja: Włochy (Ekspert) • Języki: Włoski (B2), Angielski (C1) • Paszport i uprawnienia aktualne</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="tel:+48600123456" class="btn btn-sm btn-outline-success fw-bold d-flex align-items-center gap-1" style="font-size: 0.78rem;">
|
||||
<i class='bx bx-phone-call'></i> Zadzwoń: 600 123 456
|
||||
</a>
|
||||
<button type="button" class="btn btn-sm btn-danger fw-bold" onclick="openBookingModal('1', 'Oskar Kaczmarek', 'Pilne zastępstwo SOS: Jutro rano')">
|
||||
<i class='bx bx-zap'></i> Wyślij SOS
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Pilot 2: Katarzyna Zielińska -->
|
||||
<div class="card border mb-2 p-3 shadow-none" style="background: #ffffff; border-radius: 10px;">
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap gap-2">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="rounded-3 d-flex align-items-center justify-content-center text-white fw-bold" style="width: 44px; height: 44px; background: linear-gradient(135deg, #0ea5e9, #0284c7); font-size: 1.1rem;">
|
||||
KZ
|
||||
</div>
|
||||
<div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<h6 class="fw-bold mb-0 text-navy" style="font-size: 0.9rem;">Katarzyna Zielińska</h6>
|
||||
<span class="badge bg-info-subtle text-info" style="font-size: 0.65rem;">Kwalifikowana Pierwsza Pomoc</span>
|
||||
<span class="text-warning small fw-bold"><i class='bx bxs-star'></i> 4.8 (15 opinii)</span>
|
||||
</div>
|
||||
<small class="text-muted" style="font-size: 0.75rem;">Specjalizacja: Bałkany, Włochy Północne • Języki: Angielski (C1), Włoski (B1) • Dyspozycyjna od zaraz</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="tel:+48601987654" class="btn btn-sm btn-outline-success fw-bold d-flex align-items-center gap-1" style="font-size: 0.78rem;">
|
||||
<i class='bx bx-phone-call'></i> Zadzwoń: 601 987 654
|
||||
</a>
|
||||
<button type="button" class="btn btn-sm btn-danger fw-bold" onclick="openBookingModal('4', 'Katarzyna Zielińska', 'Pilne zastępstwo SOS: Jutro rano')">
|
||||
<i class='bx bx-zap'></i> Wyślij SOS
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Masowy broadcast SOS -->
|
||||
<div class="p-3 rounded-3 mt-3 text-white" style="background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%);">
|
||||
<div class="d-flex justify-content-between align-items-center flex-wrap gap-2">
|
||||
<div>
|
||||
<div class="fw-bold" style="font-size: 0.9rem;">
|
||||
<i class='bx bx-broadcast text-warning me-1'></i> Masowy Broadcast SOS do wszystkich wolnych pilotów na kierunek Włochy
|
||||
</div>
|
||||
<small class="text-white-50" style="font-size: 0.74rem;">Wyśle równoległy alert Push & SMS do 12 pilotów spełniających wymagania. Pierwszy, który zaakceptuje, przejmuje zlecenie.</small>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-warning fw-bold px-4 py-2" style="font-size: 0.85rem;">
|
||||
<i class='bx bx-send'></i> Roześlij masowy alert SOS
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="modal-footer bg-light px-4 py-2 border-top">
|
||||
<button type="button" class="btn btn-outline-secondary btn-sm" data-bs-dismiss="modal">Zamknij</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -32,6 +32,13 @@ $supplierAppPages = ['app-orders.php', 'app-travel-agencies.php'];
|
||||
<div data-i18n="Dostawcy usług">Dostawcy usług</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="menu-item">
|
||||
<a href="../superpilot-web/index.php" class="menu-link text-primary fw-semibold">
|
||||
<i class="menu-icon tf-icons bx bx-compass text-primary"></i>
|
||||
<div data-i18n="Baza Pilotów">Baza Pilotów Superpilot</div>
|
||||
<span class="badge bg-label-primary rounded-pill ms-auto" style="font-size: 0.65rem;">NOWOŚĆ</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="menu-item <?php echo in_array($currentPage, $clientsPages, true) ? 'active open' : ''; ?>">
|
||||
<a href="javascript:void(0);" class="menu-link menu-toggle">
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,188 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$pageTitle = 'TravelLeader - Kalendarz Dostępności';
|
||||
include 'header.php';
|
||||
?>
|
||||
|
||||
<div class="app-content">
|
||||
|
||||
<!-- Nagłówek widoku dostępności -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div>
|
||||
<h5 class="fw-bold mb-0" style="color: var(--dark-navy);">Dostępność Pilota</h5>
|
||||
<small class="text-muted" style="font-size: 0.78rem;">Zarządzaj terminami dla biur podróży</small>
|
||||
</div>
|
||||
<button type="button" class="btn btn-sm btn-primary-custom py-1 px-3" style="width: auto; font-size: 0.8rem;" data-bs-toggle="modal" data-bs-target="#addUnavailableModal">
|
||||
<i class='bx bx-plus'></i> Dodaj blokadę
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Główna karta kalendarza -->
|
||||
<div class="section-card">
|
||||
<div class="calendar-month-header">
|
||||
<button class="btn btn-sm btn-light rounded-circle p-2 d-flex align-items-center"><i class='bx bx-chevron-left fs-5'></i></button>
|
||||
<h6 class="fw-bold mb-0" style="color: var(--dark-navy); font-size: 1rem;">Wrzesień 2027</h6>
|
||||
<button class="btn btn-sm btn-light rounded-circle p-2 d-flex align-items-center"><i class='bx bx-chevron-right fs-5'></i></button>
|
||||
</div>
|
||||
|
||||
<!-- Siatka kalendarza -->
|
||||
<div class="calendar-grid mb-2">
|
||||
<div class="calendar-day-header">Pn</div>
|
||||
<div class="calendar-day-header">Wt</div>
|
||||
<div class="calendar-day-header">Śr</div>
|
||||
<div class="calendar-day-header">Cz</div>
|
||||
<div class="calendar-day-header">Pt</div>
|
||||
<div class="calendar-day-header">Sb</div>
|
||||
<div class="calendar-day-header">Nd</div>
|
||||
|
||||
<!-- Dni poprzedniego miesiąca -->
|
||||
<div class="calendar-day-cell other-month">30</div>
|
||||
<div class="calendar-day-cell other-month">31</div>
|
||||
|
||||
<!-- Dni września -->
|
||||
<div class="calendar-day-cell blocked-day" title="Urlop prywatny">1</div>
|
||||
<div class="calendar-day-cell blocked-day" title="Urlop prywatny">2</div>
|
||||
<div class="calendar-day-cell blocked-day" title="Urlop prywatny">3</div>
|
||||
<div class="calendar-day-cell blocked-day" title="Urlop prywatny">4</div>
|
||||
<div class="calendar-day-cell free-day">5 <span class="calendar-day-dot bg-success"></span></div>
|
||||
|
||||
<div class="calendar-day-cell free-day">6 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">7 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">8 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">9 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">10 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">11 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">12 <span class="calendar-day-dot bg-success"></span></div>
|
||||
|
||||
<div class="calendar-day-cell free-day">13 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">14 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">15 <span class="calendar-day-dot bg-success"></span></div>
|
||||
|
||||
<!-- Wycieczka z systemu: 16-24.09.2027 -->
|
||||
<div class="calendar-day-cell trip-day" title="Wycieczka: 12 oskar prod">16 <span class="calendar-day-dot bg-primary"></span></div>
|
||||
<div class="calendar-day-cell trip-day" title="Wycieczka: 12 oskar prod">17 <span class="calendar-day-dot bg-primary"></span></div>
|
||||
<div class="calendar-day-cell trip-day" title="Wycieczka: 12 oskar prod">18 <span class="calendar-day-dot bg-primary"></span></div>
|
||||
<div class="calendar-day-cell trip-day" title="Wycieczka: 12 oskar prod">19 <span class="calendar-day-dot bg-primary"></span></div>
|
||||
|
||||
<div class="calendar-day-cell trip-day" title="Wycieczka: 12 oskar prod">20 <span class="calendar-day-dot bg-primary"></span></div>
|
||||
<div class="calendar-day-cell trip-day" title="Wycieczka: 12 oskar prod">21 <span class="calendar-day-dot bg-primary"></span></div>
|
||||
<div class="calendar-day-cell trip-day" title="Wycieczka: 12 oskar prod">22 <span class="calendar-day-dot bg-primary"></span></div>
|
||||
<div class="calendar-day-cell trip-day" title="Wycieczka: 12 oskar prod">23 <span class="calendar-day-dot bg-primary"></span></div>
|
||||
<div class="calendar-day-cell trip-day" title="Wycieczka: 12 oskar prod">24 <span class="calendar-day-dot bg-primary"></span></div>
|
||||
|
||||
<div class="calendar-day-cell free-day">25 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">26 <span class="calendar-day-dot bg-success"></span></div>
|
||||
|
||||
<div class="calendar-day-cell free-day">27 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">28 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">29 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell free-day">30 <span class="calendar-day-dot bg-success"></span></div>
|
||||
<div class="calendar-day-cell other-month">1</div>
|
||||
<div class="calendar-day-cell other-month">2</div>
|
||||
<div class="calendar-day-cell other-month">3</div>
|
||||
</div>
|
||||
|
||||
<!-- Legenda -->
|
||||
<div class="calendar-legend">
|
||||
<div class="legend-item">
|
||||
<div class="legend-color-box" style="background-color: var(--primary);"></div>
|
||||
<span>Wycieczka potwierdzona</span>
|
||||
</div>
|
||||
<div class="legend-item">
|
||||
<div class="legend-color-box" style="background-color: #ef4444;"></div>
|
||||
<span>Niedostępny / Urlop</span>
|
||||
</div>
|
||||
<div class="legend-item">
|
||||
<div class="legend-color-box" style="background-color: #22c55e;"></div>
|
||||
<span>Dostępny dla biur</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Lista wpisów w wybranym miesiącu -->
|
||||
<h6 class="fw-bold mb-2 mt-3" style="color: var(--dark-navy); font-size: 0.9rem;">Wydarzenia we Wrześniu 2027</h6>
|
||||
|
||||
<!-- Wycieczka potwierdzona -->
|
||||
<div class="card border-0 rounded-4 p-3 mb-2 shadow-sm" style="background: #ffffff; border-left: 4px solid var(--primary) !important;">
|
||||
<div class="d-flex justify-content-between align-items-start">
|
||||
<div>
|
||||
<span class="badge mb-1" style="background: #eff0fe; color: var(--primary); font-size: 0.72rem;">Wycieczka przypisana</span>
|
||||
<h6 class="fw-bold mb-1" style="font-size: 0.92rem; color: var(--dark-navy);">12 oskar prod (Włochy)</h6>
|
||||
<small class="text-muted d-block" style="font-size: 0.76rem;"><i class='bx bx-time-five'></i> 16 - 24 Września 2027 (9 dni)</small>
|
||||
</div>
|
||||
<a href="index.php" class="btn btn-sm btn-outline-primary py-1 px-2" style="font-size: 0.75rem;">Wycieczka ></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Prywatna niedostępność -->
|
||||
<div class="card border-0 rounded-4 p-3 mb-3 shadow-sm" style="background: #ffffff; border-left: 4px solid #ef4444 !important;">
|
||||
<div class="d-flex justify-content-between align-items-start">
|
||||
<div>
|
||||
<span class="badge mb-1" style="background: #fee2e2; color: #ef4444; font-size: 0.72rem;">Niedostępność pilota</span>
|
||||
<h6 class="fw-bold mb-1" style="font-size: 0.92rem; color: var(--dark-navy);">Urlop prywatny / sprawy rodzinne</h6>
|
||||
<small class="text-muted d-block" style="font-size: 0.76rem;"><i class='bx bx-time-five'></i> 01 - 04 Września 2027 (4 dni)</small>
|
||||
</div>
|
||||
<button class="btn btn-sm btn-outline-danger py-1 px-2" style="font-size: 0.75rem;" onclick="confirm('Czy chcesz usunąć tę blokadę terminu?')"><i class='bx bx-trash'></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Informacja o integracji z bazą biur -->
|
||||
<div class="p-3 rounded-4" style="background-color: #f1f3fa;">
|
||||
<div class="d-flex align-items-center gap-2 mb-1">
|
||||
<i class='bx bx-info-circle text-primary fs-5'></i>
|
||||
<span class="fw-bold" style="font-size: 0.82rem; color: var(--dark-navy);">Jak działa to dla biur podróży?</span>
|
||||
</div>
|
||||
<p class="text-muted mb-0" style="font-size: 0.75rem; line-height: 1.4;">
|
||||
Wyszukiwarka w aplikacji webowej pozwala pracownikowi biura wybrać np. „Termin: 05-15 Wrz 2027 + Kraj: Włochy”. Twój profil pojawi się na szczycie wyników, ponieważ zaznaczyłeś te dni jako wolne!
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div><!-- /.app-content -->
|
||||
|
||||
<!-- Modal dodawania niedostępności -->
|
||||
<div class="modal fade" id="addUnavailableModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content rounded-4 border-0">
|
||||
<div class="modal-header border-bottom">
|
||||
<h6 class="modal-title fw-bold" style="color: var(--dark-navy);">Zgłoś niedostępność / Urlop</h6>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
<div class="modal-body p-3">
|
||||
<div class="mb-3">
|
||||
<label class="form-label-custom">Powód niedostępności</label>
|
||||
<select class="form-select form-control-custom">
|
||||
<option selected>Urlop prywatny</option>
|
||||
<option>Zlecenie poza systemem</option>
|
||||
<option>Szkolenie / Egzamin</option>
|
||||
<option>Sprawy zdrowotne</option>
|
||||
<option>Inny powód</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="row g-2 mb-3">
|
||||
<div class="col-6">
|
||||
<label class="form-label-custom">Data od</label>
|
||||
<input type="date" class="form-control-custom" value="2027-10-01">
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<label class="form-label-custom">Data do</label>
|
||||
<input type="date" class="form-control-custom" value="2027-10-08">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-2">
|
||||
<label class="form-label-custom">Notatka prywatna (opcjonalnie)</label>
|
||||
<textarea class="form-control-custom" rows="2" placeholder="Widoczna tylko dla Ciebie..."></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer border-top p-2">
|
||||
<button type="button" class="btn btn-secondary-custom py-2 flex-grow-1" data-bs-dismiss="modal">Anuluj</button>
|
||||
<button type="button" class="btn-primary-custom py-2 flex-grow-1" data-bs-dismiss="modal" onclick="alert('Pomyślnie zablokowano termin w kalendarzu. Biura nie będą wysyłać zapytań na ten okres.');">
|
||||
Zapisz termin
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php include 'footer.php'; ?>
|
||||
@@ -0,0 +1,174 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$pageTitle = 'TravelLeader - Szkolenia i Certyfikaty';
|
||||
include 'header.php';
|
||||
?>
|
||||
|
||||
<div class="app-content">
|
||||
|
||||
<!-- Nagłówek szkoleń (Czysty, minimalistyczny, bez zbędnych odznak) -->
|
||||
<div class="mb-3">
|
||||
<h5 class="fw-bold mb-0" style="color: var(--dark-navy);">Szkolenia & Certyfikaty</h5>
|
||||
<small class="text-muted" style="font-size: 0.76rem;">Kursy podnoszące rangę profilu w bazie biur podróży</small>
|
||||
</div>
|
||||
|
||||
<!-- Przełącznik zakładek (Segmented control) -->
|
||||
<div class="d-flex p-1 rounded-3 mb-3" style="background: #eef1f8;">
|
||||
<button type="button" id="tabCoursesBtn" class="btn btn-sm flex-fill fw-bold rounded-2 py-1" style="font-size: 0.78rem; background: white; color: var(--primary); box-shadow: 0 1px 4px rgba(0,0,0,0.06);" onclick="switchCourseTab('courses');">
|
||||
Dostępne kursy (3)
|
||||
</button>
|
||||
<button type="button" id="tabCertsBtn" class="btn btn-sm flex-fill fw-bold rounded-2 py-1 text-muted" style="font-size: 0.78rem;" onclick="switchCourseTab('certs');">
|
||||
Moje certyfikaty (2)
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- SEKCJA 1: Dostępne kursy (Czyste karty, bez wielopoziomowych pięter) -->
|
||||
<div id="sectionCourses">
|
||||
|
||||
<!-- Kurs 1 -->
|
||||
<div class="section-card mb-2 p-3">
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<span class="badge" style="background: #eff0fe; color: var(--primary); font-size: 0.68rem; font-weight: 700;">
|
||||
WŁOCHY
|
||||
</span>
|
||||
<span class="fw-bold text-dark" style="font-size: 0.82rem;">199 PLN</span>
|
||||
</div>
|
||||
|
||||
<h6 class="fw-bold mb-1" style="font-size: 0.9rem; color: var(--dark-navy);">
|
||||
Włochy Północne & Dolomity 2027
|
||||
</h6>
|
||||
<p class="text-muted mb-2" style="font-size: 0.75rem; line-height: 1.35;">
|
||||
Prowadzący: Janek. Warsztaty z logistyki autokarowej, stref ZTL i nowych szlaków.
|
||||
</p>
|
||||
|
||||
<div class="d-flex justify-content-between align-items-center pt-2 border-top">
|
||||
<small class="text-muted" style="font-size: 0.72rem;">
|
||||
<i class='bx bx-calendar'></i> 24.10 • 4h online
|
||||
</small>
|
||||
<button class="btn btn-sm btn-primary-custom py-1 px-3" style="width: auto; font-size: 0.74rem;" onclick="alert('Zapis na szkolenie przez TravelPay.');">
|
||||
Zapisz się >
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Kurs 2 -->
|
||||
<div class="section-card mb-2 p-3">
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<span class="badge bg-warning-subtle text-warning-emphasis" style="font-size: 0.68rem; font-weight: 700;">
|
||||
RAINBOW TOURS
|
||||
</span>
|
||||
<span class="badge bg-success-subtle text-success fw-bold" style="font-size: 0.68rem;">BEZPŁATNE</span>
|
||||
</div>
|
||||
|
||||
<h6 class="fw-bold mb-1" style="font-size: 0.9rem; color: var(--dark-navy);">
|
||||
Standardy obsługi imprez objazdowych
|
||||
</h6>
|
||||
<p class="text-muted mb-2" style="font-size: 0.75rem; line-height: 1.35;">
|
||||
Szkolenie produktowe biura podróży dla pilotów szukających kontraktów na sezon.
|
||||
</p>
|
||||
|
||||
<div class="d-flex justify-content-between align-items-center pt-2 border-top">
|
||||
<small class="text-muted" style="font-size: 0.72rem;">
|
||||
<i class='bx bx-video'></i> VOD • 2h
|
||||
</small>
|
||||
<button class="btn btn-sm btn-secondary-custom py-1 px-3" style="width: auto; font-size: 0.74rem;" onclick="alert('Dostęp do materiałów VOD został odblokowany.');">
|
||||
Dołącz >
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Kurs 3 -->
|
||||
<div class="section-card mb-3 p-3">
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<span class="badge bg-light text-muted" style="font-size: 0.68rem; font-weight: 700;">
|
||||
PRAWO & PROCEDURY
|
||||
</span>
|
||||
<span class="fw-bold text-dark" style="font-size: 0.82rem;">149 PLN</span>
|
||||
</div>
|
||||
|
||||
<h6 class="fw-bold mb-1" style="font-size: 0.9rem; color: var(--dark-navy);">
|
||||
Prawo w turystyce & reklamacje
|
||||
</h6>
|
||||
<p class="text-muted mb-2" style="font-size: 0.75rem; line-height: 1.35;">
|
||||
Procedury awaryjne, ubezpieczenia i rozwiązywanie trudnych sytuacji z turystami.
|
||||
</p>
|
||||
|
||||
<div class="d-flex justify-content-between align-items-center pt-2 border-top">
|
||||
<small class="text-muted" style="font-size: 0.72rem;">
|
||||
<i class='bx bx-calendar'></i> 12.11 • Webinar
|
||||
</small>
|
||||
<button class="btn btn-sm btn-primary-custom py-1 px-3" style="width: auto; font-size: 0.74rem;" onclick="alert('Zapis na webinar.');">
|
||||
Zapisz się >
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- SEKCJA 2: Moje certyfikaty (Ukryta domyślnie, przełączana zakładką) -->
|
||||
<div id="sectionCerts" class="d-none">
|
||||
|
||||
<div class="section-card mb-2 p-3">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="d-flex align-items-center justify-content-center rounded-circle bg-success-subtle text-success" style="width: 38px; height: 38px; flex-shrink: 0;">
|
||||
<i class='bx bx-badge-check fs-4'></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="fw-bold mb-0" style="font-size: 0.86rem; color: var(--dark-navy);">Superpilot: Europa Południowa</h6>
|
||||
<small class="text-muted" style="font-size: 0.72rem;">Weryfikacja TravelLeader • Dodano do profilu</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section-card mb-3 p-3">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="d-flex align-items-center justify-content-center rounded-circle bg-primary-subtle text-primary" style="width: 38px; height: 38px; flex-shrink: 0;">
|
||||
<i class='bx bx-plus-medical fs-5'></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<h6 class="fw-bold mb-0" style="font-size: 0.86rem; color: var(--dark-navy);">Pierwsza Pomoc (KPP)</h6>
|
||||
<small class="text-muted" style="font-size: 0.72rem;">Certyfikat ważny do: Kwiecień 2028</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-3 rounded-3 text-center" style="background: #f8f9fd;">
|
||||
<small class="text-muted" style="font-size: 0.74rem;">
|
||||
Wszystkie zdobyte certyfikaty są automatycznie widoczne dla biur podróży w Twojej wizytówce.
|
||||
</small>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div><!-- /.app-content -->
|
||||
|
||||
<script>
|
||||
function switchCourseTab(tab) {
|
||||
const coursesSection = document.getElementById('sectionCourses');
|
||||
const certsSection = document.getElementById('sectionCerts');
|
||||
const coursesBtn = document.getElementById('tabCoursesBtn');
|
||||
const certsBtn = document.getElementById('tabCertsBtn');
|
||||
|
||||
if (tab === 'courses') {
|
||||
coursesSection.classList.remove('d-none');
|
||||
certsSection.classList.add('d-none');
|
||||
coursesBtn.style.background = 'white';
|
||||
coursesBtn.style.color = 'var(--primary)';
|
||||
coursesBtn.style.boxShadow = '0 1px 4px rgba(0,0,0,0.06)';
|
||||
certsBtn.style.background = 'transparent';
|
||||
certsBtn.style.color = 'var(--text-muted)';
|
||||
certsBtn.style.boxShadow = 'none';
|
||||
} else {
|
||||
coursesSection.classList.add('d-none');
|
||||
certsSection.classList.remove('d-none');
|
||||
certsBtn.style.background = 'white';
|
||||
certsBtn.style.color = 'var(--primary)';
|
||||
certsBtn.style.boxShadow = '0 1px 4px rgba(0,0,0,0.06)';
|
||||
coursesBtn.style.background = 'transparent';
|
||||
coursesBtn.style.color = 'var(--text-muted)';
|
||||
coursesBtn.style.boxShadow = 'none';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<?php include 'footer.php'; ?>
|
||||
@@ -0,0 +1,40 @@
|
||||
<?php
|
||||
$currentPage = basename($_SERVER['PHP_SELF'], '.php');
|
||||
?>
|
||||
<!-- Dolna belka nawigacyjna (Bottom Navigation Bar - zawsze widoczna na dole) -->
|
||||
<nav class="bottom-nav-bar">
|
||||
<a href="index.php" class="bottom-nav-item <?= in_array($currentPage, ['index', 'trip-details']) ? 'active' : '' ?>">
|
||||
<i class='bx <?= in_array($currentPage, ['index', 'trip-details']) ? 'bxs-compass' : 'bx-compass' ?>'></i>
|
||||
<span>Wycieczki</span>
|
||||
</a>
|
||||
|
||||
<a href="availability.php" class="bottom-nav-item <?= $currentPage === 'availability' ? 'active' : '' ?>">
|
||||
<i class='bx <?= $currentPage === 'availability' ? 'bxs-calendar' : 'bx-calendar' ?>'></i>
|
||||
<span>Dostępność</span>
|
||||
</a>
|
||||
|
||||
<a href="courses.php" class="bottom-nav-item <?= $currentPage === 'courses' ? 'active' : '' ?>">
|
||||
<i class='bx <?= $currentPage === 'courses' ? 'bxs-book-open' : 'bx-book-open' ?>'></i>
|
||||
<span>Szkolenia</span>
|
||||
</a>
|
||||
|
||||
<a href="profile.php" class="bottom-nav-item <?= in_array($currentPage, ['profile', 'profile-edit']) ? 'active' : '' ?>">
|
||||
<i class='bx <?= in_array($currentPage, ['profile', 'profile-edit']) ? 'bxs-user-pin' : 'bx-user' ?>'></i>
|
||||
<span>Mój Profil</span>
|
||||
<span class="nav-indicator" title="Profil wymaga uzupełnienia"></span>
|
||||
</a>
|
||||
</nav>
|
||||
|
||||
</div><!-- /.phone-screen -->
|
||||
</div><!-- /.phone-viewport-wrapper -->
|
||||
|
||||
<!-- Lokalne skrypty Bootstrap (z projektu Magico, bez jsdelivr) -->
|
||||
<script src="../../assets/vendor/js/bootstrap.js"></script>
|
||||
|
||||
<!-- Magico Feedback JS -->
|
||||
<?php if (!empty($enablePrototypeComments)): ?>
|
||||
<script src="../../assets/js/comments.js"></script>
|
||||
<?php endif; ?>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,67 @@
|
||||
<?php
|
||||
$currentPage = basename($_SERVER['PHP_SELF'], '.php');
|
||||
if (!isset($pageTitle)) {
|
||||
$pageTitle = 'TravelLeader - Aplikacja Pilota';
|
||||
}
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="pl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
|
||||
<title><?= htmlspecialchars($pageTitle) ?></title>
|
||||
|
||||
<!-- Google Fonts -->
|
||||
<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=Public+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
|
||||
|
||||
<!-- Lokalne assety (Boxicons + Core CSS z projektu Magico, bez jsdelivr) -->
|
||||
<link rel="stylesheet" href="../../assets/vendor/fonts/boxicons.css">
|
||||
<link rel="stylesheet" href="../../assets/vendor/css/core.css">
|
||||
|
||||
<!-- Stylistyka aplikacji mobilnej TravelLeader -->
|
||||
<link rel="stylesheet" href="assets/css/style.css">
|
||||
|
||||
<!-- Magico Comments -->
|
||||
<?php if (!empty($enablePrototypeComments)): ?>
|
||||
<link rel="stylesheet" href="../../assets/css/comments.css">
|
||||
<?php endif; ?>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="phone-viewport-wrapper">
|
||||
<div class="phone-screen">
|
||||
|
||||
<!-- Pasek stanu telefonu (Widoczny w ramce na desktopie, ukryty na mobile) -->
|
||||
<div class="phone-status-bar">
|
||||
<span>9:05</span>
|
||||
<div class="icons">
|
||||
<span class="badge bg-secondary" style="font-size: 0.6rem; padding: 1px 4px;">VPN</span>
|
||||
<i class='bx bx-wifi'></i>
|
||||
<i class='bx bx-signal-5'></i>
|
||||
<span style="font-size: 0.72rem; display: inline-flex; align-items: center; gap: 2px;">
|
||||
46 <i class='bx bxs-battery-charging' style="font-size: 1rem;"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Nagłówek aplikacji TravelLeader -->
|
||||
<header class="app-header">
|
||||
<a href="index.php" class="brand-logo-area">
|
||||
<div class="brand-icon-box">
|
||||
<i class='bx bx-compass'></i>
|
||||
</div>
|
||||
<div class="brand-name">Travel<span style="color: #2b304f;">Leader</span></div>
|
||||
</a>
|
||||
|
||||
<a href="profile.php" class="header-user-profile" title="Przejdź do profilu">
|
||||
<div class="header-user-info">
|
||||
<div class="header-user-email">oskar@magico.pl</div>
|
||||
<div class="header-user-role">Pilot Wycieczek</div>
|
||||
</div>
|
||||
<div class="header-avatar">
|
||||
<i class='bx bx-user'></i>
|
||||
</div>
|
||||
</a>
|
||||
</header>
|
||||
@@ -0,0 +1,322 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$pageTitle = 'TravelLeader - Wycieczki i Zlecenia';
|
||||
include 'header.php';
|
||||
?>
|
||||
|
||||
<!-- Systemowa wstążka profilu (Edge-to-edge pod nagłówkiem, nie koliduje z wyszukiwarką) -->
|
||||
<div class="system-ribbon-bar">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="ribbon-badge">45%</span>
|
||||
<div class="ribbon-text">
|
||||
<span class="fw-bold">Profil w bazie</span>
|
||||
<span class="ribbon-sub"> • Uzupełnij dane dla biur</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<a href="profile.php" class="btn-ribbon-action">
|
||||
Dokończ >
|
||||
</a>
|
||||
<button type="button" class="btn-ribbon-close" onclick="this.closest('.system-ribbon-bar').style.display='none';" title="Zamknij powiadomienie">
|
||||
<i class='bx bx-x'></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="app-content">
|
||||
|
||||
<!-- Wyszukiwarka i filtr zakresu dat (odtworzone ze zrzutu ekranu) -->
|
||||
<div class="search-filter-card">
|
||||
<div class="search-filter-icon">
|
||||
<i class='bx bx-search'></i>
|
||||
</div>
|
||||
<div class="search-filter-text flex-grow-1">
|
||||
<h6>Wycieczki</h6>
|
||||
<small>
|
||||
<i class='bx bx-calendar'></i> 18 wrz 2026 → 18 wrz 2027
|
||||
</small>
|
||||
</div>
|
||||
<i class='bx bx-chevron-down text-muted fs-4'></i>
|
||||
</div>
|
||||
|
||||
<!-- Pasek zakładek i przełącznik widoku (Lista vs Kalendarz wycieczek) -->
|
||||
<div class="trips-tabs-bar">
|
||||
<div class="nav-pills-custom">
|
||||
<a href="#" class="nav-pill-item active">
|
||||
<i class='bx bx-home-alt-2'></i>
|
||||
<span>Bieżące</span>
|
||||
<span class="badge-count">1</span>
|
||||
</a>
|
||||
<a href="#" class="nav-pill-item">
|
||||
<i class='bx bx-history'></i>
|
||||
<span>Historia</span>
|
||||
<span class="badge-count">0</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Przełącznik Lista / Kalendarz w obrębie wycieczek -->
|
||||
<div class="view-toggle-group">
|
||||
<button type="button" id="btnListView" class="view-toggle-btn active" title="Widok listy" onclick="switchTripsView('list');">
|
||||
<i class='bx bx-list-ul'></i>
|
||||
</button>
|
||||
<button type="button" id="btnCalendarView" class="view-toggle-btn" title="Widok kalendarza" onclick="switchTripsView('calendar');">
|
||||
<i class='bx bx-calendar'></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- WIDOK 1: LISTA WYCIECZEK -->
|
||||
<div id="tripsListView">
|
||||
<div class="trip-card">
|
||||
<div class="trip-card-header">
|
||||
<div class="d-flex align-items-center flex-grow-1">
|
||||
<div class="trip-id-badge">12</div>
|
||||
<div class="trip-title-area">
|
||||
<h5 class="trip-title">oskar prod</h5>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="trip-status-pill">
|
||||
<span class="badge-status">Planowana</span>
|
||||
<div class="status-subtext">za 363 dni</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Dane wycieczki -->
|
||||
<div class="trip-info-row">
|
||||
<i class='bx bx-calendar'></i>
|
||||
<span>16-24.09.2027</span>
|
||||
</div>
|
||||
|
||||
<div class="trip-info-row">
|
||||
<i class='bx bx-group'></i>
|
||||
<span>24 / 0</span>
|
||||
</div>
|
||||
|
||||
<div class="trip-info-row">
|
||||
<i class='bx bx-map'></i>
|
||||
<span class="text-muted">Brak danych</span>
|
||||
</div>
|
||||
|
||||
<!-- Stopka karty -->
|
||||
<div class="trip-card-footer">
|
||||
<div class="trip-code">
|
||||
<i class='bx bx-briefcase-alt'></i>
|
||||
<span>123osk123</span>
|
||||
</div>
|
||||
|
||||
<a href="#" class="btn-details" onclick="openTripBottomSheet('16 WRZEŚNIA 2027'); return false;">
|
||||
Szczegóły >
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- WIDOK 2: KALENDARZ WYCIECZEK (Odtworzony 1:1 ze zrzutu ekranu) -->
|
||||
<div id="tripsCalendarView" class="d-none">
|
||||
<div class="trips-calendar-container">
|
||||
|
||||
<!-- Nagłówek miesiąca -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-3 px-1">
|
||||
<button type="button" class="btn btn-sm btn-light rounded-circle p-1" onclick="alert('Przejdź do Sierpnia 2027');"><i class='bx bx-chevron-left fs-5'></i></button>
|
||||
<div class="month-title-header mb-0">WRZESIEŃ 2027</div>
|
||||
<button type="button" class="btn btn-sm btn-light rounded-circle p-1" onclick="alert('Przejdź do Października 2027');"><i class='bx bx-chevron-right fs-5'></i></button>
|
||||
</div>
|
||||
|
||||
<table class="calendar-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Pn</th>
|
||||
<th>Wt</th>
|
||||
<th>Śr</th>
|
||||
<th>Cz</th>
|
||||
<th>Pt</th>
|
||||
<th>So</th>
|
||||
<th>Nd</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<!-- Tydzień 1 -->
|
||||
<tr>
|
||||
<td class="other-month"><span class="day-number">30</span></td>
|
||||
<td class="other-month"><span class="day-number">31</span></td>
|
||||
<td><span class="day-number">1</span></td>
|
||||
<td><span class="day-number">2</span></td>
|
||||
<td><span class="day-number">3</span></td>
|
||||
<td><span class="day-number">4</span></td>
|
||||
<td><span class="day-number">5</span></td>
|
||||
</tr>
|
||||
<!-- Tydzień 2 -->
|
||||
<tr>
|
||||
<td><span class="day-number">6</span></td>
|
||||
<td><span class="day-number">7</span></td>
|
||||
<td><span class="day-number">8</span></td>
|
||||
<td><span class="day-number">9</span></td>
|
||||
<td><span class="day-number">10</span></td>
|
||||
<td><span class="day-number">11</span></td>
|
||||
<td><span class="day-number">12</span></td>
|
||||
</tr>
|
||||
<!-- Tydzień 3: Początek wycieczki 16-19 września -->
|
||||
<tr>
|
||||
<td><span class="day-number">13</span></td>
|
||||
<td><span class="day-number">14</span></td>
|
||||
<td><span class="day-number">15</span></td>
|
||||
<td onclick="openTripBottomSheet('16 WRZEŚNIA 2027');">
|
||||
<span class="day-number fw-bold text-primary">16</span>
|
||||
<span class="trip-ribbon-bar trip-ribbon-start">oskar prod</span>
|
||||
</td>
|
||||
<td onclick="openTripBottomSheet('17 WRZEŚNIA 2027');">
|
||||
<span class="day-number fw-bold text-primary">17</span>
|
||||
<span class="trip-ribbon-bar"> </span>
|
||||
</td>
|
||||
<td onclick="openTripBottomSheet('18 WRZEŚNIA 2027');">
|
||||
<span class="day-number fw-bold text-primary">18</span>
|
||||
<span class="trip-ribbon-bar"> </span>
|
||||
</td>
|
||||
<td onclick="openTripBottomSheet('19 WRZEŚNIA 2027');">
|
||||
<span class="day-number fw-bold text-primary">19</span>
|
||||
<span class="trip-ribbon-bar"> </span>
|
||||
</td>
|
||||
</tr>
|
||||
<!-- Tydzień 4: Ciąg dalszy wycieczki 20-24 września -->
|
||||
<tr>
|
||||
<td onclick="openTripBottomSheet('20 WRZEŚNIA 2027');">
|
||||
<span class="day-number fw-bold text-primary">20</span>
|
||||
<span class="trip-ribbon-bar">oskar prod</span>
|
||||
</td>
|
||||
<td onclick="openTripBottomSheet('21 WRZEŚNIA 2027');">
|
||||
<span class="day-number fw-bold text-primary">21</span>
|
||||
<span class="trip-ribbon-bar"> </span>
|
||||
</td>
|
||||
<td onclick="openTripBottomSheet('22 WRZEŚNIA 2027');">
|
||||
<span class="day-number fw-bold text-primary">22</span>
|
||||
<span class="trip-ribbon-bar"> </span>
|
||||
</td>
|
||||
<td onclick="openTripBottomSheet('23 WRZEŚNIA 2027');">
|
||||
<span class="day-number fw-bold text-primary">23</span>
|
||||
<span class="trip-ribbon-bar"> </span>
|
||||
</td>
|
||||
<td onclick="openTripBottomSheet('24 WRZEŚNIA 2027');">
|
||||
<span class="day-number fw-bold text-primary">24</span>
|
||||
<span class="trip-ribbon-bar trip-ribbon-end"> </span>
|
||||
</td>
|
||||
<td><span class="day-number">25</span></td>
|
||||
<td><span class="day-number">26</span></td>
|
||||
</tr>
|
||||
<!-- Tydzień 5 -->
|
||||
<tr>
|
||||
<td><span class="day-number">27</span></td>
|
||||
<td><span class="day-number">28</span></td>
|
||||
<td><span class="day-number">29</span></td>
|
||||
<td><span class="day-number">30</span></td>
|
||||
<td class="other-month"><span class="day-number">1</span></td>
|
||||
<td class="other-month"><span class="day-number">2</span></td>
|
||||
<td class="other-month"><span class="day-number">3</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="mt-3 pt-2 border-top d-flex justify-content-between align-items-center">
|
||||
<small class="text-muted" style="font-size: 0.72rem;">
|
||||
<i class='bx bxs-circle text-primary' style="font-size: 0.6rem;"></i> Zaznaczony termin wycieczki (16-24 Wrz)
|
||||
</small>
|
||||
<a href="availability.php" class="text-primary fw-bold text-decoration-none" style="font-size: 0.72rem;">
|
||||
Kalendarz dostępności →
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><!-- /.app-content -->
|
||||
|
||||
<!-- BOTTOM SHEET MODAL (Odtworzony 1:1 ze zrzutu ekranu) -->
|
||||
<div id="tripSheetBackdrop" class="bottom-sheet-backdrop" onclick="closeTripBottomSheet();"></div>
|
||||
<div id="tripBottomSheet" class="bottom-sheet-content">
|
||||
<div class="sheet-drag-handle"></div>
|
||||
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div>
|
||||
<div class="text-uppercase fw-bold text-muted" style="font-size: 0.68rem; letter-spacing: 0.5px;">WYBRANY DZIEŃ</div>
|
||||
<h5 class="fw-bold mb-0" id="sheetSelectedDate" style="color: var(--dark-navy); font-size: 1.15rem;">16 WRZEŚNIA 2027</h5>
|
||||
</div>
|
||||
<button type="button" class="btn-close" style="font-size: 0.75rem;" onclick="closeTripBottomSheet();" aria-label="Zamknij"></button>
|
||||
</div>
|
||||
|
||||
<!-- Karta wycieczki wewnątrz Bottom Sheet -->
|
||||
<div class="trip-card mb-0 shadow-none border mt-3">
|
||||
<div class="trip-card-header">
|
||||
<div class="d-flex align-items-center flex-grow-1">
|
||||
<div class="trip-id-badge">12</div>
|
||||
<div class="trip-title-area">
|
||||
<h5 class="trip-title">oskar prod</h5>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="trip-status-pill">
|
||||
<span class="badge-status">Planowana</span>
|
||||
<div class="status-subtext">za 363 dni</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="trip-info-row">
|
||||
<i class='bx bx-calendar'></i>
|
||||
<span>16-24.09.2027</span>
|
||||
</div>
|
||||
|
||||
<div class="trip-info-row">
|
||||
<i class='bx bx-group'></i>
|
||||
<span>24 / 0</span>
|
||||
</div>
|
||||
|
||||
<div class="trip-info-row">
|
||||
<i class='bx bx-map'></i>
|
||||
<span class="text-muted">Brak danych</span>
|
||||
</div>
|
||||
|
||||
<div class="trip-card-footer">
|
||||
<div class="trip-code">
|
||||
<i class='bx bx-briefcase-alt'></i>
|
||||
<span>123osk123</span>
|
||||
</div>
|
||||
|
||||
<button type="button" class="btn-details" onclick="alert('Otwieranie pełnych szczegółów wycieczki 12 oskar prod');">
|
||||
Szczegóły >
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function switchTripsView(view) {
|
||||
const listView = document.getElementById('tripsListView');
|
||||
const calView = document.getElementById('tripsCalendarView');
|
||||
const btnList = document.getElementById('btnListView');
|
||||
const btnCal = document.getElementById('btnCalendarView');
|
||||
|
||||
if (view === 'calendar') {
|
||||
listView.classList.add('d-none');
|
||||
calView.classList.remove('d-none');
|
||||
btnCal.classList.add('active');
|
||||
btnList.classList.remove('active');
|
||||
} else {
|
||||
listView.classList.remove('d-none');
|
||||
calView.classList.add('d-none');
|
||||
btnList.classList.add('active');
|
||||
btnCal.classList.remove('active');
|
||||
}
|
||||
}
|
||||
|
||||
function openTripBottomSheet(dateTitle) {
|
||||
document.getElementById('sheetSelectedDate').innerText = dateTitle;
|
||||
document.getElementById('tripSheetBackdrop').classList.add('active');
|
||||
document.getElementById('tripBottomSheet').classList.add('active');
|
||||
}
|
||||
|
||||
function closeTripBottomSheet() {
|
||||
document.getElementById('tripSheetBackdrop').classList.remove('active');
|
||||
document.getElementById('tripBottomSheet').classList.remove('active');
|
||||
}
|
||||
</script>
|
||||
|
||||
<?php include 'footer.php'; ?>
|
||||
@@ -0,0 +1,269 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$pageTitle = 'TravelLeader - Edycja Profilu';
|
||||
include 'header.php';
|
||||
?>
|
||||
|
||||
<div class="app-content">
|
||||
|
||||
<!-- Pasek powrotu -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<a href="profile.php" class="text-decoration-none d-flex align-items-center gap-1 text-muted" style="font-size: 0.85rem; font-weight: 600;">
|
||||
<i class='bx bx-arrow-back fs-5'></i> Powrót do profilu
|
||||
</a>
|
||||
<button type="button" class="btn btn-sm btn-primary-custom py-1 px-3" style="width: auto; font-size: 0.8rem;" onclick="saveProfile();">
|
||||
<i class='bx bx-check'></i> Zapisz
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<h5 class="fw-bold mb-3" style="color: var(--dark-navy);">Edycja Profilu</h5>
|
||||
|
||||
<!-- Toast powiadomienie o zapisie -->
|
||||
<div id="saveToast" class="alert alert-success d-none rounded-3 shadow-sm py-2 px-3 mb-3 d-flex align-items-center justify-content-between" style="font-size: 0.82rem;">
|
||||
<span><i class='bx bx-check-circle me-1'></i> Profil zaktualizowany! Zmiany widoczne dla biur.</span>
|
||||
<a href="profile.php" class="fw-bold text-success text-decoration-underline ms-2">Zobacz</a>
|
||||
</div>
|
||||
|
||||
<!-- 0. Nowoczesny, kompaktowy przełącznik widoczności (Pill card) -->
|
||||
<div class="visibility-status-pill-card mb-3">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span class="status-indicator-dot active" id="visibilityDot"></span>
|
||||
<div>
|
||||
<span class="fw-bold" style="font-size: 0.84rem; color: var(--dark-navy);" id="visibilityTitle">
|
||||
Widoczny w bazie biur podróży
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-check form-switch m-0">
|
||||
<input class="form-check-input" type="checkbox" id="visibilitySwitch" checked style="cursor: pointer; transform: scale(1.15);" onchange="toggleVisibility(this);">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 1. Zdjęcie profilowe & Wideo-Wizytówka -->
|
||||
<div class="section-card mb-3">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-image text-primary me-1'></i> Zdjęcie i Wideo</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-3 mb-3">
|
||||
<div class="profile-avatar-img d-flex align-items-center justify-content-center" style="width: 60px; height: 60px; background: linear-gradient(135deg, #4f46e5, #7c3aed); color: white; font-size: 1.4rem; font-weight: 800; flex-shrink: 0;">
|
||||
OK
|
||||
</div>
|
||||
<div>
|
||||
<button type="button" class="btn btn-sm btn-outline-primary rounded-pill py-1 px-3" style="font-size: 0.76rem;" onclick="alert('Wybierz zdjęcie z telefonu.');">
|
||||
<i class='bx bx-camera'></i> Zmień zdjęcie profilowe
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label-custom">Link do wideo-autoprezentacji</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0 py-1"><i class='bx bxl-youtube text-danger'></i></span>
|
||||
<input type="text" class="form-control form-control-custom" value="https://youtu.be/oskar-pilot-intro" placeholder="YouTube, Vimeo...">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="form-label-custom">Zdjęcia ze szlaków i wypraw</label>
|
||||
<div class="d-flex gap-2">
|
||||
<div class="media-thumbnail d-flex align-items-center justify-content-center" style="width: 50px; height: 50px; background: #eff0fe; color: var(--primary); cursor: pointer;" onclick="alert('Wybierz kolejne zdjęcia');">
|
||||
<i class='bx bx-plus fs-4'></i>
|
||||
</div>
|
||||
<div class="media-thumbnail d-flex align-items-center justify-content-center" style="width: 50px; height: 50px; background: #60a5fa; color: white;">
|
||||
<i class='bx bx-landscape fs-4'></i>
|
||||
</div>
|
||||
<div class="media-thumbnail d-flex align-items-center justify-content-center" style="width: 50px; height: 50px; background: #f59e0b; color: white;">
|
||||
<i class='bx bx-camera fs-4'></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 2. Dane podstawowe & Autoprezentacja -->
|
||||
<div class="section-card mb-3" id="bio">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-user text-primary me-1'></i> Dane podstawowe & O mnie</span>
|
||||
</div>
|
||||
|
||||
<div class="mb-2">
|
||||
<label class="form-label-custom">Imię i Nazwisko</label>
|
||||
<input type="text" class="form-control-custom" value="Oskar Kaczmarek">
|
||||
</div>
|
||||
|
||||
<div class="mb-2">
|
||||
<label class="form-label-custom">Tytuł zawodowy / Slogan</label>
|
||||
<input type="text" class="form-control-custom" value="Licencjonowany Pilot Wycieczek & Przewodnik">
|
||||
</div>
|
||||
|
||||
<div class="row g-2 mb-2">
|
||||
<div class="col-6">
|
||||
<label class="form-label-custom">Rok rozpoczęcia</label>
|
||||
<input type="number" id="startYearInput" class="form-control-custom" value="2019" min="1970" max="2026" oninput="updateExpYears();">
|
||||
<small class="text-primary fw-bold d-block mt-1" id="expCalculatedHint" style="font-size: 0.72rem;">
|
||||
<i class='bx bx-check'></i> Staż: 7 lat
|
||||
</small>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<label class="form-label-custom">Miasto bazowe</label>
|
||||
<input type="text" class="form-control-custom" value="Warszawa / Rzym">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-1">
|
||||
<label class="form-label-custom">Opis autoprezentacji dla biur</label>
|
||||
<textarea class="form-control-custom" rows="3">Pasjonat kultury śródziemnomorskiej z wykształceniem historycznym. Od 2019 roku z sukcesami pilotuję wycieczki objazdowe po Włoszech, Hiszpanii i Bałkanach. Wyróżnia mnie opanowanie w sytuacjach kryzysowych, doskonały kontakt z grupą oraz płynna znajomość języka włoskiego i angielskiego.</textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 3. Destynacje i Obsługiwane Kraje -->
|
||||
<div class="section-card mb-3" id="destynacje">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-map-pin text-primary me-1'></i> Obsługiwane kraje</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex flex-wrap gap-1 mb-2" id="countryChips">
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')">🇮🇹 Włochy</span>
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')">🇬🇷 Grecja</span>
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')">🇪🇸 Hiszpania</span>
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')">🇭🇷 Chorwacja</span>
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')">🇳🇴 Norwegia</span>
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')">🇦🇹 Austria</span>
|
||||
<span class="chip-tag" onclick="this.classList.toggle('primary')">🇵🇹 Portugalia</span>
|
||||
<span class="chip-tag" onclick="this.classList.toggle('primary')">🇹🇷 Turcja</span>
|
||||
<span class="chip-tag" onclick="this.classList.toggle('primary')">🇫🇷 Francja</span>
|
||||
</div>
|
||||
|
||||
<div class="input-group">
|
||||
<input type="text" id="newCountryInput" class="form-control form-control-custom py-1" placeholder="Wpisz inny kraj...">
|
||||
<button class="btn btn-outline-primary py-1 px-3" type="button" onclick="addNewCountry();" style="border-radius: var(--radius-sm); margin-left: 6px; font-size: 0.78rem;">
|
||||
+ Dodaj
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 4. Języki Obce -->
|
||||
<div class="section-card mb-3" id="jezyki">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-chat text-primary me-1'></i> Języki</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex flex-column gap-2 mb-2">
|
||||
<div class="row g-2 align-items-center">
|
||||
<div class="col-7">
|
||||
<input type="text" class="form-control-custom" value="Polski" readonly>
|
||||
</div>
|
||||
<div class="col-5">
|
||||
<select class="form-select form-control-custom py-1">
|
||||
<option selected>Ojczysty</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-2 align-items-center">
|
||||
<div class="col-7">
|
||||
<input type="text" class="form-control-custom" value="Angielski">
|
||||
</div>
|
||||
<div class="col-5">
|
||||
<select class="form-select form-control-custom py-1">
|
||||
<option>B1 (Średni)</option>
|
||||
<option>B2 (Płynny)</option>
|
||||
<option selected>C1 (Biegły)</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-2 align-items-center">
|
||||
<div class="col-7">
|
||||
<input type="text" class="form-control-custom" value="Włoski">
|
||||
</div>
|
||||
<div class="col-5">
|
||||
<select class="form-select form-control-custom py-1">
|
||||
<option>B1 (Średni)</option>
|
||||
<option selected>B2 (Płynny)</option>
|
||||
<option>C1 (Biegły)</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="button" class="btn btn-sm btn-light w-100 rounded-3 py-1 text-muted" style="font-size: 0.76rem;" onclick="alert('Dodaj kolejny język');">
|
||||
+ Dodaj język
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- 5. Tagi & Specjalizacje -->
|
||||
<div class="section-card mb-4" id="tagi">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-purchase-tag text-primary me-1'></i> Tagi & Specjalizacje</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex flex-wrap gap-1">
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')"><i class='bx bx-check'></i> Objazdówki</span>
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')"><i class='bx bx-check'></i> Trekking & góry</span>
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')"><i class='bx bx-check'></i> Przewodnik miejski</span>
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')"><i class='bx bx-check'></i> Grupy szkolne</span>
|
||||
<span class="chip-tag primary" onclick="this.classList.toggle('primary')"><i class='bx bx-check'></i> VIP / Incentive</span>
|
||||
<span class="chip-tag" onclick="this.classList.toggle('primary')"><i class='bx bx-check'></i> Narty</span>
|
||||
<span class="chip-tag" onclick="this.classList.toggle('primary')"><i class='bx bx-check'></i> Rejsy</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Zapisz -->
|
||||
<div class="mb-4">
|
||||
<button type="button" class="btn-primary-custom" onclick="saveProfile();">
|
||||
<i class='bx bx-save'></i> Zapisz profil publiczny
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div><!-- /.app-content -->
|
||||
|
||||
<script>
|
||||
function updateExpYears() {
|
||||
const startYear = parseInt(document.getElementById('startYearInput').value, 10);
|
||||
const currentYear = new Date().getFullYear();
|
||||
const hint = document.getElementById('expCalculatedHint');
|
||||
if (!isNaN(startYear) && startYear > 1950 && startYear <= currentYear) {
|
||||
const years = currentYear - startYear;
|
||||
hint.innerHTML = `<i class='bx bx-check'></i> Staż: ${years} ${years === 1 ? 'rok' : (years < 5 ? 'lata' : 'lat')}`;
|
||||
hint.className = 'text-primary fw-bold d-block mt-1';
|
||||
} else {
|
||||
hint.innerHTML = `<i class='bx bx-info-circle'></i> Podaj prawidłowy rok`;
|
||||
hint.className = 'text-danger fw-bold d-block mt-1';
|
||||
}
|
||||
}
|
||||
|
||||
function toggleVisibility(checkbox) {
|
||||
const dot = document.getElementById('visibilityDot');
|
||||
const title = document.getElementById('visibilityTitle');
|
||||
if (checkbox.checked) {
|
||||
dot.className = 'status-indicator-dot active';
|
||||
title.innerHTML = 'Widoczny w bazie biur podróży';
|
||||
} else {
|
||||
dot.className = 'status-indicator-dot';
|
||||
title.innerHTML = 'Profil ukryty w bazie biur';
|
||||
}
|
||||
}
|
||||
|
||||
function saveProfile() {
|
||||
const toast = document.getElementById('saveToast');
|
||||
toast.classList.remove('d-none');
|
||||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||
}
|
||||
|
||||
function addNewCountry() {
|
||||
const input = document.getElementById('newCountryInput');
|
||||
const val = input.value.trim();
|
||||
if (val) {
|
||||
const container = document.getElementById('countryChips');
|
||||
const span = document.createElement('span');
|
||||
span.className = 'chip-tag primary';
|
||||
span.innerHTML = '🌍 ' + val;
|
||||
span.onclick = function() { this.classList.toggle('primary'); };
|
||||
container.appendChild(span);
|
||||
input.value = '';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<?php include 'footer.php'; ?>
|
||||
@@ -0,0 +1,221 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$pageTitle = 'TravelLeader - Opinie Biur Podróży';
|
||||
include 'header.php';
|
||||
?>
|
||||
|
||||
<div class="app-content">
|
||||
|
||||
<!-- Pasek powrotu -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<a href="profile.php" class="text-decoration-none d-flex align-items-center gap-1 text-muted" style="font-size: 0.85rem; font-weight: 600;">
|
||||
<i class='bx bx-arrow-back fs-5'></i> Powrót do profilu
|
||||
</a>
|
||||
<span class="badge bg-light text-muted" style="font-size: 0.72rem;">Zweryfikowane przez Travel Manager</span>
|
||||
</div>
|
||||
|
||||
<!-- Podsumowanie ocen (Rating Summary Hero) -->
|
||||
<div class="section-card text-center mb-3">
|
||||
<div class="d-flex align-items-center justify-content-center gap-2 mb-1">
|
||||
<h2 class="fw-bold mb-0" style="color: var(--dark-navy); font-size: 2.2rem;">4.9</h2>
|
||||
<div class="text-start">
|
||||
<div class="text-warning" style="font-size: 1.1rem; line-height: 1;">
|
||||
<i class='bx bxs-star'></i><i class='bx bxs-star'></i><i class='bx bxs-star'></i><i class='bx bxs-star'></i><i class='bx bxs-star-half'></i>
|
||||
</div>
|
||||
<small class="text-muted" style="font-size: 0.72rem;">na podstawie 18 ocen</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-muted mb-3" style="font-size: 0.76rem;">100% biur poleca tego pilota na kolejne wyjazdy</div>
|
||||
|
||||
<!-- Rozbicie gwiazdek -->
|
||||
<div class="d-flex flex-column gap-1" style="max-width: 260px; margin: 0 auto; font-size: 0.72rem;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="width: 24px;">5★</span>
|
||||
<div class="progress flex-grow-1" style="height: 6px;">
|
||||
<div class="progress-bar bg-warning" style="width: 89%;"></div>
|
||||
</div>
|
||||
<span class="text-muted" style="width: 20px;">16</span>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="width: 24px;">4★</span>
|
||||
<div class="progress flex-grow-1" style="height: 6px;">
|
||||
<div class="progress-bar bg-warning" style="width: 11%;"></div>
|
||||
</div>
|
||||
<span class="text-muted" style="width: 20px;">2</span>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="width: 24px;">3★</span>
|
||||
<div class="progress flex-grow-1" style="height: 6px;">
|
||||
<div class="progress-bar bg-warning" style="width: 0%;"></div>
|
||||
</div>
|
||||
<span class="text-muted" style="width: 20px;">0</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Filtry opinii -->
|
||||
<div class="d-flex gap-2 overflow-x-auto pb-2 mb-3" style="white-space: nowrap;">
|
||||
<button class="nav-pill-item active" style="font-size: 0.78rem; padding: 5px 12px;">Wszystkie (18)</button>
|
||||
<button class="nav-pill-item" style="font-size: 0.78rem; padding: 5px 12px;">Włochy (12)</button>
|
||||
<button class="nav-pill-item" style="font-size: 0.78rem; padding: 5px 12px;">Hiszpania (4)</button>
|
||||
<button class="nav-pill-item" style="font-size: 0.78rem; padding: 5px 12px;">Grecja (2)</button>
|
||||
</div>
|
||||
|
||||
<h6 class="fw-bold mb-3" style="color: var(--dark-navy); font-size: 0.9rem;">Opinie od Biur Podróży</h6>
|
||||
|
||||
<!-- Opinia 1 (Z już dodaną odpowiedzią pilota) -->
|
||||
<div class="section-card mb-3">
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center bg-primary-subtle text-primary fw-bold" style="width: 34px; height: 34px; font-size: 0.8rem;">
|
||||
AL
|
||||
</div>
|
||||
<div>
|
||||
<h6 class="fw-bold mb-0" style="font-size: 0.86rem; color: var(--dark-navy);">Biuro Podróży Almatur</h6>
|
||||
<small class="text-muted" style="font-size: 0.7rem;">Wycieczka: Klasyczne Włochy • Maj 2026</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge bg-warning-subtle text-warning fw-bold" style="font-size: 0.72rem;">
|
||||
<i class='bx bxs-star'></i> 5.0
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="mb-3 text-secondary" style="font-size: 0.82rem; line-height: 1.45;">
|
||||
"Pan Oskar prowadził 8-dniowy objazd po Włoszech. Klienci byli zachwyceni jego wiedzą i empatią. Brak jakichkolwiek problemów organizacyjnych. Bardzo chętnie zarezerwujemy kolejne terminy na jesień."
|
||||
</p>
|
||||
|
||||
<!-- Odpowiedź pilota (Już opublikowana) -->
|
||||
<div class="p-3 rounded-3" style="background-color: #f6f7fe; border-left: 3px solid var(--primary);">
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<div class="d-flex align-items-center gap-1">
|
||||
<i class='bx bx-reply text-primary'></i>
|
||||
<span class="fw-bold" style="font-size: 0.76rem; color: var(--primary);">Twoja odpowiedź jako pilot</span>
|
||||
</div>
|
||||
<small class="text-muted" style="font-size: 0.68rem;">3 dni temu</small>
|
||||
</div>
|
||||
<p class="mb-0 text-secondary" style="font-size: 0.78rem; line-height: 1.4;">
|
||||
Dziękuję serdecznie za zaufanie! Współpraca z koordynatorem trasy i grupą układała się wzorowo. Do zobaczenia na kolejnych wyjazdach!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Opinia 2 (Z możliwością dodania odpowiedzi przez formularz) -->
|
||||
<div class="section-card mb-3" id="reviewCard2">
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center bg-info-subtle text-info fw-bold" style="width: 34px; height: 34px; font-size: 0.8rem;">
|
||||
LT
|
||||
</div>
|
||||
<div>
|
||||
<h6 class="fw-bold mb-0" style="font-size: 0.86rem; color: var(--dark-navy);">Logos Tour Warszawa</h6>
|
||||
<small class="text-muted" style="font-size: 0.7rem;">Wycieczka: Andaluzja & Gibraltar • Kwiecień 2026</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge bg-warning-subtle text-warning fw-bold" style="font-size: 0.72rem;">
|
||||
<i class='bx bxs-star'></i> 4.8
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="mb-2 text-secondary" style="font-size: 0.82rem; line-height: 1.45;">
|
||||
"Świetny kontakt telefoniczny i regularne raportowanie przebiegu trasy do centrali biura. Grupa bardzo zadowolona z realizacji programu mimo trudnych warunków pogodowych w górach."
|
||||
</p>
|
||||
|
||||
<!-- Przycisk / formularz odpowiedzi -->
|
||||
<div id="replyArea2">
|
||||
<button type="button" class="btn btn-sm btn-outline-primary rounded-pill py-1 px-3 mt-1" style="font-size: 0.74rem;" onclick="toggleReplyBox(2);">
|
||||
<i class='bx bx-reply'></i> Odpowiedz na opinię
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div id="replyForm2" class="d-none mt-2 p-3 rounded-3" style="background-color: #f8f9fd; border: 1px solid var(--border-color);">
|
||||
<label class="form-label-custom mb-1" style="font-size: 0.76rem;">Napisz publiczną odpowiedź do biura:</label>
|
||||
<textarea id="replyText2" class="form-control-custom mb-2" rows="2" placeholder="Podziękuj za współpracę lub odnieś się do szczegółów wycieczki..."></textarea>
|
||||
<div class="d-flex justify-content-end gap-2">
|
||||
<button type="button" class="btn btn-sm btn-light rounded-pill py-1 px-3" style="font-size: 0.72rem;" onclick="toggleReplyBox(2);">Anuluj</button>
|
||||
<button type="button" class="btn btn-sm btn-primary rounded-pill py-1 px-3" style="font-size: 0.72rem;" onclick="publishReply(2);">Opublikuj odpowiedź</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Opinia 3 -->
|
||||
<div class="section-card mb-4" id="reviewCard3">
|
||||
<div class="d-flex justify-content-between align-items-start mb-2">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="rounded-circle d-flex align-items-center justify-content-center bg-success-subtle text-success fw-bold" style="width: 34px; height: 34px; font-size: 0.8rem;">
|
||||
RT
|
||||
</div>
|
||||
<div>
|
||||
<h6 class="fw-bold mb-0" style="font-size: 0.86rem; color: var(--dark-navy);">Rainbow Tours</h6>
|
||||
<small class="text-muted" style="font-size: 0.7rem;">Wycieczka: Sycylia w pigułce • Wrzesień 2025</small>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge bg-warning-subtle text-warning fw-bold" style="font-size: 0.72rem;">
|
||||
<i class='bx bxs-star'></i> 5.0
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="mb-2 text-secondary" style="font-size: 0.82rem; line-height: 1.45;">
|
||||
"Wzorowy pilotaż i panowanie nad 45-osobową grupą. Zero opóźnień, kierowcy autokaru chwalili dyscyplinę i profesjonalizm pilota."
|
||||
</p>
|
||||
|
||||
<!-- Przycisk odpowiedzi -->
|
||||
<div id="replyArea3">
|
||||
<button type="button" class="btn btn-sm btn-outline-primary rounded-pill py-1 px-3 mt-1" style="font-size: 0.74rem;" onclick="toggleReplyBox(3);">
|
||||
<i class='bx bx-reply'></i> Odpowiedz na opinię
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div id="replyForm3" class="d-none mt-2 p-3 rounded-3" style="background-color: #f8f9fd; border: 1px solid var(--border-color);">
|
||||
<label class="form-label-custom mb-1" style="font-size: 0.76rem;">Napisz publiczną odpowiedź do biura:</label>
|
||||
<textarea id="replyText3" class="form-control-custom mb-2" rows="2" placeholder="Podziękuj za współpracę..."></textarea>
|
||||
<div class="d-flex justify-content-end gap-2">
|
||||
<button type="button" class="btn btn-sm btn-light rounded-pill py-1 px-3" style="font-size: 0.72rem;" onclick="toggleReplyBox(3);">Anuluj</button>
|
||||
<button type="button" class="btn btn-sm btn-primary rounded-pill py-1 px-3" style="font-size: 0.72rem;" onclick="publishReply(3);">Opublikuj odpowiedź</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><!-- /.app-content -->
|
||||
|
||||
<script>
|
||||
function toggleReplyBox(id) {
|
||||
const form = document.getElementById('replyForm' + id);
|
||||
const area = document.getElementById('replyArea' + id);
|
||||
if (form.classList.contains('d-none')) {
|
||||
form.classList.remove('d-none');
|
||||
area.classList.add('d-none');
|
||||
} else {
|
||||
form.classList.add('d-none');
|
||||
area.classList.remove('d-none');
|
||||
}
|
||||
}
|
||||
|
||||
function publishReply(id) {
|
||||
const textInput = document.getElementById('replyText' + id);
|
||||
const val = textInput.value.trim();
|
||||
if (!val) {
|
||||
alert('Wpisz treść odpowiedzi przed publikacją.');
|
||||
return;
|
||||
}
|
||||
|
||||
const form = document.getElementById('replyForm' + id);
|
||||
form.classList.add('d-none');
|
||||
|
||||
const replyArea = document.getElementById('replyArea' + id);
|
||||
replyArea.innerHTML = `
|
||||
<div class="p-3 rounded-3 mt-2" style="background-color: #f6f7fe; border-left: 3px solid var(--primary);">
|
||||
<div class="d-flex justify-content-between align-items-center mb-1">
|
||||
<div class="d-flex align-items-center gap-1">
|
||||
<i class='bx bx-reply text-primary'></i>
|
||||
<span class="fw-bold" style="font-size: 0.76rem; color: var(--primary);">Twoja odpowiedź jako pilot</span>
|
||||
</div>
|
||||
<small class="text-muted" style="font-size: 0.68rem;">Przed chwilą</small>
|
||||
</div>
|
||||
<p class="mb-0 text-secondary" style="font-size: 0.78rem; line-height: 1.4;">${val}</p>
|
||||
</div>
|
||||
`;
|
||||
replyArea.classList.remove('d-none');
|
||||
}
|
||||
</script>
|
||||
|
||||
<?php include 'footer.php'; ?>
|
||||
@@ -0,0 +1,215 @@
|
||||
<?php
|
||||
$enablePrototypeComments = true;
|
||||
$pageTitle = 'TravelLeader - Mój Profil Pilota';
|
||||
include 'header.php';
|
||||
|
||||
// Rok rozpoczęcia działalności jako pilot (z bazy danych / edycji)
|
||||
$startYear = 2019;
|
||||
$currentYear = (int)date('Y');
|
||||
$experienceYears = max(1, $currentYear - $startYear);
|
||||
?>
|
||||
|
||||
<div class="app-content">
|
||||
|
||||
<!-- Pasek nagłówka profilu z akcjami -->
|
||||
<!-- Pasek nagłówka profilu z akcjami i statusem bazy -->
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div>
|
||||
<div class="d-flex align-items-center gap-2 mb-1">
|
||||
<h5 class="fw-bold mb-0" style="color: var(--dark-navy);">Mój Profil</h5>
|
||||
<span class="d-inline-flex align-items-center gap-1 text-success fw-bold" style="font-size: 0.7rem; background: #ecfdf5; padding: 2px 8px; border-radius: 99px; border: 1px solid #a7f3d0;">
|
||||
<span style="width: 6px; height: 6px; background-color: #10b981; border-radius: 50%;"></span> Aktywny w bazie
|
||||
</span>
|
||||
</div>
|
||||
<small class="text-muted" style="font-size: 0.74rem;">Wizytówka widoczna dla biur podróży</small>
|
||||
</div>
|
||||
<a href="profile-edit.php" class="btn btn-sm btn-primary-custom py-2 px-3" style="width: auto; font-size: 0.78rem;">
|
||||
<i class='bx bx-edit-alt'></i> Edytuj
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Karta główna profilu (Hero - w 100% realne informacje pilota) -->
|
||||
<div class="profile-hero">
|
||||
<div class="profile-avatar-container">
|
||||
<div class="profile-avatar-img d-flex align-items-center justify-content-center" style="background: linear-gradient(135deg, #4f46e5, #7c3aed); color: white; font-size: 2.2rem; font-weight: 800;">
|
||||
OK
|
||||
</div>
|
||||
<div class="profile-verified-badge" title="Zweryfikowany pilot TravelLeader">
|
||||
<i class='bx bx-check'></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h4 class="profile-name">Oskar Kaczmarek</h4>
|
||||
<div class="profile-tagline">
|
||||
<i class='bx bx-compass text-primary'></i> Licencjonowany Pilot Wycieczek & Przewodnik
|
||||
</div>
|
||||
|
||||
<!-- Średnia ocen i liczba opinii od biur podróży -> przejście do nowego widoku profile-reviews.php -->
|
||||
<a href="profile-reviews.php" class="rating-badge-pill text-decoration-none" title="Zobacz opinie i referencje biur">
|
||||
<i class='bx bxs-star'></i>
|
||||
<span>4.9 / 5.0</span>
|
||||
<span class="text-muted fw-normal">(18 opinii od 6 biur)</span>
|
||||
<i class='bx bx-chevron-right text-muted'></i>
|
||||
</a>
|
||||
|
||||
<!-- Szybkie statystyki (staż wyliczany automatycznie z roku rozpoczęcia) -->
|
||||
<div class="row g-2 mt-2 pt-2 border-top">
|
||||
<div class="col-4">
|
||||
<div class="fw-bold" style="font-size: 1.05rem; color: var(--dark-navy);"><?= $experienceYears ?> lat</div>
|
||||
<div class="text-muted" style="font-size: 0.7rem;">Staż (od <?= $startYear ?>)</div>
|
||||
</div>
|
||||
<div class="col-4 border-start border-end">
|
||||
<div class="fw-bold" style="font-size: 1.05rem; color: var(--primary);">42</div>
|
||||
<div class="text-muted" style="font-size: 0.7rem;">Zrealizowanych</div>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<div class="fw-bold" style="font-size: 1.05rem; color: #10b981;">100%</div>
|
||||
<div class="text-muted" style="font-size: 0.7rem;">Dyspozycyjność</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sekcja: Autoprezentacja / O mnie -->
|
||||
<div class="section-card">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-user-voice text-primary me-1'></i> O mnie</span>
|
||||
<a href="profile-edit.php#bio" class="text-muted" style="font-size: 0.75rem;"><i class='bx bx-pencil'></i></a>
|
||||
</div>
|
||||
<p class="mb-0 text-secondary" style="font-size: 0.84rem; line-height: 1.5;">
|
||||
Pasjonat kultury śródziemnomorskiej z wykształceniem historycznym. Od <?= $startYear ?> roku z sukcesami pilotuję wycieczki objazdowe po Włoszech, Hiszpanii i Bałkanach. Wyróżnia mnie opanowanie w sytuacjach kryzysowych, doskonały kontakt z grupą oraz płynna znajomość języka włoskiego i angielskiego.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Sekcja: Wideo-Wizytówka & Multimedia -->
|
||||
<div class="section-card">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-video text-primary me-1'></i> Wideo-Wizytówka i Zdjęcia</span>
|
||||
<span class="badge bg-label-primary rounded-pill" style="font-size: 0.7rem;">Wideo + 4 foto</span>
|
||||
</div>
|
||||
|
||||
<!-- Odtwarzacz wideo autoprezentacji -->
|
||||
<div class="video-card-preview" onclick="alert('Odtwarzanie wideo-autoprezentacji pilota (1:15 min). Biuro podróży może posłuchać głosu i prezencji pilota przed wysłaniem zlecenia.');">
|
||||
<div class="video-play-btn">
|
||||
<i class='bx bx-play' style="margin-left: 3px;"></i>
|
||||
</div>
|
||||
<div class="fw-bold" style="font-size: 0.85rem;">Autoprezentacja dla biur (1:15 min)</div>
|
||||
<small style="font-size: 0.72rem; opacity: 0.8;">Kliknij, aby odtworzyć próbkę</small>
|
||||
</div>
|
||||
|
||||
<!-- Siatka zdjęć z tras -->
|
||||
<div class="media-grid mt-2">
|
||||
<div class="media-thumbnail d-flex align-items-center justify-content-center" style="background: linear-gradient(135deg, #60a5fa, #3b82f6); color: white;">
|
||||
<i class='bx bx-landscape fs-2'></i>
|
||||
</div>
|
||||
<div class="media-thumbnail d-flex align-items-center justify-content-center" style="background: linear-gradient(135deg, #f59e0b, #d97706); color: white;">
|
||||
<i class='bx bx-camera fs-2'></i>
|
||||
</div>
|
||||
<div class="media-thumbnail d-flex align-items-center justify-content-center" style="background: linear-gradient(135deg, #10b981, #059669); color: white;">
|
||||
<i class='bx bx-group fs-2'></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sekcja: Obsługiwane Kraje i Destynacje -->
|
||||
<div class="section-card">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-globe text-primary me-1'></i> Kraje & Destynacje</span>
|
||||
<a href="profile-edit.php#destynacje" class="text-muted" style="font-size: 0.75rem;"><i class='bx bx-pencil'></i></a>
|
||||
</div>
|
||||
<div class="d-flex flex-wrap">
|
||||
<span class="chip-tag primary">🇮🇹 Włochy (Ekspert)</span>
|
||||
<span class="chip-tag primary">🇬🇷 Grecja & Cyklady</span>
|
||||
<span class="chip-tag primary">🇪🇸 Hiszpania & Andaluzja</span>
|
||||
<span class="chip-tag">🇭🇷 Chorwacja</span>
|
||||
<span class="chip-tag">🇳🇴 Norwegia (Fiordy)</span>
|
||||
<span class="chip-tag">🇦🇹 Austria</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sekcja: Języki Obce -->
|
||||
<div class="section-card">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-message-dots text-primary me-1'></i> Języki</span>
|
||||
<a href="profile-edit.php#jezyki" class="text-muted" style="font-size: 0.75rem;"><i class='bx bx-pencil'></i></a>
|
||||
</div>
|
||||
<div class="d-flex flex-column gap-2">
|
||||
<div class="d-flex justify-content-between align-items-center p-2 rounded-3" style="background: #f8f9fd;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="font-size: 1.1rem;">🇵🇱</span>
|
||||
<span class="fw-bold" style="font-size: 0.84rem;">Polski</span>
|
||||
</div>
|
||||
<span class="badge bg-light text-dark" style="font-size: 0.72rem;">Ojczysty</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-between align-items-center p-2 rounded-3" style="background: #f8f9fd;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="font-size: 1.1rem;">🇬🇧</span>
|
||||
<span class="fw-bold" style="font-size: 0.84rem;">Angielski</span>
|
||||
</div>
|
||||
<span class="badge bg-primary-subtle text-primary" style="font-size: 0.72rem;">C1 (Biegły)</span>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-between align-items-center p-2 rounded-3" style="background: #f8f9fd;">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<span style="font-size: 1.1rem;">🇮🇹</span>
|
||||
<span class="fw-bold" style="font-size: 0.84rem;">Włoski</span>
|
||||
</div>
|
||||
<span class="badge bg-primary-subtle text-primary" style="font-size: 0.72rem;">B2 (Płynny)</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sekcja: Tagi & Specjalizacje -->
|
||||
<div class="section-card">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-purchase-tag-alt text-primary me-1'></i> Specjalizacje & Tagi</span>
|
||||
<a href="profile-edit.php#tagi" class="text-muted" style="font-size: 0.75rem;"><i class='bx bx-pencil'></i></a>
|
||||
</div>
|
||||
<div class="d-flex flex-wrap">
|
||||
<span class="chip-tag"><i class='bx bx-bus'></i> Wycieczki objazdowe</span>
|
||||
<span class="chip-tag"><i class='bx bx-walk'></i> Trekking & góry</span>
|
||||
<span class="chip-tag"><i class='bx bx-buildings'></i> Przewodnik miejski (Rzym, Florencja)</span>
|
||||
<span class="chip-tag"><i class='bx bx-book-open'></i> Grupy młodzieżowe / szkolne</span>
|
||||
<span class="chip-tag"><i class='bx bx-diamond'></i> Wyjazdy VIP / Incentive</span>
|
||||
<span class="chip-tag"><i class='bx bx-wine'></i> Enoturystyka & kulinaria</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sekcja: Kursy & Certyfikaty -->
|
||||
<div class="section-card">
|
||||
<div class="section-title">
|
||||
<span><i class='bx bx-award text-primary me-1'></i> Certyfikaty i Szkolenia</span>
|
||||
<a href="courses.php" class="text-primary fw-bold" style="font-size: 0.75rem;">Zobacz ofertę szkoleń →</a>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-3 p-2 rounded-3 mb-2" style="background: #f8f9fd;">
|
||||
<div class="d-flex align-items-center justify-content-center rounded-circle bg-success-subtle text-success" style="width: 36px; height: 36px;">
|
||||
<i class='bx bx-badge-check fs-4'></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<div class="fw-bold" style="font-size: 0.84rem; color: var(--dark-navy);">Superpilot Academy 2026</div>
|
||||
<small class="text-muted" style="font-size: 0.72rem;">Certyfikat Pilotażu Europy Południowej</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex align-items-center gap-3 p-2 rounded-3" style="background: #f8f9fd;">
|
||||
<div class="d-flex align-items-center justify-content-center rounded-circle bg-primary-subtle text-primary" style="width: 36px; height: 36px;">
|
||||
<i class='bx bx-plus-medical fs-5'></i>
|
||||
</div>
|
||||
<div class="flex-grow-1">
|
||||
<div class="fw-bold" style="font-size: 0.84rem; color: var(--dark-navy);">Kwalifikowana Pierwsza Pomoc (KPP)</div>
|
||||
<small class="text-muted" style="font-size: 0.72rem;">Ważny do: 04.2028</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Przycisk edycji na dole -->
|
||||
<div class="mb-4">
|
||||
<a href="profile-edit.php" class="btn-primary-custom">
|
||||
<i class='bx bx-edit'></i> Przejdź do edycji danych profilu
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div><!-- /.app-content -->
|
||||
|
||||
<?php include 'footer.php'; ?>
|
||||
Reference in New Issue
Block a user