feat(superpilot-web): wdrozenie webowej bazy pilotow z profilem, wyszukiwarka i zleceniami
- Wyszukiwarka ofert w stylu Pracuj.pl z multiselectem destynacji i filtrem bazy pilota - Przeprojektowany profil pilota zgodny ze standardem UX/UI 2026 i aplikacja mobile - Spokojny, ustrukturyzowany modal rezerwacji i zapytań ofertowych (booking-modal) - Panel zleceń i zapytań ofertowych biura (inquiries.php) powiazany z awatarem profilu - Integracja linku do Superpilota w menu glownym Travel Managera
This commit is contained in:
@@ -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'; ?>
|
||||
Reference in New Issue
Block a user