{% extends 'base.html' %}
{% block title %}Tags Qualys{% endblock %}
{% block content %}
<div class="flex justify-between items-center mb-4">
    <h2 class="text-xl font-bold text-cyber-accent">Tags Qualys <span class="text-sm text-gray-500">({{ stats.total }} — {{ stats.dyn }} DYN / {{ stats.stat }} STAT)</span></h2>
    <div class="flex gap-2">
        {% if can_edit_qualys %}
        <form method="POST" action="/qualys/tags/resync" style="display:inline">
            <button class="btn-sm bg-cyber-border text-cyber-accent" {% if sync_running %}disabled title="Sync Qualys agents en cours"{% else %}data-loading="Synchronisation des tags Qualys...|Cette opération peut prendre 1 à 2 minutes"{% endif %}>Resync API</button>
        </form>
        {% endif %}
        <a href="/qualys/tags/export" class="btn-sm bg-cyber-green text-black">Export CSV</a>
    </div>
</div>

{% if sync_running %}
<div class="card p-3 mb-4" style="border:1px solid #f59e0b;background:rgba(245,158,11,0.1)">
    <span class="text-cyber-yellow font-bold">⏳ Synchronisation Qualys en cours</span>
    <span class="text-xs text-gray-400 ml-2">Le bouton Resync API est désactivé. Patiente la fin du sync agents.</span>
</div>
{% endif %}

{% if msg %}
<div class="mb-3 p-2 rounded text-sm {% if 'error' in msg or 'ko' in msg %}bg-red-900/30 text-cyber-red{% else %}bg-green-900/30 text-cyber-green{% endif %}">
    {% if msg == 'resync_ok' %}Tags resynchronisés depuis l'API Qualys.{% elif msg == 'busy' %}⏳ Une synchronisation Qualys est déjà en cours (agents). Patiente quelques minutes puis réessaie.{% elif msg and msg.startswith('resync_ko') %}Erreur de synchronisation : {{ msg[10:].replace('+', ' ') if msg|length > 10 else 'API Qualys indisponible' }}{% elif msg == 'created' %}Tag créé.{% elif msg == 'create_error' %}Erreur création.{% elif msg == 'deleted' %}Tag supprimé.{% elif msg == 'delete_error' %}Erreur suppression.{% endif %}
</div>
{% endif %}

{% if can_edit_qualys %}
<div class="card p-3 mb-4">
    <form method="POST" action="/qualys/tags/create" class="flex gap-3 items-end">
        <div class="flex-1">
            <label class="text-xs text-gray-500">Créer un tag statique</label>
            <input type="text" name="tag_name" placeholder="ex: MID-TOMCAT, BDD-MONGO" class="w-full font-mono" required>
        </div>
        <button type="submit" class="btn-primary px-4 py-1 text-sm">Créer</button>
    </form>
</div>
{% endif %}

<!-- Filtres -->
<div class="flex gap-2 mb-4 items-center">
    <a href="/qualys/tags" class="btn-sm {% if not tag_type %}bg-cyber-accent text-black{% else %}bg-cyber-border text-gray-300{% endif %}">Tous ({{ stats.total }})</a>
    <a href="/qualys/tags?tag_type=dyn" class="btn-sm {% if tag_type == 'dyn' %}bg-cyber-accent text-black{% else %}bg-cyber-border text-gray-300{% endif %}">DYN ({{ stats.dyn }})</a>
    <a href="/qualys/tags?tag_type=stat" class="btn-sm {% if tag_type == 'stat' %}bg-cyber-accent text-black{% else %}bg-cyber-border text-gray-300{% endif %}">STAT ({{ stats.stat }})</a>
    <form method="GET" class="flex gap-1 ml-auto">
        {% if tag_type %}<input type="hidden" name="tag_type" value="{{ tag_type }}">{% endif %}
        <input type="text" name="search" value="{{ search or '' }}" placeholder="Filtrer..." class="text-xs py-1 px-2 w-44">
        <button type="submit" class="btn-sm bg-cyber-border text-cyber-accent">Chercher</button>
    </form>
</div>

<!-- Table -->
<div class="card overflow-x-auto">
    <table class="w-full table-cyber text-sm">
        <thead><tr>
            <th class="text-left p-2">Nom actuel</th>
            <th class="p-2">Type</th>
            <th class="text-left p-2">Nom V3</th>
            <th class="p-2">Type V3</th>
            <th class="p-2">ID Qualys</th>
            <th class="p-2">Assets</th>
            {% if can_edit_qualys %}<th class="p-2">Action</th>{% endif %}
        </tr></thead>
        <tbody>
        {% for t in tags %}
        <tr class="{% if t.v3_name and t.v3_name != t.name %}bg-yellow-900/5{% endif %}">
            <td class="p-2 font-mono text-cyber-accent">{{ t.name }}</td>
            <td class="p-2 text-center"><span class="badge {% if t.is_dynamic %}badge-blue{% else %}badge-yellow{% endif %}">{{ 'DYN' if t.is_dynamic else 'STAT' }}</span></td>
            <td class="p-2 font-mono text-xs {% if t.v3_name and t.v3_name != t.name %}text-cyber-green{% else %}text-gray-500{% endif %}">{{ t.v3_name or '-' }}</td>
            <td class="p-2 text-center">{% if t.v3_type %}<span class="badge {% if t.v3_type == 'DYN' %}badge-blue{% else %}badge-yellow{% endif %} text-[9px]">{{ t.v3_type }}</span>{% else %}-{% endif %}</td>
            <td class="p-2 text-center text-xs text-gray-500">{{ t.qualys_tag_id }}</td>
            <td class="p-2 text-center">
                {% if t.asset_count > 0 %}
                <a href="/qualys/search?field=tag&search={{ t.name }}" class="text-cyber-accent hover:underline">{{ t.asset_count }}</a>
                {% else %}<span class="text-gray-600">0</span>{% endif %}
            </td>
            {% if can_edit_qualys %}
            <td class="p-2 text-center">
                {% if not t.is_dynamic %}
                <form method="POST" action="/qualys/tags/{{ t.qualys_tag_id }}/delete" style="display:inline">
                    <button class="btn-sm bg-red-900/30 text-cyber-red" onclick="return confirm('Supprimer {{ t.name }} ?')">Suppr</button>
                </form>
                {% else %}<span class="text-xs text-gray-600">Auto</span>{% endif %}
            </td>
            {% endif %}
        </tr>
        {% endfor %}
        </tbody>
    </table>
</div>

<div class="card p-3 mt-4 text-xs text-gray-500">
    <strong>Légende V3 :</strong> Les tags surlignés ont un nom V3 différent du nom actuel (migration à prévoir).
    <span class="text-cyber-green font-mono ml-2">Vert</span> = nouveau nom V3 proposé.
    Cliquez sur le nombre d'assets pour voir les serveurs associés.
</div>
{% endblock %}