{% extends 'base.html' %}
{% block report %}
  <h2 align="center" class="mt-2 mb-4">App Report</h2>
    <table class="table">
      <thead class="thead-dark" style="text-align: center">
        <tr>
          <th scope="col">Location Name</th>
          <th scope="col">Average Rating</th>
          <th scope="col">Total Review (Google API)</th>
          <th scope="col">Total Review (on DB)</th>
          <th scope="col">Status</th>
        </tr>
      </thead>
      <tbody style="text-align: center">
      {% for loc in location_report %}
        <tr>
          <th scope="row">{{ loc.care_name }}</th>
          <td>{{ loc.average_rating }}</td>
          <td>{{ loc.total_review }}</td>
          <td>{{ loc.total_review_DB }}</td>
          {% if loc.total_review <= loc.total_review_DB %}
            <td><i class="fa fa-check-square-o" style="font-size:36px;color:green"></i></td>
          {% else %}
            <td><a href="{% url 'sync-location' loc.location_id %}"><i class="fa fa-refresh" style="font-size:36px;color:#fc9003"></i></span></a></td>
          {% endif %}
        </tr>
      {% endfor %}
      </tbody>
    </table>
{% endblock %}