{% load buttons %}
{% load helpers %}
{% load perms %}
{% load static %}
{% load scriptmanager %}

<div class="card">
  <h5 class="card-header">Result</h5>

  <div class="card-body">
    <table class="table table-hover attr-table">
      <tr>
        <th scope="row">Status</th>
        <td>
          {% badge object.get_status_display bg_color=object.get_status_color %}
        </td>
      </tr>
      <tr>
        <th scope="row">Created</th>
        <td>{{ object.created|annotated_date }}</td>
      </tr>
      <tr>
        <th scope="row">Started</th>
        <td>{{ object.started|annotated_date }}</td>
      </tr>
      <tr>
        <th scope="row">Completed</th>
        <td>{{ object.completed|annotated_date }}</td>
      </tr>
      <tr>
        <th scope="row">Duration</th>
        <td>{{ object.duration }}</td>
      </tr>
    </table>
  </div>
</div>