{% load i18n %}
{% load servo_tags %}
<table class="table table-hover">
  <thead>
    <tr>
      {% if order.is_editable %}
      <th style="width:20px"></th>
      {% endif %}
      <th>{% trans "Part" %}</th>
      <th>{% trans "Stock Price" %}</th>
      <th>{% trans "Exchange Price" %}</th>
    </tr>
  </thead>
  <tbody class="searchable">
  {% for p in products %}
    <tr>
      {% if order.is_editable %}
      <td><input type="checkbox" data-url="{% url 'orders-add_part' pk=order.pk device=device.pk code=p.code %}" class="async" data-reload="#products"/></td>
      {% endif %}
      <td>
        <a href="{% url 'products-get_info' p.code request.user.get_location.pk %}" data-modal="#modal"><strong>{{ p.code }}</strong></a>{% if p.subst_code %}<br/><small class="muted">{% blocktrans with code=p.subst_code %}Substituted to {{ code }}{% endblocktrans %}</small>{% endif %}<br/>
        {{ p.title }}<br/><small class="muted">{{ p.eee_code|default:"-"|addspace }}</small></td>
        <td>{{ p.price_sales_stock|currency }}</td>
        <td>{{ p.price_sales_exchange|currency }}</td>
      </tr>
      {% empty %}
      <tr><td colspan="5" class="muted empty">{% trans "No products found" %}</td></tr>
    {% endfor %}
    </tbody>
  </table>

  <script type="text/javascript">
    $('input.async').click(function(){
      var that = $(this);
      var url = $(this).data('url');
      var reload = $(this).data('reload');
      $.get(url, function(r) {
        $(reload).html(r);
        $(that).attr('disabled', 'disabled');
      });
    });
  </script>