Make build allocation much more intuiitive

- Display current allocation + total allocation requirement
- Color code results
- Required custom 'multiply' template tag

InvenTree/build/templates/build/allocate.html

@@ -1,5 +1,6 @@
 {% extends "base.html" %}
 {% load static %}
+{% load inventree_extras %}
 
 {% block content %}
 
@@ -36,8 +37,10 @@
 
     loadAllocationTable(
         $("#allocate-table-id-{{ bom_item.sub_part.id }}"),
+        {{ bom_item.sub_part.id }},
         "{{ bom_item.sub_part.name }}",
         "{% url 'api-build-item-list' %}?build={{ build.id }}&part={{ bom_item.sub_part.id }}",
+        {% multiply build.quantity bom_item.quantity %},
         $("#new-item-{{ bom_item.sub_part.id }}")
     );
 

InvenTree/build/templates/build/allocation_item.html

@@ -1,3 +1,5 @@
+{% load inventree_extras %}
+
 <div class='panel-group'>
     <div class='panel pane-default'>
         <div class='panel panel-heading'>
@@ -7,7 +9,19 @@
                         <a data-toggle='collapse' href='#collapse-item-{{ item.id }}'>{{ item.sub_part.name }}</a>
                     </div>
                 </div>
-                <div class='col-sm-6'>
+                <div class='col-sm-1' align='right'>
+                    Required:
+                </div>
+                <div class='col-sm-1'>   
+                    <b>{% multiply build.quantity item.quantity %}</b>
+                </div>
+                <div class='col-sm-1' align='right'>
+                    Allocated:
+                </div>
+                <div class='col-sm-1' id='allocation-panel-{{ item.sub_part.id }}'>
+                    <b><span id='allocation-total-{{ item.sub_part.id }}'>0</span></b>
+                </div>
+                <div class='col-sm-2'>
                     <div class='btn-group' style='float: right;'>
                         <button class='btn btn-success btn-sm' id='new-item-{{ item.sub_part.id }}' url="{% url 'build-item-create' %}?part={{ item.sub_part.id }}&build={{ build.id }}">Allocate Parts</button>
                     </div>

InvenTree/build/templatetags/inventree_extras.py

@@ -0,0 +1,12 @@
+""" This module provides template tags for extra functionality
+over and above the built-in Django tags.
+"""
+
+from django import template
+
+register = template.Library()
+
+
+@register.simple_tag()
+def multiply(x, y, *args, **kwargs):
+    return x * y

InvenTree/static/css/inventree.css

@@ -139,4 +139,16 @@
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
-}
+}
+
+.part-allocation-pass {
+    background: #dbf0db;
+}
+
+.part-allocation-underallocated {
+    background: #f0dbdb;
+}
+
+.part-allocation-overallocated {
+    background: #ccf5ff;
+}

InvenTree/static/script/inventree/build.js

@@ -1,4 +1,21 @@
-function loadAllocationTable(table, part, url, button) {
+function updateAllocationTotal(id, count, required) {
+    
+    
+    $('#allocation-total-'+id).html(count);
+    
+    var el = $("#allocation-panel-" + id);
+    el.removeClass('part-allocation-pass part-allocation-underallocated part-allocation-overallocated');
+
+    if (count < required) {
+        el.addClass('part-allocation-underallocated');
+    } else if (count > required) {
+        el.addClass('part-allocation-overallocated');
+    } else {
+        el.addClass('part-allocation-pass');
+    }
+}
+
+function loadAllocationTable(table, part_id, part, url, required, button) {
     
     // Load the allocation table
     table.bootstrapTable({
@@ -39,6 +56,19 @@ function loadAllocationTable(table, part, url, button) {
         });
     });
 
+    table.on('load-success.bs.table', function(data) {
+        // Extract table data
+        var results = table.bootstrapTable('getData');
+
+        var count = 0;
+
+        for (var i = 0; i < results.length; i++) {
+            count += results[i].quantity;
+        }
+
+        updateAllocationTotal(part_id, count, required);
+    });
+
     // Button callbacks for editing and deleting the allocations
     table.on('click', '.item-edit-button', function() {
         var button = $(this);