{% 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>

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

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

{% endblock %}

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

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

    function onSearchResults(table, output) {
        $(table).on('load-success.bs.table', function() {
            var n = $(table).bootstrapTable('getData').length;

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

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

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

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

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

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

    $("#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 %}