{% extends "base.html" %}
{% block title %}Dashboard - volundr{% endblock %}
{% block content %}
<div class="page-head">
  <h1>Your bikes</h1>
  <a href="/bikes/new" class="btn btn-primary">+ New bike</a>
</div>

{% if action %}
<div class="callout callout-danger" role="alert">
  <strong>Book a service now:</strong>
  {% for s in action %}
    <span class="inline-item"><a href="/bikes/{{ s.bike.id }}">{{ s.bike.name }}</a> <span class="badge badge-overdue">{{ status_text(s.due) }}</span></span>
  {% endfor %}
</div>
{% endif %}

{% if due_soon %}
<div class="callout callout-warn" role="alert">
  <strong>Service coming up:</strong>
  {% for s in due_soon %}
    <span class="inline-item"><a href="/bikes/{{ s.bike.id }}">{{ s.bike.name }}</a> <span class="badge badge-due-soon">{{ status_text(s.due) }}</span></span>
  {% endfor %}
</div>
{% endif %}

{% if not bikes %}
  <div class="card empty">
    <p>No bikes yet. Add your first bike to start logging services and repairs.</p>
    <a href="/bikes/new" class="btn btn-primary">Add a bike</a>
  </div>
{% else %}
  <div class="grid">
  {% for s in bikes %}
  <a class="card bike-card {{ status_class(s.due) }}-card" href="/bikes/{{ s.bike.id }}">
    <div class="bike-head">
      <h2 class="bike-name">{{ s.bike.name }}</h2>
      <span class="badge {{ status_class(s.due) }}">{{ status_text(s.due) }}</span>
    </div>
    <dl class="bike-meta">
      {% if s.due.current_mileage is not none %}
        <dt>Odometer</dt><dd>{{ s.due.current_mileage | money }} mi</dd>
      {% endif %}
      {% if s.due.last_service %}
        <dt>Last service</dt><dd>{{ s.due.last_service.event_date }} ({{ s.due.last_service.mileage | money }} mi)</dd>
      {% endif %}
      {% if s.bike.service_interval_miles %}
        <dt>Every</dt><dd>{{ s.bike.service_interval_miles | money }} mi</dd>
      {% endif %}
      <dt>MOT</dt><dd><span class="badge {{ renewal_class(s.mot) }}">{{ renewal_text(s.mot) }}</span></dd>
      <dt>Insurance</dt><dd><span class="badge {{ renewal_class(s.insurance) }}">{{ renewal_text(s.insurance) }}</span></dd>
      <dt>Records</dt><dd>{{ s.event_count }}</dd>
      <dt>Cost to date</dt><dd>{{ s.total_cost | money }}</dd>
    </dl>
  </a>
  {% endfor %}
  </div>
{% endif %}
{% endblock %}