{% extends "webshop/base.html" %}
{% block section_title %}<h1>Cart</h1>{% endblock %}
{% block content %}
    <h3>List of Items in your Shopping Cart:</h3>
    {% if articles_list %}
      <table class="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">PRICE p.pce.</th>
          <th scope="col">POSITION PRICE</th>
        </tr>
        {% for article in articles_list %}
          <tr class="table_content">
            <td scope="col">{{ article.id }}</td>
            <td scope="col">{{ article.article.id }}</td>
            <td scope="col">
              <a href="{% url 'details' article.article.id %}">
                {{ article.article.name }}
              </a>
            </td>
            <td scope="col">{{ article.article.stock }}</td>
            <td scope="col">
              <form id="amountfield" action="" method="POST" novalidate>
                {{ CartForm }}
                <input type="submit" value="change" />
                {% csrf_token %}
              </form>
              <!-- {{ article.amount }} -->
            </td>
            <td scope="col">
              {{ article.article.price_in_chf }}
              {{ currency_name }}
            </td>
            <td scope="col">{{ article.position_price }} {{ currency_name }}</td>
          </tr>
        {% endfor %}
        <tr>
          <td scope="col" colspan="7" class="text-right">
            Total: {{ total }} {{ currency_name }}
          </td>
        </tr>
      </table>
      <form id="checkout" method="post">
        {% csrf_token %}
        {{ checkout_form.as_p }}
        <input type="submit" value="checkout ->" />
      </form>
    {% else %}
      <p class="alert alert-danger">
        <strong>
          This cart seams to lack some Items.
          Go get some in the store!
        <strong>
      </p>
    {% endif %}
    <p class="alert text-danger">
      <strong>
        {{ message }}
      <strong>
    </p>
{% endblock %}
