{% extends "base.html" %}
{% block title %}Devices - Juniper Manager{% endblock %}
{% block content %}
<div class="actions-row">
  <h1>Devices</h1>
  {% if current_user.role == 'admin' %}
  <a href="{{ url_for('devices.new_device') }}" class="btn btn-primary">Add device</a>
  {% endif %}
</div>

<div class="card">
  <table>
    <thead>
      <tr><th>Name</th><th>Hostname</th><th>Site</th><th></th></tr>
    </thead>
    <tbody>
      {% for device in devices %}
      <tr>
        <td><a href="{{ url_for('devices.device_detail', device_id=device.id) }}">{{ device.name }}</a></td>
        <td>{{ device.hostname }}:{{ device.port }}</td>
        <td>{{ device.site or "—" }}</td>
        <td>
          <a href="{{ url_for('devices.device_detail', device_id=device.id) }}" class="btn btn-sm">View</a>
          {% if current_user.role == 'admin' %}
          <a href="{{ url_for('devices.edit_device', device_id=device.id) }}" class="btn btn-sm">Edit</a>
          <form class="inline" method="post" action="{{ url_for('devices.delete_device', device_id=device.id) }}" onsubmit="return confirm('Remove device {{ device.name }}?');">
            <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
            <button type="submit" class="btn btn-sm btn-danger">Remove</button>
          </form>
          {% endif %}
        </td>
      </tr>
      {% else %}
      <tr><td colspan="4">No devices yet.</td></tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% endblock %}