Files
tableau-de-bord/app/templates/dashboard.html

100 lines
4.0 KiB
HTML
Raw 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.
{% extends "base.html" %}
{% block title %}Journal de bord{% endblock %}
{% block content %}
<!-- En-tête date -->
<div class="mb-5">
<p class="font-display text-2xl font-semibold" style="color:var(--ink); letter-spacing:-0.01em;">
{{ today | date_fr }}
</p>
</div>
<!-- Carte aujourd'hui -->
<div class="card card-amber">
<p class="card-label">Aujourd'hui</p>
{% if today_entry %}
<div class="flex items-baseline gap-3">
<span class="stat-number">{{ today_entry.total_hours_str() }}</span>
<span class="stat-sub">travaillées</span>
</div>
<div class="flex items-center justify-between mt-3">
<span class="text-xs font-semibold px-2 py-0.5 rounded" style="background:var(--parchment); color:#6A6258; letter-spacing:0.06em;">
{{ today_entry.day_type }}{% if today_entry.motor_vehicle_id %} · {{ today_entry.motor_vehicle_id }}{% endif %}
</span>
<a href="/entries/{{ today_entry.id }}/edit"
class="text-xs font-semibold" style="color:var(--amber);">Modifier →</a>
</div>
{% if today_entry.comment %}
<p class="mt-2 text-xs italic" style="color:#9A9288;">{{ today_entry.comment }}</p>
{% endif %}
{% else %}
<a href="/entries/new" class="btn-primary btn-amber mt-1" style="letter-spacing:0.06em;">
+ Saisir ma journée
</a>
{% endif %}
</div>
<!-- Carte semaine -->
<div class="card card-ink">
<p class="card-label">Semaine en cours</p>
<div class="flex items-end justify-between">
<div>
<span class="stat-number">{{ week_actual_str }}</span>
<p class="stat-sub mt-1">objectif 38h45</p>
</div>
<span class="balance-badge {% if week_balance >= 0 %}balance-pos{% else %}balance-neg{% endif %}">
{{ '+' if week_balance >= 0 else '' }}{{ week_balance_str }}
</span>
</div>
</div>
<!-- Carte mois -->
{% if month_km %}
<div class="card card-mist">
<p class="card-label">Ce mois — déplacements</p>
<div class="space-y-2 mt-1">
{% for vehicle_id, km in month_km.items() %}
<div class="flex items-baseline justify-between">
<span class="text-xs" style="color:#8A8278;">{{ vehicle_id | capitalize }}</span>
<span class="font-data font-semibold text-sm" style="color:var(--ink);">{{ km }} <span class="font-normal text-xs" style="color:#9A9288;">km</span></span>
</div>
{% endfor %}
<div class="flex items-baseline justify-between pt-1" style="border-top:1px solid var(--parchment);">
<span class="text-xs" style="color:#8A8278;">CO₂</span>
<span class="font-data font-semibold text-sm" style="color:var(--ink);">{{ month_co2_kg }} <span class="font-normal text-xs" style="color:#9A9288;">kg</span></span>
</div>
</div>
</div>
{% endif %}
<!-- Carte congés / RTT -->
<div class="card card-sage">
<p class="card-label">Solde congés &amp; RTT</p>
<div class="space-y-3 mt-1">
<div>
<div class="flex justify-between items-baseline">
<span class="text-xs font-semibold" style="color:#8A8278; letter-spacing:0.06em;">CONGÉS</span>
<span class="font-data text-sm font-semibold" style="color:var(--ink);">
{{ used.conges }}<span class="font-normal text-xs" style="color:#9A9288;"> / {{ balance.conges_total }} j</span>
</span>
</div>
<div class="progress-track">
<div class="progress-fill" style="width:{{ [[used.conges / balance.conges_total * 100, 100] | min, 0] | max }}%; background:var(--sage);"></div>
</div>
</div>
<div>
<div class="flex justify-between items-baseline">
<span class="text-xs font-semibold" style="color:#8A8278; letter-spacing:0.06em;">RTT</span>
<span class="font-data text-sm font-semibold" style="color:var(--ink);">
{{ used.rtt }}<span class="font-normal text-xs" style="color:#9A9288;"> / {{ balance.rtt_total }} j</span>
</span>
</div>
<div class="progress-track">
<div class="progress-fill" style="width:{{ [[used.rtt / balance.rtt_total * 100, 100] | min, 0] | max }}%; background:var(--amber);"></div>
</div>
</div>
</div>
</div>
{% endblock %}