{% extends 'layout/backEndLayout.html.twig' %}

{% block title %}Détails de la définition
{% endblock %}

{% block stylesheets %}
	{{ parent() }}
	<link rel="stylesheet" href="{{ asset('assets/css/finance-custom.css') }}">
{% endblock %}

{% block body %}
	<div class="all-title-box" style="background: linear-gradient(135deg, #17a2b8 0%, #138496 100%);">
		<div class="container text-center">
			<h1 style="color: white;">Détails de la définition<span class="m_1" style="color: #d1ecf1;">{{ fee_definition.label }}</span>
			</h1>
		</div>
	</div>

	<div id="overviews" class="section lb">
		<div class="container">
			{% include 'layout/partials/flash_messages.html.twig' %}

			<div class="row">
				<div class="col-lg-8 mx-auto">
					<div class="card shadow">
						<div class="card-header bg-info text-white">
							<h4 class="mb-0">
								<i class="fa fa-info-circle"></i>
								Définition #{{ fee_definition.id }}
							</h4>
						</div>
						<div class="card-body">
							<div class="row mb-3">
								<div class="col-md-6">
									<div class="info-box">
										<label class="font-weight-bold text-muted">
											<i class="fa fa-calendar finance-icon-orange"></i>
											Année scolaire
										</label>
										<p class="h5">{{ fee_definition.schoolYear }}</p>
									</div>

								</div>
								<div class="col-md-6">
									<div class="info-box">
										<label class="font-weight-bold text-muted">
											<i class="fa fa-tag finance-icon-orange"></i>
											Type de frais
										</label>
										<p>
											<span class="badge badge-lg
													                                            {% if fee_definition.feeType.value == 'REGISTRATION' %}badge-primary
													                                            {% elseif fee_definition.feeType.value == 'EXAM' %}badge-warning
													                                            {% else %}badge-success
													                                            {% endif %}">
												{{ fee_definition.feeType.label() }}
											</span>
										</p>
									</div>
								</div>
							</div>

							<div class="info-box mb-3">
								<label class="font-weight-bold text-muted">
									<i class="fa fa-file-text finance-icon-orange"></i>
									Libellé
								</label>
								<p class="h5">{{ fee_definition.label }}</p>
							</div>

							<div class="row mb-3">
								<div class="col-md-6">
									<div class="info-box">
										<label class="font-weight-bold text-muted">
											<i class="fa fa-graduation-cap finance-icon-green"></i>
											Niveau
										</label>
										<p>
											{% if fee_definition.level %}
												<span class="badge badge-secondary badge-lg">{{ fee_definition.level.name }}</span>
											{% else %}
												<span class="text-muted">Tous les niveaux</span>
											{% endif %}
										</p>
									</div>
								</div>
								<div class="col-md-6">
									<div class="info-box">
										<label class="font-weight-bold text-muted">
											<i class="fa fa-money finance-icon-green"></i>
											Montant
										</label>
										<p class="h4 text-success mb-0">{{ fee_definition.amount|number_format(0, ',', ' ') }}
											FCFA</p>
									</div>
								</div>
							</div>

							<div class="row mb-3">
								<div class="col-md-6">
									<div class="info-box">
										<label class="font-weight-bold text-muted">
											<i class="fa fa-clock-o finance-icon-orange"></i>
											Date d'échéance
										</label>
										<p>
											{% if fee_definition.dueDate %}
												{{ fee_definition.dueDate|date('d/m/Y') }}
											{% else %}
												<span class="text-muted">Non définie</span>
											{% endif %}
										</p>
									</div>
								</div>
								<div class="col-md-6">
									<div class="info-box">
										<label class="font-weight-bold text-muted">
											<i class="fa fa-list-ol finance-icon-green"></i>
											Nombre de tranches
										</label>
										<p>
											{% if fee_definition.installments %}
												<span class="badge badge-info badge-lg">{{ fee_definition.installments }}
													tranche(s)</span>
											{% else %}
												<span class="text-muted">Paiement unique</span>
											{% endif %}
										</p>
									</div>
								</div>
							</div>

							<div class="info-box mb-3">
								<label class="font-weight-bold text-muted">
									<i class="fa fa-toggle-on finance-icon-green"></i>
									Statut
								</label>
								<p>
									{% if fee_definition.isActive %}
										<span class="badge badge-success badge-lg">
											<i class="fa fa-check"></i>
											Actif
										</span>
									{% else %}
										<span class="badge badge-secondary badge-lg">
											<i class="fa fa-times"></i>
											Inactif
										</span>
									{% endif %}
								</p>
							</div>

							<hr class="my-4">

							<div class="row">
								<div class="col-md-4 mb-2">
									<a href="{{ path('app_finance_fee_definition_edit', {'id': fee_definition.id}) }}" class="btn btn-warning btn-block btn-lg">
										<i class="fa fa-edit"></i>
										Modifier
									</a>
								</div>
								<div class="col-md-4 mb-2">
									<form method="post" action="{{ path('app_finance_fee_definition_delete', {'id': fee_definition.id}) }}" onsubmit="return confirm('Êtes-vous sûr de vouloir supprimer cette définition ?');">
										<input type="hidden" name="_token" value="{{ csrf_token('delete' ~ fee_definition.id) }}">
										<button class="btn btn-danger btn-block btn-lg">
											<i class="fa fa-trash"></i>
											Supprimer
										</button>
									</form>
								</div>
								<div class="col-md-4 mb-2">
									<a href="{{ path('app_finance_fee_definition_index') }}" class="btn btn-finance-secondary btn-block btn-lg">
										<i class="fa fa-arrow-left"></i>
										Retour
									</a>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
{% endblock %}