{% extends 'generic/object.html' %}
{% block content %}
  {% spaceless %}
    <div class="row mb-3">

      {# Left column #}
      <div class="col col-md-6">

        <div class="card">
          <h5 class="card-header">Service IP</h5>
          <table class="table table-hover attr-table">
            <tr>
              <th scope="row">Name</th>
              <td>{{ object.name }}</td>
            </tr>
            <tr>
              <th scope="row">Status</th>
              <td>{% badge object.get_status_display bg_color=object.get_status_color %}</td>
            </tr>
            <tr>
              <th scope="row">Active</th>
              <td>{% if object.active %}
                    <span class="text-success">&#10003;</span>
                  {% else %}
                    <span class="text-danger">&#10007;</span>
                  {% endif %}
              </td>
            </tr>
            <tr>
              <th scope="row">Tenant</th>
              <td>{{ object.tenant|linkify|default:"—" }}</td>
            </tr>
            <tr>
              <th scope="row">Monitored</th>
              <td>{% if object.monitored %}Yes{% else %}No{% endif %}</td>
            </tr>
            <tr>
              <th scope="row">Service Start</th>
              <td>{{ object.service_start|date:"Y-m-d H:i"|default:"—" }}</td>
            </tr>
            <tr>
              <th scope="row">Service End</th>
              <td>{{ object.service_end|date:"Y-m-d H:i"|default:"—" }}</td>
            </tr>
            <tr>
              <th scope="row">RT Tickets</th>
              <td>{{ object.rt|default:"—" }}</td>
            </tr>
          </table>
        </div>

        <div class="card mt-3">
          <h5 class="card-header">Attachment</h5>
          <table class="table table-hover attr-table">
            <tr>
              <th scope="row">SAP</th>
              <td>{{ object.sap|linkify|default:"—" }}</td>
            </tr>
            {% if object.sap %}
            <tr>
              <th scope="row">SAP Device</th>
              <td>{{ object.sap.device|linkify }}</td>
            </tr>
            {% endif %}
          </table>
        </div>

        <div class="card mt-3">
          <h5 class="card-header">Encapsulation</h5>
          <table class="table table-hover attr-table">
            <tr>
              <th scope="row">Mode</th>
              <td>{% badge object.get_encapsulation_mode_display bg_color=object.get_encapsulation_mode_color %}</td>
            </tr>
            <tr>
              <th scope="row">QinQ S-VLAN ID</th>
              <td>{{ object.encapsulation_qinq_s_vlan_id|default:"—" }}</td>
            </tr>
            <tr>
              <th scope="row">QinQ C-VLAN ID</th>
              <td>{{ object.encapsulation_qinq_c_vlan_id|default:"—" }}</td>
            </tr>
          </table>
        </div>

        {% include 'inc/panels/custom_fields.html' %}
        {% include 'inc/panels/comments.html' %}
      </div>

      {# Right column #}
      <div class="col col-md-6">

        <div class="card">
          <h5 class="card-header">IP Addresses</h5>
          <table class="table table-hover attr-table">
            <tr>
              <th scope="row">IPv4 Address</th>
              <td>{{ object.ipv4_addr|linkify|default:"—" }}</td>
            </tr>
            <tr>
              <th scope="row">IPv6 Address</th>
              <td>{{ object.ipv6_addr|linkify|default:"—" }}</td>
            </tr>
          </table>
        </div>

        <div class="card mt-3">
          <h5 class="card-header">Routing</h5>
          <table class="table table-hover attr-table">
            <tr>
              <th scope="row">Routing Type</th>
              <td>{% badge object.get_routing_type_display bg_color=object.get_routing_type_color %}</td>
            </tr>
            <tr>
              <th scope="row">Static Next Hop</th>
              <td>{{ object.routing_static_next_hop|linkify|default:"—" }}</td>
            </tr>
            <tr>
              <th scope="row">BGP Peer AS</th>
              <td>{{ object.routing_bgp_peer_as|linkify|default:"—" }}</td>
            </tr>
            <tr>
              <th scope="row">BGP Peer IP</th>
              <td>{{ object.routing_bgp_peer_ip|linkify|default:"—" }}</td>
            </tr>
            <tr>
              <th scope="row">BGP Policy</th>
              <td>{{ object.routing_bgp_policy|default:"—" }}</td>
            </tr>
          </table>
        </div>

        {% if object.routing_prefixes.all %}
          <div class="card mt-3">
            <h5 class="card-header">Routing Prefixes</h5>
            <table class="table table-hover">
              <thead><tr><th>Prefix</th></tr></thead>
              <tbody>
                {% for prefix in object.routing_prefixes.all %}
                  <tr><td>{{ prefix|linkify }}</td></tr>
                {% endfor %}
              </tbody>
            </table>
          </div>
        {% endif %}

        {% include 'inc/panels/tags.html' %}
      </div>

    </div>
  {% endspaceless %}
{% endblock content %}