Files

589 lines
27 KiB
PHP
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<?php
$enablePrototypeComments = true;
$pageTitle = 'TravelLeader - Wycieczki i Zlecenia';
$isAccepted = isset($_GET['accepted']) && $_GET['accepted'] == '15';
$isRejected = isset($_GET['rejected']) && $_GET['rejected'] == '15';
$activeTab = $_GET['tab'] ?? ($isAccepted ? 'current' : 'current');
$currentCount = $isAccepted ? 2 : 1;
$invitationsCount = ($isAccepted || $isRejected) ? 0 : 1;
include 'header.php';
?>
<!-- SYSTEMOWY STACK WSTĄŻEK (Pasy pod nagłówkiem na pełną szerokość - oddzielone kolorami i subtelnym borderem) -->
<div class="system-ribbons-stack">
<!-- 1. WSTĄŻKA ZAPROSZENIA (Ciepły koral/bursztyn, 24h timer, priorytet biznesowy) -->
<?php if (!$isAccepted && !$isRejected): ?>
<div class="system-ribbon-bar ribbon-invitation" id="ribbonInvitationBar">
<div class="d-flex align-items-center gap-2" style="min-width: 0;">
<span class="ribbon-badge ribbon-badge-urgent">⏳ 18h</span>
<div class="ribbon-text">
<span class="fw-bold">Zaproszenie</span>
<span class="ribbon-sub"> • Włochy (05–12.10) • 4 400 zł</span>
</div>
</div>
<div class="d-flex align-items-center gap-2 flex-shrink-0">
<a href="invitation-details.php?id=15" class="btn-ribbon-action btn-ribbon-invitation">
Sprawdź &gt;
</a>
<button type="button" class="btn-ribbon-close" onclick="this.closest('.ribbon-invitation').style.display='none';" title="Zamknij powiadomienie">
<i class='bx bx-x'></i>
</button>
</div>
</div>
<?php endif; ?>
<!-- 2. WSTĄŻKA PROFILU (Chabrowa, uzupełnienie danych) -->
<div class="system-ribbon-bar ribbon-profile" id="ribbonProfileBar">
<div class="d-flex align-items-center gap-2" style="min-width: 0;">
<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 flex-shrink-0">
<a href="profile.php" class="btn-ribbon-action">
Dokończ &gt;
</a>
<button type="button" class="btn-ribbon-close" onclick="this.closest('.ribbon-profile').style.display='none';" title="Zamknij powiadomienie">
<i class='bx bx-x'></i>
</button>
</div>
</div>
</div>
<div class="app-content">
<?php if ($isAccepted): ?>
<!-- Zwięzły alert sukcesu po akceptacji wycieczki -->
<div class="p-2 px-3 rounded-2 mb-2 d-flex align-items-center justify-content-between" style="background: #ecfdf5; border: 1px solid #a7f3d0; font-size: 0.78rem;">
<div class="d-flex align-items-center gap-2">
<i class='bx bx-check-circle fs-5 text-success'></i>
<span class="text-success fw-semibold">Wycieczka #15 została zaakceptowana i dodana do Twojego grafiku!</span>
</div>
<a href="index.php" class="btn-close" style="font-size: 0.65rem;" aria-label="Zamknij"></a>
</div>
<?php elseif ($isRejected): ?>
<!-- Zwięzły alert informacyjny po odrzuceniu -->
<div class="p-2 px-3 rounded-2 mb-2 d-flex align-items-center justify-content-between" style="background: #f8fafc; border: 1px solid #e2e8f0; font-size: 0.78rem;">
<div class="d-flex align-items-center gap-2">
<i class='bx bx-info-circle fs-5 text-muted'></i>
<span class="text-muted">Zaproszenie #15 zostało odrzucone. Biuro podróży otrzymało powiadomienie.</span>
</div>
<a href="index.php" class="btn-close" style="font-size: 0.65rem;" aria-label="Zamknij"></a>
</div>
<?php endif; ?>
<!-- Wyszukiwarka i filtr zakresu dat -->
<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 &rarr; 18 wrz 2027
</small>
</div>
<i class='bx bx-chevron-down text-muted fs-4'></i>
</div>
<!-- Pasek zakładek i przełącznik widoku (Bieżące vs Zaproszenia vs Historia) -->
<div class="trips-tabs-bar">
<div class="nav-pills-custom">
<a href="javascript:void(0);" class="nav-pill-item <?= $activeTab === 'current' ? 'active' : '' ?>" id="tabBtnCurrent" onclick="switchTripsTab('current');">
<i class='bx bx-home-alt-2'></i>
<span>Bieżące</span>
<span class="badge-count" id="badgeCurrentCount"><?= $currentCount ?></span>
</a>
<a href="javascript:void(0);" class="nav-pill-item <?= $activeTab === 'invitations' ? 'active' : '' ?>" id="tabBtnInvitations" onclick="switchTripsTab('invitations');">
<i class='bx bx-envelope'></i>
<span>Zaproszenia</span>
<span class="badge-count <?= $invitationsCount > 0 ? 'badge-alert' : '' ?>" id="badgeInvitationsCount"><?= $invitationsCount ?></span>
</a>
<a href="javascript:void(0);" class="nav-pill-item <?= $activeTab === 'history' ? 'active' : '' ?>" id="tabBtnHistory" onclick="switchTripsTab('history');">
<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" id="tripsViewToggleGroup" style="<?= $activeTab === 'invitations' ? 'display: none !important;' : '' ?>">
<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: BIEŻĄCE WYCIECZKI (LISTA) ==================== -->
<div id="tripsListView" class="<?= $activeTab !== 'current' ? 'd-none' : '' ?>">
<?php if ($isAccepted): ?>
<!-- Nowo zaakceptowana wycieczka #15 -->
<div class="trip-card border-success" style="border-left: 4px solid #10b981 !important;">
<div class="trip-card-header">
<div class="d-flex align-items-center flex-grow-1">
<div class="trip-id-badge" style="background: linear-gradient(135deg, #10b981, #059669); color: white;">15</div>
<div class="trip-title-area">
<div class="d-flex align-items-center gap-1">
<span class="badge bg-success-subtle text-success py-0 px-1" style="font-size: 0.65rem;">Nowo przyjęta</span>
<span class="text-muted small" style="font-size: 0.72rem;">Almatur</span>
</div>
<h5 class="trip-title mb-0">Magia Toskanii i Rzym</h5>
</div>
</div>
<div class="trip-status-pill">
<span class="badge-status bg-success-subtle text-success">Zaakceptowana</span>
<div class="status-subtext">za 382 dni</div>
</div>
</div>
<!-- Dane wycieczki -->
<div class="trip-info-row">
<i class='bx bx-calendar text-primary'></i>
<span>05-12.10.2027 (8 dni)</span>
</div>
<div class="trip-info-row">
<i class='bx bx-group text-primary'></i>
<span>38 osób • Autokar</span>
</div>
<div class="trip-info-row">
<i class='bx bx-map text-primary'></i>
<span>🇮🇹 Włochy (Florencja, Rzym)</span>
</div>
<!-- Stopka karty -->
<div class="trip-card-footer">
<div class="trip-code">
<i class='bx bx-wallet'></i>
<strong class="text-success">4 400 PLN netto</strong>
</div>
<a href="invitation-details.php?id=15" class="btn-details">
Szczegóły &gt;
</a>
</div>
</div>
<?php endif; ?>
<!-- Istniejąca wycieczka #12 -->
<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 &gt;
</a>
</div>
</div>
</div>
<!-- ==================== WIDOK 2: KALENDARZ WYCIECZEK ==================== -->
<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">&nbsp;</span>
</td>
<td onclick="openTripBottomSheet('18 WRZEŚNIA 2027');">
<span class="day-number fw-bold text-primary">18</span>
<span class="trip-ribbon-bar">&nbsp;</span>
</td>
<td onclick="openTripBottomSheet('19 WRZEŚNIA 2027');">
<span class="day-number fw-bold text-primary">19</span>
<span class="trip-ribbon-bar">&nbsp;</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">&nbsp;</span>
</td>
<td onclick="openTripBottomSheet('22 WRZEŚNIA 2027');">
<span class="day-number fw-bold text-primary">22</span>
<span class="trip-ribbon-bar">&nbsp;</span>
</td>
<td onclick="openTripBottomSheet('23 WRZEŚNIA 2027');">
<span class="day-number fw-bold text-primary">23</span>
<span class="trip-ribbon-bar">&nbsp;</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">&nbsp;</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 &rarr;
</a>
</div>
</div>
</div>
<!-- ==================== WIDOK 3: ZAPROSZENIA I OFERTY BIUR (MINIMALISTYCZNA LISTA) ==================== -->
<div id="tripsInvitationsView" class="<?= $activeTab !== 'invitations' ? 'd-none' : '' ?>">
<div class="d-flex justify-content-between align-items-center mb-3">
<h6 class="fw-bold mb-0 text-dark" style="font-size: 0.92rem;">Otrzymane zaproszenia na wycieczki</h6>
<span class="badge bg-primary-subtle text-primary border border-primary-subtle px-2 py-1" style="font-size: 0.72rem;">
<?= $invitationsCount ?> aktywne
</span>
</div>
<?php if (!$isAccepted && !$isRejected): ?>
<!-- Minimalistyczny wiersz zaproszenia #15 (Single-tap) -->
<a href="invitation-details.php?id=15" class="invitation-compact-item is-pending" title="Kliknij, aby przejść do szczegółów i decyzji">
<div class="inv-item-icon">
<i class='bx bx-envelope'></i>
<span class="inv-item-status-dot"></span>
</div>
<div class="inv-item-content">
<div class="inv-item-top">
<span class="inv-item-agency fw-bold" style="color: #ea580c;">Nowe zaproszenie</span>
<span class="inv-item-timer">⏳ 18h na decyzję</span>
</div>
<div class="inv-item-title">#15: Magia Toskanii i Rzym</div>
<div class="inv-item-meta">
<span>05–12.10.2027 (8 dni)</span>
<span>•</span>
<span class="text-success fw-bold">4 400 PLN netto</span>
<span>•</span>
<span>Almatur</span>
</div>
</div>
<div class="inv-item-arrow">
<i class='bx bx-chevron-right fs-4 text-muted'></i>
</div>
</a>
<?php endif; ?>
<?php if ($isAccepted): ?>
<!-- Kompaktowy kafelek zaakceptowanego zlecenia -->
<a href="invitation-details.php?id=15" class="invitation-compact-item is-accepted">
<div class="inv-item-icon" style="background: #ecfdf5; color: #10b981;">
<i class='bx bx-check'></i>
</div>
<div class="inv-item-content">
<div class="inv-item-top">
<span class="inv-item-agency">Almatur Warszawa</span>
<span class="badge bg-success-subtle text-success py-0 px-1" style="font-size: 0.68rem;">Zaakceptowane</span>
</div>
<div class="inv-item-title">Wycieczka #15: Magia Toskanii i Rzym</div>
<div class="inv-item-meta">
<span>05–12.10.2027</span>
<span>•</span>
<span class="text-success fw-semibold">4 400 PLN</span>
</div>
</div>
<div class="inv-item-arrow">
<i class='bx bx-chevron-right fs-4 text-muted'></i>
</div>
</a>
<?php endif; ?>
<?php if ($isRejected): ?>
<!-- Kompaktowy kafelek odrzuconego zlecenia -->
<div class="invitation-compact-item is-rejected">
<div class="inv-item-icon" style="background: #fef2f2; color: #ef4444;">
<i class='bx bx-x'></i>
</div>
<div class="inv-item-content">
<div class="inv-item-top">
<span class="inv-item-agency">Almatur Warszawa</span>
<span class="badge bg-danger-subtle text-danger py-0 px-1" style="font-size: 0.68rem;">Odrzucone</span>
</div>
<div class="inv-item-title">Wycieczka #15: Magia Toskanii i Rzym</div>
<div class="inv-item-meta">
<span>05–12.10.2027</span>
<span>•</span>
<span>Kolizja terminów</span>
</div>
</div>
</div>
<?php endif; ?>
<!-- Zaproszenie zrealizowane z przeszłości -->
<div class="invitation-compact-item opacity-75">
<div class="inv-item-icon" style="background: #f1f5f9; color: #64748b;">
<span>R</span>
</div>
<div class="inv-item-content">
<div class="inv-item-top">
<span class="inv-item-agency">Rainbow Tours</span>
<span class="badge bg-light text-muted border py-0 px-1" style="font-size: 0.68rem;">Zrealizowana</span>
</div>
<div class="inv-item-title">Wycieczka #9: Klasyczna Grecja</div>
<div class="inv-item-meta">
<span>Czerwiec 2026</span>
<span>•</span>
<span>Ocena: ★ 5.0</span>
</div>
</div>
</div>
</div>
<!-- ==================== WIDOK 4: HISTORIA WYCIECZEK ==================== -->
<div id="tripsHistoryView" class="d-none">
<div class="text-center py-5">
<i class='bx bx-history text-muted' style="font-size: 3rem;"></i>
<h6 class="fw-bold mt-2 text-dark">Brak zrealizowanych wycieczek w tym sezonie</h6>
<p class="text-muted small">Wycieczki z poprzednich lat są archiwizowane w bazie zleceń.</p>
</div>
</div>
</div><!-- /.app-content -->
<!-- BOTTOM SHEET DLA WYCIECZKI Z KALENDARZA -->
<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 &gt;
</button>
</div>
</div>
</div>
<script>
function switchTripsTab(tab) {
const tabCurrent = document.getElementById('tabBtnCurrent');
const tabInvitations = document.getElementById('tabBtnInvitations');
const tabHistory = document.getElementById('tabBtnHistory');
const listView = document.getElementById('tripsListView');
const calView = document.getElementById('tripsCalendarView');
const invView = document.getElementById('tripsInvitationsView');
const histView = document.getElementById('tripsHistoryView');
const toggleGroup = document.getElementById('tripsViewToggleGroup');
// Reset tabs
[tabCurrent, tabInvitations, tabHistory].forEach(t => t.classList.remove('active'));
[listView, calView, invView, histView].forEach(v => v.classList.add('d-none'));
if (tab === 'invitations') {
tabInvitations.classList.add('active');
invView.classList.remove('d-none');
if (toggleGroup) toggleGroup.style.setProperty('display', 'none', 'important');
} else if (tab === 'history') {
tabHistory.classList.add('active');
histView.classList.remove('d-none');
if (toggleGroup) toggleGroup.style.setProperty('display', 'none', 'important');
} else {
tabCurrent.classList.add('active');
listView.classList.remove('d-none');
if (toggleGroup) toggleGroup.style.display = 'flex';
// Reset sub toggle to list
document.getElementById('btnListView').classList.add('active');
document.getElementById('btnCalendarView').classList.remove('active');
}
}
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');
}
// Obsługa parametru URL przy starcie (np. kliknięcie dzwonka w headerze)
document.addEventListener('DOMContentLoaded', function() {
const urlParams = new URLSearchParams(window.location.search);
const tabParam = urlParams.get('tab');
if (tabParam === 'invitations') {
switchTripsTab('invitations');
}
});
</script>
<?php include 'footer.php'; ?>