{% extends "index.html" %}

{% block main_info %}

<div class="card">
  <div class="card-header"><strong>workflow {{workflow.id}} {{" finished after "+ (workflow.completed_at-workflow.started_at)|formatdelta if workflow.completed_at else "" }}</strong></div>
  <table class="table table-responsive-sm table-hover table-outline mb-0">
    <thead class="thead-light">
    <tr>
      <th class="text-center">id</th>
      <th class="text-center">name</th>
      <th class="text-center">date</th>
      <th class="text-center">steps</th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <tr>
      <td class="text-center">
        {{ workflow.id }}
      </td>
      <td class="text-center">
        {{ workflow.name }}
      </td>
      <td class="text-center">
        <a> {{ workflow.started_at|formatdatetime }} </a>
      </td>
      <td class="text-center">
        <a> {{ workflow.jobs_done }}/{{ workflow.jobs_total }} </a>
      </td>
    </tr>
    </tbody>
  </table>
</div>

<div class="card">
  <div class="card-header">progress</div>
  <div class="card-body">
    <div class="progress">
      {% set progress_percent = "%.2f"|format((workflow.jobs_done|float)/(workflow.jobs_total|float)*100)|string %}
      <div class="progress-bar" role="progressbar" style="width: {{ progress_percent }}%;" aria-valuenow="75"
           aria-valuemin="0" aria-valuemax="100">{{ progress_percent }}%
      </div>
    </div>
  </div>
</div>

<div class="card">
  <div class="card-header"> workflow Jobs</div>
  <div class="card-body">
    <table class="table table-responsive-sm table-bordered table-striped table-sm">
      <thead>
      <tr>
        <th>Id</th>
        <th>Name</th>
        <th>Status</th>
        <th>Duration</th>
      </tr>
      </thead>
      <tbody>
      {% for job in get_jobs(workflow.id) %}
      <tr>
        <td>
          <a href='/workflow/{{ job.workflow_id }}/job/{{ job.jobid }}'> {{ job.jobid }} </a>
        </td>
        <td>
          <a href='/workflow/{{ job.workflow_id }}/job/{{ job.jobid }}'> {{ job.name }} </a>
        </td>
        <td><span class="badge badge-{{ 'success' if job.status=='Done' else ('danger' if job.status=='Error' else 'warning')}}"> {{ job.status }} </span></td>
        <td>
         <a> {{ (job.completed_at-job.started_at)|formatdelta if job.completed_at else '-' }}</a>
        </td>
      </tr>
      {% endfor %}

      </tbody>
    </table>
  </div>
</div>


{% endblock %}
