{% extends "leases/base.html" %}
{% block title %}New lease{% endblock %}
{% block content %}
<h1>New lease</h1>
<div class="wizard-layout">
<form method="post" id="lease-form" class="wizard">
  {% csrf_token %}
  {{ formset.management_form }}
  <ol class="steps"><li data-step="0">Lease</li><li data-step="1">Payments</li><li data-step="2">Rate and costs</li><li data-step="3">Options and exemptions</li></ol>
  {% if form.non_field_errors %}<div class="flash error">{{ form.non_field_errors }}</div>{% endif %}
  <fieldset data-step="0">
    {% for f in form %}{% if f.name in "entity reference description asset_class lessor commencement_date term_months" %}<div class="field">{{ f.label_tag }}{{ f }}{{ f.errors }}{% if f.help_text %}<small>{{ f.help_text }}</small>{% endif %}</div>{% endif %}{% endfor %}
  </fieldset>
  <fieldset data-step="1">
    {% for f in form %}{% if f.name in "payment_amount frequency timing escalation_pct escalation_every_years cpi_indexed rent_free_months" %}<div class="field">{{ f.label_tag }}{{ f }}{{ f.errors }}{% if f.help_text %}<small>{{ f.help_text }}</small>{% endif %}</div>{% endif %}{% endfor %}
  </fieldset>
  <fieldset data-step="2">
    {% for f in form %}{% if f.name in "ibr initial_direct_costs incentives_received prepaid_payments restoration_cost useful_life_months ownership_transfers" %}<div class="field">{{ f.label_tag }}{{ f }}{{ f.errors }}{% if f.help_text %}<small>{{ f.help_text }}</small>{% endif %}</div>{% endif %}{% endfor %}
  </fieldset>
  <fieldset data-step="3">
    {% for f in form %}{% if f.name == "exemption" %}<div class="field">{{ f.label_tag }}{{ f }}{{ f.errors }}</div>{% endif %}{% endfor %}
    <h3>Extension and termination options</h3>
    {{ formset.non_form_errors }}
    {% for sub in formset %}<div class="option-row">{{ sub.kind }} {{ sub.months }} <label>{{ sub.reasonably_certain }} reasonably certain</label>{{ sub.errors }}</div>{% endfor %}
    <small>Only options flagged reasonably certain change the lease term used for measurement.</small>
  </fieldset>
  <div class="actions">
    <button type="button" id="prev" class="secondary">Back</button>
    <button type="button" id="next">Next</button>
    <button type="submit" id="submit">Create lease</button>
  </div>
</form>
<aside class="preview" id="preview"><h3>Live measurement</h3><p class="muted">Fill in the lease to see the opening liability and ROU asset.</p></aside>
</div>
{% endblock %}
{% block scripts %}{% load static %}<script type="module" src="{% static 'leases/app.js' %}" data-preview-url="{% url 'api_preview' %}"></script>{% endblock %}