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

{% block page_title %}
{% inventree_title %} | {% trans "Index" %}
{% endblock %}

{% block content %}
<h3>{% inventree_title %} </h3>
<hr>

<div class='col-sm-3' id='item-panel'>
    <ul class='list-group' id='action-item-list'>
    </ul>
</div>
<div class='col-sm-9' id='details-panel'>
    <ul class='list-group' id='detail-item-list'>
        <li class='list-group-item'>
            <div class='container'>
                <img class='index-bg' src='{% static "img/inventree.png" %}'>
            </div>
        </li>
    </ul>
</div>

{% endblock %}

{% block js_ready %}

{{ block.super }}

function addHeaderTitle(title) {
    // Add a header block to the action list
    $("#action-item-list").append(
        `<li class='list-group-item'><b>${title}</b></li>`
    );
}

function addHeaderAction(label, title, icon, options) {
    // Add an action block to the action list
    $("#action-item-list").append(
        `<li class='list-group-item' id='action-${label}'>
            <a href='#'>
                <span class='fas ${icon}'></span>
                ${title}
            </a>
            <span class='badge' id='badge-${label}'>
                <span class='fas fa-spin fa-spinner'></span>
            </span>
        </li>`
    );

    // Add a detail item to the detail item-panel
    $("#detail-item-list").append(
        `<li class='list-group-item' id='detail-${label}'>
            <h4>${title}</h4>
            <table class='table table-condensed table-striped' id='table-${label}'></table>
        </li>`
    );

    $(`#detail-${label}`).hide();

    $(`#action-${label}`).click(function() {

        // Hide all child elements
        $('#detail-item-list').children('li').each(function() {
            $(this).hide();
        });

        // Show the one we want
        $(`#detail-${label}`).fadeIn();

        // Remove css class from all action items
        $("#action-item-list").children('li').each(function() {
            $(this).removeClass('index-action-selected');
        });

        // Add css class to the action we are interested in
        $(`#action-${label}`).addClass('index-action-selected');
    });

    // Connect a callback to the table
    $(`#table-${label}`).on('load-success.bs.table', function() {
        var count = $(`#table-${label}`).bootstrapTable('getData').length;
    
        $(`#badge-${label}`).html(count);

        if (count > 0) {
            $(`#badge-${label}`).addClass('badge-orange');
        }
    });
}

{% if roles.part.view %}
addHeaderTitle('{% trans "Parts" %}');
addHeaderAction('starred-parts', '{% trans "Starred Parts" %}', 'fa-star');
addHeaderAction('latest-parts', '{% trans "Latest Parts" %}', 'fa-newspaper');
addHeaderAction('bom-validation', '{% trans "BOM Waiting Validation" %}', 'fa-times-circle');


loadSimplePartTable("#table-latest-parts", "{% url 'api-part-list' %}", {
    params: {
        ordering: "-creation_date",
        max_results: {% settings_value "PART_RECENT_COUNT" %},
    },
    name: 'latest_parts',
});

loadSimplePartTable("#table-starred-parts", "{% url 'api-part-list' %}", {
    params: {
        "starred": true,
    },
    name: 'starred_parts',
});

loadSimplePartTable("#table-bom-validation", "{% url 'api-part-list' %}", {
    params: {
        "bom_valid": false,
    },
    name: 'bom_invalid_parts',
});

{% endif %}

{% if roles.stock.view %}
addHeaderTitle('{% trans "Stock" %}');
addHeaderAction('recently-updated-stock', '{% trans "Recently Updated" %}', 'fa-clock');
addHeaderAction('low-stock', '{% trans "Low Stock" %}', 'fa-shopping-cart');
addHeaderAction('stock-to-build', '{% trans "Required for Build Orders" %}', 'fa-bullhorn');

loadStockTable($('#table-recently-updated-stock'), {
    params: {
        part_detail: true,
        ordering: "-updated",
        max_results: {% settings_value "STOCK_RECENT_COUNT" %},
    },
    name: 'recently-updated-stock',
    grouping: false,
});

{% settings_value "STOCK_ENABLE_EXPIRY" as expiry %}
{% if expiry %}
addHeaderAction('expired-stock', '{% trans "Expired Stock" %}', 'fa-calendar-times');
addHeaderAction('stale-stock', '{% trans "Stale Stock" %}', 'fa-stopwatch');

loadStockTable($("#table-expired-stock"), {
    params: {
        expired: true,
        location_detail: true,
        part_detail: true,
    },
});

loadStockTable($("#table-stale-stock"), {
    params: {
        stale: true,
        expired: false,
        location_detail: true,
        part_detail: true,
    },
});
{% endif %}

loadSimplePartTable("#table-low-stock", "{% url 'api-part-list' %}", {
    params: {
        low_stock: true,
    },
    name: "low_stock_parts",
});

loadSimplePartTable("#table-stock-to-build", "{% url 'api-part-list' %}", {
    params: {
        stock_to_build: true,
    },
    name: "to_build_parts",
});

{% endif %}

{% if roles.build.view %}
addHeaderTitle('{% trans "Build Orders" %}');
addHeaderAction('build-pending', '{% trans "Build Orders In Progress" %}', 'fa-cogs');
addHeaderAction('build-overdue', '{% trans "Overdue Build Orders" %}', 'fa-calendar-times');

loadBuildTable("#table-build-pending", {
    url: "{% url 'api-build-list' %}",
    params: {
        active: true,
    },
    disableFilters: true,
});

loadBuildTable("#table-build-overdue", {
    url: "{% url 'api-build-list' %}",
    params: {
        overdue: true,
    },
    disableFilters: true,
});
{% endif %}

{% if roles.purchase_order.view %}
addHeaderTitle('{% trans "Purchase Orders" %}');
addHeaderAction('po-outstanding', '{% trans "Outstanding Purchase Orders" %}', 'fa-sign-in-alt');
addHeaderAction('po-overdue', '{% trans "Overdue Purchase Orders" %}', 'fa-calendar-times');

loadPurchaseOrderTable("#table-po-outstanding", {
    url: "{% url 'api-po-list' %}",
    params: {
        supplier_detail: true,
        outstanding: true,
    }
});

loadPurchaseOrderTable("#table-po-overdue", {
    url: "{% url 'api-po-list' %}",
    params: {
        supplier_detail: true,
        overdue: true,
    }
});

{% endif %}

{% if roles.sales_order.view %}
addHeaderTitle('{% trans "Sales Orders" %}');
addHeaderAction('so-outstanding', '{% trans "Outstanding Sales Orders" %}', 'fa-sign-out-alt');
addHeaderAction('so-overdue', '{% trans "Overdue Sales Orders" %}', 'fa-calendar-times');

loadSalesOrderTable("#table-so-outstanding", {
    url: "{% url 'api-so-list' %}",
    params: {
        customer_detail: true,
        outstanding: true,
    },
});

loadSalesOrderTable("#table-so-overdue", {
    url: "{% url 'api-so-list' %}",
    params: {
        overdue: true,
        customer_detail: true,
    }
});

{% endif %}

{% endblock %}