From 2f0bbecc3deba47ca71a6eb47e4987b01265460e Mon Sep 17 00:00:00 2001
From: Oliver Walters <oliver.henry.walters@gmail.com>
Date: Sat, 25 Apr 2020 15:13:55 +1000
Subject: [PATCH] Refactored status code label generation

- Larger style available
---
 InvenTree/InvenTree/static/css/inventree.css  |  7 ++
 InvenTree/InvenTree/status_codes.py           | 80 +++++++++++--------
 .../build/templates/build/build_base.html     |  2 +-
 .../order/templates/order/order_base.html     |  2 +-
 .../templates/order/sales_order_base.html     |  2 +-
 InvenTree/part/templatetags/status_codes.py   |  8 +-
 InvenTree/templates/status_codes.html         | 14 ++--
 7 files changed, 66 insertions(+), 49 deletions(-)

diff --git a/InvenTree/InvenTree/static/css/inventree.css b/InvenTree/InvenTree/static/css/inventree.css
index e57188aa8c..72e5dbeeb5 100644
--- a/InvenTree/InvenTree/static/css/inventree.css
+++ b/InvenTree/InvenTree/static/css/inventree.css
@@ -149,6 +149,13 @@
 .label-large {
     margin: 3px;
     font-size: 100%;
+    border: 3px solid;
+    border-radius: 15px;
+    background: none;
+    padding-right: 10px;
+    padding-left: 10px;
+    padding-top: 5px;
+    padding-bottom: 5px;
 }
 
 .label-right {
diff --git a/InvenTree/InvenTree/status_codes.py b/InvenTree/InvenTree/status_codes.py
index 754a666d96..bc57f5d3f1 100644
--- a/InvenTree/InvenTree/status_codes.py
+++ b/InvenTree/InvenTree/status_codes.py
@@ -7,12 +7,18 @@ class StatusCode:
     This is used to map a set of integer values to text.
     """
 
-    labels = {}
+    # Colors used for label rendering
+    LBL_WHITE = '#FFF'
+    LBL_GREY = "#AAA"
+    LBL_GREEN = "#50aa51"
+    LBL_BLUE = "#4194bd"
+    LBL_YELLOW = "#fdc82a"
+    LBL_RED = "#e35a57"
 
     @classmethod
-    def render(cls, key):
+    def render(cls, key, large=False):
         """
-        Render the value as a label.
+        Render the value as a HTML label.
         """
 
         # If the key cannot be found, pass it back
@@ -20,12 +26,20 @@ class StatusCode:
             return key
         
         value = cls.options.get(key, key)
-        label = cls.labels.get(key, None)
+        color = cls.colors.get(key, StatusCode.LBL_GREY)
 
-        if label:
-            return "<span class='label label-{label}'>{value}</span>".format(label=label, value=value)
+        if large:
+            span_class = 'label label-large'
+            style = 'color: {c}; border-color: {c}; background: none;'.format(c=color)
         else:
-            return value
+            span_class = 'label'
+            style = 'color: {w}; background: {c}'.format(w=StatusCode.LBL_WHITE, c=color)
+
+        return "<span class='{cl}' style='{st}'>{value}</span>".format(
+            cl=span_class,
+            st=style,
+            value=value
+        )
 
     @classmethod
     def list(cls):
@@ -42,10 +56,10 @@ class StatusCode:
                 'value': cls.options[key]
             }
 
-            label = cls.labels.get(key)
+            color = cls.colors.get(key, None)
 
-            if label:
-                opt['label'] = label
+            if color:
+                opt['color'] = color
 
             codes.append(opt)
 
@@ -92,13 +106,13 @@ class PurchaseOrderStatus(StatusCode):
         RETURNED: _("Returned"),
     }
 
-    labels = {
-        PENDING: "primary",
-        PLACED: "primary",
-        COMPLETE: "success",
-        CANCELLED: "danger",
-        LOST: "warning",
-        RETURNED: "warning",
+    colors = {
+        PENDING: StatusCode.LBL_BLUE,
+        PLACED: StatusCode.LBL_BLUE,
+        COMPLETE: StatusCode.LBL_GREEN,
+        CANCELLED: StatusCode.LBL_RED,
+        LOST: StatusCode.LBL_YELLOW,
+        RETURNED: StatusCode.LBL_YELLOW,
     }
 
     # Open orders
@@ -132,12 +146,12 @@ class SalesOrderStatus(StatusCode):
         RETURNED: _("Returned"),
     }
 
-    labels = {
-        PENDING: "primary",
-        SHIPPED: "success",
-        CANCELLED: "danger",
-        LOST: "warning",
-        RETURNED: "warning",
+    colors = {
+        PENDING: StatusCode.LBL_BLUE,
+        SHIPPED: StatusCode.LBL_GREEN,
+        CANCELLED: StatusCode.LBL_RED,
+        LOST: StatusCode.LBL_YELLOW,
+        RETURNED: StatusCode.LBL_YELLOW,
     }
 
 
@@ -166,11 +180,11 @@ class StockStatus(StatusCode):
         RETURNED: _("Returned"),
     }
 
-    labels = {
-        OK: 'success',
-        ATTENTION: 'warning',
-        DAMAGED: 'danger',
-        DESTROYED: 'danger',
+    colors = {
+        OK: StatusCode.LBL_GREEN,
+        ATTENTION: StatusCode.LBL_YELLOW,
+        DAMAGED: StatusCode.LBL_RED,
+        DESTROYED: StatusCode.LBL_RED,
     }
 
     # The following codes correspond to parts that are 'available' or 'in stock'
@@ -204,11 +218,11 @@ class BuildStatus(StatusCode):
         COMPLETE: _("Complete"),
     }
 
-    labels = {
-        PENDING: 'primary',
-        ALLOCATED: 'info',
-        COMPLETE: 'success',
-        CANCELLED: 'danger',
+    colors = {
+        PENDING: StatusCode.LBL_BLUE,
+        ALLOCATED: StatusCode.LBL_BLUE,
+        COMPLETE: StatusCode.LBL_GREEN,
+        CANCELLED: StatusCode.LBL_RED,
     }
 
     ACTIVE_CODES = [
diff --git a/InvenTree/build/templates/build/build_base.html b/InvenTree/build/templates/build/build_base.html
index af1852551d..dfe3719d98 100644
--- a/InvenTree/build/templates/build/build_base.html
+++ b/InvenTree/build/templates/build/build_base.html
@@ -26,7 +26,7 @@ src="{% static 'img/blank_image.png' %}"
 {% endblock %}
 
 {% block page_data %}
-<h3>{% trans "Build" %}</h3>
+<h3>{% trans "Build" %} {% build_status_label build.status large=True %}</h3>
 <hr>
 <h4>{{ build.quantity }} x {{ build.part.full_name }}</h4>
 <div class='btn-row'>
diff --git a/InvenTree/order/templates/order/order_base.html b/InvenTree/order/templates/order/order_base.html
index 3f76d98a77..e047c5607f 100644
--- a/InvenTree/order/templates/order/order_base.html
+++ b/InvenTree/order/templates/order/order_base.html
@@ -20,7 +20,7 @@ src="{% static 'img/blank_image.png' %}"
 {% endblock %}
 
 {% block page_data %}
-<h3>{% trans "Purchase Order" %}</h3>
+<h3>{% trans "Purchase Order" %} {% purchase_order_status_label order.status large=True %}</h3>
 <hr>
 <h4>{{ order }}</h4>
 <p>{{ order.description }}</p>
diff --git a/InvenTree/order/templates/order/sales_order_base.html b/InvenTree/order/templates/order/sales_order_base.html
index 385b669215..298b7441b1 100644
--- a/InvenTree/order/templates/order/sales_order_base.html
+++ b/InvenTree/order/templates/order/sales_order_base.html
@@ -30,7 +30,7 @@ src="{% static 'img/blank_image.png' %}"
 
 {% block page_data %}
 
-<h3>{% trans "Sales Order" %}</h3>
+<h3>{% trans "Sales Order" %} {% sales_order_status_label order.status large=True %}</h3>
 <hr>
 <h4>{{ order }}</h4>
 <p>{{ order.description }}</p>
diff --git a/InvenTree/part/templatetags/status_codes.py b/InvenTree/part/templatetags/status_codes.py
index ad972726c1..2d4dc77113 100644
--- a/InvenTree/part/templatetags/status_codes.py
+++ b/InvenTree/part/templatetags/status_codes.py
@@ -13,22 +13,22 @@ register = template.Library()
 @register.simple_tag
 def purchase_order_status_label(key, *args, **kwargs):
     """ Render a PurchaseOrder status label """
-    return mark_safe(PurchaseOrderStatus.render(key))
+    return mark_safe(PurchaseOrderStatus.render(key, large=kwargs.get('large', False)))
 
 
 @register.simple_tag
 def sales_order_status_label(key, *args, **kwargs):
     """ Render a SalesOrder status label """
-    return mark_safe(SalesOrderStatus.render(key))
+    return mark_safe(SalesOrderStatus.render(key, large=kwargs.get('large', False)))
 
 
 @register.simple_tag
 def stock_status_label(key, *args, **kwargs):
     """ Render a StockItem status label """
-    return mark_safe(StockStatus.render(key))
+    return mark_safe(StockStatus.render(key, large=kwargs.get('large', False)))
 
 
 @register.simple_tag
 def build_status_label(key, *args, **kwargs):
     """ Render a Build status label """
-    return mark_safe(BuildStatus.render(key))
+    return mark_safe(BuildStatus.render(key, large=kwargs.get('large', False)))
diff --git a/InvenTree/templates/status_codes.html b/InvenTree/templates/status_codes.html
index 36d5aa8b3e..eb2b4b144d 100644
--- a/InvenTree/templates/status_codes.html
+++ b/InvenTree/templates/status_codes.html
@@ -4,8 +4,8 @@
 var {{ label }}Codes = {
     {% for opt in options %}'{{ opt.key }}': {
         key: '{{ opt.key }}',
-        value: '{{ opt.value }}',{% if opt.label %}
-        label: '{{ opt.label }}',{% endif %}
+        value: '{{ opt.value }}',{% if opt.color %}
+        color: '{{ opt.color }}',{% endif %}
     },{% endfor %}
 };
 
@@ -18,18 +18,14 @@ function {{ label }}StatusDisplay(key) {
 
     key = String(key);
 
-    var label = {{ label }}Codes[key].label;
-
     var value = {{ label }}Codes[key].value;
 
     if (value == null || value.length == 0) {
         value = key;
     }
 
-    // Label not found, return the original string
-    if (label == null || label.length == 0) {
-        return value;
-    }
+    // Select the label color
+    var color = {{ label }}Codes[key].color ?? '#AAA';
 
-    return `<span class='label label-${label}'>${value}</span>`;
+    return `<span class='label' style='background: ${color};'>${value}</span>`;
 }