{% extends "base.html" %}

{% load static %}

{% block page_title %}
InvenTree | Search Results
{% endblock %}

{% block content %}

<h3>Search Results</h3>

<div>
{% include "search_form.html" with query_text=query %}
</div>

<br><br>
<hr>

<div id='no-search-results'>
    <h4><i>No results found</i></h4>
</div>

{% include "InvenTree/search_part_category.html" with collapse_id="categories" %}

{% include "InvenTree/search_parts.html" with collapse_id='parts' %}

{% include "InvenTree/search_company.html" with collapse_id='companies' %}

{% include "InvenTree/search_supplier_parts.html" with collapse_id='supplier_parts' %}

{% include "InvenTree/search_stock_location.html" with collapse_id="locations" %}

{% endblock %}

{% block js_load %}
{{ block.super }}
<script type='text/javascript' src="{% static 'script/inventree/part.js' %}"></script>
{% endblock %}

{% block js_ready %}
{{ block.super }}

    $(".panel-group").hide();

    function onSearchResults(table, output) {
        $(table).on('load-success.bs.table', function() {

            var panel = $(output).closest('.panel-group');

            var n = $(table).bootstrapTable('getData').length;

            var text = '';
            if (n == 0) {
                text = '<i>No results</i>'

                $(panel).hide();
                

            } else {
                text = n + ' result';

                if (n > 1) {
                    text += 's';
                }

                $(panel).show();

                $("#no-search-results").hide();
            }

            $(output).html(text);
        });
    }

    onSearchResults("#category-results-table", "#category-results-count");
    
    onSearchResults("#location-results-table", "#location-results-count");

    onSearchResults('#part-results-table', '#part-result-count');

    onSearchResults('#company-results-table', '#company-result-count');
    
    onSearchResults('#supplier-part-results-table', '#supplier-part-result-count');

    $("#category-results-table").bootstrapTable({
        url: "{% url 'api-part-category-list' %}",
        queryParams: {
            search: "{{ query }}",
        },
        columns: [
            {
                field: 'name',
                title: 'Name',
                formatter: function(value, row, index, field) {
                    return renderLink(value, '/part/category/' + row.pk + '/');
                },
            },
            {
                field: 'description',
                title: 'Description',
            },
        ],
    });

    $("#location-results-table").bootstrapTable({
        url: "{% url 'api-location-list' %}",
        queryParams: {
            search: "{{ query }}",
        },
        columns: [
            {
                field: 'name',
                title: 'Name',
                formatter: function(value, row, index, field) {
                    return renderLink(value, '/stock/location/' + row.pk + '/');
                },
            },
            {
                field: 'description',
                title: 'Description',
            },
        ],
    });

    loadPartTable("#part-results-table",
        "{% url 'api-part-list' %}",
        {
            query: {
                search: "{{ query }}",
            },
            allowInactive: true,
            checkbox: false,
        }
    );

    $("#company-results-table").bootstrapTable({
        url: "{% url 'api-company-list' %}",
        queryParams: {
            search: "{{ query }}",
        },
        pagination: true,
        pageSize: 25,
        search: true,
        columns: [
            {
                field: 'name',
                title: 'Name',
                formatter: function(value, row, index, field) {
                    return imageHoverIcon(row.image) + renderLink(value, row.url);
                },
            },
            {
                field: 'description',
                title: 'Description',
            },
        ]
    });

    $("#supplier-part-results-table").bootstrapTable({
        url: "{% url 'api-part-supplier-list' %}",
        queryParams: {
            search: "{{ query }}",
        },
        pagination: true,
        pageSize: 25,
        search: true,
        columns: [
            {
                field: 'supplier_name',
                title: 'Supplier',
                formatter: function(value, row, index, field) {
                    return imageHoverIcon(row.supplier_logo) + renderLink(value, '/company/' + row.supplier + '/');
                }
            },
            {
                field: 'SKU',
                title: 'SKU',
                formatter: function(value, row, index, field) {
                    return renderLink(value, row.url);
                }
            },
            {
                field: 'manufacturer',
                title: 'Manufacturer',
            },
            {
                field: 'MPN',
                title: 'MPN',
            }
        ]
    });
    
{% endblock %}