Many more refactoring

InvenTree/InvenTree/static/script/inventree/filters.js

@@ -97,6 +97,16 @@ function addTableFilter(tableKey, filterKey, filterValue) {
 }
 
 
+/*
+ * Clear all the custom filters for a given table
+ */
+function clearTableFilters(tableKey) {
+    saveTableFilters(tableKey, {});
+
+    return {};
+}
+
+
 /*
  * Return a list of the "available" filters for a given table key.
  * A filter is "available" if it is not already being used to filter the table.
@@ -208,6 +218,103 @@ function generateFilterInput(tableKey, filterKey) {
 }
 
 
+/**
+ * Configure a filter list for a given table
+ * 
+ * @param {*} tableKey - string lookup key for filter settings
+ * @param {*} table - bootstrapTable element to update
+ * @param {*} target - name of target element on page
+ */
+function setupFilterList(tableKey, table, target) {
+
+    if (!target || target.length == 0) {
+        target = '#filter-list-" + tableKey';
+    }
+
+    var tag = `filter-tag-${tableKey}`;
+    var add = `filter-add-${tableKey}`;
+    var clear = `filter-clear-${tableKey}`;
+    var make = `filter-make-${tableKey}`;
+
+    console.log(`Refilling filter list: ${tableKey}`);
+
+    var filters = loadTableFilters(tableKey);
+
+    var element = $(target);
+
+    element.empty();
+
+    element.append(`<button class='btn btn-default' id='${add}'>Add filter</button>`);
+    element.append(`<button class='btn btn-default' id='${clear}'>Clear filters</button>`);
+
+    for (var key in filters) {
+        var value = getFilterOptionValue(tableKey, key, filters[key]);
+        var title = getFilterTitle(tableKey, key);
+
+        element.append(`<li>${title} = ${value}<span ${tag}='${key}' class='close'>x</span></li>`);
+    }
+
+    // Add a callback for adding a new filter
+    element.find(`#${add}`).click(function() {
+
+        var html = '<div>';
+
+        html += generateAvailableFilterList(tableKey);
+        html += generateFilterInput(tableKey);
+
+        html += `<button class='btn btn-default' id='${make}'>Add</button>`;
+
+        html += '</div>';
+
+        element.append(html);
+
+        // Add a callback for when the filter tag selection is changed
+        element.find(`#filter-tag-${tableKey}`).on('change', function() {
+            var list = element.find(`#filter-value-${tableKey}`);
+
+            list.replaceWith(generateFilterInput(tableKey, this.value));
+        });
+
+        // Add a callback for when the new filter is created
+        element.find(`#filter-make-${tableKey}`).click(function() {
+            var tag = element.find(`#filter-tag-${tableKey}`).val();
+            var val = element.find(`#filter-value-${tableKey}`).val();
+
+            var filters = addTableFilter(tableKey, tag, val);
+
+            reloadStockTable(table, filters);
+
+            // Run this function again
+            setupFilterList(tableKey, table, target);
+        });
+
+    });
+
+    // Add a callback for clearing all the filters
+    element.find(`#${clear}`).click(function() {
+        var filters = clearTableFilters(tableKey);
+        
+        reloadStockTable(table, filters);
+
+        setupFilterList(tableKey, table, target);
+    });
+
+    // Add callback for deleting each filter
+    element.find(".close").click(function(event) {
+        var me = $(this);
+
+        var filter = me.attr(`filter-tag-${tableKey}`);
+
+        var filters = removeTableFilter(tableKey, filter);
+
+        reloadStockTable(table, filters);
+
+        // Run this function again!
+        setupFilterList(tableKey, table, target);
+    });
+}
+
+
 /**
  * Return the pretty title for the given table and filter selection.
  * If no title is provided, default to the key value.

InvenTree/InvenTree/static/script/inventree/stock.js

@@ -15,73 +15,6 @@ function getStockLocations(filters={}, options={}) {
 }
 
 
-function createStockFilter() {
-
-    var html = generateAvailableFilterList("stock");
-
-    // Add in a (blank) selection for filter value
-    html += generateFilterInput("stock" );
-    //html += `<div id='filter-value' name='value'></select>`;
-
-    html += `<button class='btn btn-default' id='filter-make'>Add</Button>`;
-
-    var div = $("#add-new-filter");
-
-    div.html(html);
-
-    div.find("#filter-make").click(function() {
-        var tag = div.find("#filter-tag-stock").val();
-        var val = div.find("#filter-value-stock").val();
-
-        addTableFilter("stock", tag, val);
-    });
-
-    div.find('#filter-tag-stock').on('change', function() {
-
-        var list = div.find('#filter-value-stock');
-
-        list.replaceWith(generateFilterInput("stock", this.value));
-    });
-
-}
-
-function clearStockFilters() {
-    // TODO
-    console.log("clear stock filters");
-}
-
-function updateStockFilterList(filterListElement, table) {
-
-    var filters = loadTableFilters("stock");
-
-    for (var key in filters) {
-
-        var value = getFilterOptionValue("stock", key, filters[key]);
-
-        $(filterListElement).append(`<li>${key} = ${value}<span filter-tag-stock='${key}' class='close'>x</span></li>` );
-    }
-
-    // Whenever the callback is called, pass the original parameters through
-
-    $(filterListElement).find(".close").click(function(event) {
-        var element = $(this);
-
-        var tag = element.attr('filter-tag-stock');
-
-        // Clear out any existing elements
-        $(filterListElement).empty();
-
-        var filters = removeTableFilter("stock", tag);
-
-        reloadStockTable(table, filters);
-
-        // Call this function again to re-update the filterss
-        updateStockFilterList(filterListElement, table);
-
-    });
-}
-
-
 /* Functions for interacting with stock management forms
  */
 
@@ -160,7 +93,7 @@ function loadStockTable(table, options) {
     // It will be required if the table is refreshed
     //options.original = original;
 
-    updateStockFilterList(filterListElement, table);
+    setupFilterList("stock", table, filterListElement);
 
     $("#filter-add").click(function() {
         createStockFilter();

InvenTree/part/templatetags/inventree_extras.py

@@ -14,6 +14,9 @@ register = template.Library()
 
 @register.simple_tag(takes_context=True)
 def load_status_codes(context):
+    """
+    Make the various StatusCodes available to the page context
+    """
 
     context['order_status_codes'] = OrderStatus.list()
     context['stock_status_codes'] = StockStatus.list()

InvenTree/templates/stock_table.html

@@ -18,9 +18,10 @@
             </ul>
         </div>
         {% endif %}
+        <div class='filters' id='#filter-list-stock'>
+            <!-- An empty div in which the filter list will be constructed -->
+        </div>
         <div class='filters'>
-            <button class='btn btn-default' id='filter-add'>Add filter</button>
-            <button class='btn btn-default' id='filter-clear'>Clear filters</button>
             <ul class='filter-list' id='stock-filter-list'>
                 <!-- This is an empty list which will be populated with the stock table filters -->
             </ul>

InvenTree/templates/table_filters.html

@@ -1,10 +1,10 @@
 {% load i18n %}
 {% load inventree_extras %}
 
-<script type='text/javascript'>
-
 {% load_status_codes %}
 
+<script type='text/javascript'>
+
 function getAvailableTableFilters(tableKey) {
 
     tableKey = tableKey.toLowerCase();
@@ -12,23 +12,23 @@ function getAvailableTableFilters(tableKey) {
     // Filters for the "Stock" table
     if (tableKey == 'stock') {
         return {
-            'cascade': {
-                'type': 'bool',
-                'description': '{% trans "Include stock in sublocations" %}',
-                'title': '{% trans "Include sublocations" %}',
+            cascade: {
+                type: 'bool',
+                description: '{% trans "Include stock in sublocations" %}',
+                title: '{% trans "Include sublocations" %}',
             },
-            'active': {
-                'type': 'bool',
-                'title': '{% trans "Active parts" %}',
-                'description': '{% trans "Show stock for active parts" %}',
+            active: {
+                type: 'bool',
+                title: '{% trans "Active parts" %}',
+                description: '{% trans "Show stock for active parts" %}',
             },
             'status': {
-                'options': {
+                options: {
                     {% for opt in stock_status_codes %}'{{ opt.value }}': '{{ opt.key }}',
                     {% endfor %}
                 },
-                'title': '{% trans "Stock status" %}',
-                'description': '{% trans "Stock status" %}',
+                title: '{% trans "Stock status" %}',
+                description: '{% trans "Stock status" %}',
             },
         };
     }
@@ -36,6 +36,13 @@ function getAvailableTableFilters(tableKey) {
     // Filters for the "Build" table
     if (tableKey == 'build') {
         return {
+            status: {
+                title: '{% trans "Build status" %}',
+                options: {
+                    {% for opt in build_status_codes %}'{{ opt.value }}': '{{ opt.key }}',
+                    {% endfor %}
+                },
+            },
 
         };
     }
@@ -43,11 +50,17 @@ function getAvailableTableFilters(tableKey) {
     // Filters for the "Order" table
     if (tableKey == "order") {
         return {
-
+            status: {
+                title: '{% trans "Order status" %}',
+                options: {
+                    {% for opt in order_status_codes %}'{{ opt.value }}': '{{ opt.key }}',
+                    {% endfor %}
+                },
+            },
         };
     }
 
-    // Filters fro the "Parts" table
+    // Filters for the "Parts" table
     if (tableKey == "parts") {
         return {
         };