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

{% block menubar %}
{% include "part/navbar.html" with tab='variants' %}
{% endblock %}

{% block heading %}
{% trans "Part Variants" %}
{% endblock %}

{% block details %}
<div id='button-toolbar'>
    <div class='button-toolbar container-fluid'>
        <div class='btn-group' role='group'>
            {% if part.is_template and part.active %}
            <button class='btn btn-success' id='new-variant' title='{% trans "Create new variant" %}'>
                <span class='fas fa-plus-circle'></span> {% trans "New Variant" %}
            </button>
            {% endif %}
        </div>
        <div class='filter-list' id='filter-list-variants'>
            <!-- Empty div (will be filled out with available BOM filters) -->
        </div>
    </div>
</div>

<table class='table table-striped table-condensed' id='variants-table' data-toolbar='#button-toolbar'>
</table>

{% endblock %}

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

    loadPartVariantTable($('#variants-table'), {{ part.pk }});

    $('#new-variant').click(function() {
        launchModalForm(
            "{% url 'make-part-variant' part.id %}",
            {
                follow: true,
            }
        );
    });

{% endblock %}