{% extends "part/part_base.html" %}
{% load static %}
{% load i18n %}

{% block details %}

{% include 'part/tabs.html' with tab='orders' %}

<h4>{% trans "Purchase Orders" %}</h4>
<hr>

<div id='button-bar'>
    <div class='button-toolbar container-fluid' style='float: right;'>
        <button class='btn btn-primary' type='button' id='part-order2' title='{% trans "Order part" %}'>
            <span class='fas fa-shopping-cart'></span> {% trans "Order Part" %}
        </button>
        <div class='filter-list' id='filter-list-purchaseorder'>
            <!-- An empty div in which the filter list will be constructed -->
        </div>
    </div>
</div>

<table class='table table-striped table-condensed po-table' id='purchase-order-table' data-toolbar='#button-bar'>
</table>


{% endblock %}

{% block js_ready %}
{{ block.super }}

loadPurchaseOrderTable($("#purchase-order-table"), {
    url: "{% url 'api-po-list' %}",
    params: {
        part: {{ part.id }},
    },
});

$("#part-order2").click(function() {
    launchModalForm("{% url 'order-parts' %}", {
        data: {
            part: {{ part.id }},
        },
        reload: true,
    });
});

{% endblock %}