{% extends 'layout_dtpop_forms.html' %}
{% load static %}
{% load widget_tweaks %}
{% load template_math %}

{% block styles %}
    {{ block.super }}
    <style type="text/css">
        .ui-front {
            z-index: 9999999 !important;
        }
    </style>
{% endblock styles %}

{% block content %}
{% include "informant_erp/includes/receiver_create_modal.html" %}

{% comment %}
{% if form.errors %}
        {% for field in form %}
        {% for error in field.errors %}
            <p> {{ errors }} </p>
        {% endfor %}
        {% endfor %}
        {% for error in form.non_field_errors %}
        <p> {{ error }} </p>
        {% endfor %}
    {% endif %}
{% endcomment %}    

<form id="id-form-car-revise" class="form-main" method="post" action="">
    {% csrf_token %}
<div class="row">
    <div class="col-3">
        <div class="row no-gutters">
            <div class="col-2">
                <div class="row no-gutters">
                    <button type="button" class="btn btn-info btn-block btn-filter" data-loc-type="SPECIFIC" data-content="NP">NP</button>
                </div>
                <div class="row no-gutters">
                    <button type="button" class="btn btn-info btn-block btn-filter" data-loc-type="SPECIFIC" data-content="SP">SP</button>
                </div>
                <div class="row no-gutters">
                    <button type="button" class="btn btn-info btn-block btn-filter" data-loc-type="SPECIFIC" data-content="SS">SS</button>
                </div>
            </div>
            <div class="col-2">
                <div class="row no-gutters">
                    <button type="button" class="btn btn-info btn-block btn-filter" data-loc-type="SPECIFIC" data-content="ML">ML</button>
                </div>
                <div class="row no-gutters">
                    <button type="button" class="btn btn-info btn-block btn-filter" data-loc-type="SPECIFIC" data-content="ET">ET</button>
                </div>
                <div class="row no-gutters">
                    <button type="button" class="btn btn-info btn-block btn-filter" data-loc-type="SPECIFIC" data-content="WT">WT</button>
                </div>
            </div>
            <div class="co2">
                <div class="row no-gutters">
                    <button type="button" class="btn btn-info btn-block btn-filter" data-loc-type="GENERAL" data-content="A&R">A&R</button>
                </div>
                <div class="row no-gutters">
                    <button type="button" class="btn btn-info btn-block btn-filter" data-loc-type="GENERAL" data-content="LIRC">LIRC</button>
                </div>
                <div class="row no-gutters">
                    <button type="button" class="btn btn-info btn-block btn-filter" data-loc-type="GENERAL" data-content="ALL">ALL</button>
                </div>
            </div>
        </div>
    </div>
    <div class="col-9">
        <div class="row">
            <div class="col-3">
            </div>
            <div class="col-3">
                <input type="submit" name="submit" value="Done" class="btn btn-primary btn-block form-group col-md-9 mt-0 mb-3" id="submit-id-submit" tabindex="3000">
            </div>
            <div class="col-3">
                <input type="submit" name="cancel" value="Cancel" class="btn btn-primary btn-danger btn-block form-group col-md-9 mt-0 mb-3" id="submit-id-submit_and_continue" tabindex="3001">
            </div>
        </div>
        <div class="row">
            <div class="col-5">
            Filter: <input type="text" id="filter_box" name="filter_box" />
            </div>
        </div>
    </div>
</div>
<div id="id_header_row" class="row pb-3 pt-3">
    <div class="col-1 font-weight-bolder">Loc</div>
    <div class="col-2 font-weight-bolder">Car/Comp</div>
    <div class="col-2 font-weight-bolder">Receiver</div>
    <div class="col-3 pl-2 font-weight-bolder">Item</div>
    <div class="col-1 font-weight-bolder">%Fill</div>
    <div class="col-2 font-weight-bolder">Status</div>
</div>
    {{ form.management_form }}
<div id="id_formset_container" class="pl-3 pr-2" style="height:400px; width:100%; overflow:auto;">
    {% for theform in form %}
    <div id="id-form-row-{{ forloop.counter0 }}" class="single-form row mb-3 filter_row" data-loc="{{ cardict | get_item:theform.instance.car_id }}" data-car="{{ theform.instance.car_id }}" search_string="">
        <div class="col-12">
            <div class="row">
                <div class="col-1">
                    <div class="row">
                        <span id="id_form-{{ forloop.counter0 }}-loc">{{ cardict | get_item:theform.instance.car_id }}</span>
                    </div>
                </div>
                <div class="col-2">
                    <div class="row pb-3">
                        <span id="id_form-{{ forloop.counter0 }}-car">{{ theform.instance.car_id }}</span>
                    </div>
                    <div class="row pb-3">
                        <div class="col-7">
                            {{ car_location_reference }}->
                        </div>
                        <div class="col-5">
                            <span>{{ theform.instance.c1 }}</span>
                        </div>
                    </div>
                    <div class="row pb-3">
                        <div class="col-7">
                            &nbsp;
                        </div>
                        <div class="col-5">
                            <span>{{ theform.instance.c2 }}</span>
                        </div>
                    </div>
                    <div class="row pb-3">
                        <div class="col-7">
                            &nbsp; 
                        </div>
                        <div class="col-5">
                            <span>{{ theform.instance.c3 }}</span>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-7">
                            &nbsp; 
                        </div>
                        <div class="col-5">
                            <span>{{ theform.instance.c4 }}</span>
                        </div>
                    </div>
                </div>
                <div class="col-2">
                    <div class="row">
                        {% render_field theform.receiver data-car=theform.instance.car_id class+="textinput textInput form-control" data-for-item="item-receiver" data-counter=forloop.counter0 tabindex=forloop.counter|sub:1|mul:11|add:3001 %}
                    </div>
                    <div class="row">
                        {% render_field theform.c1rec data-car=theform.instance.car_id class+="textinput textInput form-control" data-for-item="item-c1rec" data-counter=forloop.counter0 tabindex="-1" no-autopop="no-autopop" %}
                    </div>
                    <div class="row">
                        {% render_field theform.c2rec data-car=theform.instance.car_id class+="textinput textInput form-control" data-for-item="item-c2rec" data-counter=forloop.counter0 tabindex="-1" no-autopop="no-autopop" %}
                    </div>
                    <div class="row">
                        {% render_field theform.c3rec data-car=theform.instance.car_id class+="textinput textInput form-control" data-for-item="item-c3rec" data-counter=forloop.counter0 tabindex="-1" no-autopop="no-autopop" %}
                    </div>
                    <div class="row">
                        {% render_field theform.c4rec data-car=theform.instance.car_id class+="textinput textInput form-control" data-for-item="item-c4rec" data-counter=forloop.counter0 tabindex="-1" no-autopop="no-autopop" %}
                    </div>
                </div>
                <div class="col-3">
                    <div class="row pl-4 pb-3">
                        <span id="id_form-{{ forloop.counter0 }}-item-receiver"></span>
                    </div>
                    <div class="row pl-4 pb-3">
                        <span id="id_form-{{ forloop.counter0 }}-item-c1rec"></span>
                    </div>
                    <div class="row pl-4 pb-3">
                        <span id="id_form-{{ forloop.counter0 }}-item-c2rec"></span>
                    </div>
                    <div class="row pl-4 pb-3">
                        <span id="id_form-{{ forloop.counter0 }}-item-c3rec"></span>
                    </div>
                    <div class="row pl-4">
                        <span id="id_form-{{ forloop.counter0 }}-item-c4rec"></span>
                    </div>
                </div>
                <div class="col-1">
                    <div class="row pb-2">&nbsp;</div>
                    <div class="row">
                        <div class="col">
                            {% render_field theform.c1fill class+="textinput textInput form-control" data-number="whole" tabindex=forloop.counter|sub:1|mul:11|add:3002 %}
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            {% render_field theform.c2fill class+="textinput textInput form-control" data-number="whole" tabindex=forloop.counter|sub:1|mul:11|add:3004 %}
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            {% render_field theform.c3fill class+="textinput textInput form-control" data-number="whole" tabindex=forloop.counter|sub:1|mul:11|add:3006 %}
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            {% render_field theform.c4fill class+="textinput textInput form-control" data-number="whole" tabindex=forloop.counter|sub:1|mul:11|add:3008 %}
                        </div>
                    </div>
                </div>
                <div class="col-2">
                    <div class="row pb-2">&nbsp;</div>
                    <div class="row">
                        <div class="col">
                            {% render_field theform.c1sts class+="textinput textInput form-control" tabindex=forloop.counter|sub:1|mul:11|add:3003 %}
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            {% render_field theform.c2sts class+="textinput textInput form-control" tabindex=forloop.counter|sub:1|mul:11|add:3005 %}
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            {% render_field theform.c3sts class+="textinput textInput form-control" tabindex=forloop.counter|sub:1|mul:11|add:3007 %}
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            {% render_field theform.c4sts class+="textinput textInput form-control" tabindex=forloop.counter|sub:1|mul:11|add:3009 %}
                        </div>
                    </div>
                </div>
            </div>
            <div class="row pt-2">
                <div class="col-3">&nbsp;</div>
                <div class="col-2">MT Routing</div> 
                <div class="col-6">{% render_field theform.routing class+="textinput textInput form-control col-12" tabindex=forloop.counter|sub:1|mul:11|add:3010 filter_field="" %}{{ theform.id }}</div>
            </div>
            <div class="row pt-2">
                <div class="col-3">&nbsp;</div>
                <div class="col-2">Comment</div> 
                <div class="col-6">{% render_field theform.comment1 class+="textinput textInput form-control col-12" tabindex=forloop.counter|sub:1|mul:11|add:3011 filter_field="" %}{{ theform.id }}</div>
            </div>
        </div>
        <hr />
    </div>
    {% endfor %}
</div>
</form>
{% endblock content %}
{% block body_scripts %}
    {{ block.super }}
    <script>
        // Dynamic URLs - used in .js support files
        var new_inv_receipt_url = "{% url 'inv_receipt_modal' %}";
        var check_car_url = "{% url 'get_value_from_model' %}";
        var get_item_url = "{% url 'get_value_from_model' %}";
        var check_receiver_url = "{% url 'get_value_from_model' %}";
        var recdict = {{ recdict|safe }};  // Lookup dict for receiver/item for intial item display
    </script>
    <script type="text/javascript" src="{% static 'informant_erp/js/support_popupview_common.js' %}"></script>
    <script type="text/javascript" src="{% static 'informant_erp/js/support_car_revise.js' %}"></script>
    <script type="text/javascript" src="{% static 'informant_erp/js/support_invlog_new_modal.js' %}"></script>
    <script type="text/javascript" src="{% static 'informant_erp/js/filter_formset.js' %}"></script>
{% endblock body_scripts %}