Moar refactoring

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

@@ -112,11 +112,11 @@ function getAvailableTableFilters(tableKey) {
             'cascade': {
                 'type': 'bool',
                 'description': 'Include stock in sublocations',
-                'title': 'sublocations',
+                'title': 'Include sublocations',
             },
             'active': {
                 'type': 'bool',
-                'title': 'part active',
+                'title': 'Acitve parts',
                 'description': 'Show stock for active parts',
             },
             'status': {
@@ -127,8 +127,12 @@ function getAvailableTableFilters(tableKey) {
                     'DESTROYED': 60,
                     'LOST': 70
                 },
+                'title': 'Stock status',
                 'description': 'Stock status',
-            }
+            },
+            'test': {
+                title: 'A test parameter',
+            },
         };
     }
 
@@ -191,7 +195,62 @@ function getFilterOptionList(tableKey, filterKey) {
 }
 
 
+/*
+ * Generate a list of <option> tags for the given table.
+ */
+function generateAvailableFilterList(tableKey) {
 
+    var remaining = getRemainingTableFilters(tableKey);
+    
+    var id = 'filter-tag-' + tableKey.toLowerCase();
+
+    var html = `<select id='${id}' name='tag'>`;
+    
+    html += `<option value=''>Select filter</option>`;
+
+    for (var opt in remaining) {
+        var title = getFilterTitle(tableKey, opt);
+        html += `<option value='${opt}'>${title}</option>`;
+    }
+
+    html += `</select>`;
+
+    return html;
+}
+
+
+/*
+ * Generate an input for setting the value of a given filter.
+ */
+function generateFilterInput(tableKey, filterKey) {
+
+    var id = 'filter-value-' + tableKey.toLowerCase();
+
+    if (filterKey == null || filterKey.length == 0) {
+        // Return an 'empty' element
+        return `<div id='${id}'></div>`;
+    }
+
+    var options = getFilterOptionList(tableKey, filterKey);
+
+    var html = '';
+
+    // A 'null' options list means that a simple text-input dialog should be used
+    if (options == null) {
+        html = `<input id='${id}' name='value'></input>`;
+    } else {
+        // Return a 'select' input with the available values
+        html = `<select id='${id}' name='value'>`;
+
+        for (var opt in options) {
+            html += `<option value='${options[opt]}'>${opt}</option>`;
+        }
+
+        html += `</select>`;
+    }
+    
+    return html;
+}
 
 
 /**

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

@@ -16,26 +16,12 @@ function getStockLocations(filters={}, options={}) {
 
 
 function createStockFilter() {
-    // TODO
-    console.log("create stock filter");
 
-    var html = `<select id='filter-tag' name='tag'>`;
+    var html = generateAvailableFilterList("stock");
-
-    var available = getRemainingTableFilters("stock");
-
-    html += `<option value=''>Select filter</option>`;
-
-    for (var key in available) {
-
-        var title = getFilterTitle("stock", key);
-
-        html += `<option value='${key}'>${title}</option>`;
-    }
-
-    html += `</select>`;
 
     // Add in a (blank) selection for filter value
-    html += `<select id='filter-value' name='value'></select>`;
+    html += generateFilterInput("stock" );
+    //html += `<div id='filter-value' name='value'></select>`;
 
     html += `<button class='btn btn-default' id='filter-make'>Add</Button>`;
 
@@ -44,28 +30,19 @@ function createStockFilter() {
     div.html(html);
 
     div.find("#filter-make").click(function() {
-        var tag = div.find("#filter-tag").val();
+        var tag = div.find("#filter-tag-stock").val();
-        var val = div.find("#filter-value").val();
+        var val = div.find("#filter-value-stock").val();
 
         addTableFilter("stock", tag, val);
     });
 
-    div.find('#filter-tag').on('change', function() {
+    div.find('#filter-tag-stock').on('change', function() {
 
-        // Select the filter
+        var list = div.find('#filter-value-stock');
-        var filter = available[this.value];
 
-        var list = div.find('#filter-value');
+        list.replaceWith(generateFilterInput("stock", this.value));
-
-        list.empty();
-
-        // Make options
-        var options = getFilterOptionList("stock", this.value);
-
-        for (var option in options) {
-            list.append(`<option value='${options[option]}'>${option}</option>`);
-        }
     });
+
 }
 
 function clearStockFilters() {
@@ -78,7 +55,7 @@ function updateStockFilterList(filterListElement, table) {
     var filters = loadTableFilters("stock");
 
     for (var key in filters) {
-        $(filterListElement).append(`<li>${key} = ${filters[key]}<span filter-tag='${key}' class='close'>x</span></li>` );
+        $(filterListElement).append(`<li>${key} = ${filters[key]}<span filter-tag-stock='${key}' class='close'>x</span></li>` );
     }
 
     // Whenever the callback is called, pass the original parameters through
@@ -86,7 +63,7 @@ function updateStockFilterList(filterListElement, table) {
     $(filterListElement).find(".close").click(function(event) {
         var element = $(this);
 
-        var tag = element.attr('filter-tag');
+        var tag = element.attr('filter-tag-stock');
 
         // Clear out any existing elements
         $(filterListElement).empty();