{% extends 'base.html' %}
{% block title %}Historique patching{% endblock %}
{% block content %}
<div class="flex justify-between items-center mb-4">
    <div>
        <h2 class="text-xl font-bold text-cyber-accent">Historique patching</h2>
        <p class="text-xs text-gray-500 mt-1">Vue unifiée : imports xlsx + campagnes standard + QuickWin.</p>
    </div>
    <div class="flex gap-2">
        {% for y in years %}<a href="?year={{ y }}" class="btn-sm {% if y == year %}bg-cyber-accent text-black{% else %}bg-cyber-border text-gray-300{% endif %} px-3 py-1 text-xs">{{ y }}</a>{% endfor %}
    </div>
</div>

<!-- KPIs -->
<div style="display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;">
    <div class="card p-3 text-center" style="flex:1;min-width:0">
        <div class="text-2xl font-bold text-cyber-accent">{{ kpis.total }}</div>
        <div class="text-xs text-gray-500">Events {{ year }}</div>
    </div>
    <div class="card p-3 text-center" style="flex:1;min-width:0">
        <div class="text-2xl font-bold text-cyber-green">{{ kpis.servers }}</div>
        <div class="text-xs text-gray-500">Serveurs distincts</div>
    </div>
    <div class="card p-3 text-center" style="flex:1;min-width:0">
        <div class="text-2xl font-bold text-white">{{ kpis.patchables }}</div>
        <div class="text-xs text-gray-500">Patchables SecOps</div>
    </div>
    <div class="card p-3 text-center" style="flex:1;min-width:0">
        <div class="text-2xl font-bold {% if kpis.never > 0 %}text-cyber-red{% else %}text-cyber-green{% endif %}">{{ kpis.never }}</div>
        <div class="text-xs text-gray-500">Jamais patchés {{ year }}</div>
    </div>
    <div class="card p-3 text-center" style="flex:1;min-width:0">
        <div class="text-2xl font-bold {% if kpis.coverage_pct >= 80 %}text-cyber-green{% elif kpis.coverage_pct >= 50 %}text-cyber-yellow{% else %}text-cyber-red{% endif %}">{{ kpis.coverage_pct }}%</div>
        <div class="text-xs text-gray-500">Couverture</div>
    </div>
</div>

<!-- Répartition par source -->
<div style="display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;">
    <a href="?year={{ year }}&source=import" class="card p-3 text-center hover:border-cyber-accent" style="flex:1;min-width:0">
        <div class="text-2xl font-bold text-blue-400">{{ by_source.import }}</div>
        <div class="text-xs text-gray-500">Import xlsx</div>
    </a>
    <a href="?year={{ year }}&source=standard" class="card p-3 text-center hover:border-cyber-accent" style="flex:1;min-width:0">
        <div class="text-2xl font-bold text-cyan-400">{{ by_source.standard }}</div>
        <div class="text-xs text-gray-500">Campagnes standard</div>
    </a>
    <a href="?year={{ year }}&source=quickwin" class="card p-3 text-center hover:border-cyber-accent" style="flex:1;min-width:0">
        <div class="text-2xl font-bold text-purple-400">{{ by_source.quickwin }}</div>
        <div class="text-xs text-gray-500">QuickWin</div>
    </a>
</div>

<!-- Graphique par semaine -->
{% if by_week %}
<div class="card p-4 mb-4">
    <h3 class="text-sm font-bold text-cyber-accent mb-3">Serveurs patchés par semaine ({{ year }})</h3>
    <div style="display:flex;align-items:flex-end;gap:2px;height:120px;">
        {% set max_val = by_week|map(attribute='servers')|max %}
        {% for w in by_week %}
        <a href="?year={{ year }}&week={{ w.week_num|int }}" title="S{{ w.week_num }} : {{ w.servers }} serveur(s)" style="flex:1;display:flex;flex-direction:column;align-items:center;min-width:0;">
            <div style="width:100%;background:{% if week and week == w.week_num|int %}#00ff88{% elif w.servers >= 30 %}#06b6d4{% elif w.servers >= 15 %}#0e7490{% else %}#164e63{% endif %};border-radius:2px 2px 0 0;height:{{ (w.servers / max_val * 100)|int if max_val else 0 }}px;min-height:2px;"></div>
            <span style="font-size:8px;color:#6b7280;margin-top:2px;">{{ w.week_num }}</span>
        </a>
        {% endfor %}
    </div>
</div>
{% endif %}

<!-- Filtres -->
<div class="card p-3 mb-4">
    <form method="GET" class="flex gap-2 items-center flex-wrap">
        <input type="hidden" name="year" value="{{ year }}">
        <select name="week" class="text-xs py-1 px-2">
            <option value="">Toutes semaines</option>
            {% for w in by_week %}<option value="{{ w.week_num|int }}" {% if week == w.week_num|int %}selected{% endif %}>S{{ w.week_num }} ({{ w.servers }})</option>{% endfor %}
        </select>
        <select name="source" class="text-xs py-1 px-2">
            <option value="">Toutes sources</option>
            <option value="import" {% if source == 'import' %}selected{% endif %}>Import xlsx</option>
            <option value="standard" {% if source == 'standard' %}selected{% endif %}>Campagne std</option>
            <option value="quickwin" {% if source == 'quickwin' %}selected{% endif %}>QuickWin</option>
        </select>
        <select name="os_family" class="text-xs py-1 px-2">
            <option value="">Tous OS</option>
            {% for o in filter_opts.os %}<option value="{{ o }}" {% if os_family == o %}selected{% endif %}>{{ o }}</option>{% endfor %}
        </select>
        <select name="zone" class="text-xs py-1 px-2">
            <option value="">Toutes zones</option>
            {% for z in filter_opts.zones %}<option value="{{ z }}" {% if zone == z %}selected{% endif %}>{{ z }}</option>{% endfor %}
        </select>
        <select name="domain" class="text-xs py-1 px-2">
            <option value="">Tous domaines</option>
            {% for d in filter_opts.domains %}<option value="{{ d }}" {% if domain == d %}selected{% endif %}>{{ d }}</option>{% endfor %}
        </select>
        <select name="intervenant" class="text-xs py-1 px-2">
            <option value="">Tous intervenants</option>
            {% for i in filter_opts.intervenants %}<option value="{{ i }}" {% if intervenant == i %}selected{% endif %}>{{ i }}</option>{% endfor %}
        </select>
        <input type="text" name="hostname" value="{{ hostname or '' }}" placeholder="Hostname..." class="text-xs py-1 px-2" style="width:140px">
        <button type="submit" class="btn-primary px-3 py-1 text-xs">Filtrer</button>
        <a href="/patching/historique?year={{ year }}" class="text-xs text-gray-500 hover:text-cyber-accent">Reset</a>
        <span class="text-xs text-gray-500 ml-auto">{{ total_filtered }} résultat{{ 's' if total_filtered != 1 }}</span>
    </form>
</div>

<!-- Tableau -->
<div class="card overflow-x-auto">
    <table class="w-full table-cyber text-xs">
        <thead><tr>
            <th class="p-2 text-left">Hostname</th>
            <th class="p-2 text-center">OS</th>
            <th class="p-2 text-center">Zone</th>
            <th class="p-2 text-center">Domaine</th>
            <th class="p-2 text-center">État</th>
            <th class="p-2 text-center">Date</th>
            <th class="p-2 text-center">Sem.</th>
            <th class="p-2 text-center">Intervenant</th>
            <th class="p-2 text-center">Source</th>
            <th class="p-2 text-center">Status</th>
            <th class="p-2 text-left">Notes</th>
        </tr></thead>
        <tbody>
        {% for r in rows %}
        <tr class="border-t border-cyber-border/30 hover:bg-cyber-hover/20">
            <td class="p-2 font-mono text-cyber-accent"><a href="/servers/{{ r.sid }}" class="hover:underline">{{ r.hostname }}</a></td>
            <td class="p-2 text-center text-gray-400">{{ (r.os_family or '-')[:6] }}</td>
            <td class="p-2 text-center"><span class="badge {% if r.zone == 'DMZ' %}badge-red{% else %}badge-gray{% endif %}">{{ r.zone or '-' }}</span></td>
            <td class="p-2 text-center text-gray-300">{{ (r.domain_name or '-')[:10] }}</td>
            <td class="p-2 text-center"><span class="badge {% if r.etat == 'Production' %}badge-green{% else %}badge-yellow{% endif %}">{{ (r.etat or '-')[:6] }}</span></td>
            <td class="p-2 text-center text-gray-300">{{ r.date_patch.strftime('%Y-%m-%d %H:%M') if r.date_patch else '-' }}</td>
            <td class="p-2 text-center text-gray-400">{% if r.date_patch %}S{{ r.date_patch.strftime('%V') }}{% else %}-{% endif %}</td>
            <td class="p-2 text-center text-gray-300">{{ r.intervenant_name or '-' }}</td>
            <td class="p-2 text-center">
                {% if r.source_type == 'import' %}<span class="badge" style="background:#1e3a5f;color:#60a5fa;">xlsx</span>
                {% elif r.source_type == 'standard' %}<a href="/campaigns/{{ r.campaign_id }}" class="badge" style="background:#164e63;color:#22d3ee;text-decoration:none">{{ r.campaign_label or 'Campagne' }}</a>
                {% elif r.source_type == 'quickwin' %}<a href="/quickwin/{{ r.run_id }}" class="badge" style="background:#3b1f5e;color:#c084fc;text-decoration:none">{{ r.run_label or 'QuickWin' }}</a>
                {% else %}<span class="badge badge-gray">{{ r.source_type or '?' }}</span>{% endif %}
            </td>
            <td class="p-2 text-center"><span class="badge {% if r.status == 'ok' or r.status == 'patched' %}badge-green{% elif r.status == 'ko' or r.status == 'failed' %}badge-red{% else %}badge-yellow{% endif %}">{{ r.status }}</span></td>
            <td class="p-2 text-gray-400" style="max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="{{ r.notes or '' }}">{{ (r.notes or '-')[:40] }}</td>
        </tr>
        {% endfor %}
        {% if not rows %}
        <tr><td colspan="11" class="p-6 text-center text-gray-500">Aucun event de patching pour ce filtre</td></tr>
        {% endif %}
        </tbody>
    </table>
</div>

<!-- Pagination -->
{% if total_filtered > per_page %}
<div class="flex justify-center gap-2 mt-4">
    {% set qs = 'year=' ~ year ~ ('&week=' ~ week if week else '') ~ ('&source=' ~ source if source else '') ~ ('&os_family=' ~ os_family if os_family else '') ~ ('&zone=' ~ zone if zone else '') ~ ('&domain=' ~ domain if domain else '') ~ ('&intervenant=' ~ intervenant if intervenant else '') ~ ('&hostname=' ~ hostname if hostname else '') %}
    {% if page > 1 %}<a href="?{{ qs }}&page={{ page - 1 }}" class="btn-sm bg-cyber-border text-gray-300 px-3 py-1 text-xs">← Précédent</a>{% endif %}
    <span class="text-xs text-gray-500 py-1">Page {{ page }} / {{ ((total_filtered - 1) // per_page) + 1 }}</span>
    {% if page * per_page < total_filtered %}<a href="?{{ qs }}&page={{ page + 1 }}" class="btn-sm bg-cyber-border text-gray-300 px-3 py-1 text-xs">Suivant →</a>{% endif %}
</div>
{% endif %}
{% endblock %}