{% extends 'base/layout.html' %}
{% load helpers %}

{% block title %}{{ record.device }} - Compliance{% endblock %}

{% block content %}

{% include 'config_officer/navi_panel.html' %}

<div class="d-flex justify-content-between align-items-center mb-3">
    <h1 class="h3 mb-0">{{ record.device }} - compliance status</h1>
    <a href="{% url 'dcim:device' pk=record.device.pk %}" class="btn btn-outline-secondary btn-sm">
        <i class="mdi mdi-server"></i> Back to device
    </a>
</div>

{# -- Summary card ----------------------------------------------------------- #}
<div class="card mb-3">
    <div class="card-header"><strong>Service compliance status</strong></div>
    <table class="table table-hover mb-0">
        <tr>
            <th style="width:200px">Device</th>
            <td>
                <a href="{% url 'dcim:device' pk=record.device.pk %}">{{ record.device }}</a>
            </td>
        </tr>
        <tr>
            <th>Status</th>
            <td>
                {% if record.status == 'compliance' %}
                <span class="badge bg-success fs-6">{{ record.status }}</span>
                {% else %}
                <span class="badge bg-danger fs-6">{{ record.status }}</span>
                {% endif %}
            </td>
        </tr>
        <tr>
            <th>Notes</th>
            <td><span class="text-info">{{ record.notes|default:"—" }}</span></td>
        </tr>
        <tr>
            <th>Attached services</th>
            <td>
                {% for service in record.get_services %}
                <a href="{% url 'plugins:config_officer:service' pk=service.pk %}">
                    {{ service.name }}
                </a><br>
                {% empty %}
                <span class="text-muted">None</span>
                {% endfor %}
            </td>
        </tr>
        <tr>
            <th>Matched templates</th>
            <td>
                {% for template in record.get_device_templates %}
                <a href="{% url 'plugins:config_officer:template' pk=template.pk %}">
                    {{ template.name }}
                </a><br>
                {% empty %}
                <span class="text-muted">None</span>
                {% endfor %}
            </td>
        </tr>
    </table>
</div>

{# -- Config diff card ------------------------------------------------------- #}
<div class="card mb-3">
    <div class="card-header"><strong>Configuration compliance</strong></div>
    <div class="card-body p-0">
        <div class="row g-0">
            <div class="col-md-6 border-end p-3">
                <h6 class="text-muted">Generated config (from templates)</h6>
                <pre class="mb-0"><samp>{{ record.get_generated_config|default:"—" }}</samp></pre>
            </div>
            <div class="col-md-6 p-3">
                <h6 class="text-muted">Diff (missing lines)</h6>
                <pre class="mb-0 text-danger"><samp>{{ record.diff|default:"—" }}</samp></pre>
            </div>
        </div>
    </div>
</div>

{# -- All matched templates --------------------------------------------------- #}
<div class="card mb-3">
    <div class="card-header"><strong>All matched templates</strong></div>
    <table class="table table-hover mb-0">
        <thead>
            <tr>
                <th>Template</th>
                <th>Template text</th>
            </tr>
        </thead>
        <tbody>
            {% for template in record.get_device_templates %}
            <tr>
                <td><a href="{{ template.get_absolute_url }}">{{ template }}</a></td>
                <td>
                    <pre class="mb-0 text-primary"><samp>{{ template.configuration }}</samp></pre>
                </td>
            </tr>
            {% empty %}
            <tr>
                <td colspan="2" class="text-muted">No matched templates</td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</div>

{# -- Running config (collapsible) ------------------------------------------- #}
<div class="mb-3">
    <button type="button" class="btn btn-outline-secondary btn-sm" data-bs-toggle="collapse"
        data-bs-target="#running-config-collapse">
        <i class="mdi mdi-console"></i> Show / hide running config
    </button>
    <span class="text-muted ms-2">
        <small>updated: {{ config_update_date }}</small>
    </span>
</div>
<div id="running-config-collapse" class="collapse">
    <div class="card">
        <div class="card-header">
            <strong>{{ record.device }} running configuration</strong>
        </div>
        <div class="card-body p-0">
            <pre class="mb-0 p-3 text-success"><samp>{{ device_config|default:"Config file not found." }}</samp></pre>
        </div>
    </div>
</div>

{% endblock %}