{% extends 'base.html.twig' %}
{% set titre ='Réservation' %}
{% block title %}{% endblock %}
{% block body %}
	<section class="mt-7 py-0">
		<div class="bg-holder w-50 bg-right d-none d-lg-block" style="background-image:url({{ asset('assets/img/gallery/hero-section-1.png')}});"></div>
		<!--/.bg-holder-->

		<div class="container-sm">
			<div class="col-12 col-md-8 col-xl-5">
				<span id="bookingId" data="{{ booking.id}} "></span>
				<table class="table-responsive{-sm|-md|-lg|-xl|-xxl}">
					<tr>
						<td style="font-weight:bold ; vertical-align:top" width="50%">
							<h4>{{ titre }}
								<span id="numdossier">
									<strong>{{ booking.numdossier }}</strong>
								</span>
							</h4>
						</td>
						<td style="font-weight:bold ; vertical-align:top">
							<table border="0">
								{% set i = 0 %}
								{% for passager in passagers %}
									{% set i = i + 1 %}
									<tr>
										<td>
											{{ i }}
											-
										</td>
										<td>
											{{ passager.lastname }}
											{{ passager.firstname }}
										</td>
									</tr>
								{% endfor %}
							</table>
						</td>
					</tr>
					<tr>
						<td>
							{{ booking.schedule.company }}
							<div>
								{% if booking.schedule.company.image is null %}
									<img class="img-thumbnail" src="{{ asset('assets/img/company/')}}0.jpg" width=" 120" height=" 60">
								{% else %}
									<img class="img-thumbnail" src="{{ asset('assets/img/company/')}}{{booking.schedule.company.image}}" width="120" height="60">
								{% endif %}
							</div>
						</td>
						<td>
							{% for conf in booking.schedule.bus.conforts %}
								<i class='{{conf.class}}' desc='{{conf.name}}' title={{conf.description}}></i>
								{{conf.description}}
							{% endfor %}
						</td>
					</tr>
				</table>
				<table>
					<tr>
						<td colspan="3">
							<svg fill="#757575" class="_11vpoll" viewbox="0 0 24 24" width="24px" height="24px">
								<path d="M2,8 L18,8 L18,20 L2,20 L2,8 Z M13.9798254,0 L13.9798254,2 L6,2 L6,0 L3,0 L3,2 L2.00104344,2 C0.895897664,2 1.04665405e-13,2.89821238 9.79822387e-14,3.99079514 L-7.88860905e-31,20.0092049 C-6.72539167e-15,21.1086907 0.898212381,22 1.99079514,22 L18.0092049,22 C19.1086907,22 20,21.1017876 20,20.0092049 L20,3.99079514 C20,2.89130934 19.1090599,2 17.9997971,2 L16.9760131,2 L17,0 L13.9798254,0 Z M10,18 L16,18 L16,12 L10,12 L10,18 Z"></path>
							</svg>
							<span>
								{{ booking.schedule.scheduleDate ? booking.schedule.scheduleDate|format_datetime('full', 'none', locale='fr') }}
							</span>
						</td>
						<td rowspan="3" style="text-align: right"><img width="50%" src='{{ qrcode }}'></td>
					</tr>
					<tr>
						<td>
							<strong>{{ booking.schedule.departureTime ? booking.schedule.departureTime|date('H:i') : '' }}</strong>
						</td>
						<td>
							<svg
								class="_1mmywa6" viewbox="0 0 24 24" width="24px" height="24px" stroke="grey" stroke-width="2" stroke-linecap="round" fill="none" fill-rule="evenodd">
								{# <path d="M4,12 L20,12 M12,6 L20,12 M12,18 L20,12"></path> #}
								<circle cx="6" cy="12" r="3"></circle>
								<path d="M6,12 L6,24"></path>
							</svg>
						</td>
						<td>
							{{ booking.schedule.depart }}
							-
							{{ booking.agenceDepart }}

						</td>
					</tr>
					<tr>
						<td>
							<strong>{{ booking.schedule.estimatedArrivalTime ? booking.schedule.estimatedArrivalTime|date('H:i') : '' }}
							</strong>
						</td>
						<td>
							<svg
								class="_1mmywa6" viewbox="0 0 24 24" width="24px" height="24px" stroke="grey" stroke-width="2" stroke-linecap="round" fill="none" fill-rule="evenodd">
								{# <path d="M4,12 L20,12 M12,6 L20,12 M12,18 L20,12"></path> #}
								<circle cx="6" cy="12" r="3"></circle>
								<path d="M6,12 L6,0"></path>
							</svg>
						</td>
						<td>
							{{ booking.schedule.arrivee }}
							-
							{{ booking.agenceArrivee }}
						</td>
					</tr>
				</table>
				<table>
					{% if booking.status  %}
						<tr>
							<td>Montant :
								{{ booking.totalAmount }}
								{{ booking.status.currency }}
								-
							</td>
							<td style="text-align: right">
								Transaction :
								{{ booking.status.financialTransactionId }}
							</td>
						</tr>

					{% else %}
						<tr>
							<th>Status de la transaction</th>
							<td>
								<span id="statusmsg">Non payée</span>
							</td>
						</tr>
					{% endif %}
				</table>
				{% if not(booking.user) and (booking.status) %}
					{{ form_start(form) }}
					<div class=" input-group mb-3">
						<label>Pour recevoir votre ticket par mail, veuillez remplir le champs ci-dessous :</label>
					</div>
					<input type="hidden" id="phone" name="phone" value="{{booking.status.payer.partyId[3:]}}"/>
					{{ form_row(form.email) }}
					{{ form_row(form.password) }}
					{{ form_row(form.send) }}
					{{ form_end(form) }}
				{% endif %}
				<div class=" input-group mb-3">
					<a href="{{ path('app_booking_index')}}">Retour à la liste</a>
				</div>
			</div>
		</div>
	</section>
{% endblock %}
{% block footer %}
	{{ include('footer.html.twig') }}
{% endblock %}