InvenTree/InvenTree/part/templates/part/category.html

{% extends "part/part_app_base.html" %}
{% load static %}
{% load i18n %}

{% block sidebar %}
{% include 'part/category_sidebar.html' %}
{% endblock %}

{% block breadcrumb_tree %}
<div id="breadcrumb-tree"></div>
{% endblock breadcrumb_tree %}

{% block heading %}
{% if category %}
{% trans "Part Category" %}: {{ category.name }}
{% else %}
{% trans "Parts" %}
{% endif %}
{% endblock %}

{% block actions %}
{% if user.is_staff and roles.part_category.change %}
{% url 'admin:part_partcategory_change' category.pk as url %}
{% include "admin_button.html" with url=url %}
{% endif %}
{% if category %}
{% if starred_directly %}
<button type='button' class='btn btn-outline-secondary' id='toggle-starred' title='{% trans "You are subscribed to notifications for this category" %}'>
    <span id='category-star-icon' class='fas fa-bell icon-green'></span>
</button>
{% elif starred %}
<button type='button' class='btn btn-outline-secondary' title='{% trans "You are subscribed to notifications for this category" %}' disabled='true'>
    <span class='fas fa-bell icon-green'></span>
</button>
{% else %}
<button type='button' class='btn btn-outline-secondary' id='toggle-starred' title='{% trans "Subscribe to notifications for this category" %}'>
    <span id='category-star-icon' class='fa fa-bell-slash'/>
</button>
{% endif %}
{% if roles.part_category.change or roles.part_category.delete %}
<div class='btn-group' role='group'>
    <button id='category-options' class='btn btn-outline-secondary dropdown-toggle' type='button' data-bs-toggle='dropdown' title='{% trans "Category Actions" %}'>
        <span class='fas fa-tools'></span> <span class='caret'></span>
    </button>
    <ul class='dropdown-menu'>
        {% if roles.part_category.change %}
        <li><a class='dropdown-item' href='#' id='cat-edit' title='{% trans "Edit category" %}'>
            <span class='fas fa-edit icon-green'></span> {% trans "Edit Category" %}
        </a></li>
        {% endif %}
        {% if roles.part_category.delete %}
        <li><a class='dropdown-item' href='#' id='cat-delete' title='{% trans "Delete category" %}'>
            <span class='fas fa-trash-alt icon-red'></span> {% trans "Delete Category" %}
        </a></li>
        {% endif %}
    </ul>
</div>
{% endif %}
{% endif %}
{% if roles.part_category.add %}
<button class='btn btn-success' id='cat-create' title='{% trans "Create new part category" %}'>
    <span class='fas fa-plus-circle'></span> {% trans "New Category" %}
</button>
{% endif %}
{% endblock %}

{% block details_left %}
<table class='table table-striped table-condensed'>
    <col width='25'>
    {% if category %}
    {% if category.description %}
    <tr>
        <td><span class='fas fa-info-circle'></span></td>
        <td>{% trans "Description" %}</td>
        <td>{{ category.description }}</td>
    </tr>
    {% endif %}
    <tr>
        <td><span class='fas fa-sitemap'></span></td>
        <td>{% trans "Category Path" %}</td>
        <td>{{ category.pathstring }}</td>
    </tr>
    {% if category.default_keywords %}
    <tr>
        <td><span class='fas fa-key'></span></td>
        <td>{% trans "Keywords" %}</td>
        <td>{{ category.default_keywords }}</td>
    </tr>
    {% endif %}
    {% else %}
    <tr>
        <td><span class='fas fa-sitemap'></span></td>
        <td>{% trans "Category Path" %}</td>
        <td><em>{% trans "Top level part category" %}</em></td>
    </tr>
    {% endif %}
</table>
{% endblock details_left %}

{% block details_right %}

{% if category %}
<table class='table table-condensed table-striped'>
    <col width='25'>
    {% if category.default_location %}
    <tr>
        <td><span class='fas fa-map-marker-alt'></span></td>
        <td>{% trans "Default Location" %}</td>
        <td><a href="{% url 'stock-location-detail' category.default_location.pk %}">{{ category.default_location.pathstring }}</a></td>
    </tr>
    {% endif %}
    <tr>
        <td><span class='fas fa-sitemap'></span></td>
        <td>{% trans "Subcategories" %}</td>
        <td>{{ category.children.count }}</td>
    </tr>
    <tr>
        <td><span class='fas fa-shapes'></span></td>
        <td>{% trans "Parts (Including subcategories)" %}</td>
        <td>{{ category.partcount }}</td>
    </tr>
</table>
{% else %}
<table class='table table-striped table-condensed'>
    <col width='25'>
    <tr>
        <td><span class='fas fa-sitemap'></span></td>
        <td>{% trans "Part Categories" %}</td>
        <td>{{ category_count }}</td>
    </tr>
    <tr>
        <td><span class='fas fa-shapes'></span></td>
        <td>{% trans "Parts" %}</td>
        <td>{{ part_count }}</td>
    </tr>
</table>
{% endif %}
{% endblock details_right %}

{% block page_content %}

{% if messages %}
  {% for message in messages %}
    <div class='{{ message.tags }}'>
        {{ message|safe }}
    </div>
  {% endfor %}
{% endif %}

<div class='panel panel-hidden' id='panel-parts'>
    <div class='panel-heading'>
        <div class='d-flex flex-wrap'>
            <h4>{% trans "Parts" %}</h4>
            {% include "spacer.html" %}
            <div class='btn-group' role='group'>
                {% if roles.part.add %}
                <button type='button' class='btn btn-success' id='part-create' title='{% trans "Create new part" %}'>
                    <span class='fas fa-plus-circle'></span> {% trans "New Part" %}
                </button>
                {% endif %}
            </div>
        </div>
    </div>
    <div id='part-button-toolbar'>
        <div class='btn-group' role='group'>
            <div class='btn-group' role='group'>
                <button id='part-options' class='btn btn-primary dropdown-toggle' type='button' data-bs-toggle="dropdown">
                    <span class='fas fa-tools' title='{% trans "Options" %}'></span>
                </button>
                <ul class='dropdown-menu'>
                    {% if roles.part.change %}
                    <li><a class='dropdown-item' href='#' id='multi-part-category' title='{% trans "Set category" %}'>
                        <span class='fas fa-sitemap'></span> {% trans "Set Category" %}
                    </a></li>
                    {% endif %}
                    <li><a class='dropdown-item' href='#' id='multi-part-order' title='{% trans "Order parts" %}'>
                        <span class='fas fa-shopping-cart'></span> {% trans "Order Parts" %}
                    </a></li>
                    {% if report_enabled %}
                    <li><a class='dropdown-item' href='#' id='multi-part-print-label' title='{% trans "Print Labels" %}'>
                        <span class='fas fa-tag'></span> {% trans "Print Labels" %}
                    </a></li>
                    {% endif %}
                </ul>
            </div>
            {% include "filter_list.html" with id="parts" %}
        </div>
    </div>
    <div class='panel-content'>
        <table class='table table-striped table-condensed' data-toolbar='#part-button-toolbar' id='part-table'>
        </table>
    </div>
</div>

<div class='panel panel-hidden' id='panel-stock'>
    <div class='panel-heading'>
        <h4>{% trans "Stock Items" %}</h4>
    </div>
    <div class='panel-content'>
        {% include "stock_table.html" %}
    </div>
</div>

<div class='panel panel-hidden' id='panel-parameters'>
    <div class='panel-heading'>
        <h4>{% trans "Part Parameters" %}</h4>
    </div>
    <div class='panel-content'>
        <table class='table table-striped table-condensed' data-toolbar='#param-button-toolbar' id='parametric-part-table'>
        </table>
    </div>
</div>

<div class='panel panel-hidden' id='panel-subcategories'>
    <div class='panel-heading'>
        <h4>{% trans "Subcategories" %}</h4>
    </div>
    <div class='panel-content'>
        <div id='subcategory-button-toolbar'>
            <div class='btn-group' role='group'>
                {% include "filter_list.html" with id="category" %}
            </div>
        </div>

        <table class='table table-striped table-condensed' id='subcategory-table' data-toolbar='#subcategory-button-toolbar'></table>

    </div>
</div>

{% endblock %}

{% block js_load %}
{{ block.super }}
{% endblock %}

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

    {% if category %}

    onPanelLoad('stock', function() {
        loadStockTable(
            $('#stock-table'),
            {
                params: {
                    category: {{ category.pk }},
                    part_detail: true,
                    location_detail: true,
                    supplier_part_detail: true,
                }
            }
        );
    });

    onPanelLoad('parameters', function() {
        loadParametricPartTable(
            "#parametric-part-table",
            {
                category: {{ category.pk }},
            }
        );
    });

    $("#toggle-starred").click(function() {
        toggleStar({
            url: '{% url "api-part-category-detail" category.pk %}',
            button: '#category-star-icon'
        });
    });

    {% endif %}

    // Enable breadcrumb tree view
    enableBreadcrumbTree({
        label: 'category',
        url: '{% url "api-part-category-tree" %}',
        {% if category %}
        selected: {{ category.pk }},
        {% endif %}
        processNode: function(node) {
            node.text = node.name;
            node.href = `/part/category/${node.pk}/`;

            return node;
        }
    });

    onPanelLoad('subcategories', function() {
        loadPartCategoryTable(
            $('#subcategory-table'), {
                params: {
                    {% if category %}
                    parent: {{ category.pk }},
                    {% else %}
                    parent: null,
                    {% endif %}
                },
                allowTreeView: true,
            }
        );
    });

    $("#cat-create").click(function() {

        var fields = categoryFields();

        {% if category %}
        fields.parent.value = {{ category.pk }};
        {% endif %}

        constructForm('{% url "api-part-category-list" %}', {
            fields: fields,
            method: 'POST',
            title: '{% trans "Create Part Category" %}',
            follow: true,
        });
    });

    {% if roles.part.add %}
    $("#part-create").click(function() {

        var fields = partFields({
            create: true,
        });

        {% if category %}
        fields.category.value = {{ category.pk }};
        {% endif %}

        constructForm('{% url "api-part-list" %}', {
            method: 'POST',
            fields: fields,
            groups: partGroups(),
            title: '{% trans "Create Part" %}',
            reloadFormAfterSuccess: true,
            persist: true,
            persistMessage: '{% trans "Create another part after this one" %}',
            successMessage: '{% trans "Part created successfully" %}',
            onSuccess: function(data) {
                // Follow the new part
                location.href = `/part/${data.pk}/`;
            },
        });

    });
    {% endif %}

    {% if category %}
    $("#cat-edit").click(function () {

        editCategory({{ category.pk }});
    });

    {% if category.parent %}
    var redirect = "{% url 'category-detail' category.parent.id %}";
    {% else %}
    var redirect = "{% url 'part-index' %}";
    {% endif %}

    $('#cat-delete').click(function() {
        launchModalForm(
            "{% url 'category-delete' category.id %}",
            {
                redirect: redirect
            }
        );
    });

    {% endif %}

    onPanelLoad('parts', function() {
        loadPartTable(
            "#part-table",
            "{% url 'api-part-list' %}",
            {
                params: {
                    {% if category %}category: {{ category.id }},
                    {% else %}category: "null",
                    {% endif %}
                },
                checkbox: true,
                gridView: true,
            },
        );
    });

    // Enable left-hand navigation sidebar
    enableSidebar('category');

{% endblock %}