network_report_server/app/backend/templates/backend/index.html

{% extends "base.html" %}
{% load backend_tags %}
{% block content %}
<h2>Exfo APIs</h2>
      <div class='row row-cols-md-5 row-cols-2'>
      {% for r in output.results %}
      <div class='p-3 border text-center'><a href="/backend/service_status?cmd={{r.URI}}/v1&section=index">{{ r.display_name }}</a></div>
      {% endfor %}
      </div>
      <!--
      <pre>
      {{ output | pprint }}
      </pre> -->
      <h1>SLA</h1>

      {% for x  in sla.result %}
        {% for k,v in x.items %}

         <!-- <code>
          {{ v|pprint }}
         </code> -->
         <h2>{{ v.sla_name }}</h2>
          <ul>
          {% for k1,v1 in v.items %}
            {% if 'uri' in k1 %}
            <li><a href="/backend/remote?cmd={{v1|urlencode}}">{{ k1|cut:"_uri"|to_label }}</a></li>
            {% endif %}
          {% endfor %}
          </ul>
        {% endfor %}
      {% endfor %}
      <hr>
<h2>Mikrotik APIs</h2>
<!--
<pre>
{{ mk_ips | pprint }}
</pre> -->
<h5 class='text-primary'>IP/ROUTE</h5>
{% for ip in mk_ips %}
<h4>{{ ip.gateway }}</h4>
  <div class='d-flex flex-row justify-content-start  flex-wrap align-content-stretch mb-5'>
    {% for k,v in ip.items %}
      <div class='border p-3 fw-bolder'>{{ k }}</div><div class='border p-3'>{{ v }}</div>
    {% endfor %}
  </div>
  
{% endfor %}

<h5 class='text-primary'>IP/Address</h5>
<!-- 
<pre>
{{ mk_address | pprint }}
</pre> -->
{% for ip in mk_address %}
<h4>{{ ip.interface }}</h4>
  <div class='d-flex flex-row justify-content-start  flex-wrap align-content-stretch mb-5'>
    {% for k,v in ip.items %}
      <div class='border p-3 fw-bolder'>{{ k }}</div><div class='border p-3'>{{ v }}</div>
    {% endfor %}
  </div>
  
{% endfor %}

<div class='py-3'>
  <p>
    <a class="btn btn-primary" data-bs-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample">
      Raw JSON
    </a>
  </p>
  <div class="collapse" id="collapseExample">
    <div class="card card-body">
      <pre>
        {{ sla | pprint }}
      </pre>
    </div>
  </div>
</div>
{% endblock %}