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 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 %}
{% if category %}
<p>{{ category.description }}</p>
{% else %}
<p>{% trans "Top level part category" %}</p>
{% endif %}

{% endblock %}

{% block details_right %}

{% if category %}
<table class='table table-condensed table-striped'>
    <col width='25'>
    <tr>
        <td><span class='fas fa-sitemap'></span></td>
        <td>{% trans "Category Path" %}</td>
        <td>{{ category.pathstring }}</td>
    </tr>
    <tr>
        <td><span class='fas fa-info-circle'></span></td>
        <td>{% trans "Category Description" %}</td>
        <td>{{ category.description }}</td>
    </tr>
    {% 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 %}
    {% if category.default_keywords %}
    <tr>
        <td><span class='fas fa-key'></span></td>
        <td>{% trans "Keywords" %}</td>
        <td>{{ category.default_keywords }}</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 %}

{% 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'>
                <button type='button' class='btn btn-outline-secondary' id='part-export' title='{% trans "Export Part Data" %}'>
                    <span class='fas fa-file-download'></span> {% trans "Export" %}
                </button>
                {% 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">
                    {% trans "Options" %}
                </button>
                <ul class='dropdown-menu'>
                    {% if roles.part.change %}
                    <li><a class='dropdown-item' href='#' id='multi-part-category' title='{% trans "Set category" %}'>{% trans "Set Category" %}</a></li>
                    {% endif %}
                    <li><a class='dropdown-item' href='#' id='multi-part-order' title='{% trans "Order parts" %}'>{% trans "Order Parts" %}</a></li>
                    <li><a class='dropdown-item' href='#' id='multi-part-print-label' title='{% trans "Print Labels" %}'>{% trans "Print Labels" %}</a></li>
                    <li><a class='dropdown-item' href='#' id='multi-part-export' title='{% trans "Export" %}'>{% trans "Export Data" %}</a></li>
                </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-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 %}
    loadParametricPartTable(
        "#parametric-part-table",
        { 
            headers: {{ headers|safe }},
            data: {{ parameters|safe }},
        }
    );

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

    {% endif %}

    enableSidebar('category');

    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,
        });
    });

    $("#part-export").click(function() {

        var url = "{% url 'part-export' %}?category={{ category.id }}";

        location.href = url;
    });

    {% 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" %}',
            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 %}

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

{% endblock %}