{#
    Copyright (c) 2015 Chintalagiri Shashank
    Released under the MIT license
#}

{% extends "base_templates/base.html" %}

{% block magellan %}
<!-- Magellan -->
<div data-magellan-expedition="sticky">
    <dl class="sub-nav">
        <dd data-magellan-arrival="order"><a href="#order">Order</a></dd>
        <dd data-magellan-arrival="documentation"><a href="#documentation">Documentation</a></dd>
        <dd data-magellan-arrival="snomap"><a href="#snomap">Serial Map</a></dd>
    </dl>
</div>
{% endblock %}

{% block main %}

<p></p>

<h4>Production Order {{ stage.order.serialno }}</h4>
<h3>{{ stage.order.title }}</h3>

<div class="small-12 medium-6 columns" data-magellan-destination="order">
<a name="order"></a>
    {% if stage.order.card_orders.keys()|length %}
    <div class="small-12 columns panel header radius">
        <div class="sign small-9 medium-6 small-centered columns autoscale">
            <h6>Modules for Production</h6>
        </div>
        <div class="small-12 columns">
            <table id="order_cards_table" class="display" data-paging='false'>
                <thead>
                <tr>
                    <th class="all">Card</th>
                    <th class="all text-center">Quantity</th>
                </tr>
                </thead>
                <tbody>
                {% for card, qty in stage.order.card_orders.iteritems() %}
                    <tr>
                        <td> {{ card }} </td>
                        <td class="text-center"> {{ qty }} </td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
        <script type="text/javascript">
            $(document).ready( function () {
                var table = $('#order_cards_table').DataTable({
                    /* Disable initial sort */
                    "aaSorting": [],
                    {% include 'parts/datatable_defaults.html' %}
                });
                table.buttons().container()
                    .appendTo( '#order_cards_table_wrapper .small-12.medium-6.columns:eq(0)' );
            });
        </script>
    {% endif %}
    {% if stage.order.delta_orders|length %}
    <div class="small-12 columns panel header radius">
        <div class="sign small-9 medium-6 small-centered columns autoscale">
            <h6>Modules for Delta Modifications</h6>
        </div>
        <div class="small-12 columns">
            <table id="order_deltas_table" class="display" data-paging='false'>
                <thead>
                <tr>
                    <th class="all">Serial No</th>
                    <th class="all">Original</th>
                    <th class="all">Target</th>
                </tr>
                </thead>
                <tbody>
                {% for delta in stage.order.delta_orders %}
                    <tr>
                        <td> {{ delta.sno }} </td>
                        <td> {{ delta['orig-cardname'] }} </td>
                        <td> {{ delta['target-cardname'] }} </td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
        <script type="text/javascript">
            $(document).ready( function () {
                var table = $('#order_deltas_table').DataTable({
                    /* Disable initial sort */
                    "aaSorting": [],
                    {% include 'parts/datatable_defaults.html' %}
                });
                table.buttons().container()
                    .appendTo( '#order_deltas_table_wrapper .small-12.medium-6.columns:eq(0)' );
            });
        </script>
    {% endif %}
    </div>


    <div class="small-12 columns panel header radius">
        <div class="sign small-9 medium-6 small-centered columns autoscale">
            <h6>Related Documentation</h6>
        </div>
        <div class="small-12 columns">
        {% for indentsno in stage.order.indent_snos %}
        <a href="/inventory/indent/{{ indentsno }}">
            <div class="button radius small-12 columns active-tb shadow mrgn-20-top">
                <div class="text-center">Inventory Indent</div>
                <div class="text-center"><b>{{ indentsno }}</b></div>
            </div>
        </a>
        {% endfor %}
        <a href="/production/manifests/{{ stage.order_sno }}">
            <div class="button radius small-12 columns active-tb shadow mrgn-20-top">
                <div class="text-center">Collated Assembly Manifests</div>
            </div>
        </a>
        </div>
    </div>

</div>

<div class="small-12 medium-6 columns" data-magellan-destination="documentation">
<div class="text-center">
    <h5> Order Documentation </h5>
</div>
<a name="documentation"></a>
    <ul class="doclinklist">
        {% for doc in stage.docs %}
            {% include 'parts/doc_link_list_element.html' %}
        {% endfor %}
        <a href="{{ stage.order_sno }}/getlabels" target="_blank">
            <li class="small-12 small-centered columns panel radius active-tb shadow mrgn-20-top">
                <div class="row small-collapse medium-uncollapse">
                <div class="show-for-medium-up medium-2 columns text-center"><i class="fi-download icon"></i></div>
                <div class="small-9 medium-8 columns text-center">DEVICE LABELS</div>
                <div class="small-3 medium-2 columns text-center">
                    <img src="/static/images/pdf.png">
                </div>
                </div>
            </li>
        </a>
    </ul>
</div>

<div class="small-12 medium-6 columns end" data-magellan-destination="snomap">
<div class="text-center">
    <h5> Serial Number Map </h5>
</div>
<a name="snomap"></a>
    <div class="small-12 columns">
        <ul id="snomap_table" class="pricing-table">
            {% for action in stage.order.card_actions %}
            <li class="title"> {{ action.ident }} </li>
                {% for refdes in action.refdes %}
                <li class="ptembedlink bullet-item active-tb">
                    <a class="ptembedlink" href="/entityhub/cards/instance/{{ refdes }}">
                        <div> {{ refdes }} </div>
                    </a>
                </li>
                {% endfor %}
            {% endfor %}
            <li></li>
        </ul>
    </div>
</div>


{% endblock %}
