{% extends 'dashboard.html.twig' %}

{% block sidebard %}
    <li class="nav-item">
        <a class="nav-link active" aria-current="page" href="{{ path("user_panel") }}">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-home"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg>
            <span class="ml-2">Accueil</span>
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="{{ path('user_rents') }}">
            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file"><path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path><polyline points="13 2 13 9 20 9"></polyline></svg>
            <span class="ml-2">Mes Locations</span>
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="{{ path('app_logout') }}">
            <i class="fas fa-sign-out-alt"></i>
            <span class="ml-2">Déconnexion</span>
        </a>
    </li>
{% endblock %}

{% block dashboard_current %}
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ path('user_panel') }}">Panel</a></li>
            <li class="breadcrumb-item"><a href="{{ path('user_rents') }}">Locations</a></li>
            <li class="breadcrumb-item active" aria-current="page">#{{ rent.id }}</li>
        </ol>
    </nav>
{% endblock %}

{% block dashboard_body %}
		{# {{ encore_entry_script_tags('details') }}	#}
    <div class="container">
        <div class="container px-1 px-md-4 py-5 mx-auto">
            <div class="card">
                <a class="fa_icon" href="{{ path('user_rents') }}" style="margin-left: 10px;">
                    <span class="fa fa-angle-left">retour</span>
                </a>
                <div class="row d-flex justify-content-between px-3 top">
                    <div class="d-flex">
                        <h5>Réservation : #{{ rent.id }}</h5>
                    </div>
                    <div class="d-flex flex-column text-sm-right">
                        <p>Proprietaire : <span>{{ rent.caro.renter.name }}</span>
                        - {{ rent.caro.renter.email }}</span></p>
                    </div>
					
					
                </div>
                
                <div class="row justify-content-between px-3 top">
					
                    <div class="row d-flex icon-content">
                        
                        <div class="d-flex flex-column text-sm-right">
                            
							<p>Adresse du Hangar : <span>{{ rent.caro.adresse }}</span></p>
                        </div>
						<div class="d-flex flex-column text-sm-right">
                            {% if rent.caro.available %} 
							<p>Hangar Libre : {{ rent.caro.available }}</p>
							{% else %}
							<p>Hangar loué depuis {{ rent.startDate|date('d-m-Y') }} </p>
							{% endif %}   
                        </div>
						<div class="d-flex flex-column text-sm-right">
                            
							<p>rent.isPaid: <span>{{ rent.isPaid ? 'Yes' : 'No' }}</span>
							 - rent.PaidMonths: <span>{{ rent.PaidMonths }}</span></p>
                        </div>
                    </div>
                    <div class="row d-flex icon-content">
                        
                        
						<div class="d-flex flex-column">
                                <p>Location Mensuel : {{ rent.price }} euros - 
								Location par Jour : {{ rent.caro.price }} euros</p>
                        </div>
						<div class="d-flex flex-column">
						<p class="font-weight-bold">Sol : {{ rent.caro.features['sol'] }}-
						Bati : {{ rent.caro.features['bati'] }} - 
						Surface : {{ rent.caro.features['surface'] }} -
						Ouvert : {{ rent.caro.features['ouvert'] }} </p>
						</div>
                    </div>
					
					
                    <div class="row d-flex icon-content">
                        
                        <div class="d-flex flex-column">
						<p><img height="100px" src="{{ asset("uploads/images/Cars/") ~ rent.caro.image  }}" ></p>
                        </div>
                    </div>
					
                </div>
            </div>
        </div>
	
    <table class="table">
        <thead>
            <tr>
                <th>Id</th>
				<th>Idrent</th>
                <th>Adresse</th>
				<th>Idcaro</th>
				<th>Name</th>
                <th>Idcaro</th>
                <th>IdBailleur</th>
                <th>Mois</th>
                <th>Dateregl</th>
				<th>DateRefLoyer</th>
                <th>Price</th>
                <th>actions</th>
            </tr>
        </thead>
        <tbody>
		{% set count = 0 %}
        {% for loyer in loyer %}
		   	{% set count = count + 1 %}
            <tr>
                <td>{{ loyer.id }}</td>
				<td>{{ loyer.idrent }}</td>
                <td>{{ loyer.relation.caro.adresse }}</td>
				<td>{{ loyer.idcaro }}</td>
				<td>{{ loyer.relation.caro.renter.name }}</td>
				<td>{{ loyer.relation.user.firstname }}</td>
                
                <td>{{ loyer.iduser }}</td>
                <td>{{ loyer.mois }}</td>
                <td>{{ loyer.dateregl ? loyer.dateregl|date('Y-m-d') : '' }}</td>
				<td>{{ loyer.daterefloyer ? loyer.daterefloyer|date('Y-m-d') : '' }}</td>
                <td>{{ loyer.price }}</td>
                
            </tr>
        {% else %}
            <tr>
                <td colspan="8">no records found</td>
            </tr>
        {% endfor %}
		<h2>Nombre de Loyer : {{ count }}</h2>
        </tbody>
    </table>
		
    </div>
{% endblock %}