{% extends "base.html" %}
{% load static %}

{% block page_title %}
InvenTree | {{ company.name }} - Parts
{% endblock %}

{% block content %}

<div class='row'>
    <div class='col-sm-6'>
        <h3>Supplier Part</h3>
        <p><a href="{% url 'company-detail-parts' part.supplier.id %}">{{ part.supplier.name }}</a> - {{ part.SKU }}</p>
    </div>
    <div class='col-sm-6'>
        <h3>
            <div class="dropdown" style="float: right;">
                <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Options
                <span class="caret"></span></button>
                <ul class="dropdown-menu">
                  <li><a href="#" id='edit-part' title='Edit supplier part'>Edit</a></li>
                  <li><a href="#" id='delete-part' title='Delete supplier part'>Delete</a></li>
                </ul>
            </div>
        </h3>
    </div>
</div>

<hr>

<div class='row'>
<div class='col-sm-6'>
    <table class="table table-striped table-condensed">
        <tr><td>Supplier</td><td><a href="{% url 'company-detail-parts' part.supplier.id %}">{{ part.supplier.name }}</a></td></tr>
        <tr><td>SKU</td><td>{{ part.SKU }}</tr></tr>
        <tr>
            <td>Internal Part</td>
            <td>
        {% if part.part %}
            <a href="{% url 'part-suppliers' part.part.id %}">{{ part.part.full_name }}</a>
        {% endif %}
            </td>
        </tr>
    {% if part.URL %}
        <tr><td>URL</td><td><a href="{{ part.URL }}">{{ part.URL }}</a></td></tr>
    {% endif %}
    {% if part.description %}
        <tr><td>Description</td><td>{{ part.description }}</td></tr>
    {% endif %}
    {% if part.manufacturer %}
        <tr><td>Manufacturer</td><td>{{ part.manufacturer }}</td></tr>
        <tr><td>MPN</td><td>{{ part.MPN }}</td></tr>
    {% endif %}
    {% if part.note %}
        <tr><td>Note</td><td>{{ part.note }}</td></tr>
    {% endif %}
    </table>
</div>

<div class='col-sm-6'>
<table class="table table-striped table-condensed">
    <tr>
        <th colspan='2'>Pricing</th>
    </tr>
    <tr><td>Order Multiple</td><td>{{ part.multiple }}</td></tr>
    {% if part.base_cost > 0 %}
    <tr><td>Base Price (Flat Fee)</td><td>{{ part.base_cost }}</td></tr>
    {% endif %}
    <tr>
        <th>Price Breaks</th>
        <th>
            <div style='float: right;'>
                <button class='btn btn-primary' id='new-price-break' type='button'>New Price Break</button>
            </div>
        </th>
    </tr>
    <tr>
        <th>Quantity</th>
        <th>Price</th>
    </tr>
    {% if part.price_breaks.all %}
    {% for pb in part.price_breaks.all %}
        <tr>
            <td>{{ pb.quantity }}</td>
            <td>{{ pb.cost }}
                <div class='btn-group' style='float: right;'>
                    <button title='Edit Price Break' class='btn btn-primary pb-edit-button btn-sm' type='button' url="{% url 'price-break-edit' pb.id %}"><span class='glyphicon glyphicon-small glyphicon-edit'></span></button>
                    <button title='Delete Price Break' class='btn btn-danger pb-delete-button btn-sm' type='button' url="{% url 'price-break-delete' pb.id %}"><span class='glyphicon glyphicon-small glyphicon-trash'></span></button>
                </div>
            </td>
        </tr>
    {% endfor %}
    {% else %}
    <tr>
        <td colspan='2'>
            <span class='warning-msg'><i>No price breaks have been added for this part</i></span>
        </td>
    </tr>
    {% endif %}
</table>
</div>
</div>

<hr>

<h4>Purchase Orders</h4>
{% include "order/po_table.html" with orders=part.purchase_orders %}

{% endblock %}

{% block js_ready %}
{{ block.super }}
    $('#edit-part').click(function () {
        launchModalForm(
                        "{% url 'supplier-part-edit' part.id %}",
                        {
                            reload: true
                        }
        );
    });

    $('#delete-part').click(function() {
        launchModalForm(
                         "{% url 'supplier-part-delete' part.id %}",
                         {
                             redirect: "{% url 'company-index' %}"
                         }
        );
    });

    $('#new-price-break').click(function() {
        launchModalForm("{% url 'price-break-create' %}",
            {
                reload: true,
                data: {
                    part: {{ part.id }},
                }
            }
        );
    });

    $('.pb-edit-button').click(function() {
        var button = $(this);

        launchModalForm(button.attr('url'),
            {
                reload: true,
            }
        );
    });

    $('.pb-delete-button').click(function() {
        var button = $(this);

        launchModalForm(button.attr('url'),
            {
                reload: true,
            }
        );
    });

{% endblock %}