{% extends "base.html" %}
{% load static %}
{% load users_extra %}
{% block entete %}{% if self %}Mon Profil{% else %}Profil de {{user}}{% endif %}{%endblock%}
{% block extra_script %}<script src="{% static 'jquery.js' %}"></script>{% endblock %}
{% block navbar %}
<ul>
	<li><a href="#first">{% if self %}Mes informations {% else %} Informations {% endif %}</a>
	</li>
	<li><a href="#second">{% if self %}Mes dernières consommations {% else %} Dernières consommations {% endif %}</a>
	</li>
	<li><a href="#third">{% if self %}Mes derniers rechargements{% else %}Derniers rechargements {% endif %}</a>
	</li>
	<li><a href="#fourth">{% if self %} Mes cotisations {% else %} Cotisations {% endif %}</a></li>
	<li><a href="#fifth">{% if self %} Mes accès gracieux {% else %} Accès gracieux {% endif %}</a></li>
	<li><a href="#sixth">{% if self %} Mes banissements {% else %} Banissements {% endif %}</a></li>
</ul>
{% endblock %}
{% block content %}
<section id="first" class="main">
	<div class="content">
		<header class="major">
			<h2>{% if self %} Mes informations {% else %} Informations {% endif %}</h2>
		</header>
		<div class="row">
			<div class="12u">
				<ul class="alt" id="informationsClient">
					<li>
						<b>Nom : </b>{{user.last_name}}<span class="tabulation">
						<b>Prénom : </b>{{user.first_name}}</span><span class="tabulation">
						<b>École : </b>{{user.profile.school}}</span>
					</li>
					<li><b>Nom d'utilisateur : </b>{{user.username}}<span class="tabulation">
						<b>Adresse mail: </b> {{user.email}}</span>
					</li>
					<li>
						<b>Date inscription : </b>{{user.date_joined}}<span class="tabulation">
						<b>Fin de cotisation: </b> {{user.profile.cotisationEnd|default:"Aucune cotisation"}}</span>
					</li>
					<li><b>Solde : </b>{{user.profile.balance}} €<span class="tabulation">
						<b>Crédit : </b>{{user.profile.credit}} €</span><span class="tabulation">
						<b>Débit : </b>{{user.profile.debit}} €</span><span class="tabulation">
						<b>Débit direct : </b>{{user.profile.direct_debit}}</b></span>
					</li>
					<li><b>Groupe(s) : </b>{{user.groups.all|join:", "}}</li>
					<li>
						<b>Position au classement : </b>{{user.profile.rank}}<span class="tabulation">
						<b>Quantité d'alcool ingérée : </b>{{user.profile.alcohol | floatformat:"-2"}} kg</span><span class="tabulation">
						<b>Nombre de pinte(s) non rendue(s) : </b> {{ user.pintes_owned_currently.count }} </span>
					</li>
				</ul>
			</div>
			<div class="12u">
				<ul class="alt">
					<li>
						{% if self or perms.users.change_user %}
						<span><a href="{% url 'users:editUser' user.pk %}"><i class="fa fa-pencil-alt"></i> Modifier {{self | yesno:"mes,les"}} informations</a></span>
						{% endif %}
						{% if self %}
						<span class="tabulation"><a href="{% url 'users:editPassword' user.pk %}"><i class="fa fa-user-lock"></i> Changer mon mot de passe</a></span>
						{% endif %}
						{% if perms.users.can_change_user_perm %}
						<span class="tabulation"><a href="{% url 'users:editGroups' user.pk %}"><i class="fa fa-layer-group"></i> Changer les groupes</a></span>
						{% endif %}
						{% if perms.auth.change_user %}
						<span class="tabulation"><a href="{% url 'users:switchActivateUser' user.pk %}"><i class="fa fa-check-circle"></i> {{ user.is_active | yesno:"Désa,A"}}ctiver</a></span>
						{% endif %}
						{% if perms.users.view_user %}
						<span class="tabulation"><a href="{% url 'users:genUserInfos' user.pk %}"><i class="fa fa-id-card"></i> Générer les informations</a></span>
						{% endif %}
					</li>
				</ul>
			</div>
		</div>
	</div>
	<section class="row uniform">
			<canvas id="myChart" width="2000px" height="2000px"></canvas>
			<script src="{% static 'chart.min.js' %}"></script>
			<script src="{% static 'randomColor.js' %}"></script>
			<script>
			var ctx = document.getElementById("myChart").getContext('2d');
			var bgColor = randomColor({count: {{products|length}}});
			var myChart = new Chart(ctx, {
				type: 'pie',
				data: {
					labels: [{% for p in products %}"{{p}}", {% endfor %}],
					datasets: [{
						label: '# of Votes',
						data: [{% for q in quantities %}{{q}}, {% endfor %}],
						backgroundColor: bgColor
					}]
				},
				options: {
					scales: {
						yAxes: [{
							ticks: {
								beginAtZero:true
							}
						}]
					}
				}
			});
			</script>
	</section>
</section>
<section id="second" class="main">
	<header class="major">
		<h2>{{self | yesno:"Mes dernières,Dernières"}} consommations</h2>
		<p>(Affichage des 10 dernières entrées : <a href="{% url 'users:allConsumptions' user.pk 1 %}">Voir toutes les entrées</a>)</p>
	</header>
	<section id="transactions">
		<div class="table-wrapper">
			<table>
				<thead id="headTransaction">
					<tr>
						<th>Produit</th>
						<th>Quantité</th>
						<th>Montant</th>
						<th>Type de Paiement</th>
						<th>Date</th>
						<th>Annuler</th>
					</tr>
				</thead>
				<tbody id="bodyTransaction">
					{% for c in lastConsumptions %}
					<tr>
						<td>{% if perms.gestion.view_product %}<a href="{% url 'gestion:productProfile' c.product.pk %}">{{ c.product.name }}</a>{% else %}{{c.product}}{% endif %}</td>
						<td>{{c.quantity}}</td>
						<td>{{c.amount}} €</td>
						<td>{{c.paymentMethod}}</td>
						<td>{{c.date}}</td>
						<td>{% if perms.gestion.delete_consumptionhistory %}<a href="{% url 'gestion:cancelConsumption' c.pk %}" class="button small"><i class="fa fa-times"></i> Annuler</a>{% endif %}</td>
					</tr>
					{%endfor%}
				</tbody>
			</table>
		</div>
	</section>
</section>
<section id="secondbis" class="main">
	<header class="major">
		<h2>{{self | yesno:"Mes derniers,Derniers"}} menus</h2>
		<p>(Affichage des 5 dernières entrées : <a href="{% url 'users:allMenus' user.pk 1 %}">Voir toutes les entrées</a>)</p>
	</header>
	<section id="transactions">
		<div class="table-wrapper">
			<table>
				<thead id="headTransaction">
					<tr>
						<th>Menu</th>
						<th>Quantité</th>
						<th>Montant</th>
						<th>Type de Paiement</th>
						<th>Date</th>
						<th>Annuler</th>
					</tr>
				</thead>
				<tbody id="bodyTransaction">
					{% for m in lastMenus %}
					<tr>
						<td>{{m.menu}}</td>
						<td>{{m.quantity}}</td>
						<td>{{m.amount}} €</td>
						<td>{{m.paymentMethod}}</td>
						<td>{{m.date}}</td>
						<td>{% if perms.gestion.delete_menuhistory %}<a href="{% url 'gestion:cancelMenu' m.pk %}" class="button small"><i class="fa fa-times"></i> Annuler</a>{% endif %}</td>
					</tr>
					{%endfor%}
				</tbody>
			</table>
		</div>
	</section>
</section>
<section id="third" class="main">
	<header class="major">
		<h2>{{self | yesno:"Mes derniers,Derniers"}} rechargements</h2>
		<p>(Affichage des 5 dernières entrées : <a href="{% url 'users:allReloads' user.pk 1 %}">Voir toutes les entrées</a>)</p>
	</header>
	<section>
		<div class="table-wrapper">
			<table>
				<thead>
					<tr>
						<th>Montant</th>
						<th>Type de Rechargement</th>
						<th>Date</th>
						{% if perms.gestion.delete_reload %}
						<th>Annuler</th>
						{% endif %}
					</tr>
				</thead>
				<tbody>
					{% for reload in reloads %}
					<tr>
						<td>{{reload.amount}} €</td>
						<td>{{reload.PaymentMethod}}</td>
						<td>{{reload.date}}</td>
						{% if perms.gestion.delete_reload %}
						<th><a href="{% url 'gestion:cancelReload' reload.pk %}" class="button small"><i class="fa fa-times"></i> Annuler</a></th>
						{% endif %}
					</tr>
					{% endfor %}
				</tbody>
			</table>
		</div>
	</section>
</section>

<section id="fourth" class="main">
	<header class="major">
		<h2>{{ self | yesno:"Mes cotisations,Cotisations"}}</h2>
	</header>
	<section>
		<a class="button" href="{% url 'users:addCotisationHistory' user.pk %}"><i class="fa fa-comments-dollar"></i> Ajouter une cotisation</a><br><br>
		<div class="table-wrapper">
			<table>
				<thead>
					<tr>
						<th>Montant</th>
						<th>Durée</th>
						<th>Date de paiement</th>
						<th>Moyen de paiement</th>
						<th>Date de fin</th>
						<th>Modération</th>
					</tr>
				</thead>
				<tbody>
					{% for cotisation in cotisations %}
					<tr>
						<td>{{cotisation.amount}} €</td>
						<td>{{cotisation.duration}} jours</td>
						<td>{{cotisation.paymentDate}}</td>
						<td>{{cotisation.paymentMethod}}</td>
						<td>{{cotisation.endDate}}</td>
						<td>{% if perms.users.delete_cotisationhistory %}<a class="button small" href="{% url 'users:deleteCotisationHistory' cotisation.pk %}"><i class="fa fa-trash"></i> Supprimer</a>{% endif %}</td>
					</tr>
					{% endfor %}
				</tbody>
			</table>
		</div>
	</section>
</section>

<section id="fifth" class="main">
	<header class="major">
		<h2>{{ self | yesno:"Mes accès gracieux,Accès gracieux"}}</h2>
	</header>
	<section>
		<a class="button" href="{% url 'users:addWhiteListHistory' user.pk %}"><i class="fa fa-handshake"></i> Ajouter un accès à titre gracieux</a><br><br>
		<div class="table-wrapper">
			<table>
				<thead>
					<tr>
						<th>Date de l'ajout</th>
						<th>Date de fin</th>
						<th>Durée</th>
						<th>Raison</th>
					</tr>
				</thead>
				<tbody>
					{% for whitelist in whitelists %}
					<tr>
						<td>{{whitelist.paymentDate}}</td>
						<td>{{whitelist.endDate}}</td>
						<td>{{whitelist.duration}} jours</td>
						<td>{{ whitelist.reason }}</td>
					</tr>
					{% endfor %}
				</tbody>
			</table>
		</div>
	</section>
</section>

<section id="sixth" class="main">
	<header class="major">
		<h2>{{ self | yesno:"Mes banissements,Banissements"}}</h2>
	</header>
	<section>
		{% if perms.users.add_banishmenthistory %}
		<a class="button" href="{% url 'users:addBanishmentHistory' user.pk %}"><i class="fa fa-hand-paper"></i> Ajouter un banissement</a><br><br>
		{% endif %}
		<div class="table-wrapper">
			<table>
				<thead>
					<tr>
						<th>Date de début</th>
						<th>Date de fin</th>
						<th>Raison</th>
					</tr>
				</thead>
				<tbody>
					{% for banishment in banishments %}
					<tr>
						<td>{{banishment.ban_date}}</td>
						<td>{{banishment.end_date}}</td>
						<td>{{ banishment.reason }}</td>
					</tr>
					{% endfor %}
				</tbody>
			</table>
		</div>
	</section>
</section>
{%endblock%}