{% extends 'frontend/base.html' %}
{% load static %}

{% block navbar %}
{% include 'frontend/snippet.navlinks.html' %}
{% endblock %}

{% block content %}
<div class="container-fluid">
  <div class="row">
    <main class="col-12">
      <h2>{{ title }}</h2>

      <div class="mb-3">
        <a href="{% url 'frontend:ansible_results_list' %}" class="btn btn-secondary">← Back to List</a>
        {% if result.machine %}
        <a href="{% url 'frontend:machine_ansible_results' result.machine.pk %}" class="btn btn-info">View Machine Ansible Tab</a>
        {% endif %}
      </div>

      <!-- Result Details -->
      <div class="card mb-3">
        <div class="card-header">
          <h5>Scan Information</h5>
        </div>
        <div class="card-body">
          <table class="table table-sm">
            <tr>
              <th style="width: 200px;">ID:</th>
              <td>{{ result.pk }}</td>
            </tr>
            <tr>
              <th>Machine:</th>
              <td>
                {% if result.machine %}
                <a href="{% url 'frontend:detail' result.machine.pk %}">{{ result.machine.fqdn }}</a>
                {% else %}
                <em>No machine linked</em>
                {% endif %}
              </td>
            </tr>
            <tr>
              <th>Run Date:</th>
              <td>{{ result.run_date|date:"Y-m-d H:i:s" }}</td>
            </tr>
            <tr>
              <th>Ansible Version:</th>
              <td>{{ result.ansible_version|default:"-" }}</td>
            </tr>
          </table>
        </div>
      </div>

      <!-- Raw Facts -->
      <div class="card mb-3">
        <div class="card-header">
          <h5>Raw Ansible Facts (JSON)</h5>
        </div>
        <div class="card-body">
          <pre style="max-height: 500px; overflow-y: auto; background-color: #f5f5f5; padding: 10px; border-radius: 4px;"><code>{{ result.facts_raw|pprint }}</code></pre>
        </div>
      </div>

      <!-- Actions -->
      <div class="card">
        <div class="card-header">
          <h5>Actions</h5>
        </div>
        <div class="card-body">
          {% if result.machine %}
          <form method="post" action="{% url 'frontend:ansible_result_apply' result.pk %}" style="display: inline;">
            {% csrf_token %}
            <input type="hidden" name="redirect_to" value="detail" />
            <button type="submit" class="btn btn-success" onclick="return confirm('Apply this scan result to {{ result.machine.fqdn }}?');">
              Apply to Machine
            </button>
          </form>
          {% endif %}

          <form method="post" action="{% url 'frontend:ansible_result_delete' result.pk %}" style="display: inline;">
            {% csrf_token %}
            <input type="hidden" name="redirect_to" value="list" />
            <button type="submit" class="btn btn-danger" onclick="return confirm('Are you sure you want to delete this scan result?');">
              Delete
            </button>
          </form>
        </div>
      </div>
    </main>
  </div>
</div>
{% endblock %}