{% extends "modal_form.html" %}
{% load i18n %}

{% block form %}
<form method="post" action='' class='js-modal-form' enctype="multipart/form-data">
    {% load crispy_forms_tags %}
    
    <label class='control-label'>Parts</label>
    <p class='help-block'>{% trans "Set category for the following parts" %}</p>
    
    <table class='table table-striped'>
        <tr>
            <th>{% trans "Part" %}</th>
            <th>{% trans "Description" %}</th>
            <th>{% trans "Category" %}</th>
            <th>
            </tr>
            {% for part in parts %}
            <tr id='part_row_{{ part.id }}'>
                <input type='hidden' name='part_id_{{ part.id }}' value='1'/>
                <td>
                    {% include "hover_image.html" with image=part.image hover=False %}
                    {{ part.full_name }}
                </td>
                <td>
                    {{ part.description }}
                </td>
                <td>
                    {{ part.category.pathstring }}
                </td>
                <td>
                    <button class='btn btn-default btn-remove' onClick='removeRowFromModalForm()' title='{% trans "Remove part" %}' type='button'>
                        <span row='part_row_{{ part.id }}' class='fas fa-trash-alt icon-red'></span>
                    </button>
                </td>
            </tr>
            {% endfor %}
        </table>
    
    {% crispy form %}
        
    </form>
    {% endblock %}