{% extends "webshop/base.html" %}
{% block section_title %}CHECKOUT{% endblock %}
{% block content %}
    <h3>Preview your Purchase:</h3>
    <br>
    <h4>Shipping Address:</h4>
    {% if person %}
    <p><b>Salutation: </b>{{ person.salutation }}</p>
    <p><b>Firstname: </b>{{ request.user.first_name }}</p>
    <p><b>Lastname: </b>{{ request.user.last_name }}</p>
    <p><b>Street: </b>{{ person.street_name }}</p>
    <p><b>Streetnumber: </b>{{ person.street_number }}</p>
    <p><b>City: </b>{{ person.city }}</p>
    {% else %}
      <p class="alert alert-danger">
        <strong>
          Something whent wrong. Your User is incomplete.
        <strong>
      </p>
    {% endif %}
    {% if cart_position_list %}
  <br>
    <h4>Your Items:</h4>
      <table class="table price-table">
        <tr class="table_header">
          <th scope="col">POS.</th>
          <th scope="col">ART#</th>
          <th scope="col">NAME</th>
          <th scope="col">STOCK</th>
          <th scope="col">AMOUNT</th>
          <th scope="col" class="price-label">PRICE p.pce.</th>
          <th scope="col" class="price-label">POSITION PRICE</th>
        </tr>
        {% for cart_position in cart_position_list %}
          <tr class="table_content">
            <td scope="col">{{ cart_position.id }}</td>
            <td scope="col">{{ cart_position.article.id }}</td>
            <td scope="col">
              <a href="{% url 'details' cart_position.article.id %}">
                {{ cart_position.article.name }}
              </a>
            </td>
            <td scope="col">{{ cart_position.article.stock }}</td>
            <td scope="col">{{ cart_position.amount }}</td>
            <td scope="col" class="price-value">
              {{ cart_position.article.price_in_chf }}
              {{ currency_name }}
            </td>
            <td scope="col" class="price-value">
              {{ cart_position.position_price }} {{ currency_name }}
            </td>
          </tr>
        {% endfor %}
        <tr>
          <td scope="col" colspan="5" class="text-right">
          <td scope="col" class="price-value">
            <dt><dl>Total:</dl></dt></td>
          <td scope="col" class="price-value">
             <dt><dl>{{ total }} {{ currency_name }}</dl></dt>
          </td>
        </tr>
        <tr>
          <td scope="col" colspan="5" class="text-right">
          <td scope="col" class="price-value">
            <dt><dl>Exchange Rate to 1 CHF:</dl></dt></td>
          <td scope="col" class="price-value">
             <dt><dl>{{ exchange_rate }}</dl></dt>
          </td>
        </tr>
      </table>
      <form id="checkout_form" action="{% url 'cart' %}" method="POST">
        {% csrf_token %}
        <input type="submit" value="Cancel" class="btn btn-warning" role="button"/>
      </form>
    </br>
      <form id="checkout_form" action="" method="POST">
        {% csrf_token %}
        {{ checkout_form.as_p }}
        <input type="submit" value="Order" class="btn btn-success" role="button"/>
      </form>
    {% else %}
      <p class="alert alert-danger">
        <strong>
          Your cart seamed to lack Items.
          Go get some in the store!
        <strong>
      </p>
    {% endif %}
    <p class="alert text-danger">
      <strong>
        {{ message }}
      </strong>
    </p>
{% endblock %}
