Fix: \n 1. General styles cleanup. \n 2. Contact page - styling of input fields on mobile improved. \n 3. Services page - alignment error in technologies table on most devices, corrected. \n 4. Supplier Purchase Order page - items preview click event was not triggering, fixed end-to-end saving of new SPO, most changes copied to Manufacturing Purchase Orders, but not tested.

business_objects/store/manufacturing_purchase_order.py

@@ -98,6 +98,7 @@ class Manufacturing_Purchase_Order(db.Model, Store_Base):
         manufacturing_purchase_order.cost_total_local_VAT_incl = json.get(cls.FLAG_COST_TOTAL_LOCAL_VAT_INCL, None)
         manufacturing_purchase_order.price_total_local_VAT_excl = json.get(cls.FLAG_PRICE_TOTAL_LOCAL_VAT_EXCL, None)
         manufacturing_purchase_order.price_total_local_VAT_incl = json.get(cls.FLAG_PRICE_TOTAL_LOCAL_VAT_INCL, None)
+        manufacturing_purchase_order.items = [Manufacturing_Purchase_Order_Product_Link.from_json(item) for item in json[cls.FLAG_ORDER_ITEMS]]
         manufacturing_purchase_order.active = json[cls.FLAG_ACTIVE]
         manufacturing_purchase_order.created_on = json.get(cls.FLAG_CREATED_ON, None)
         manufacturing_purchase_order.name = json.get(cls.FLAG_NAME, None)
@@ -119,9 +120,12 @@ class Manufacturing_Purchase_Order_Product_Link(db.Model, Store_Base):
     # __tablename__ = 'Shop_Manufacturing_Purchase_Order_Temp'
     id_link = db.Column(db.Integer, primary_key=True)
     id_order = db.Column(db.Integer)
+    id_category = db.Column(db.Integer)
+    id_product = db.Column(db.Integer)
     id_permutation = db.Column(db.Integer)
     id_unit_quantity = db.Column(db.Integer)
     name_permutation = db.Column(db.String(255))
+    csv_id_pairs_variation = db.Column(db.String)
     quantity_used = db.Column(db.Float)
     quantity_produced = db.Column(db.Float)
     id_unit_latency_manufacture = db.Column(db.Integer)
@@ -142,26 +146,32 @@ class Manufacturing_Purchase_Order_Product_Link(db.Model, Store_Base):
         link = cls()
         link.id_link = query_row[0]
         link.id_order = query_row[1]
-        link.id_permutation = query_row[2]
+        link.id_category = query_row[2]
-        link.name_permutation = query_row[3]
+        link.id_product = query_row[3]
-        link.id_unit_quantity = query_row[4]
+        link.id_permutation = query_row[4]
-        link.quantity_used = query_row[5]
+        link.name_permutation = query_row[5]
-        link.quantity_produced = query_row[6]
+        link.csv_id_pairs_variation = query_row[6]
-        link.id_unit_latency_manufacture = query_row[7]
+        link.id_unit_quantity = query_row[7]
-        link.latency_manufacture = query_row[8]
+        link.quantity_used = query_row[8]
-        link.display_order = query_row[9]
+        link.quantity_produced = query_row[9]
-        link.cost_unit_local_VAT_excl = query_row[10]
+        link.id_unit_latency_manufacture = query_row[10]
-        link.cost_unit_local_VAT_incl = query_row[11]
+        link.latency_manufacture = query_row[11]
-        link.price_unit_local_VAT_excl = query_row[12]
+        link.display_order = query_row[12]
-        link.price_unit_local_VAT_incl = query_row[13]
+        link.cost_unit_local_VAT_excl = query_row[13]
-        link.active = query_row[14]
+        link.cost_unit_local_VAT_incl = query_row[14]
+        link.price_unit_local_VAT_excl = query_row[15]
+        link.price_unit_local_VAT_incl = query_row[16]
+        link.active = query_row[17]
         return link
     def __repr__(self):
         return f'''
 {self.ATTR_ID_MANUFACTURING_PURCHASE_ORDER_PRODUCT_LINK}: {self.id_link},
 {self.ATTR_ID_MANUFACTURING_PURCHASE_ORDER}: {self.id_order},
+{self.ATTR_ID_PRODUCT_CATEGORY}: {self.id_category},
+{self.ATTR_ID_PRODUCT}: {self.id_product},
 {self.ATTR_ID_PRODUCT_PERMUTATION}: {self.id_permutation},
 {self.FLAG_NAME}: {self.name_permutation},
+{self.FLAG_PRODUCT_VARIATIONS}: {self.csv_id_pairs_variation},
 {self.ATTR_ID_UNIT_MEASUREMENT_QUANTITY}: {self.id_unit_quantity},
 {self.FLAG_QUANTITY_USED}: {self.quantity_used},
 {self.FLAG_QUANTITY_PRODUCED}: {self.quantity_produced},
@@ -179,8 +189,11 @@ class Manufacturing_Purchase_Order_Product_Link(db.Model, Store_Base):
             **self.get_shared_json_attributes(self),
             self.ATTR_ID_MANUFACTURING_PURCHASE_ORDER_PRODUCT_LINK: self.id_link,
             self.ATTR_ID_MANUFACTURING_PURCHASE_ORDER: self.id_order,
+            self.ATTR_ID_PRODUCT_CATEGORY: self.id_category,
+            self.ATTR_ID_PRODUCT: self.id_product,                        
             self.ATTR_ID_PRODUCT_PERMUTATION: self.id_permutation,
             self.FLAG_NAME: self.name_permutation,
+            self.FLAG_PRODUCT_VARIATIONS: self.csv_id_pairs_variation,
             self.ATTR_ID_UNIT_MEASUREMENT_QUANTITY: self.id_unit_quantity,
             self.FLAG_QUANTITY_USED: self.quantity_used,
             self.FLAG_QUANTITY_PRODUCED: self.quantity_produced,
@@ -204,8 +217,11 @@ class Manufacturing_Purchase_Order_Product_Link(db.Model, Store_Base):
         link = cls()
         link.id_link = json[cls.ATTR_ID_MANUFACTURING_PURCHASE_ORDER_PRODUCT_LINK]
         link.id_order = json[cls.ATTR_ID_MANUFACTURING_PURCHASE_ORDER]
-        link.id_permutation = json[cls.ATTR_ID_PRODUCT_PERMUTATION]
+        link.id_category = json[cls.ATTR_ID_PRODUCT_CATEGORY]
-        link.name_permutation = json[cls.FLAG_NAME]
+        link.id_product = json[cls.ATTR_ID_PRODUCT]
+        link.id_permutation = json.get(cls.ATTR_ID_PRODUCT_PERMUTATION, None)
+        link.name_permutation = json.get(cls.FLAG_NAME, None)
+        link.csv_id_pairs_variation = json[cls.FLAG_PRODUCT_VARIATIONS]
         link.id_unit_quantity = json[cls.ATTR_ID_UNIT_MEASUREMENT_QUANTITY]
         link.quantity_used = json[cls.FLAG_QUANTITY_USED]
         link.quantity_produced = json[cls.FLAG_QUANTITY_PRODUCED]
@@ -247,23 +263,24 @@ class Parameters_Manufacturing_Purchase_Order(Get_Many_Parameters_Base):
 class Manufacturing_Purchase_Order_Temp(db.Model, Store_Base):
     __tablename__: ClassVar[str] = 'Shop_Manufacturing_Purchase_Order_Temp'
     __table_args__ = { 'extend_existing': True }
-    id_order: int = db.Column(db.Integer, primary_key=True)
+    id_temp: int = db.Column(db.Integer, primary_key=True, autoincrement=True)
-    id_manufacturing: int = db.Column(db.Integer)
+    id_order: int = db.Column(db.Integer)
     id_currency: int = db.Column(db.Integer)
     active: bool = db.Column(db.Boolean)
     guid: str = db.Column(db.String(36))
+    def __init__(self):
+        super().__init__()
+        self.id_temp = None
     @classmethod
     def from_manufacturing_purchase_order(cls, manufacturing_purchase_order):
         row = cls()
         row.id_order = manufacturing_purchase_order.id_order
-        row.id_manufacturing = manufacturing_purchase_order.id_manufacturing
         row.id_currency = manufacturing_purchase_order.id_currency
         row.active = 1 if manufacturing_purchase_order.active else 0
         return row
     def __repr__(self):
         return f'''
 id_order: {self.id_order}
-id_manufacturing: {self.id_manufacturing}
 id_currency: {self.id_currency}
 active: {self.active}
 guid: {self.guid}
@@ -272,9 +289,13 @@ guid: {self.guid}
 class Manufacturing_Purchase_Order_Product_Link_Temp(db.Model, Store_Base):
     __tablename__: ClassVar[str] = 'Shop_Manufacturing_Purchase_Order_Product_Link_Temp'
     __table_args__ = { 'extend_existing': True }
-    id_link: int = db.Column(db.Integer, primary_key=True)
+    id_temp: int = db.Column(db.Integer, primary_key=True, autoincrement=True)
+    id_link: int = db.Column(db.Integer)
     id_order: int = db.Column(db.Integer)
+    id_category: int = db.Column(db.Integer)
+    id_product: int = db.Column(db.Integer)
     id_permutation: int = db.Column(db.Integer)
+    csv_list_variations: str = db.Column(db.String)
     id_unit_quantity: int = db.Column(db.Integer)
     quantity_used: float = db.Column(db.Float)
     quantity_produced: float = db.Column(db.Float)
@@ -289,12 +310,18 @@ class Manufacturing_Purchase_Order_Product_Link_Temp(db.Model, Store_Base):
     """
     active: bool = db.Column(db.Boolean)
     guid: str = db.Column(db.String(36))
+    def __init__(self):
+        super().__init__()
+        self.id_temp = None
     @classmethod
     def from_manufacturing_purchase_order_product_link(cls, manufacturing_purchase_order_product_link):
         row = cls()
         row.id_link = manufacturing_purchase_order_product_link.id_link
         row.id_order = manufacturing_purchase_order_product_link.id_order
+        row.id_category = manufacturing_purchase_order_product_link.id_category
+        row.id_product = manufacturing_purchase_order_product_link.id_product
         row.id_permutation = manufacturing_purchase_order_product_link.id_permutation
+        row.csv_list_variations = manufacturing_purchase_order_product_link.csv_id_pairs_variation
         row.id_unit_quantity = manufacturing_purchase_order_product_link.id_unit_quantity
         row.quantity_used = manufacturing_purchase_order_product_link.quantity_used
         row.quantity_produced = manufacturing_purchase_order_product_link.quantity_produced
@@ -313,7 +340,10 @@ class Manufacturing_Purchase_Order_Product_Link_Temp(db.Model, Store_Base):
         return f'''
 id_link: {self.id_link}
 id_order: {self.id_order}
+id_category: {self.id_category}
+id_product: {self.id_product}
 id_permutation: {self.id_permutation}
+csv_list_variations: {self.csv_list_variations}
 id_unit_quantity: {self.id_unit_quantity}
 quantity_used: {self.quantity_used}
 quantity_produced: {self.quantity_produced}

business_objects/store/supplier.py

@@ -29,7 +29,7 @@ class Supplier(db.Model, Store_Base):
     FLAG_NAME_CONTACT: ClassVar[str] = 'name_contact'
     NAME_ATTR_OPTION_VALUE: ClassVar[str] = Store_Base.ATTR_ID_SUPPLIER
     NAME_ATTR_OPTION_TEXT: ClassVar[str] = FLAG_NAME_COMPANY
-    __tablename__ = 'Shop_Supplier_Temp'
+    __tablename__ = 'Shop_Supplier'
     id_supplier = db.Column(db.Integer, primary_key=True)
     # id_address = db.Column(db.Integer)
     id_currency = db.Column(db.Integer)
@@ -153,7 +153,8 @@ class Parameters_Supplier(Get_Many_Parameters_Base):
 class Supplier_Temp(db.Model, Store_Base):
     __tablename__: ClassVar[str] = 'Shop_Supplier_Temp'
     __table_args__ = { 'extend_existing': True }
-    id_supplier: int = db.Column(db.Integer, primary_key=True)
+    id_temp: int = db.Column(db.Integer, primary_key=True, autoincrement=True)
+    id_supplier: int = db.Column(db.Integer)
     id_currency: int = db.Column(db.Integer)
     # id_address: int = db.Column(db.Integer)
     name_company: str = db.Column(db.String(255))
@@ -165,6 +166,9 @@ class Supplier_Temp(db.Model, Store_Base):
     website: str = db.Column(db.String(255))
     active: bool = db.Column(db.Boolean)
     guid: str = db.Column(db.String(36))
+    def __init__(self):
+        super().__init__()
+        self.id_temp = None
     @classmethod
     def from_supplier(cls, supplier):
         row = cls()

business_objects/store/supplier_purchase_order.py

@@ -100,6 +100,7 @@ class Supplier_Purchase_Order(db.Model, Store_Base):
         supplier_purchase_order.id_currency = json[cls.ATTR_ID_CURRENCY]
         supplier_purchase_order.cost_total_local_VAT_excl = json[cls.FLAG_COST_TOTAL_LOCAL_VAT_EXCL]
         supplier_purchase_order.cost_total_local_VAT_incl = json[cls.FLAG_COST_TOTAL_LOCAL_VAT_INCL]
+        supplier_purchase_order.items = [Supplier_Purchase_Order_Product_Link.from_json(item) for item in json[cls.FLAG_ORDER_ITEMS]]
         supplier_purchase_order.active = json[cls.FLAG_ACTIVE]
         supplier_purchase_order.created_on = json.get(cls.FLAG_CREATED_ON, None)
         supplier_purchase_order.created_by = json.get(cls.FLAG_CREATED_BY, None)
@@ -115,6 +116,7 @@ class Supplier_Purchase_Order_Product_Link(db.Model, Store_Base):
     id_category = db.Column(db.Integer)
     id_product = db.Column(db.Integer)
     id_permutation = db.Column(db.Integer)
+    csv_id_pairs_variation = db.Column(db.String)
     id_unit_quantity = db.Column(db.Integer)
     name_permutation = db.Column(db.String(255))
     quantity_ordered = db.Column(db.Float)
@@ -141,16 +143,17 @@ class Supplier_Purchase_Order_Product_Link(db.Model, Store_Base):
         link.id_product = query_row[3]
         link.id_permutation = query_row[4]
         link.name_permutation = query_row[5]
-        link.id_unit_quantity = query_row[6]
+        link.csv_id_pairs_variation = query_row[6]
-        link.quantity_ordered = query_row[7]
+        link.id_unit_quantity = query_row[7]
-        link.quantity_received = query_row[8]
+        link.quantity_ordered = query_row[8]
-        link.latency_delivery_days = query_row[9]
+        link.quantity_received = query_row[9]
-        link.display_order = query_row[10]
+        link.latency_delivery_days = query_row[10]
-        link.cost_total_local_VAT_excl = query_row[11]
+        link.display_order = query_row[11]
-        link.cost_total_local_VAT_incl = query_row[12]
+        link.cost_total_local_VAT_excl = query_row[12]
-        link.cost_unit_local_VAT_excl = query_row[13]
+        link.cost_total_local_VAT_incl = query_row[13]
-        link.cost_unit_local_VAT_incl = query_row[14]
+        link.cost_unit_local_VAT_excl = query_row[14]
-        link.active = query_row[15]
+        link.cost_unit_local_VAT_incl = query_row[15]
+        link.active = query_row[16]
         return link
     def __repr__(self):
         return f'''
@@ -160,6 +163,7 @@ class Supplier_Purchase_Order_Product_Link(db.Model, Store_Base):
 {self.ATTR_ID_PRODUCT}: {self.id_product},
 {self.ATTR_ID_PRODUCT_PERMUTATION}: {self.id_permutation},
 {self.FLAG_NAME}: {self.name_permutation},
+{self.FLAG_PRODUCT_VARIATIONS}: {self.csv_id_pairs_variation},
 {self.ATTR_ID_UNIT_MEASUREMENT_QUANTITY}: {self.id_unit_quantity},
 {self.FLAG_QUANTITY_ORDERED}: {self.quantity_ordered},
 {self.FLAG_QUANTITY_RECEIVED}: {self.quantity_received},
@@ -180,6 +184,7 @@ class Supplier_Purchase_Order_Product_Link(db.Model, Store_Base):
             self.ATTR_ID_PRODUCT: self.id_product,
             self.ATTR_ID_PRODUCT_PERMUTATION: self.id_permutation,
             self.FLAG_NAME: self.name_permutation,
+            self.FLAG_PRODUCT_VARIATIONS: self.csv_id_pairs_variation,
             self.ATTR_ID_UNIT_MEASUREMENT_QUANTITY: self.id_unit_quantity,
             self.FLAG_QUANTITY_ORDERED: self.quantity_ordered,
             self.FLAG_QUANTITY_RECEIVED: self.quantity_received,
@@ -204,8 +209,9 @@ class Supplier_Purchase_Order_Product_Link(db.Model, Store_Base):
         link.id_order = json[cls.ATTR_ID_SUPPLIER_PURCHASE_ORDER]
         link.id_category = json.get(cls.ATTR_ID_PRODUCT_CATEGORY, None)
         link.id_product = json.get(cls.ATTR_ID_PRODUCT, None)
-        link.id_permutation = json[cls.ATTR_ID_PRODUCT_PERMUTATION]
+        link.id_permutation = json.get(cls.ATTR_ID_PRODUCT_PERMUTATION, None)
         link.name_permutation = json.get(cls.FLAG_NAME, None)
+        link.csv_id_pairs_variation = json.get(cls.FLAG_PRODUCT_VARIATIONS, '')
         link.id_unit_quantity = json[cls.ATTR_ID_UNIT_MEASUREMENT_QUANTITY]
         link.quantity_ordered = json[cls.FLAG_QUANTITY_ORDERED]
         link.quantity_received = json[cls.FLAG_QUANTITY_RECEIVED]
@@ -214,7 +220,7 @@ class Supplier_Purchase_Order_Product_Link(db.Model, Store_Base):
         link.cost_total_local_VAT_excl = json[cls.FLAG_COST_TOTAL_LOCAL_VAT_EXCL]
         link.cost_total_local_VAT_incl = json[cls.FLAG_COST_TOTAL_LOCAL_VAT_INCL]
         link.cost_unit_local_VAT_excl = json.get(cls.FLAG_COST_UNIT_LOCAL_VAT_EXCL, None)
-        link.cost_unit_local_VAT_incl = json(cls.FLAG_COST_UNIT_LOCAL_VAT_INCL, None)
+        link.cost_unit_local_VAT_incl = json.get(cls.FLAG_COST_UNIT_LOCAL_VAT_INCL, None)
         link.active = json[cls.FLAG_ACTIVE]
         return link
 
@@ -254,11 +260,15 @@ class Parameters_Supplier_Purchase_Order(Get_Many_Parameters_Base):
 class Supplier_Purchase_Order_Temp(db.Model, Store_Base):
     __tablename__: ClassVar[str] = 'Shop_Supplier_Purchase_Order_Temp'
     __table_args__ = { 'extend_existing': True }
-    id_order: int = db.Column(db.Integer, primary_key=True)
+    id_temp: int = db.Column(db.Integer, primary_key=True, autoincrement=True)
+    id_order: int = db.Column(db.Integer)
     id_supplier_ordered: int = db.Column(db.Integer)
     id_currency_cost: int = db.Column(db.Integer)
     active: bool = db.Column(db.Boolean)
     guid: str = db.Column(db.String(36))
+    def __init__(self):
+        super().__init__()
+        self.id_temp = None
     @classmethod
     def from_supplier_purchase_order(cls, supplier_purchase_order):
         row = cls()
@@ -279,10 +289,12 @@ guid: {self.guid}
 class Supplier_Purchase_Order_Product_Link_Temp(db.Model, Store_Base):
     __tablename__: ClassVar[str] = 'Shop_Supplier_Purchase_Order_Product_Link_Temp'
     __table_args__ = { 'extend_existing': True }
-    id_link = db.Column(db.Integer, primary_key=True)
+    id_temp: int = db.Column(db.Integer, primary_key=True, autoincrement=True)
+    id_link = db.Column(db.Integer)
     id_order = db.Column(db.Integer)
     id_product = db.Column(db.Integer)
     id_permutation = db.Column(db.Integer)
+    csv_list_variations = db.Column(db.String)
     id_unit_quantity = db.Column(db.Integer)
     quantity_ordered = db.Column(db.Float)
     quantity_received = db.Column(db.Float)
@@ -292,6 +304,9 @@ class Supplier_Purchase_Order_Product_Link_Temp(db.Model, Store_Base):
     cost_total_local_VAT_incl = db.Column(db.Float)
     active = db.Column(db.Boolean)
     guid = db.Column(db.String(36))
+    def __init__(self):
+        super().__init__()
+        self.id_temp = None
     @classmethod
     def from_supplier_purchase_order_product_link(cls, supplier_purchase_order_product_link):
         row = cls()
@@ -299,6 +314,7 @@ class Supplier_Purchase_Order_Product_Link_Temp(db.Model, Store_Base):
         row.id_order = supplier_purchase_order_product_link.id_order
         row.id_product = supplier_purchase_order_product_link.id_product
         row.id_permutation = supplier_purchase_order_product_link.id_permutation
+        row.csv_list_variations = supplier_purchase_order_product_link.csv_id_pairs_variation
         row.id_unit_quantity = supplier_purchase_order_product_link.id_unit_quantity
         row.quantity_ordered = supplier_purchase_order_product_link.quantity_ordered
         row.quantity_received = supplier_purchase_order_product_link.quantity_received
@@ -314,6 +330,7 @@ id_link: {self.id_link}
 id_order: {self.id_order}
 id_product: {self.id_product}
 id_permutation: {self.id_permutation}
+csv_list_variations: {self.csv_list_variations}
 id_unit_quantity: {self.id_unit_quantity}
 quantity_ordered: {self.quantity_ordered}
 quantity_received: {self.quantity_received}

controllers/store/manufacturing_purchase_order.py

@@ -62,12 +62,12 @@ def filter_manufacturing_purchase_order():
                     Model_View_Store_Manufacturing_Purchase_Order.FLAG_STATUS: Model_View_Store_Manufacturing_Purchase_Order.FLAG_FAILURE, 
                     Model_View_Store_Manufacturing_Purchase_Order.FLAG_MESSAGE: f'Form invalid.\n{form_filters.errors}'
                 })
-        model = Model_View_Store_Manufacturing_Purchase_Order(filters_manufacturing_purchase_order = form_filters)
+        model = Model_View_Store_Manufacturing_Purchase_Order(form_filters_old = form_filters)
         if not model.is_user_logged_in:
             raise Exception('User not logged in.')
         return jsonify({
             Model_View_Store_Manufacturing_Purchase_Order.FLAG_STATUS: Model_View_Store_Manufacturing_Purchase_Order.FLAG_SUCCESS, 
-            Model_View_Store_Manufacturing_Purchase_Order.FLAG_DATA: model.category_list.to_json()
+            Model_View_Store_Manufacturing_Purchase_Order.FLAG_DATA: model.convert_list_objects_to_json(model.manufacturing_purchase_orders)
         })
     except Exception as e:
         return jsonify({
@@ -99,12 +99,12 @@ def save_manufacturing_purchase_order():
                 Model_View_Store_Manufacturing_Purchase_Order.FLAG_STATUS: Model_View_Store_Manufacturing_Purchase_Order.FLAG_FAILURE, 
                 Model_View_Store_Manufacturing_Purchase_Order.FLAG_MESSAGE: f'Save errors: {save_errors}'
             })
-        model_return = Model_View_Store_Manufacturing_Purchase_Order(filters_manufacturing_purchase_order_old = form_filters)
+        model_return = Model_View_Store_Manufacturing_Purchase_Order(form_filters_old = form_filters)
         if not model_return.is_user_logged_in:
             raise Exception('User not logged in.')
         return jsonify({
             Model_View_Store_Manufacturing_Purchase_Order.FLAG_STATUS: Model_View_Store_Manufacturing_Purchase_Order.FLAG_SUCCESS, 
-            Model_View_Store_Manufacturing_Purchase_Order.FLAG_DATA: model_return.category_list.to_json()
+            Model_View_Store_Manufacturing_Purchase_Order.FLAG_DATA: model_return.convert_list_objects_to_json(model_return.manufacturing_purchase_orders)
         })
     except Exception as e:
         return jsonify({

controllers/store/supplier.py

@@ -62,7 +62,7 @@ def filter_supplier():
                     Model_View_Store_Supplier.FLAG_STATUS: Model_View_Store_Supplier.FLAG_FAILURE, 
                     Model_View_Store_Supplier.FLAG_MESSAGE: f'Form invalid.\n{form_filters.errors}'
                 })
-        model = Model_View_Store_Supplier(filters_supplier = form_filters)
+        model = Model_View_Store_Supplier(form_filters_old = form_filters)
         if not model.is_user_logged_in:
             raise Exception('User not logged in.')
         return jsonify({

controllers/store/supplier_purchase_order.py

@@ -62,12 +62,12 @@ def filter_supplier_purchase_order():
                     Model_View_Store_Supplier_Purchase_Order.FLAG_STATUS: Model_View_Store_Supplier_Purchase_Order.FLAG_FAILURE, 
                     Model_View_Store_Supplier_Purchase_Order.FLAG_MESSAGE: f'Form invalid.\n{form_filters.errors}'
                 })
-        model = Model_View_Store_Supplier_Purchase_Order(filters_supplier_purchase_order = form_filters)
+        model = Model_View_Store_Supplier_Purchase_Order(form_filters_old = form_filters)
         if not model.is_user_logged_in:
             raise Exception('User not logged in.')
         return jsonify({
             Model_View_Store_Supplier_Purchase_Order.FLAG_STATUS: Model_View_Store_Supplier_Purchase_Order.FLAG_SUCCESS, 
-            Model_View_Store_Supplier_Purchase_Order.FLAG_DATA: model.category_list.to_json()
+            Model_View_Store_Supplier_Purchase_Order.FLAG_DATA: model.convert_list_objects_to_dict_json_by_attribute_key_default(model.supplier_purchase_orders)
         })
     except Exception as e:
         return jsonify({

forms/store/manufacturing_purchase_order.py

@@ -33,6 +33,8 @@ class Filters_Manufacturing_Purchase_Order(Form_Base):
         _m = f'{cls.__name__}.from_json'
         form =  cls()
         form.active.data = av.input_bool(json[Store_Base.FLAG_ACTIVE], 'active', _m)
-        form.date_from.data = json[Store_Base.FLAG_DATE_FROM]
+        if json[Store_Base.FLAG_DATE_FROM] != '':
-        form.date_to.data = json[Store_Base.FLAG_DATE_TO]
+            form.date_from.data = json[Store_Base.FLAG_DATE_FROM]
+        if json[Store_Base.FLAG_DATE_TO] != '':
+            form.date_to.data = json[Store_Base.FLAG_DATE_TO]
         return form

forms/store/supplier_purchase_order.py

@@ -33,6 +33,8 @@ class Filters_Supplier_Purchase_Order(Form_Base):
         _m = f'{cls.__name__}.from_json'
         form =  cls()
         form.active.data = av.input_bool(json[Store_Base.FLAG_ACTIVE], 'active', _m)
-        form.date_from.data = json[Store_Base.FLAG_DATE_FROM]
+        if json[Store_Base.FLAG_DATE_FROM] != '':
-        form.date_to.data = json[Store_Base.FLAG_DATE_TO]
+            form.date_from.data = json[Store_Base.FLAG_DATE_FROM]
+        if json[Store_Base.FLAG_DATE_TO] != '':
+            form.date_to.data = json[Store_Base.FLAG_DATE_TO]
         return form

static/MySQL/0000_combine.sql

@@ -1119,13 +1119,14 @@ CREATE TABLE IF NOT EXISTS Shop_Unit_Measurement_Audit (
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Unit_Measurement_Conversion';
 
 CREATE TABLE IF NOT EXISTS Shop_Unit_Measurement_Conversion (
-    id_conversion INT NOT NULL PRIMARY KEY,
+    id_conversion INT NOT NULL PRIMARY KEY AUTO_INCREMENT,
     id_unit_derived INT NOT NULL,
     id_unit_base INT NOT NULL,
-    power_unit_base FLOAT NOT NULL,
     multiplier_unit_base FLOAT NOT NULL,
     increment_unit_base FLOAT NOT NULL,
+    apply_multiplier_before_increment BIT NOT NULL DEFAULT 1,
     active BIT NOT NULL DEFAULT 1,
+    display_order INT NOT NULL,
     created_on DATETIME,
     created_by INT,
     id_change_set INT,
@@ -1498,22 +1499,27 @@ CREATE TABLE IF NOT EXISTS Shop_Variation_Type_Temp (
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Variation';
 
 CREATE TABLE Shop_Variation (
-	id_variation INT NOT NULL AUTO_INCREMENT PRIMARY KEY, 
+	id_variation INT NOT NULL AUTO_INCREMENT PRIMARY KEY
-	id_type INT NOT NULL,
+	, id_type INT NOT NULL
-	CONSTRAINT FK_Shop_Variation_id_type
+	, CONSTRAINT FK_Shop_Variation_id_type
 		FOREIGN KEY (id_type) 
-		REFERENCES Shop_Variation_Type(id_type)
+		REFERENCES partsltd_prod.Shop_Variation_Type(id_type)
-		ON UPDATE RESTRICT,
+		ON UPDATE RESTRICT
-	code VARCHAR(50),
+    , id_unit_measurement INT NULL
-	name VARCHAR(255),
+	, CONSTRAINT FK_Shop_Unit_Measurement_id_unit_measurement
-	active BIT NOT NULL DEFAULT 1,
+		FOREIGN KEY (id_unit_measurement) 
-	display_order INT NOT NULL,
+		REFERENCES partsltd_prod.Shop_Unit_Measurement(id_unit_measurement)
-	created_on DATETIME,
+    , count_unit_measurement INT NULL
-	created_by INT,
+	, code VARCHAR(50)
-	id_change_set INT,
+	, name VARCHAR(255)
-	CONSTRAINT FK_Shop_Variation_id_change_set
+	, active BIT NOT NULL DEFAULT 1
+	, display_order INT NOT NULL
+	, created_on DATETIME
+	, created_by INT
+	, id_change_set INT
+	, CONSTRAINT FK_Shop_Variation_id_change_set
 		FOREIGN KEY (id_change_set) 
-		REFERENCES Shop_Product_Change_Set(id_change_set)
+		REFERENCES partsltd_prod.Shop_Product_Change_Set(id_change_set)
 );
 
 # Variation Audits
@@ -1548,6 +1554,8 @@ CREATE TABLE Shop_Variation_Temp (
 	id_temp INT NOT NULL PRIMARY KEY AUTO_INCREMENT
 	, id_variation INT NOT NULL
 	, id_type INT NOT NULL
+    , id_unit_measurement INT NULL
+    , count_unit_measurement INT NULL
 	, code VARCHAR(50)
 	, name VARCHAR(255)
 	, active BIT
@@ -2542,6 +2550,7 @@ CREATE TABLE IF NOT EXISTS Shop_Supplier_Audit (
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Supplier_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Supplier_Temp (
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
     id_supplier INT NOT NULL,
     name_company VARCHAR(255) NOT NULL,
     name_contact VARCHAR(255) NULL,
@@ -2692,7 +2701,8 @@ DROP TABLE IF EXISTS Shop_Supplier_Purchase_Order_Temp;
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Supplier_Purchase_Order_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Supplier_Purchase_Order_Temp (
-	id_order INT NOT NULL
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY
+	, id_order INT NOT NULL
     , id_supplier_ordered INT NOT NULL
     , id_currency_cost INT NOT NULL
     , active BIT NULL
@@ -2770,7 +2780,8 @@ CREATE TABLE IF NOT EXISTS Shop_Supplier_Purchase_Order_Product_Link_Audit (
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Supplier_Purchase_Order_Product_Link_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Supplier_Purchase_Order_Product_Link_Temp (
-	id_link INT NOT NULL PRIMARY KEY
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY
+	, id_link INT NOT NULL
     , id_order INT NOT NULL
     , id_product INT NULL
     , id_permutation INT NULL
@@ -2855,7 +2866,8 @@ CREATE TABLE IF NOT EXISTS Shop_Manufacturing_Purchase_Order_Audit (
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Manufacturing_Purchase_Order_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Manufacturing_Purchase_Order_Temp (
-	id_order INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
+	id_order INT NOT NULL,
     /*
 	cost_total_local FLOAT NOT NULL,
     */
@@ -2952,7 +2964,8 @@ CREATE TABLE IF NOT EXISTS Shop_Manufacturing_Purchase_Order_Product_Link_Audit
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Manufacturing_Purchase_Order_Product_Link_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Manufacturing_Purchase_Order_Product_Link_Temp (
-	id_link INT NOT NULL PRIMARY KEY,
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
+	id_link INT NOT NULL,
     id_order INT NOT NULL,
     id_product INT NULL,
     id_permutation INT NULL,
@@ -4347,6 +4360,14 @@ BEGIN
         value_new,
         id_change_set
     )
+    # Changed id_unit_measurement
+	SELECT NEW.id_variation, 'id_unit_measurement', OLD.id_unit_measurement, NEW.id_unit_measurement, NEW.id_change_set
+		WHERE NOT OLD.id_unit_measurement <=> NEW.id_unit_measurement
+    UNION
+    # Changed count_unit_measurement
+	SELECT NEW.id_variation, 'count_unit_measurement', OLD.count_unit_measurement, NEW.count_unit_measurement, NEW.id_change_set
+		WHERE NOT OLD.count_unit_measurement <=> NEW.count_unit_measurement
+    UNION
     # Changed code
 	SELECT NEW.id_variation, 'code', OLD.code, NEW.code, NEW.id_change_set
 		WHERE NOT OLD.code <=> NEW.code
@@ -5755,10 +5776,6 @@ BEGIN
 	# Changed id_unit_base
 	SELECT NEW.id_conversion, 'id_unit_base', OLD.id_unit_base, NEW.id_unit_base, NEW.id_change_set
 		WHERE NOT OLD.id_unit_base <=> NEW.id_unit_base
-    UNION
-	# Changed power_unit_base
-	SELECT NEW.id_conversion, 'power_unit_base', OLD.power_unit_base, NEW.power_unit_base, NEW.id_change_set
-		WHERE NOT OLD.power_unit_base <=> NEW.power_unit_base
     UNION
 	# Changed multiplier_unit_base
 	SELECT NEW.id_conversion, 'multiplier_unit_base', OLD.multiplier_unit_base, NEW.multiplier_unit_base, NEW.id_change_set
@@ -5767,6 +5784,10 @@ BEGIN
 	# Changed increment_unit_base
 	SELECT NEW.id_conversion, 'active', OLD.increment_unit_base, NEW.increment_unit_base, NEW.id_change_set
 		WHERE NOT OLD.increment_unit_base <=> NEW.increment_unit_base
+    UNION
+	# Changed apply_multiplier_before_increment
+	SELECT NEW.id_conversion, 'apply_multiplier_before_increment', OLD.apply_multiplier_before_increment, NEW.apply_multiplier_before_increment, NEW.id_change_set
+		WHERE NOT OLD.apply_multiplier_before_increment <=> NEW.apply_multiplier_before_increment
     UNION
 	# Changed active
 	SELECT NEW.id_conversion, 'active', OLD.active, NEW.active, NEW.id_change_set
@@ -7690,7 +7711,7 @@ BEGIN
 	SET a_get_inactive_storage_location = IFNULL(a_get_inactive_storage_location, 0);
     
 	SELECT 
-		SL.id_storage_location
+		SL.id_location
         , P.id_plant
         , P.id_address
         , A.id_region
@@ -11623,6 +11644,7 @@ BEGIN
     -- Duplicate Variation Ids
     -- Duplicate Variation Type Codes
     -- Duplicate Variation Codes
+    -- Variation unit measurement with no count unit measurement
     
     -- Permissions
 	IF a_debug = 1 THEN
@@ -22567,21 +22589,60 @@ INSERT INTO Shop_Unit_Measurement (
 	name_singular, name_plural, symbol, is_base_unit, is_unit_of_distance, is_unit_of_mass, is_unit_of_time, is_unit_of_volume
 )
 VALUES
-	('metre', 'metres', 'm', 1, 1, 0, 0, 0),
+	('metre', 'metres', 'm', 1, 1, 0, 0, 0)
-    ('kilogram', 'kilograms', 'kg', 1, 0, 1, 0, 0),
+	, ('millimetre', 'millimetres', 'mm', 0, 1, 0, 0, 0)
-    ('item', 'items', 'x', 0, 0, 0, 0, 0),
+    , ('kilogram', 'kilograms', 'kg', 1, 0, 1, 0, 0)
-	('hour', 'hours', 'h', 1, 0, 0, 1, 0)
+	, ('gram', 'grams', 'g', 0, 0, 1, 0, 0)
+	, ('litre', 'litres', 'L', 0, 0, 0, 0, 1)
+	, ('millilitre', 'millilitres', 'mL', 0, 0, 0, 0, 1)
+    , ('item', 'items', 'x', 0, 0, 0, 0, 0)
+	, ('hour', 'hours', 'h', 1, 0, 0, 1, 0)
+	, ('day', 'days', 'd', 0, 0, 0, 1, 0)
 ;
 
-/*
 # Unit of Measurement Conversion
 INSERT INTO Shop_Unit_Measurement_Conversion (
-	id_unit_derived, id_unit_base, power_unit_base, multiplier_unit_base, increment_unit_base
+	id_unit_derived
+	, id_unit_base
+	, display_order
+	, multiplier_unit_base
+	, increment_unit_base
+	, apply_multiplier_before_increment
 )
-VALUES
+VALUES 
-	
+	(
+		2 -- id_unit_derived
+		, 1 -- id_unit_base
+		, 1 -- display_order
+		, 0.001 -- multiplier_unit_base
+		, 0 -- increment_unit_base
+		, apply_multiplier_before_increment
+	)
+	, (
+		4 -- id_unit_derived
+		, 3 -- id_unit_base
+		, 1 -- display_order
+		, 0.001 -- multiplier_unit_base
+		, 0 -- increment_unit_base
+		, apply_multiplier_before_increment
+	)
+	, (
+		6 -- id_unit_derived
+		, 5 -- id_unit_base
+		, 1 -- display_order
+		, 0.001 -- multiplier_unit_base
+		, 0 -- increment_unit_base
+		, apply_multiplier_before_increment
+	)
+	, (
+		9 -- id_unit_derived
+		, 8 -- id_unit_base
+		, 1 -- display_order
+		, 24 -- multiplier_unit_base
+		, 0 -- increment_unit_base
+		, apply_multiplier_before_increment
+	)
 ;
-*/
 
 
 # Categories
@@ -22841,15 +22902,138 @@ INSERT INTO Shop_Variation_Type (
 )
 VALUES 
 	(1, 'COLOUR', 'Colour', 'Colours')
+	, (2, 'SIZE', 'Size', 'Sizes')
 ;
 
 # Variations
 INSERT INTO Shop_Variation (
-	display_order, id_type, code, name
+	display_order, id_type, code, name, id_unit_measurement, count_unit_measurement
 )
 VALUES 
-	(1, 1, 'RED', 'Red'),
+	(1, 1, 'RED', 'Red', NULL, NULL)
-	(2, 1, 'BLUE', 'Blue')
+	, (2, 1, 'BLUE', 'Blue', NULL, NULL)
+	, (1, 2, '400ml', '400 millilitres', 6, 400)
+	, (2, 2, '400g', '400 grams', 4, 400)
+	, (3, 2, '410g', '410 grams', 4, 410)
+	, (4, 2, '8g', '8 grams', 4, 8)
+	, (5, 2, '13g', '13 grams', 4, 13)
+	, (6, 2, '27g', '27 grams', 4, 27)
+	, (7, 2, '104g', '104 grams', 4, 104)
+	, (8, 2, '200g', '200 grams', 4, 200)
+	, (9, 2, '92g', '92 grams', 4, 92)
+	, (10, 2, '100g', '100 grams', 4, 100)
+	, (11, 2, '500g', '500 grams', 4, 500)
+	, (12, 2, '250g', '250 grams', 4, 250)
+	, (13, 2, '750g', '750 grams', 4, 750)
+	, (14, 2, '145g', '145 grams', 4, 145)
+	, (15, 2, '340g', '340 grams', 4, 340)
+	, (16, 2, '132g', '132 grams', 4, 132)
+	, (17, 2, '170g', '170 grams', 4, 170)
+	, (18, 2, '700g', '700 grams', 4, 700)
+	, (19, 2, '150g', '150 grams', 4, 150)
+	, (20, 2, '1kg', '1 kilogram', 3, 1)
+	, (21, 2, '2kg', '2 kilograms', 3, 2)
+	, (22, 2, '800ml', '800 millilitres', 6, 800)
+	, (23, 2, '570g', '570 grams', 4, 570)
+	, (24, 2, '300g', '300 grams', 4, 300)
+	, (25, 2, '350g', '350 grams', 4, 350)
+	, (26, 2, '30g', '30 grams', 4, 30)
+	, (27, 2, '1L', '1 litre', 5, 1)
+	, (28, 2, '1.2L', '1.2 litres', 5, 1.2)
+	, (29, 2, '1.8L', '1.8 litres', 5, 1.8)
+	, (30, 2, 'bag of 20', 'bag of 20', 7, 20)
+	, (31, 2, '180ml', '180 millilitres', 6, 180)
+	, (32, 2, '70g', '70 grams', 4, 70)
+	, (33, 2, '60ml', '60 millilitres', 6, 60)
+	, (34, 2, '325g', '325 grams', 4, 325)
+	, (35, 2, 'pack of 50', 'pack of 50', 7, 50)
+	, (36, 2, 'box of 24 (each 5.9g)', 'box of 24 (each 5.9 grams)', 7, 24)
+	, (37, 2, '397g', '397 grams', 4, 397)
+	, (38, 2, '720g', '720 grams', 4, 720)
+	, (39, 2, '454g', '454 grams', 4, 454)
+	, (40, 2, 'pack of 4 (each 37g)', 'pack of 4 (each 37 grams)', 7, 4)
+	, (41, 2, '450g', '450 grams', 4, 450)
+	, (42, 2, '24.6.g', '24.6 grams', 4, 24.6)
+	, (43, 2, '230g', '230 grams', 4, 230)
+	, (44, 2, '37.3g', '37.3 grams', 4, 37.3)
+	, (45, 2, '38.3g', '38.3 grams', 4, 38.3)
+	, (46, 2, '123g', '123 grams', 4, 123)
+	, (47, 2, '266g', '266 grams', 4, 266)
+	, (48, 2, '157g', '157 grams', 4, 157)
+	, (49, 2, '285g', '285 grams', 4, 285)
+	, (50, 2, '700ml', '700 millilitres', 6, 700)
+	, (51, 2, '5L', '5 litres', 5, 5)
+	, (52, 2, '216g', '216 grams', 4, 216)
+	, (53, 2, '320g', '320 grams', 4, 320)
+	, (54, 2, '2L', '2 litres', 5, 2)
+	, (55, 2, '200ml', '200 millilitres', 6, 200)
+	, (56, 2, '250ml', '250 millilitres', 6, 250)
+	, (57, 2, '1 punnet', '1 punnet', 7, 1)
+	, (58, 2, '420g', '420 grams', 4, 420)
+	, (59, 2, '230g', '230 grams', 4, 230)
+	, (60, 2, '465g', '465 grams', 4, 465)
+	, (61, 2, '500ml', '500 millilitres', 6, 500)
+	, (62, 2, '250ml', '250 millilitres', 6, 250)
+	, (63, 2, '238ml', '238 millilitres', 6, 238)
+	, (64, 2, '140ml', '140 millilitres', 6, 140)
+	, (65, 2, '195g', '195 grams', 4, 195)
+	, (66, 2, '1pt', '1 pint', 5, 1)
+	, (67, 2, '570ml', '570 millilitres', 6, 570)
+	, (68, 2, '360g', '360 grams', 4, 360)
+	, (69, 2, '90g', '90 grams', 4, 90)
+	, (70, 2, '800ml', '800 millilitres', 6, 800)
+	, (71, 2, '197g', '197 grams', 4, 197)
+;
+
+INSERT INTO partsltd_prod.Shop_Product_Change_Set (
+	comment
+)
+VALUES ( 'Update Variation Display Orders' )
+;
+WITH RANKED AS (
+    SELECT 
+        V.id_variation,
+        RANK() OVER (ORDER BY 
+			CONCAT(
+				CASE WHEN V.count_unit_measurement = FLOOR(V.count_unit_measurement) THEN
+					LPAD(CAST(V.count_unit_measurement AS CHAR), 25, '0')
+				ELSE
+					CONCAT(
+						LPAD(
+							CAST(FLOOR(V.count_unit_measurement) AS CHAR)
+							, 25
+							, '0'
+						)
+						, SUBSTRING(
+							CAST(V.count_unit_measurement AS CHAR)
+							FROM LOCATE('.', CAST(V.count_unit_measurement AS CHAR))
+						)
+					)
+				END
+                , ' '
+                , IFNULL(IFNULL(UM.symbol, UM.name_singular), '(No Unit of Measurement)')
+			)
+		) as new_order
+    FROM partsltd_prod.Shop_Variation V
+    INNER JOIN partsltd_prod.Shop_Unit_Measurement UM 
+		ON V.id_unit_measurement = UM.id_unit_measurement
+        AND UM.active = 1
+    WHERE 
+		V.id_type = 2
+)
+UPDATE partsltd_prod.Shop_Variation V
+INNER JOIN RANKED ON V.id_variation = RANKED.id_variation
+JOIN (
+	SELECT CS.id_change_set
+    FROM partsltd_prod.Shop_Product_Change_Set CS
+    ORDER BY CS.id_change_set DESC
+    LIMIT 1
+) CS
+SET 
+	V.display_order = RANKED.new_order
+    , V.id_change_set = CS.id_change_set
+WHERE 
+	V.id_type = 2
 ;
 
 # Product Permutation Variation Links

static/MySQL/1124_tbl_Shop_Unit_Measurement_Conversion.sql

@@ -6,13 +6,14 @@
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Unit_Measurement_Conversion';
 
 CREATE TABLE IF NOT EXISTS Shop_Unit_Measurement_Conversion (
-    id_conversion INT NOT NULL PRIMARY KEY,
+    id_conversion INT NOT NULL PRIMARY KEY AUTO_INCREMENT,
     id_unit_derived INT NOT NULL,
     id_unit_base INT NOT NULL,
-    power_unit_base FLOAT NOT NULL,
     multiplier_unit_base FLOAT NOT NULL,
     increment_unit_base FLOAT NOT NULL,
+    apply_multiplier_before_increment BIT NOT NULL DEFAULT 1,
     active BIT NOT NULL DEFAULT 1,
+    display_order INT NOT NULL,
     created_on DATETIME,
     created_by INT,
     id_change_set INT,

static/MySQL/1212_tbl_Shop_Variation.sql

@@ -6,20 +6,25 @@
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Variation';
 
 CREATE TABLE Shop_Variation (
-	id_variation INT NOT NULL AUTO_INCREMENT PRIMARY KEY, 
+	id_variation INT NOT NULL AUTO_INCREMENT PRIMARY KEY
-	id_type INT NOT NULL,
+	, id_type INT NOT NULL
-	CONSTRAINT FK_Shop_Variation_id_type
+	, CONSTRAINT FK_Shop_Variation_id_type
 		FOREIGN KEY (id_type) 
-		REFERENCES Shop_Variation_Type(id_type)
+		REFERENCES partsltd_prod.Shop_Variation_Type(id_type)
-		ON UPDATE RESTRICT,
+		ON UPDATE RESTRICT
-	code VARCHAR(50),
+    , id_unit_measurement INT NULL
-	name VARCHAR(255),
+	, CONSTRAINT FK_Shop_Unit_Measurement_id_unit_measurement
-	active BIT NOT NULL DEFAULT 1,
+		FOREIGN KEY (id_unit_measurement) 
-	display_order INT NOT NULL,
+		REFERENCES partsltd_prod.Shop_Unit_Measurement(id_unit_measurement)
-	created_on DATETIME,
+    , count_unit_measurement INT NULL
-	created_by INT,
+	, code VARCHAR(50)
-	id_change_set INT,
+	, name VARCHAR(255)
-	CONSTRAINT FK_Shop_Variation_id_change_set
+	, active BIT NOT NULL DEFAULT 1
+	, display_order INT NOT NULL
+	, created_on DATETIME
+	, created_by INT
+	, id_change_set INT
+	, CONSTRAINT FK_Shop_Variation_id_change_set
 		FOREIGN KEY (id_change_set) 
-		REFERENCES Shop_Product_Change_Set(id_change_set)
+		REFERENCES partsltd_prod.Shop_Product_Change_Set(id_change_set)
 );

static/MySQL/1214_tbl_Shop_Variation_Temp.sql

@@ -9,6 +9,8 @@ CREATE TABLE Shop_Variation_Temp (
 	id_temp INT NOT NULL PRIMARY KEY AUTO_INCREMENT
 	, id_variation INT NOT NULL
 	, id_type INT NOT NULL
+    , id_unit_measurement INT NULL
+    , count_unit_measurement INT NULL
 	, code VARCHAR(50)
 	, name VARCHAR(255)
 	, active BIT

static/MySQL/1402_tbl_Shop_Supplier_Temp.sql

@@ -4,6 +4,7 @@
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Supplier_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Supplier_Temp (
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
     id_supplier INT NOT NULL,
     name_company VARCHAR(255) NOT NULL,
     name_contact VARCHAR(255) NULL,

static/MySQL/1411_tbl_Shop_Supplier_Purchase_Order_Temp.sql

@@ -6,7 +6,8 @@ DROP TABLE IF EXISTS Shop_Supplier_Purchase_Order_Temp;
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Supplier_Purchase_Order_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Supplier_Purchase_Order_Temp (
-	id_order INT NOT NULL
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY
+	, id_order INT NOT NULL
     , id_supplier_ordered INT NOT NULL
     , id_currency_cost INT NOT NULL
     , active BIT NULL

static/MySQL/1414_tbl_Shop_Supplier_Purchase_Order_Product_Link_Temp.sql

@@ -8,7 +8,8 @@
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Supplier_Purchase_Order_Product_Link_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Supplier_Purchase_Order_Product_Link_Temp (
-	id_link INT NOT NULL PRIMARY KEY
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY
+	, id_link INT NOT NULL
     , id_order INT NOT NULL
     , id_product INT NULL
     , id_permutation INT NULL

static/MySQL/1417_tbl_Shop_Manufacturing_Purchase_Order_Temp.sql

@@ -6,7 +6,8 @@
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Manufacturing_Purchase_Order_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Manufacturing_Purchase_Order_Temp (
-	id_order INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
+	id_order INT NOT NULL,
     /*
 	cost_total_local FLOAT NOT NULL,
     */

static/MySQL/1420_tbl_Shop_Manufacturing_Purchase_Order_Product_Link_Temp.sql

@@ -7,7 +7,8 @@
 SELECT CONCAT('WARNING: Table ', TABLE_NAME, ' already exists.') AS msg_warning FROM INFORMATION_SCHEMA.TABLES WHERE TABLE_NAME = 'Shop_Manufacturing_Purchase_Order_Product_Link_Temp';
 
 CREATE TABLE IF NOT EXISTS Shop_Manufacturing_Purchase_Order_Product_Link_Temp (
-	id_link INT NOT NULL PRIMARY KEY,
+    id_temp INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
+	id_link INT NOT NULL,
     id_order INT NOT NULL,
     id_product INT NULL,
     id_permutation INT NULL,

static/MySQL/3212_tri_Shop_Variation.sql

@@ -35,6 +35,14 @@ BEGIN
         value_new,
         id_change_set
     )
+    # Changed id_unit_measurement
+	SELECT NEW.id_variation, 'id_unit_measurement', OLD.id_unit_measurement, NEW.id_unit_measurement, NEW.id_change_set
+		WHERE NOT OLD.id_unit_measurement <=> NEW.id_unit_measurement
+    UNION
+    # Changed count_unit_measurement
+	SELECT NEW.id_variation, 'count_unit_measurement', OLD.count_unit_measurement, NEW.count_unit_measurement, NEW.id_change_set
+		WHERE NOT OLD.count_unit_measurement <=> NEW.count_unit_measurement
+    UNION
     # Changed code
 	SELECT NEW.id_variation, 'code', OLD.code, NEW.code, NEW.id_change_set
 		WHERE NOT OLD.code <=> NEW.code

static/MySQL/3406_tri_Shop_Unit_Of_Measurement_Conversion.sql

@@ -42,10 +42,6 @@ BEGIN
 	# Changed id_unit_base
 	SELECT NEW.id_conversion, 'id_unit_base', OLD.id_unit_base, NEW.id_unit_base, NEW.id_change_set
 		WHERE NOT OLD.id_unit_base <=> NEW.id_unit_base
-    UNION
-	# Changed power_unit_base
-	SELECT NEW.id_conversion, 'power_unit_base', OLD.power_unit_base, NEW.power_unit_base, NEW.id_change_set
-		WHERE NOT OLD.power_unit_base <=> NEW.power_unit_base
     UNION
 	# Changed multiplier_unit_base
 	SELECT NEW.id_conversion, 'multiplier_unit_base', OLD.multiplier_unit_base, NEW.multiplier_unit_base, NEW.id_change_set
@@ -54,6 +50,10 @@ BEGIN
 	# Changed increment_unit_base
 	SELECT NEW.id_conversion, 'active', OLD.increment_unit_base, NEW.increment_unit_base, NEW.id_change_set
 		WHERE NOT OLD.increment_unit_base <=> NEW.increment_unit_base
+    UNION
+	# Changed apply_multiplier_before_increment
+	SELECT NEW.id_conversion, 'apply_multiplier_before_increment', OLD.apply_multiplier_before_increment, NEW.apply_multiplier_before_increment, NEW.id_change_set
+		WHERE NOT OLD.apply_multiplier_before_increment <=> NEW.apply_multiplier_before_increment
     UNION
 	# Changed active
 	SELECT NEW.id_conversion, 'active', OLD.active, NEW.active, NEW.id_change_set

static/MySQL/6206_fn_shop_get_product_permutation_name.sql

@@ -1,44 +1,49 @@
 
-DROP FUNCTION IF EXISTS fn_shop_get_product_permutation_name;
+DROP FUNCTION IF EXISTS fn_shop_get_product_permutation_variations_csv;
 
 DELIMITER //
 
-CREATE FUNCTION fn_shop_get_product_permutation_name(id_product_permutation INT)
+CREATE FUNCTION fn_shop_get_product_permutation_variations_csv(id_product_permutation INT)
 RETURNS VARCHAR(4000)
 DETERMINISTIC
 BEGIN
-    DECLARE name VARCHAR(4000);
+    DECLARE csv VARCHAR(4000);
     
-    SET name := (
+    SET csv := (
         SELECT 
-            CONCAT(
+			CASE WHEN P.has_variations = 0 THEN
-				IFNULL(PC.name, '(No Category)')
+				''
-                , ' - '
+            ELSE
-                , IFNULL(P.name, '(No Product)')
+				GROUP_CONCAT(
-                , CASE WHEN P.has_variations = 1 THEN
+					CONCAT(
-                    CONCAT(' - ', GROUP_CONCAT(CONCAT(VT.name, ': ', V.name) SEPARATOR ', '))
+						PV.id_type
-                ELSE '' END
+						, ':'
-            )
+						, PV.id_variation
-        FROM Shop_Product_Permutation PP
+					)
-        LEFT JOIN Shop_Product P ON PP.id_product = P.id_product
+					SEPARATOR ','
-        LEFT JOIN Shop_Product_Category PC ON P.id_category = PC.id_category
+				)
-        LEFT JOIN Shop_Product_Permutation_Variation_Link PPVL ON PP.id_permutation = PPVL.id_permutation
+			END 
-        LEFT JOIN Shop_Variation V ON PPVL.id_variation = V.id_variation
+		FROM partsltd_prod.Shop_Product_Permutation PP
-        LEFT JOIN Shop_Variation_Type VT ON V.id_type = VT.id_type
+		LEFT JOIN partsltd_prod.Shop_Product P ON PP.id_product = P.id_product
+		LEFT JOIN partsltd_prod.Shop_Product_Permutation_Variation_Link PPVL ON PP.id_permutation = PPVL.id_permutation
+		LEFT JOIN partsltd_prod.Shop_Variation PV ON PPVL.id_variation = PV.id_variation
+		LEFT JOIN partsltd_prod.Shop_Variation_Type PVT ON PV.id_type = PVT.id_type
         WHERE PP.id_permutation = id_product_permutation
-        GROUP BY PC.id_category, PC.name, P.id_product, P.name, P.has_variations, VT.display_order, VT.name, V.display_order, V.name
+        GROUP BY P.id_product, P.has_variations, PVT.display_order, PVT.name, PV.display_order, PV.name
         LIMIT 1
     );
     
-    RETURN name;
+    RETURN csv;
 END //
 
 DELIMITER ;
-
-/*
 SELECT 
-	fn_shop_get_product_permutation_name(
+	fn_shop_get_product_permutation_variations_csv(
 		3 -- id_product_permutation
 	)
+    , fn_shop_get_product_permutation_variations_csv(
+		1 -- id_product_permutation
+	)
 ;
+/*
 */

static/MySQL/7212_p_shop_save_product_variation.sql

@@ -340,6 +340,7 @@ BEGIN
     -- Duplicate Variation Ids
     -- Duplicate Variation Type Codes
     -- Duplicate Variation Codes
+    -- Variation unit measurement with no count unit measurement
     
     -- Permissions
 	IF a_debug = 1 THEN

static/MySQL/7403_p_shop_save_supplier_purchase_order.sql

@@ -403,8 +403,8 @@ BEGIN
 			id_type, code, msg
 		)
 		SELECT
-			v_id_error_type_bad_data, 
+			v_id_type_error_bad_data, 
-			v_code_error_type_bad_data, 
+			v_code_type_error_bad_data, 
 			CONCAT(
 				'A valid quantity ordered is required for the following Supplier Purchase Order Item(s): '
 				, GROUP_CONCAT(t_SPOPL.name_error SEPARATOR ', ')
@@ -425,8 +425,8 @@ BEGIN
 			id_type, code, msg
 		)
 		SELECT
-			v_id_error_type_bad_data, 
+			v_id_type_error_bad_data, 
-			v_code_error_type_bad_data, 
+			v_code_type_error_bad_data, 
 			CONCAT(
 				'A valid quantity received is required for the following Supplier Purchase Order Item(s): '
 				, GROUP_CONCAT(t_SPOPL.name_error, ' - ', t_SPOPL.quantity_received SEPARATOR ', ')
@@ -445,8 +445,8 @@ BEGIN
 			id_type, code, msg
 		)
 		SELECT
-			v_id_error_type_bad_data, 
+			v_id_type_error_bad_data, 
-			v_code_error_type_bad_data, 
+			v_code_type_error_bad_data, 
 			CONCAT(
 				'A valid delivery latency is required for the following Supplier Purchase Order Item(s): '
 				, GROUP_CONCAT(t_SPOPL.name_error, ' - ', t_SPOPL.latency_delivery_days SEPARATOR ', ')
@@ -470,8 +470,8 @@ BEGIN
 			id_type, code, msg
 		)
 		SELECT
-			v_id_error_type_bad_data, 
+			v_id_type_error_bad_data, 
-			v_code_error_type_bad_data, 
+			v_code_type_error_bad_data, 
 			CONCAT('Duplicate records: ', GROUP_CONCAT(t_SPOPLC.name_error SEPARATOR ', '))
 		FROM (
 			SELECT 
@@ -490,8 +490,8 @@ BEGIN
 			id_type, code, msg
 		)
 		SELECT
-			v_id_error_type_bad_data, 
+			v_id_type_error_bad_data, 
-			v_code_error_type_bad_data, 
+			v_code_type_error_bad_data, 
 			CONCAT(
 				'There are no items in the following Supplier Purchase Order(s): '
 				, GROUP_CONCAT(t_SPO.name_error SEPARATOR ', ')
@@ -513,8 +513,8 @@ BEGIN
 			id_type, code, msg
 		)
 		SELECT
-			v_id_error_type_bad_data, 
+			v_id_type_error_bad_data, 
-			v_code_error_type_bad_data, 
+			v_code_type_error_bad_data, 
 			CONCAT(
 				'There is no order for the following Supplier Purchase Order Item(s): '
 				, GROUP_CONCAT(t_SPOPL.name_error SEPARATOR ', ')

static/MySQL/7403_p_shop_save_supplier_purchase_order_test.sql

@@ -58,7 +58,7 @@ BEGIN
         WHERE id_order = 6
         */
 		;
-        
+        /*
 		INSERT INTO partsltd_prod.Shop_Supplier_Purchase_Order_Product_Link_Temp (
 			id_link
 			, id_order
@@ -73,7 +73,8 @@ BEGIN
 			, cost_total_local_VAT_incl
             , GUID
 		)
-        /* Test 1 - Insert */
+        ;
+        / Test 1 - Insert 
         VALUES (
 			-1
             , -1
@@ -88,6 +89,7 @@ BEGIN
             , 6
             , v_guid
         )
+        */
         /* Test 2 - Update
         SELECT
 			id_link
@@ -105,7 +107,7 @@ BEGIN
 		FROM partsltd_prod.Shop_Supplier_Purchase_Order_Product_Link
         WHERE id_order = 6
         */
-        ;
+        
         
 	COMMIT;
     
@@ -151,7 +153,6 @@ DELETE FROM partsltd_prod.Shop_Supplier_Purchase_Order_Product_Link_Temp;
 
 DROP TABLE IF EXISTS tmp_Msg_Error;
 
-/*
 Cannot add or update a child row: a foreign key constraint fails (`partsltd_prod`.`shop_supplier_address`, CONSTRAINT `FK_Shop_Supplier_Address_id_supplier` FOREIGN KEY (`id_supplier`) REFERENCES `shop_supplier` (`id_supplier`) ON UPDATE RESTRICT)
 
 */

static/MySQL/7404_p_shop_get_many_supplier_purchase_order.sql

@@ -441,6 +441,7 @@ BEGIN
         , P.id_product
 		, SPOPL.id_permutation
         , fn_shop_get_product_permutation_name(SPOPL.id_permutation) AS name_permutation
+        , fn_shop_get_product_permutation_variations_csv(SPOPL.id_permutation) AS csv_id_pairs_variation
 		-- , SPOPL.id_currency_cost
 		, SPOPL.id_unit_quantity
 		, SPOPL.quantity_ordered

static/MySQL/7415_p_shop_save_manufacturing_purchase_order.sql

@@ -97,7 +97,6 @@ BEGIN
 		, id_order INT NOT NULL
         , id_product INT NULL
         , id_permutation INT NULL
-		, id_currency INT NOT NULL
 		, id_unit_quantity INT NOT NULL
 		, quantity_used FLOAT NOT NULL
 		, quantity_produced FLOAT NULL
@@ -171,6 +170,7 @@ BEGIN
 		, price_unit_local_VAT_incl
 		, has_order
 		, is_new
+        , name_error
 	)
 	SELECT 
 		IFNULL(MPOPL_T.id_link, 0) AS id_link

static/MySQL/7416_p_shop_get_many_manufacturing_purchase_order.sql

@@ -341,6 +341,7 @@ BEGIN
 		, MPOPL.id_order
 		, MPOPL.id_permutation
         , fn_shop_get_product_permutation_name(MPOPL.id_permutation) AS name_permutation
+        , fn_shop_get_product_permutation_variations_csv(MPOPL.id_permutation) AS csv_id_pairs_variation
 		, MPOPL.id_unit_quantity
 		, MPOPL.quantity_used
 		, MPOPL.quantity_produced
@@ -380,6 +381,7 @@ END //
 DELIMITER ;;
 
 
+/*
 
 CALL p_shop_get_many_manufacturing_purchase_order (
 	1 # a_id_user
@@ -392,5 +394,11 @@ CALL p_shop_get_many_manufacturing_purchase_order (
 	, 0 # a_debug
 );
 
-/*
+
+select *
+from partsltd_prod.shop_manufacturing_purchase_order
+;
+select *
+from partsltd_prod.shop_manufacturing_purchase_order_product_link
+;
 */

static/MySQL/9000_populate.sql

@@ -225,21 +225,60 @@ INSERT INTO Shop_Unit_Measurement (
 	name_singular, name_plural, symbol, is_base_unit, is_unit_of_distance, is_unit_of_mass, is_unit_of_time, is_unit_of_volume
 )
 VALUES
-	('metre', 'metres', 'm', 1, 1, 0, 0, 0),
+	('metre', 'metres', 'm', 1, 1, 0, 0, 0)
-    ('kilogram', 'kilograms', 'kg', 1, 0, 1, 0, 0),
+	, ('millimetre', 'millimetres', 'mm', 0, 1, 0, 0, 0)
-    ('item', 'items', 'x', 0, 0, 0, 0, 0),
+    , ('kilogram', 'kilograms', 'kg', 1, 0, 1, 0, 0)
-	('hour', 'hours', 'h', 1, 0, 0, 1, 0)
+	, ('gram', 'grams', 'g', 0, 0, 1, 0, 0)
+	, ('litre', 'litres', 'L', 0, 0, 0, 0, 1)
+	, ('millilitre', 'millilitres', 'mL', 0, 0, 0, 0, 1)
+    , ('item', 'items', 'x', 0, 0, 0, 0, 0)
+	, ('hour', 'hours', 'h', 1, 0, 0, 1, 0)
+	, ('day', 'days', 'd', 0, 0, 0, 1, 0)
 ;
 
-/*
 # Unit of Measurement Conversion
 INSERT INTO Shop_Unit_Measurement_Conversion (
-	id_unit_derived, id_unit_base, power_unit_base, multiplier_unit_base, increment_unit_base
+	id_unit_derived
+	, id_unit_base
+	, display_order
+	, multiplier_unit_base
+	, increment_unit_base
+	, apply_multiplier_before_increment
 )
-VALUES
+VALUES 
-	
+	(
+		2 -- id_unit_derived
+		, 1 -- id_unit_base
+		, 1 -- display_order
+		, 0.001 -- multiplier_unit_base
+		, 0 -- increment_unit_base
+		, apply_multiplier_before_increment
+	)
+	, (
+		4 -- id_unit_derived
+		, 3 -- id_unit_base
+		, 1 -- display_order
+		, 0.001 -- multiplier_unit_base
+		, 0 -- increment_unit_base
+		, apply_multiplier_before_increment
+	)
+	, (
+		6 -- id_unit_derived
+		, 5 -- id_unit_base
+		, 1 -- display_order
+		, 0.001 -- multiplier_unit_base
+		, 0 -- increment_unit_base
+		, apply_multiplier_before_increment
+	)
+	, (
+		9 -- id_unit_derived
+		, 8 -- id_unit_base
+		, 1 -- display_order
+		, 24 -- multiplier_unit_base
+		, 0 -- increment_unit_base
+		, apply_multiplier_before_increment
+	)
 ;
-*/
 
 
 # Categories
@@ -499,15 +538,138 @@ INSERT INTO Shop_Variation_Type (
 )
 VALUES 
 	(1, 'COLOUR', 'Colour', 'Colours')
+	, (2, 'SIZE', 'Size', 'Sizes')
 ;
 
 # Variations
 INSERT INTO Shop_Variation (
-	display_order, id_type, code, name
+	display_order, id_type, code, name, id_unit_measurement, count_unit_measurement
 )
 VALUES 
-	(1, 1, 'RED', 'Red'),
+	(1, 1, 'RED', 'Red', NULL, NULL)
-	(2, 1, 'BLUE', 'Blue')
+	, (2, 1, 'BLUE', 'Blue', NULL, NULL)
+	, (1, 2, '400ml', '400 millilitres', 6, 400)
+	, (2, 2, '400g', '400 grams', 4, 400)
+	, (3, 2, '410g', '410 grams', 4, 410)
+	, (4, 2, '8g', '8 grams', 4, 8)
+	, (5, 2, '13g', '13 grams', 4, 13)
+	, (6, 2, '27g', '27 grams', 4, 27)
+	, (7, 2, '104g', '104 grams', 4, 104)
+	, (8, 2, '200g', '200 grams', 4, 200)
+	, (9, 2, '92g', '92 grams', 4, 92)
+	, (10, 2, '100g', '100 grams', 4, 100)
+	, (11, 2, '500g', '500 grams', 4, 500)
+	, (12, 2, '250g', '250 grams', 4, 250)
+	, (13, 2, '750g', '750 grams', 4, 750)
+	, (14, 2, '145g', '145 grams', 4, 145)
+	, (15, 2, '340g', '340 grams', 4, 340)
+	, (16, 2, '132g', '132 grams', 4, 132)
+	, (17, 2, '170g', '170 grams', 4, 170)
+	, (18, 2, '700g', '700 grams', 4, 700)
+	, (19, 2, '150g', '150 grams', 4, 150)
+	, (20, 2, '1kg', '1 kilogram', 3, 1)
+	, (21, 2, '2kg', '2 kilograms', 3, 2)
+	, (22, 2, '800ml', '800 millilitres', 6, 800)
+	, (23, 2, '570g', '570 grams', 4, 570)
+	, (24, 2, '300g', '300 grams', 4, 300)
+	, (25, 2, '350g', '350 grams', 4, 350)
+	, (26, 2, '30g', '30 grams', 4, 30)
+	, (27, 2, '1L', '1 litre', 5, 1)
+	, (28, 2, '1.2L', '1.2 litres', 5, 1.2)
+	, (29, 2, '1.8L', '1.8 litres', 5, 1.8)
+	, (30, 2, 'bag of 20', 'bag of 20', 7, 20)
+	, (31, 2, '180ml', '180 millilitres', 6, 180)
+	, (32, 2, '70g', '70 grams', 4, 70)
+	, (33, 2, '60ml', '60 millilitres', 6, 60)
+	, (34, 2, '325g', '325 grams', 4, 325)
+	, (35, 2, 'pack of 50', 'pack of 50', 7, 50)
+	, (36, 2, 'box of 24 (each 5.9g)', 'box of 24 (each 5.9 grams)', 7, 24)
+	, (37, 2, '397g', '397 grams', 4, 397)
+	, (38, 2, '720g', '720 grams', 4, 720)
+	, (39, 2, '454g', '454 grams', 4, 454)
+	, (40, 2, 'pack of 4 (each 37g)', 'pack of 4 (each 37 grams)', 7, 4)
+	, (41, 2, '450g', '450 grams', 4, 450)
+	, (42, 2, '24.6.g', '24.6 grams', 4, 24.6)
+	, (43, 2, '230g', '230 grams', 4, 230)
+	, (44, 2, '37.3g', '37.3 grams', 4, 37.3)
+	, (45, 2, '38.3g', '38.3 grams', 4, 38.3)
+	, (46, 2, '123g', '123 grams', 4, 123)
+	, (47, 2, '266g', '266 grams', 4, 266)
+	, (48, 2, '157g', '157 grams', 4, 157)
+	, (49, 2, '285g', '285 grams', 4, 285)
+	, (50, 2, '700ml', '700 millilitres', 6, 700)
+	, (51, 2, '5L', '5 litres', 5, 5)
+	, (52, 2, '216g', '216 grams', 4, 216)
+	, (53, 2, '320g', '320 grams', 4, 320)
+	, (54, 2, '2L', '2 litres', 5, 2)
+	, (55, 2, '200ml', '200 millilitres', 6, 200)
+	, (56, 2, '250ml', '250 millilitres', 6, 250)
+	, (57, 2, '1 punnet', '1 punnet', 7, 1)
+	, (58, 2, '420g', '420 grams', 4, 420)
+	, (59, 2, '230g', '230 grams', 4, 230)
+	, (60, 2, '465g', '465 grams', 4, 465)
+	, (61, 2, '500ml', '500 millilitres', 6, 500)
+	, (62, 2, '250ml', '250 millilitres', 6, 250)
+	, (63, 2, '238ml', '238 millilitres', 6, 238)
+	, (64, 2, '140ml', '140 millilitres', 6, 140)
+	, (65, 2, '195g', '195 grams', 4, 195)
+	, (66, 2, '1pt', '1 pint', 5, 1)
+	, (67, 2, '570ml', '570 millilitres', 6, 570)
+	, (68, 2, '360g', '360 grams', 4, 360)
+	, (69, 2, '90g', '90 grams', 4, 90)
+	, (70, 2, '800ml', '800 millilitres', 6, 800)
+	, (71, 2, '197g', '197 grams', 4, 197)
+;
+
+INSERT INTO partsltd_prod.Shop_Product_Change_Set (
+	comment
+)
+VALUES ( 'Update Variation Display Orders' )
+;
+WITH RANKED AS (
+    SELECT 
+        V.id_variation,
+        RANK() OVER (ORDER BY 
+			CONCAT(
+				CASE WHEN V.count_unit_measurement = FLOOR(V.count_unit_measurement) THEN
+					LPAD(CAST(V.count_unit_measurement AS CHAR), 25, '0')
+				ELSE
+					CONCAT(
+						LPAD(
+							CAST(FLOOR(V.count_unit_measurement) AS CHAR)
+							, 25
+							, '0'
+						)
+						, SUBSTRING(
+							CAST(V.count_unit_measurement AS CHAR)
+							FROM LOCATE('.', CAST(V.count_unit_measurement AS CHAR))
+						)
+					)
+				END
+                , ' '
+                , IFNULL(IFNULL(UM.symbol, UM.name_singular), '(No Unit of Measurement)')
+			)
+		) as new_order
+    FROM partsltd_prod.Shop_Variation V
+    INNER JOIN partsltd_prod.Shop_Unit_Measurement UM 
+		ON V.id_unit_measurement = UM.id_unit_measurement
+        AND UM.active = 1
+    WHERE 
+		V.id_type = 2
+)
+UPDATE partsltd_prod.Shop_Variation V
+INNER JOIN RANKED ON V.id_variation = RANKED.id_variation
+JOIN (
+	SELECT CS.id_change_set
+    FROM partsltd_prod.Shop_Product_Change_Set CS
+    ORDER BY CS.id_change_set DESC
+    LIMIT 1
+) CS
+SET 
+	V.display_order = RANKED.new_order
+    , V.id_change_set = CS.id_change_set
+WHERE 
+	V.id_type = 2
 ;
 
 # Product Permutation Variation Links

static/css/components/button.css

@@ -0,0 +1,24 @@
+
+button, .button-submit, input[type="submit"] {
+    font-size: 20px;
+    font-weight: bold;
+    border: 4px solid;
+    border-radius: 2vh;
+    padding: 1vh 2vh 1vh 2vh;
+    margin: 0.5vh;
+    background-color: var(--c_purple_pastel);
+    color: var(--c_purple_dark);
+    border-color: var(--c_purple_dark);
+}
+
+button.navContactUs {
+    border: 4px solid var(--c_purple_dark);
+    background-color: var(--c_purple_pastel);
+    color: var(--c_purple_dark) !important;
+    border-radius: 2vh;
+    width: 180px !important;
+}
+
+button:hover, input[type="submit"]:hover {
+    text-decoration: underline;
+}

static/css/components/image.css

@@ -0,0 +1,4 @@
+
+img, video {
+    border-radius: 3vh;
+}

static/css/components/label.css

@@ -0,0 +1,26 @@
+
+h1 {
+    font-size: min(24px, calc(1vh * 6));
+}
+
+h2 {
+    font-size: min(20px, calc(1vh * 5));
+}
+
+h3 {
+    font-size: min(16px, calc(1vh * 4));
+    margin-top: 1vh;
+}
+
+h4 {
+    font-size: 13px;
+    margin: 1vh;
+    text-align: center;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+h5 {
+    font-size: 11px;
+    margin: 1vh;
+}

static/css/components/overlay.css

@@ -1,3 +1,83 @@
+
+
+/* Overlay modal */
+.overlay {
+    /*
+    display: none;
+    */
+    position: fixed;
+    top: 15vh;
+    right: 0;
+    width: 100px;
+    /* height: 50%; */ 
+    background: var(--c_purple_pastel);
+    justify-content: right;
+    align-items: right;
+    align-self: right;
+    z-index: 999;
+}
+.overlay.expanded {
+    display: block;
+}
+.collapsed {
+    display: none;
+}
+
+/* Hamburger menu overlay */
+#buttonHamburger:hover {
+    text-decoration: none;
+}
+#overlayHamburger {
+    overflow-x: hidden;
+    overflow-y: auto;
+    max-height: 80%;
+}
+.hamburger {
+    border: 2px solid var(--c_purple_dark);
+    border-radius: 4px;
+}
+.hamburger:first-child {
+    border-top-left-radius: 12px;
+    border-top-right-radius: 12px;
+}
+.hamburger:last-child {
+    border-bottom-left-radius: 12px;
+    border-bottom-right-radius: 12px;
+}
+
+.hamburger > * {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    width: 100%;
+    color: var(--c_purple_dark);
+    font-weight: bold;
+    font-size: 18px;
+    /* height: 18px; */
+}
+.hamburger > :hover {
+    background-color: var(--c_purple_light);
+    color: var(--c_purple_dark);
+}
+.hamburger > * > * {
+    width: 100%;
+    /*
+    margin-top: 4.5px;
+    margin-bottom: 4.5px;
+    */
+}
+.hamburger > .container {
+    padding-top: 4.5px;
+    padding-bottom: 4.5px;
+}
+
+#overlayHamburger .row *:hover {
+    text-decoration: underline;
+}
+
+/* Confirm overlay */
 #overlayConfirm {
     position: absolute;
     left: 25vw;

static/css/components/table.css

@@ -48,13 +48,6 @@ tr {
 }
 */
 
-table textarea,
-table select,
-table input {
-    width: 100%;
-    box-sizing: border-box;
-}
-
 table button {
     margin: 0.25vh;
     padding: 0.5vh 1vh;
@@ -67,3 +60,7 @@ table button.active {
 tr.delete, tr.delete > td {
     background-color: red;
 }
+
+table div {
+    align-content: center;
+}

static/css/layouts/footer.css

@@ -0,0 +1,23 @@
+
+/* Footer */
+.footer {
+    padding: 1vh;
+    padding-left: 1vw;
+    padding-right: 1vw;
+    text-align: center;
+    margin: 0;
+    height: 8vh !important;
+    overflow-y: auto;
+    background-color: var(--c_purple_pastel);
+    border-top-left-radius: 2.5vh;
+    border-top-right-radius: 2.5vh;
+    position: absolute;
+    /* top: 2.5vh; */
+    bottom: 0;
+    width: 98vw;
+}
+
+.footer > h4, h5 {
+    padding: 0;
+    margin: 0;
+}

static/css/layouts/header.css

@@ -1,5 +1,72 @@
 
 
+/* Navigation */
+.topnav {
+    border-bottom-left-radius: 2.5vh;
+    border-bottom-right-radius: 2.5vh;
+    display: flex;
+    flex-wrap: wrap;
+    flex: 1;
+    flex-direction: row;
+    font-weight: bold;
+    font-size: 1vh;
+    max-height: 15vh;
+    height: 15vh;
+    align-items: flex-start;
+}
+.topnav a, .topnav label, .topnav p, .topnav h1 {
+    float: left;
+    display: flex;
+    color: white;
+    text-align: center;
+    text-decoration: none;
+    width: 100%;
+    max-height: 15vh;
+    font-weight: normal;
+    justify-content: center;
+}
+.topnav a:hover {
+    background-color: var(--c_purple_light);
+    color: var(--c_purple_dark);
+}
+
+.topnav > .container {
+    max-width: 50%;
+    height: 100%;
+    align-items: center;
+    align-self: center;
+    /* align-content: center; */
+    /* width: fit-content; */
+    display: flex;
+}
+.topnav select {
+    padding: 1vh;
+    margin: 1vh;
+    border-radius: 1vh;
+    /* background-color: var(--c_purple_light); */
+    color: var(--c_purple_dark);
+    border: 2px solid white;
+    font-weight: bold;
+    text-align: center;
+}
+.topnav select .collapsed {
+    width: 5vw;
+}
+.topnav select .expanded {
+    width: 25vw;
+}
+
+.company-name {
+    font-size: min(28px, calc(1vh * 7));
+    color: white;
+}
+@media screen and (max-width: 450px) {
+    .company-name {
+        font-size: min(24px, calc(1vh * 7));
+    }
+}
+
+/* Page Filters */
 button.collapsed {
     display: block;
     opacity: 0;

static/css/layouts/table-main.css

@@ -9,7 +9,11 @@
     justify-content: normal;
 }
 
-#tableMain select, #tableMain input, #tableMain textarea, #tableMain div {
+#tableMain * {
+    padding: 0.25vh 0.5vh;
+}
+
+#tableMain select, #tableMain input:not([type="checkbox"]), #tableMain textarea, #tableMain div {
     box-sizing: border-box;
     width: 100%;
     height: 100%;
@@ -20,6 +24,13 @@
     min-width: 20vh;
     padding: 0 0.5vh;
 }
+#tableMain tbody tr td {
+    height: 5vh;
+    padding-top: 0.5vh;
+}
+#tableMain tbody tr:not(:last-of-type) td {
+    padding-bottom: 0.5vh;
+}
 #tableMain thead tr th.active, #tableMain tbody tr td.active {
     width: 6vh;
     min-width: 6vh;
@@ -27,4 +38,4 @@
 #tableMain tbody tr td.display_order, #tableMain thead tr th.display_order {
     width: 5vh;
     min-width: 5vh;
-}
+}

static/css/main.css

@@ -1,60 +1,4 @@
 
-
-/* Base styles *
-@import 'lib/reset.css';
-@import 'lib/typography.css';
-@import 'lib/variables.css';
-@import 'lib/utils.css';
-
-/* Layout styles *
-@import 'layouts/header.css';
-@import 'layouts/footer.css';
-@import 'layouts/table-main.css';
-
-/* Component styles *
-@import 'components/button.css';
-@import 'components/card.css';
-@import 'components/dialog.css';
-@import 'components/form.css';
-@import 'components/modal.css';
-@import 'components/navigation.css';
-@import 'components/overlay.css';
-
-/* Section styles *
-@import 'sections/store.css';
-*/
-
-/* Page-specific styles *
-@import 'pages/page_admin.css';
-@import 'pages/page_contact.css';
-@import 'pages/page_home.css';
-@import 'pages/page_license.css';
-@import 'pages/page_services.css';
-@import 'pages/page_store_home.css';
-@import 'pages/page_store_product_permutations.css';
-@import 'pages/page_store_stock_items.css';
-*/
-
-/* Theme styles *
-@import 'themes/light.css';
-/* Uncomment the line below to enable dark theme */
-/* @import 'themes/dark.css'; */
-
-
-
-/* Custom styles */
-/* Add any custom styles or overrides here */
-
-body {
-    /* Example of using a CSS variable defined in variables.css */
-    background-color: var(--background-color);
-    color: var(--text-color);
-    font-family: var(--font-family-base);
-}
-
-/* You can add more global styles here */
-
-
 :root {
     /* Declare global variables */
     --c_purple: #5B29FF;
@@ -67,19 +11,14 @@ body {
     --c_blue_dark: #003ADB;
 }
 
-*{
-    margin: 0;
-}
-
-script, link {
-    display: none !important;
-}
-
 html {
     height: 100%;
 }
 
 body {
+    background-color: var(--background-color);
+    color: var(--text-color);
+    font-family: var(--font-family-base);
     font-family: Arial;
     padding: 0;
     margin: 0;
@@ -89,122 +28,14 @@ body {
     max-height: 100%;
 }
 
-/*
+* {
-h1, h2, h3, h4, h5, p, a, label {
-    display: flex;
     margin: 0;
-    padding: 0;
-}
-*/
-
-h1 {
-    font-size: min(24px, calc(1vh * 6));
 }
 
-h2 {
+script, link {
-    font-size: min(20px, calc(1vh * 5));
+    display: none !important;
 }
 
-h3 {
-    font-size: min(16px, calc(1vh * 4));
-    margin-top: 1vh;
-}
-
-h4 {
-    font-size: 13px;
-    margin: 1vh;
-    text-align: center;
-    margin-left: auto;
-    margin-right: auto;
-}
-
-h5 {
-    font-size: 11px;
-    margin: 1vh;
-}
-
-/* Style the top navigation bar */
-.topnav {
-    /* overflow: hidden; */
-    /* background-color: var(--c_purple); */
-    border-bottom-left-radius: 2.5vh;
-    border-bottom-right-radius: 2.5vh;
-    display: flex;
-    flex-wrap: wrap;
-    flex: 1;
-    flex-direction: row;
-    font-weight: bold;
-    font-size: 1vh;
-    max-height: 15vh;
-    height: 15vh;
-    align-items: flex-start;
-}
-
-/* Style the topnav links */
-.topnav a, .topnav label, .topnav p, .topnav h1 {
-    float: left;
-    display: flex;
-    color: white;
-    text-align: center;
-    /* padding: 14px 16px; */
-    text-decoration: none;
-    width: 100%;
-    max-height: 15vh;
-    font-weight: normal;
-    /* font-size: 20px; */
-    justify-content: center;
-}
-/*
-.topnav a {
-    padding: 3vh 2vw;
-}
-*/
-
-/* Change color on hover */
-.topnav a:hover {
-    background-color: var(--c_purple_light);
-    color: var(--c_purple_dark);
-}
-
-.topnav > .container {
-    max-width: 50%;
-    height: 100%;
-    align-items: center;
-    align-self: center;
-    /* align-content: center; */
-    /* width: fit-content; */
-    display: flex;
-}
-
-.topnav select {
-    padding: 1vh;
-    margin: 1vh;
-    border-radius: 1vh;
-    /* background-color: var(--c_purple_light); */
-    color: var(--c_purple_dark);
-    border: 2px solid white;
-    font-weight: bold;
-    text-align: center;
-}
-.topnav select .collapsed {
-    width: 5vw;
-}
-.topnav select .expanded {
-    width: 25vw;
-}
-
-
-.company-name {
-    font-size: min(28px, calc(1vh * 7));
-    color: white;
-}
-@media screen and (max-width: 450px) {
-    .company-name {
-        font-size: min(24px, calc(1vh * 7));
-    }
-}
-
-
 #pageBody {
     height: 69vh !important;
     padding: 1vh;
@@ -222,8 +53,7 @@ h5 {
     overflow-y: auto;
     overflow-x: hidden;
     position: absolute;
-    width: 98vw;
+    width: 98vw; 
-
 }
 
 .page-body > * {
@@ -250,9 +80,7 @@ h5 {
     margin-top: 0vh;
     top: 0;
 }
-#pageBody > .card:last-of-type {
+
-    /* margin-bottom: 1vh; */
-}
 /* Create two unequal columns that floats next to each other *
 /* Left column *
 .leftcolumn {   
@@ -280,16 +108,14 @@ h5 {
 }
 */
 
-/* Fake image */
+/* Fake image 
 .fakeimg {
     background-color: var(--c_purple_light);
     width: 100%;
     padding: 20px;
 }
+*/
 
-img, video {
-    border-radius: 3vh;
-}
 
 /* header image */
 img.header-logo {
@@ -306,6 +132,7 @@ img.header-logo {
     border-radius: 0;
 }
 
+/*
 .container-icon-label {
     padding: 0;
     display: flex;
@@ -329,6 +156,7 @@ img.header-logo {
     max-width: 75%;
     justify-self: left;
 }
+*/
 
 /* Add a card effect for articles */
 .card {
@@ -349,10 +177,6 @@ img.header-logo {
     padding-right: 2.5vw;
 }
 
-.card.subcard {
-    margin-top: 0;
-}
-
 .header.card {
     border-radius: 2.5vh;
     border-bottom-left-radius: 0;
@@ -388,36 +212,6 @@ img.header-logo {
 }
 
 
-/* Clear floats after the columns 
-.row:after {
-    content: "";
-    display: table;
-    clear: both;
-}
-*/
-/* Footer */
-.footer {
-    padding: 1vh;
-    padding-left: 1vw;
-    padding-right: 1vw;
-    text-align: center;
-    margin: 0;
-    height: 8vh !important;
-    overflow-y: auto;
-    background-color: var(--c_purple_pastel);
-    border-top-left-radius: 2.5vh;
-    border-top-right-radius: 2.5vh;
-    position: absolute;
-    /* top: 2.5vh; */
-    bottom: 0;
-    width: 98vw;
-}
-
-.footer > h4, h5 {
-    padding: 0;
-    margin: 0;
-}
-
 /*
 /* Responsive layout - when the screen is less than 800px wide, make the two columns stack on top of each other instead of next to each other *
 @media screen and (max-width: 800px) {
@@ -436,9 +230,6 @@ img.header-logo {
 }
 */
 
-/* input container 
-    margin-top: 3vh;
-    */
 .container-input {
     padding: 1vh;
     display: flex;
@@ -460,8 +251,6 @@ img.header-logo {
 
 .container-input > input, .container-input > textarea {
     border: 2px solid var(--c_purple);
-    max-width: 66%;
-    min-width: 20%;
     padding: 1vh;
 }
 
@@ -469,105 +258,6 @@ img.header-logo {
     width: 100%;
 }
 
-button, .button-submit, input[type="submit"] {
-    font-size: 20px;
-    font-weight: bold;
-    border: 4px solid;
-    border-radius: 2vh;
-    padding: 1vh 2vh 1vh 2vh;
-    margin: 0.5vh;
-    /*
-    background-color: var(--c_blue_pastel);
-    color: var(--c_blue_dark);
-    border-color: var(--c_blue_dark);
-    */
-    background-color: var(--c_purple_pastel);
-    color: var(--c_purple_dark);
-    border-color: var(--c_purple_dark);
-}
-button.navContactUs {
-    border: 4px solid var(--c_purple_dark);
-    background-color: var(--c_purple_pastel);
-    color: var(--c_purple_dark) !important;
-    border-radius: 2vh;
-    width: 180px !important;
-}
-button:hover, input[type="submit"]:hover, #overlayHamburger .row *:hover {
-    text-decoration: underline;
-}
-#buttonHamburger:hover {
-    text-decoration: none;
-}
-
-
-/* Overlay modal */
-.overlay {
-    /*
-    display: none;
-    */
-    position: fixed;
-    top: 15vh;
-    right: 0;
-    width: 100px;
-    /* height: 50%; */ 
-    background: var(--c_purple_pastel);
-    justify-content: right;
-    align-items: right;
-    align-self: right;
-    z-index: 999;
-}
-.overlay.expanded {
-    display: block;
-}
-.collapsed {
-    display: none;
-}
-
-#overlayHamburger {
-    overflow-x: hidden;
-    overflow-y: auto;
-    max-height: 80%;
-}
-.hamburger {
-    border: 2px solid var(--c_purple_dark);
-    border-radius: 4px;
-}
-.hamburger:first-child {
-    border-top-left-radius: 12px;
-    border-top-right-radius: 12px;
-}
-.hamburger:last-child {
-    border-bottom-left-radius: 12px;
-    border-bottom-right-radius: 12px;
-}
-
-.hamburger > * {
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: center;
-    text-align: center;
-    width: 100%;
-    color: var(--c_purple_dark);
-    font-weight: bold;
-    font-size: 18px;
-    /* height: 18px; */
-}
-.hamburger > :hover {
-    background-color: var(--c_purple_light);
-    color: var(--c_purple_dark);
-}
-.hamburger > * > * {
-    width: 100%;
-    /*
-    margin-top: 4.5px;
-    margin-bottom: 4.5px;
-    */
-}
-.hamburger > .container {
-    padding-top: 4.5px;
-    padding-bottom: 4.5px;
-}
 
 ul {
     max-width: 90%;
@@ -587,7 +277,6 @@ input.dirty, textarea.dirty, select.dirty {
 }
 
 
-/* Tables */
 #pageBody > *, button {
     font-size: min(12px, calc(1vh * 3));
 }

static/css/pages/core/contact.css

@@ -12,22 +12,16 @@
 }
 
 #email {
-    min-width: 40vw;
+    /* min-width: 40vw; */
     width: 40vw;
 }
-
+#name {
-/*
+    width: 50vw;
-.content > a {
+}
-    display: flex;
+#message {
-    flex-wrap: wrap;
+    width: 60vw;
-    align-items: center;
-    justify-content: center;
-    text-align: center;
 }
 
-.content > a > img, .content > a > h4 {
+input, textarea {
-    flex: content;
+    max-width: 65vw;
-    margin: 0px;
+}
-}
-*/
-

static/css/pages/core/services.css

@@ -5,7 +5,8 @@
 }
 
 #pageBody .card h1,
-#pageBody .card h2 {
+#pageBody .card h2,
+#pageBody .card p {
     width: 100%;
 }
 
@@ -26,21 +27,3 @@ table td {
 table th {
     font-size: min(16px, calc(1vh * 4));
 }
-
-/*
-tr th::after {
-    content: "";
-    position: absolute;
-    top: 65px;
-    left: 4%;
-    width: 92%;
-    border-bottom: 2px solid var(--c_purple_dark);
-}
-*/
-
-/*
-img {
-    max-height: 5vh;
-    max-width: 10vw;
-}
-*/

static/dist/css/core_contact.bundle.css

@@ -12,25 +12,18 @@
 }
 
 #email {
-    min-width: 40vw;
+    /* min-width: 40vw; */
     width: 40vw;
 }
-
+#name {
-/*
+    width: 50vw;
-.content > a {
+}
-    display: flex;
+#message {
-    flex-wrap: wrap;
+    width: 60vw;
-    align-items: center;
-    justify-content: center;
-    text-align: center;
 }
 
-.content > a > img, .content > a > h4 {
+input, textarea {
-    flex: content;
+    max-width: 65vw;
-    margin: 0px;
 }
-*/
-
-
 
 /*# sourceMappingURL=core_contact.bundle.css.map*/

static/dist/css/core_services.bundle.css

@@ -5,7 +5,8 @@
 }
 
 #pageBody .card h1,
-#pageBody .card h2 {
+#pageBody .card h2,
+#pageBody .card p {
     width: 100%;
 }
 
@@ -27,22 +28,5 @@ table th {
     font-size: min(16px, calc(1vh * 4));
 }
 
-/*
-tr th::after {
-    content: "";
-    position: absolute;
-    top: 65px;
-    left: 4%;
-    width: 92%;
-    border-bottom: 2px solid var(--c_purple_dark);
-}
-*/
-
-/*
-img {
-    max-height: 5vh;
-    max-width: 10vw;
-}
-*/
 
 /*# sourceMappingURL=core_services.bundle.css.map*/

static/dist/css/main.bundle.css

@@ -1,60 +1,4 @@
 
-
-/* Base styles *
-@import 'lib/reset.css';
-@import 'lib/typography.css';
-@import 'lib/variables.css';
-@import 'lib/utils.css';
-
-/* Layout styles *
-@import 'layouts/header.css';
-@import 'layouts/footer.css';
-@import 'layouts/table-main.css';
-
-/* Component styles *
-@import 'components/button.css';
-@import 'components/card.css';
-@import 'components/dialog.css';
-@import 'components/form.css';
-@import 'components/modal.css';
-@import 'components/navigation.css';
-@import 'components/overlay.css';
-
-/* Section styles *
-@import 'sections/store.css';
-*/
-
-/* Page-specific styles *
-@import 'pages/page_admin.css';
-@import 'pages/page_contact.css';
-@import 'pages/page_home.css';
-@import 'pages/page_license.css';
-@import 'pages/page_services.css';
-@import 'pages/page_store_home.css';
-@import 'pages/page_store_product_permutations.css';
-@import 'pages/page_store_stock_items.css';
-*/
-
-/* Theme styles *
-@import 'themes/light.css';
-/* Uncomment the line below to enable dark theme */
-/* @import 'themes/dark.css'; */
-
-
-
-/* Custom styles */
-/* Add any custom styles or overrides here */
-
-body {
-    /* Example of using a CSS variable defined in variables.css */
-    background-color: var(--background-color);
-    color: var(--text-color);
-    font-family: var(--font-family-base);
-}
-
-/* You can add more global styles here */
-
-
 :root {
     /* Declare global variables */
     --c_purple: #5B29FF;
@@ -67,19 +11,14 @@ body {
     --c_blue_dark: #003ADB;
 }
 
-*{
-    margin: 0;
-}
-
-script, link {
-    display: none !important;
-}
-
 html {
     height: 100%;
 }
 
 body {
+    background-color: var(--background-color);
+    color: var(--text-color);
+    font-family: var(--font-family-base);
     font-family: Arial;
     padding: 0;
     margin: 0;
@@ -89,122 +28,14 @@ body {
     max-height: 100%;
 }
 
-/*
+* {
-h1, h2, h3, h4, h5, p, a, label {
-    display: flex;
     margin: 0;
-    padding: 0;
-}
-*/
-
-h1 {
-    font-size: min(24px, calc(1vh * 6));
 }
 
-h2 {
+script, link {
-    font-size: min(20px, calc(1vh * 5));
+    display: none !important;
 }
 
-h3 {
-    font-size: min(16px, calc(1vh * 4));
-    margin-top: 1vh;
-}
-
-h4 {
-    font-size: 13px;
-    margin: 1vh;
-    text-align: center;
-    margin-left: auto;
-    margin-right: auto;
-}
-
-h5 {
-    font-size: 11px;
-    margin: 1vh;
-}
-
-/* Style the top navigation bar */
-.topnav {
-    /* overflow: hidden; */
-    /* background-color: var(--c_purple); */
-    border-bottom-left-radius: 2.5vh;
-    border-bottom-right-radius: 2.5vh;
-    display: flex;
-    flex-wrap: wrap;
-    flex: 1;
-    flex-direction: row;
-    font-weight: bold;
-    font-size: 1vh;
-    max-height: 15vh;
-    height: 15vh;
-    align-items: flex-start;
-}
-
-/* Style the topnav links */
-.topnav a, .topnav label, .topnav p, .topnav h1 {
-    float: left;
-    display: flex;
-    color: white;
-    text-align: center;
-    /* padding: 14px 16px; */
-    text-decoration: none;
-    width: 100%;
-    max-height: 15vh;
-    font-weight: normal;
-    /* font-size: 20px; */
-    justify-content: center;
-}
-/*
-.topnav a {
-    padding: 3vh 2vw;
-}
-*/
-
-/* Change color on hover */
-.topnav a:hover {
-    background-color: var(--c_purple_light);
-    color: var(--c_purple_dark);
-}
-
-.topnav > .container {
-    max-width: 50%;
-    height: 100%;
-    align-items: center;
-    align-self: center;
-    /* align-content: center; */
-    /* width: fit-content; */
-    display: flex;
-}
-
-.topnav select {
-    padding: 1vh;
-    margin: 1vh;
-    border-radius: 1vh;
-    /* background-color: var(--c_purple_light); */
-    color: var(--c_purple_dark);
-    border: 2px solid white;
-    font-weight: bold;
-    text-align: center;
-}
-.topnav select .collapsed {
-    width: 5vw;
-}
-.topnav select .expanded {
-    width: 25vw;
-}
-
-
-.company-name {
-    font-size: min(28px, calc(1vh * 7));
-    color: white;
-}
-@media screen and (max-width: 450px) {
-    .company-name {
-        font-size: min(24px, calc(1vh * 7));
-    }
-}
-
-
 #pageBody {
     height: 69vh !important;
     padding: 1vh;
@@ -222,8 +53,7 @@ h5 {
     overflow-y: auto;
     overflow-x: hidden;
     position: absolute;
-    width: 98vw;
+    width: 98vw; 
-
 }
 
 .page-body > * {
@@ -250,9 +80,7 @@ h5 {
     margin-top: 0vh;
     top: 0;
 }
-#pageBody > .card:last-of-type {
+
-    /* margin-bottom: 1vh; */
-}
 /* Create two unequal columns that floats next to each other *
 /* Left column *
 .leftcolumn {   
@@ -280,16 +108,14 @@ h5 {
 }
 */
 
-/* Fake image */
+/* Fake image 
 .fakeimg {
     background-color: var(--c_purple_light);
     width: 100%;
     padding: 20px;
 }
+*/
 
-img, video {
-    border-radius: 3vh;
-}
 
 /* header image */
 img.header-logo {
@@ -306,6 +132,7 @@ img.header-logo {
     border-radius: 0;
 }
 
+/*
 .container-icon-label {
     padding: 0;
     display: flex;
@@ -329,6 +156,7 @@ img.header-logo {
     max-width: 75%;
     justify-self: left;
 }
+*/
 
 /* Add a card effect for articles */
 .card {
@@ -349,10 +177,6 @@ img.header-logo {
     padding-right: 2.5vw;
 }
 
-.card.subcard {
-    margin-top: 0;
-}
-
 .header.card {
     border-radius: 2.5vh;
     border-bottom-left-radius: 0;
@@ -388,36 +212,6 @@ img.header-logo {
 }
 
 
-/* Clear floats after the columns 
-.row:after {
-    content: "";
-    display: table;
-    clear: both;
-}
-*/
-/* Footer */
-.footer {
-    padding: 1vh;
-    padding-left: 1vw;
-    padding-right: 1vw;
-    text-align: center;
-    margin: 0;
-    height: 8vh !important;
-    overflow-y: auto;
-    background-color: var(--c_purple_pastel);
-    border-top-left-radius: 2.5vh;
-    border-top-right-radius: 2.5vh;
-    position: absolute;
-    /* top: 2.5vh; */
-    bottom: 0;
-    width: 98vw;
-}
-
-.footer > h4, h5 {
-    padding: 0;
-    margin: 0;
-}
-
 /*
 /* Responsive layout - when the screen is less than 800px wide, make the two columns stack on top of each other instead of next to each other *
 @media screen and (max-width: 800px) {
@@ -436,9 +230,6 @@ img.header-logo {
 }
 */
 
-/* input container 
-    margin-top: 3vh;
-    */
 .container-input {
     padding: 1vh;
     display: flex;
@@ -460,8 +251,6 @@ img.header-logo {
 
 .container-input > input, .container-input > textarea {
     border: 2px solid var(--c_purple);
-    max-width: 66%;
-    min-width: 20%;
     padding: 1vh;
 }
 
@@ -469,6 +258,29 @@ img.header-logo {
     width: 100%;
 }
 
+
+ul {
+    max-width: 90%;
+    padding: 5px 0 10px 0;
+}
+li {
+    text-align: left;
+    font-size: 18px;
+}
+
+
+:not(input,textarea,select).dirty {
+    background-color: var(--c_purple_dark);
+}
+input.dirty, textarea.dirty, select.dirty {
+    border-color: var(--c_purple_dark);
+}
+
+
+#pageBody > *, button {
+    font-size: min(12px, calc(1vh * 3));
+}
+
 button, .button-submit, input[type="submit"] {
     font-size: 20px;
     font-weight: bold;
@@ -476,15 +288,11 @@ button, .button-submit, input[type="submit"] {
     border-radius: 2vh;
     padding: 1vh 2vh 1vh 2vh;
     margin: 0.5vh;
-    /*
-    background-color: var(--c_blue_pastel);
-    color: var(--c_blue_dark);
-    border-color: var(--c_blue_dark);
-    */
     background-color: var(--c_purple_pastel);
     color: var(--c_purple_dark);
     border-color: var(--c_purple_dark);
 }
+
 button.navContactUs {
     border: 4px solid var(--c_purple_dark);
     background-color: var(--c_purple_pastel);
@@ -492,14 +300,50 @@ button.navContactUs {
     border-radius: 2vh;
     width: 180px !important;
 }
-button:hover, input[type="submit"]:hover, #overlayHamburger .row *:hover {
+
+button:hover, input[type="submit"]:hover {
     text-decoration: underline;
 }
-#buttonHamburger:hover {
+
-    text-decoration: none;
+
+
+
+
+img, video {
+    border-radius: 3vh;
 }
 
 
+h1 {
+    font-size: min(24px, calc(1vh * 6));
+}
+
+h2 {
+    font-size: min(20px, calc(1vh * 5));
+}
+
+h3 {
+    font-size: min(16px, calc(1vh * 4));
+    margin-top: 1vh;
+}
+
+h4 {
+    font-size: 13px;
+    margin: 1vh;
+    text-align: center;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+h5 {
+    font-size: 11px;
+    margin: 1vh;
+}
+
+
+
+
+
 /* Overlay modal */
 .overlay {
     /*
@@ -523,6 +367,10 @@ button:hover, input[type="submit"]:hover, #overlayHamburger .row *:hover {
     display: none;
 }
 
+/* Hamburger menu overlay */
+#buttonHamburger:hover {
+    text-decoration: none;
+}
 #overlayHamburger {
     overflow-x: hidden;
     overflow-y: auto;
@@ -569,34 +417,11 @@ button:hover, input[type="submit"]:hover, #overlayHamburger .row *:hover {
     padding-bottom: 4.5px;
 }
 
-ul {
+#overlayHamburger .row *:hover {
-    max-width: 90%;
+    text-decoration: underline;
-    padding: 5px 0 10px 0;
-}
-li {
-    text-align: left;
-    font-size: 18px;
 }
 
-
+/* Confirm overlay */
-:not(input,textarea,select).dirty {
-    background-color: var(--c_purple_dark);
-}
-input.dirty, textarea.dirty, select.dirty {
-    border-color: var(--c_purple_dark);
-}
-
-
-/* Tables */
-#pageBody > *, button {
-    font-size: min(12px, calc(1vh * 3));
-}
-
-
-
-
-
-
 #overlayConfirm {
     position: absolute;
     left: 25vw;
@@ -653,13 +478,6 @@ tr {
 }
 */
 
-table textarea,
-table select,
-table input {
-    width: 100%;
-    box-sizing: border-box;
-}
-
 table button {
     margin: 0.25vh;
     padding: 0.5vh 1vh;
@@ -673,8 +491,78 @@ tr.delete, tr.delete > td {
     background-color: red;
 }
 
+table div {
+    align-content: center;
+}
 
 
+/* Navigation */
+.topnav {
+    border-bottom-left-radius: 2.5vh;
+    border-bottom-right-radius: 2.5vh;
+    display: flex;
+    flex-wrap: wrap;
+    flex: 1;
+    flex-direction: row;
+    font-weight: bold;
+    font-size: 1vh;
+    max-height: 15vh;
+    height: 15vh;
+    align-items: flex-start;
+}
+.topnav a, .topnav label, .topnav p, .topnav h1 {
+    float: left;
+    display: flex;
+    color: white;
+    text-align: center;
+    text-decoration: none;
+    width: 100%;
+    max-height: 15vh;
+    font-weight: normal;
+    justify-content: center;
+}
+.topnav a:hover {
+    background-color: var(--c_purple_light);
+    color: var(--c_purple_dark);
+}
+
+.topnav > .container {
+    max-width: 50%;
+    height: 100%;
+    align-items: center;
+    align-self: center;
+    /* align-content: center; */
+    /* width: fit-content; */
+    display: flex;
+}
+.topnav select {
+    padding: 1vh;
+    margin: 1vh;
+    border-radius: 1vh;
+    /* background-color: var(--c_purple_light); */
+    color: var(--c_purple_dark);
+    border: 2px solid white;
+    font-weight: bold;
+    text-align: center;
+}
+.topnav select .collapsed {
+    width: 5vw;
+}
+.topnav select .expanded {
+    width: 25vw;
+}
+
+.company-name {
+    font-size: min(28px, calc(1vh * 7));
+    color: white;
+}
+@media screen and (max-width: 450px) {
+    .company-name {
+        font-size: min(24px, calc(1vh * 7));
+    }
+}
+
+/* Page Filters */
 button.collapsed {
     display: block;
     opacity: 0;
@@ -696,6 +584,28 @@ form.filter button.save, form.filter button.button-cancel {
     width: 12vh;
 }
 
+/* Footer */
+.footer {
+    padding: 1vh;
+    padding-left: 1vw;
+    padding-right: 1vw;
+    text-align: center;
+    margin: 0;
+    height: 8vh !important;
+    overflow-y: auto;
+    background-color: var(--c_purple_pastel);
+    border-top-left-radius: 2.5vh;
+    border-top-right-radius: 2.5vh;
+    position: absolute;
+    /* top: 2.5vh; */
+    bottom: 0;
+    width: 98vw;
+}
+
+.footer > h4, h5 {
+    padding: 0;
+    margin: 0;
+}
 
 #tableMain {
     overflow-x: auto;
@@ -707,7 +617,11 @@ form.filter button.save, form.filter button.button-cancel {
     justify-content: normal;
 }
 
-#tableMain select, #tableMain input, #tableMain textarea {
+#tableMain * {
+    padding: 0.25vh 0.5vh;
+}
+
+#tableMain select, #tableMain input:not([type="checkbox"]), #tableMain textarea, #tableMain div {
     box-sizing: border-box;
     width: 100%;
     height: 100%;
@@ -718,6 +632,13 @@ form.filter button.save, form.filter button.button-cancel {
     min-width: 20vh;
     padding: 0 0.5vh;
 }
+#tableMain tbody tr td {
+    height: 5vh;
+    padding-top: 0.5vh;
+}
+#tableMain tbody tr:not(:last-of-type) td {
+    padding-bottom: 0.5vh;
+}
 #tableMain thead tr th.active, #tableMain tbody tr td.active {
     width: 6vh;
     min-width: 6vh;
@@ -730,6 +651,7 @@ form.filter button.save, form.filter button.button-cancel {
 
 
 
+
 :root {
     --background-color: #ffffff;
     --text-color: #333333;

static/dist/js/main.bundle.js

@@ -12,7 +12,7 @@ function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o =
 function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-var Validation = /*#__PURE__*/function () {
+var validation_Validation = /*#__PURE__*/function () {
   function Validation() {
     _classCallCheck(this, Validation);
   }
@@ -149,6 +149,12 @@ var Validation = /*#__PURE__*/function () {
       };
       img.src = url;
     }
+  }, {
+    key: "toFixedOrDefault",
+    value: function toFixedOrDefault(value, decimalPlaces) {
+      var defaultValue = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+      return Validation.isValidNumber(value) ? parseFloat(value).toFixed(decimalPlaces) : defaultValue;
+    }
   }]);
 }();
 
@@ -204,7 +210,7 @@ var DOM = /*#__PURE__*/function () {
   }, {
     key: "setElementValueCurrentIfEmpty",
     value: function setElementValueCurrentIfEmpty(element, data) {
-      if (Validation.isEmpty(DOM.getElementValueCurrent(element))) {
+      if (validation_Validation.isEmpty(DOM.getElementValueCurrent(element))) {
         DOM.setElementValueCurrent(element, data);
       }
     }
@@ -216,7 +222,7 @@ var DOM = /*#__PURE__*/function () {
   }, {
     key: "getRowFromElement",
     value: function getRowFromElement(element, flagRow) {
-      var selector = Validation.isEmpty(flagRow) ? 'tr' : 'tr.' + flagRow;
+      var selector = validation_Validation.isEmpty(flagRow) ? 'tr' : 'tr.' + flagRow;
       return element.closest(selector);
     }
   }, {
@@ -235,7 +241,7 @@ var DOM = /*#__PURE__*/function () {
     key: "convertForm2JSON",
     value: function convertForm2JSON(elementForm) {
       var dataForm = {};
-      if (Validation.isEmpty(elementForm)) {
+      if (validation_Validation.isEmpty(elementForm)) {
         return dataForm;
       }
       var containersFilter = elementForm.querySelectorAll('.' + flagContainerInput + '.' + flagFilter);
@@ -306,7 +312,7 @@ var DOM = /*#__PURE__*/function () {
     key: "getElementValueCurrent",
     value: function getElementValueCurrent(element) {
       var returnVal = '';
-      if (!Validation.isEmpty(element)) {
+      if (!validation_Validation.isEmpty(element)) {
         if (element.type === "checkbox") {
           returnVal = element.checked;
         }
@@ -322,15 +328,15 @@ var DOM = /*#__PURE__*/function () {
           returnVal = element.textContent;
         }
       }
-      if (Validation.isEmpty(returnVal)) returnVal = '';
+      if (validation_Validation.isEmpty(returnVal)) returnVal = '';
       return returnVal;
     }
   }, {
     key: "getElementAttributeValueCurrent",
     value: function getElementAttributeValueCurrent(element) {
-      if (Validation.isEmpty(element)) return null;
+      if (validation_Validation.isEmpty(element)) return null;
       return element.getAttribute(attrValueCurrent);
-      if (!Validation.isEmpty(value) && element.type === "checkbox") {
+      if (!validation_Validation.isEmpty(value) && element.type === "checkbox") {
         value = value === 'true';
       }
       return value;
@@ -338,9 +344,9 @@ var DOM = /*#__PURE__*/function () {
   }, {
     key: "getElementAttributeValuePrevious",
     value: function getElementAttributeValuePrevious(element) {
-      if (Validation.isEmpty(element)) return null;
+      if (validation_Validation.isEmpty(element)) return null;
       return element.getAttribute(attrValuePrevious);
-      if (!Validation.isEmpty(value) && element.type === "checkbox") {
+      if (!validation_Validation.isEmpty(value) && element.type === "checkbox") {
         value = value === 'true';
       }
       return value;
@@ -404,7 +410,7 @@ var DOM = /*#__PURE__*/function () {
   }, {
     key: "createOption",
     value: function createOption(optionJson) {
-      if (Validation.isEmpty(optionJson)) optionJson = {
+      if (validation_Validation.isEmpty(optionJson)) optionJson = {
         text: 'Select',
         value: 0
       };
@@ -2181,7 +2187,7 @@ var BusinessObjects = /*#__PURE__*/function () {
   }, {
     key: "getObjectText",
     value: function getObjectText(objectJson) {
-      return objectJson[objectJson[flagNameAttrOptionText]];
+      return objectJson == null ? '' : objectJson[objectJson[flagNameAttrOptionText]];
     }
   }, {
     key: "getListObjectsFromIdDictAndCsv",
@@ -2300,6 +2306,8 @@ function base_table_setPrototypeOf(t, e) { return base_table_setPrototypeOf = Ob
 
 
 var TableBasePage = /*#__PURE__*/function (_BasePage) {
+  // static hash
+  // static attrIdRowObject
   // callFilterTableContent
   // callSaveTableContent
 
@@ -2361,7 +2369,7 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
         var filters = dataPage[flagFormFilters];
         var formFilters = this.getFormFilters();
         var filtersDefault = DOM.convertForm2JSON(formFilters);
-        if (!Validation.areEqualDicts(filters, filtersDefault)) {
+        if (!validation_Validation.areEqualDicts(filters, filtersDefault)) {
           this.callFilterTableContent(filters);
         }
       }
@@ -2430,7 +2438,7 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
         row.remove();
       });
       var rowsJson = response.data[flagRows];
-      if (!Validation.isEmpty(rowsJson) && rowsJson.every(function (row) {
+      if (!validation_Validation.isEmpty(rowsJson) && rowsJson.every(function (row) {
         return row.hasOwnProperty('display_order');
       })) {
         rowsJson = rowsJson.sort(function (a, b) {
@@ -2500,7 +2508,6 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
     value: function getTableRecords() {
       var _this6 = this;
       var dirtyOnly = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-      // let table = TableBasePage.getTableMain();
       var records = [];
       var record;
       document.querySelectorAll(idTableMain + ' > tbody > tr').forEach(function (row) {
@@ -2567,13 +2574,13 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
       });
       var countRows = document.querySelectorAll(idTableMain + ' > tbody > tr').length;
       row.setAttribute(this.constructor.attrIdRowObject, -1 - countRows);
-      this.initialiseRowNew(row);
+      this.initialiseRowNew(tbody, row);
       tbody.appendChild(row);
       this.hookupTableMain();
     }
   }, {
     key: "initialiseRowNew",
-    value: function initialiseRowNew(row) {
+    value: function initialiseRowNew(tbody, row) {
       if (this.constructor === TableBasePage) {
         throw new Error("Subclass of TableBasePage must implement method initialiseRowNew().");
       }
@@ -2608,6 +2615,19 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
       });
       _rowBlank.setAttribute(this.constructor.attrIdRowObject, -1 - countRows);
     }
+  }, {
+    key: "initialiseSliderDisplayOrderRowNew",
+    value: function initialiseSliderDisplayOrderRowNew(tbody, row) {
+      // let tdSelector = ':scope > tr > td.' + flagDisplayOrder;
+      // let tbody = document.querySelector('table' + (Validation.isEmpty(flagTable) ? '' : '.' + flagTable) + ' > tbody');
+      var slidersDisplayOrder = tbody.querySelectorAll(':scope > tr > td.' + flagDisplayOrder + ' input.' + flagSlider);
+      var maxDisplayOrder = 0;
+      slidersDisplayOrder.forEach(function (slider) {
+        maxDisplayOrder = Math.max(maxDisplayOrder, parseFloat(DOM.getElementValueCurrent(slider)));
+      });
+      var sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
+      DOM.setElementValuesCurrentAndPrevious(sliderDisplayOrder, maxDisplayOrder + 1);
+    }
   }, {
     key: "hookupSlidersDisplayOrderTable",
     value: function hookupSlidersDisplayOrderTable() {
@@ -2723,7 +2743,7 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
     key: "handleChangeNestedElementCellTable",
     value: function handleChangeNestedElementCellTable(event, element) {
       var wasDirtyParentRows = this.getAllIsDirtyRowsInParentTree(element);
-      var wasDirtyElement = DOM.isElementDirty(element);
+      var wasDirtyElement = element.classList.contains(flagDirty);
       var isDirtyElement = DOM.updateAndCheckIsElementDirty(element);
       if (_verbose) {
         console.log({
@@ -2758,7 +2778,7 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
   }, {
     key: "cascadeChangedIsDirtyNestedElementCellTable",
     value: function cascadeChangedIsDirtyNestedElementCellTable(element, isDirtyElement, wasDirtyParentRows) {
-      if (Validation.isEmpty(wasDirtyParentRows)) return;
+      if (validation_Validation.isEmpty(wasDirtyParentRows)) return;
       var td = DOM.getCellFromElement(element);
       var isDirtyTd = isDirtyElement || DOM.hasDirtyChildrenContainer(tr);
       DOM.handleDirtyElement(td, isDirtyTd);
@@ -2867,13 +2887,13 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
       var handleClickRowNew = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function (event, element) {
         _this11.handleClickAddRowTable(event, element);
       };
-      var selectorButton = 'table' + (Validation.isEmpty(flagTable) ? '' : '.' + flagTable) + ' > tbody > tr > td.' + flagActive + ' button';
+      var selectorButton = 'table' + (validation_Validation.isEmpty(flagTable) ? '' : '.' + flagTable) + ' > tbody > tr > td.' + flagActive + ' button';
       var selectorButtonDelete = selectorButton + '.' + flagDelete;
       var selectorButtonUndelete = selectorButton + ':not(.' + flagDelete + ')';
       console.log("hookupFieldsActive: ", selectorButtonDelete, selectorButtonUndelete);
       this.hookupButtonsRowDelete(selectorButtonDelete, selectorButtonUndelete);
       this.hookupButtonsRowUndelete(selectorButtonDelete, selectorButtonUndelete);
-      this.hookupEventHandler("click", 'table' + (Validation.isEmpty(flagTable) ? '' : '.' + flagTable) + ' > thead > tr > th.' + flagActive + ' button', function (event, button) {
+      this.hookupEventHandler("click", 'table' + (validation_Validation.isEmpty(flagTable) ? '' : '.' + flagTable) + ' > thead > tr > th.' + flagActive + ' button', function (event, button) {
         handleClickRowNew(event, button);
       });
     }
@@ -2996,7 +3016,6 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
       });
       tdNew.appendChild(ddl);
       var ddlSelector = cellSelector + ' select';
-      debugger;
       ddlHookup(ddlSelector);
     }
     /*
@@ -3074,8 +3093,8 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
     key: "hookupFieldsProductPermutationVariation",
     value: function hookupFieldsProductPermutationVariation() {
       this.hookupPreviewsProductPermutationVariation();
-      this.hookupDdlsProductPermutationVariation();
       this.hookupDdlsProductPermutationVariationType();
+      this.hookupDdlsProductPermutationVariation();
       this.hookupButtonsProductPermutationVariationAddDelete();
     }
   }, {
@@ -3091,7 +3110,7 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
     value: function handleClickProductPermutationVariationsPreview(event, element) {
       var _this20 = this;
       var tblVariations = element.querySelector('table.' + flagProductVariations);
-      if (!Validation.isEmpty(tblVariations)) return;
+      if (!validation_Validation.isEmpty(tblVariations)) return;
       this.toggleColumnCollapsed(flagProductVariations, false);
       var permutationVariations = this.getElementProductVariations(element);
       tblVariations = document.createElement("table");
@@ -3116,7 +3135,7 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
       thead.appendChild(tr);
       tblVariations.appendChild(thead);
       var tbody = document.createElement("tbody");
-      if (!Validation.isEmpty(permutationVariations)) {
+      if (!validation_Validation.isEmpty(permutationVariations)) {
         permutationVariations.forEach(function (permutationVariation, index) {
           _this20.addProductPermutationVariationRow(tbody, permutationVariation);
         });
@@ -3148,7 +3167,7 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
       var permutationVariations = element.getAttribute(attrValueCurrent);
       var objVariations = [];
       var parts, new_variation, new_variation_type;
-      if (!Validation.isEmpty(permutationVariations)) {
+      if (!validation_Validation.isEmpty(permutationVariations)) {
         permutationVariations = permutationVariations.split(',');
         permutationVariations.forEach(function (variation) {
           parts = variation.split(':');
@@ -3261,26 +3280,54 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
       tr.appendChild(tdDelete);
       tbody.appendChild(tr);
     }
-  }, {
-    key: "hookupDdlsProductPermutationVariation",
-    value: function hookupDdlsProductPermutationVariation() {
-      this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariation);
-    }
   }, {
     key: "hookupDdlsProductPermutationVariationType",
     value: function hookupDdlsProductPermutationVariationType() {
-      this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariationType);
+      var _this21 = this;
+      this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariationType + ' select', function (event, ddlVariationType) {
+        _this21.handleChangeDdlProductVariationOrVariationType(event, ddlVariationType);
+        var idVariationTypeSelected = DOM.getElementValueCurrent(ddlVariationType);
+        var row = DOM.getRowFromElement(ddlVariationType);
+        var tdVariation = row.querySelector('td.' + flagProductVariation);
+        tdVariation.dispatchEvent(new Event('click'));
+        var ddlVariation = row.querySelector('td.' + flagProductVariation + ' select');
+        ddlVariation.innerHTML = '';
+        ddlVariation.appendChild(DOM.createOption(null));
+        var optionJson, option;
+        var variationType = productVariationTypes[idVariationTypeSelected];
+        if (variationType == null) variationType = base_table_defineProperty({}, flagProductVariations, []);
+        variationType[flagProductVariations].forEach(function (variation) {
+          optionJson = BusinessObjects.getOptionJsonFromObjectJson(variation);
+          option = DOM.createOption(optionJson);
+          ddlVariation.appendChild(option);
+        });
+        _this21.handleChangeDdlProductVariationOrVariationType(event, ddlVariation);
+      });
+    }
+  }, {
+    key: "handleChangeDdlProductVariationOrVariationType",
+    value: function handleChangeDdlProductVariationOrVariationType(event, element) {
+      this.updateProductPermutationVariations(element);
+      this.handleChangeNestedElementCellTable(event, element);
+    }
+  }, {
+    key: "hookupDdlsProductPermutationVariation",
+    value: function hookupDdlsProductPermutationVariation() {
+      var _this22 = this;
+      this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariation, function (event, ddlVariation) {
+        _this22.handleChangeDdlProductVariationOrVariationType(event, ddlVariation);
+      });
     }
   }, {
     key: "hookupButtonsProductPermutationVariationAddDelete",
     value: function hookupButtonsProductPermutationVariationAddDelete() {
-      var _this21 = this;
+      var _this23 = this;
       var selectorButton = idTableMain + ' td.' + flagProductVariations + ' tr.' + flagProductVariation + ' button';
       var selectorButtonDelete = selectorButton + '.' + flagDelete;
       var selectorButtonUndelete = selectorButton + '.' + flagAdd;
       this.hookupButtonsRowDelete(selectorButtonDelete, selectorButtonUndelete, function (event, element) {
-        _this21.handleClickButtonRowDelete(event, element);
+        _this23.handleClickButtonRowDelete(event, element);
-        _this21.updateProductPermutationVariations(element);
+        _this23.updateProductPermutationVariations(element);
       });
       this.hookupButtonsRowUndelete(selectorButtonDelete, selectorButtonUndelete);
       this.hookupButtonsProductPermutationVariationAdd();
@@ -3288,9 +3335,9 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
   }, {
     key: "hookupButtonsProductPermutationVariationAdd",
     value: function hookupButtonsProductPermutationVariationAdd() {
-      var _this22 = this;
+      var _this24 = this;
       this.hookupEventHandler("click", idTableMain + ' td.' + flagProductVariations + ' button.' + flagAdd, function (event, element) {
-        _this22.handleClickButtonProductPermutationVariationAdd(event, element);
+        _this24.handleClickButtonProductPermutationVariationAdd(event, element);
       });
     }
   }, {
@@ -3307,21 +3354,22 @@ var TableBasePage = /*#__PURE__*/function (_BasePage) {
     value: function updateProductPermutationVariations(element) {
       var variationsCell = element.closest('td.' + flagProductVariations);
       var variationPairsString = this.getProductPermutationVariationsText(variationsCell);
-      variationsCell.setAttribute(attrValueCurrent, variationPairsString);
+      DOM.setElementAttributeValueCurrent(variationsCell, variationPairsString);
       DOM.isElementDirty(variationsCell);
     }
   }, {
     key: "getProductPermutationVariationsText",
     value: function getProductPermutationVariationsText(variationsTd) {
-      var rows = variationsTd.querySelectorAll('tr');
+      var rows = variationsTd.querySelectorAll(':scope tbody tr');
       var variationPairsString = '';
       var ddlVariationType, ddlVariation, idVariationType, idVariation;
       rows.forEach(function (row, index) {
-        ddlVariationType = row.querySelector('td select.' + flagProductVariationType);
+        ddlVariationType = row.querySelector(':scope td select.' + flagProductVariationType);
-        ddlVariation = row.querySelector('td select.' + flagProductVariation);
+        ddlVariation = row.querySelector(':scope td select.' + flagProductVariation);
-        idVariationType = ddlVariationType.getAttribute(attrValueCurrent);
+        idVariationType = DOM.getElementValueCurrent(ddlVariationType);
-        idVariation = ddlVariation.getAttribute(attrValueCurrent);
+        idVariation = DOM.getElementValueCurrent(ddlVariation);
-        variationPairsString += idVariationType + ':' + idVariation + ',';
+        if (variationPairsString != '') variationPairsString += ',';
+        variationPairsString += idVariationType + ':' + idVariation;
       });
       return variationPairsString;
     }
@@ -3411,7 +3459,7 @@ export class PageStoreProductCategories extends TableBasePage {
     hookupFilters() {}
     loadRowTable(rowJson) {}
     getJsonRow(row) {}
-    initialiseRowNew(row) {}
+    initialiseRowNew(tbody, row) {}
     hookupTableMain() {}
     isDirtyRow(row) {}
     leave() {}
@@ -3897,7 +3945,7 @@ var StoreMixinPage = /*#__PURE__*/function () {
   }], [{
     key: "validateBasket",
     value: function validateBasket(basket) {
-      return Validation.isEmpty(basket) && Validation.dictHasKey(basket, keyItems) && Validation.dictHasKey(basket, keyIsIncludedVAT) && Validation.dictHasKey(basket, keyIdCurrency) && Validation.dictHasKey(basket, keyIdRegionDelivery);
+      return validation_Validation.isEmpty(basket) && validation_Validation.dictHasKey(basket, keyItems) && validation_Validation.dictHasKey(basket, keyIsIncludedVAT) && validation_Validation.dictHasKey(basket, keyIdCurrency) && validation_Validation.dictHasKey(basket, keyIdRegionDelivery);
     }
   }, {
     key: "makeNewBasket",
@@ -4102,8 +4150,8 @@ var PageStoreManufacturingPurchaseOrders = /*#__PURE__*/function (_TableBasePage
     }
   }, {
     key: "initialiseRowNew",
-    value: function initialiseRowNew(row) {
+    value: function initialiseRowNew(tbody, row) {
-      manufacturing_purchase_orders_superPropGet(PageStoreManufacturingPurchaseOrders, "initialiseRowNew", this, 3)([row]);
+      manufacturing_purchase_orders_superPropGet(PageStoreManufacturingPurchaseOrders, "initialiseRowNew", this, 3)([tbody, row]);
     }
   }, {
     key: "hookupTableMain",
@@ -4658,15 +4706,9 @@ var PageStoreProductCategories = /*#__PURE__*/function (_TableBasePage) {
     }
   }, {
     key: "initialiseRowNew",
-    value: function initialiseRowNew(row) {
+    value: function initialiseRowNew(tbody, row) {
       if (row == null) return;
-      var slidersDisplayOrder = document.querySelectorAll('td.' + flagDisplayOrder + ' input.' + flagSlider);
+      this.initialiseSliderDisplayOrderRowNew(tbody, row);
-      var maxDisplayOrder = 0;
-      slidersDisplayOrder.forEach(function (slider) {
-        maxDisplayOrder = Math.max(maxDisplayOrder, parseFloat(DOM.getElementValueCurrent(slider)));
-      });
-      var sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
-      DOM.setElementValuesCurrentAndPrevious(sliderDisplayOrder, maxDisplayOrder + 1);
     }
   }, {
     key: "hookupTableMain",
@@ -4926,13 +4968,13 @@ var PageStoreProductPermutations = /*#__PURE__*/function (_TableBasePage) {
     }
   }, {
     key: "initialiseRowNew",
-    value: function initialiseRowNew(row) {
+    value: function initialiseRowNew(tbody, row) {
       var ddlCategoryFilter = document.querySelector(idFormFilters + ' #' + attrIdProductCategory);
       var idProductCategoryFilter = DOM.getElementValueCurrent(ddlCategoryFilter);
-      var hasCategoryFilter = !(Validation.isEmpty(idProductCategoryFilter) || idProductCategoryFilter == '0');
+      var hasCategoryFilter = !(validation_Validation.isEmpty(idProductCategoryFilter) || idProductCategoryFilter == '0');
       var ddlProductFilter = document.querySelector(idFormFilters + ' #' + attrIdProduct);
       var idProductFilter = DOM.getElementValueCurrent(ddlProductFilter);
-      var hasProductFilter = !(Validation.isEmpty(idProductFilter) || idProductFilter == '0');
+      var hasProductFilter = !(validation_Validation.isEmpty(idProductFilter) || idProductFilter == '0');
       if (_verbose) {
         console.log("initialiseRowNew: ", row);
         console.log({
@@ -5266,15 +5308,9 @@ var PageStoreProducts = /*#__PURE__*/function (_TableBasePage) {
     }
   }, {
     key: "initialiseRowNew",
-    value: function initialiseRowNew(row) {
+    value: function initialiseRowNew(tbody, row) {
       if (row == null) return;
-      var slidersDisplayOrder = document.querySelectorAll('td.' + flagDisplayOrder + ' input.' + flagSlider);
+      this.initialiseSliderDisplayOrderRowNew(tbody, row);
-      var maxDisplayOrder = 0;
-      slidersDisplayOrder.forEach(function (slider) {
-        maxDisplayOrder = Math.max(maxDisplayOrder, parseFloat(DOM.getElementValueCurrent(slider)));
-      });
-      var sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
-      DOM.setElementValuesCurrentAndPrevious(sliderDisplayOrder, maxDisplayOrder + 1);
     }
   }, {
     key: "hookupTableMain",
@@ -5401,7 +5437,7 @@ var PageStoreProductVariations = /*#__PURE__*/function (_TableBasePage) {
       var buttonActive = row.querySelector('td.' + flagActive + ' button');
       var jsonRow = {};
       jsonRow[attrIdProductVariationType] = row.getAttribute(attrIdProductVariationType);
-      if (Validation.isEmpty(jsonRow[attrIdProductVariationType])) jsonRow[attrIdProductVariationType] = -1;
+      if (validation_Validation.isEmpty(jsonRow[attrIdProductVariationType])) jsonRow[attrIdProductVariationType] = -1;
       jsonRow[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(inputDisplayOrder);
       jsonRow[flagCode] = DOM.getElementAttributeValueCurrent(textareaCode);
       jsonRow[flagName] = DOM.getElementAttributeValueCurrent(textareaName);
@@ -5431,7 +5467,7 @@ var PageStoreProductVariations = /*#__PURE__*/function (_TableBasePage) {
       var buttonActive = tr.querySelector('td.' + flagActive + ' button');
       var jsonRow = {};
       jsonRow[attrIdProductVariation] = tr.getAttribute(attrIdProductVariation);
-      if (Validation.isEmpty(jsonRow[attrIdProductVariation])) jsonRow[attrIdProductVariation] = -1 - indexRow;
+      if (validation_Validation.isEmpty(jsonRow[attrIdProductVariation])) jsonRow[attrIdProductVariation] = -1 - indexRow;
       jsonRow[attrIdProductVariationType] = tr.getAttribute(attrIdProductVariationType);
       jsonRow[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(inputDisplayOrder);
       jsonRow[flagCode] = DOM.getElementAttributeValueCurrent(textareaCode);
@@ -5441,8 +5477,9 @@ var PageStoreProductVariations = /*#__PURE__*/function (_TableBasePage) {
     }
   }, {
     key: "initialiseRowNew",
-    value: function initialiseRowNew(row) {
+    value: function initialiseRowNew(tbody, row) {
-      product_variations_superPropGet(PageStoreProductVariations, "initialiseRowNew", this, 3)([row]);
+      product_variations_superPropGet(PageStoreProductVariations, "initialiseRowNew", this, 3)([tbody, row]);
+      this.initialiseSliderDisplayOrderRowNew(tbody, row);
     }
   }, {
     key: "hookupTableMain",
@@ -5473,9 +5510,10 @@ var PageStoreProductVariations = /*#__PURE__*/function (_TableBasePage) {
     key: "hookupProductVariationsPreviews",
     value: function hookupProductVariationsPreviews() {
       var _this3 = this;
-      this.hookupEventHandler("click", idTableMain + ' td.' + flagProductVariations, function (event, td) {
+      this.hookupEventHandler("click", idTableMain + ' td.' + flagProductVariations + ' div', function (event, element) {
+        var td = DOM.getCellFromElement(element);
         if (!td.classList.contains(flagCollapsed)) return;
-        _this3.handleClickProductVariationsPreview(event, td);
+        _this3.handleClickProductVariationsPreview(event, element);
       });
     }
   }, {
@@ -5485,12 +5523,10 @@ var PageStoreProductVariations = /*#__PURE__*/function (_TableBasePage) {
       if (_verbose) {
         console.log("click order items preview");
       }
-      this.toggleColumnHeaderCollapsed(flagProductVariations, false);
-      element.classList.remove(flagCollapsed);
       var row = DOM.getRowFromElement(element);
       var idProductVariationType = row.getAttribute(attrIdProductVariationType);
-      if (idProductVariationType == null || idProductVariationType < 1) return;
       var productVariationType = productVariationTypes[idProductVariationType];
+      if (productVariationType == null) productVariationType = product_variations_defineProperty({}, flagProductVariations, []);
       var tblProductVariations = document.createElement("table");
       tblProductVariations.classList.add(flagProductVariations);
       var thead = document.createElement("thead");
@@ -5526,10 +5562,12 @@ var PageStoreProductVariations = /*#__PURE__*/function (_TableBasePage) {
       var cell = DOM.getCellFromElement(element);
       var cellNew = cell.cloneNode(false);
       cellNew.appendChild(tblProductVariations);
+      cellNew.classList.remove(flagCollapsed);
       row.replaceChild(cellNew, cell);
       if (_verbose) {
         console.log("tblProductVariations: ", tblProductVariations);
       }
+      this.toggleColumnHeaderCollapsed(flagProductVariations, false);
       this.hookupFieldsProductVariation();
     }
   }, {
@@ -5619,7 +5657,7 @@ var PageStoreProductVariations = /*#__PURE__*/function (_TableBasePage) {
   }]);
 }(TableBasePage);
 product_variations_defineProperty(PageStoreProductVariations, "hash", hashPageStoreProductVariations);
-product_variations_defineProperty(PageStoreProductVariations, "attrIdRowObject", attrIdProductVariation);
+product_variations_defineProperty(PageStoreProductVariations, "attrIdRowObject", attrIdProductVariationType);
 
 ;// CONCATENATED MODULE: ./static/js/pages/store/stock_items.js
 function stock_items_typeof(o) { "@babel/helpers - typeof"; return stock_items_typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, stock_items_typeof(o); }
@@ -5762,14 +5800,14 @@ var PageStoreStockItems = /*#__PURE__*/function (_TableBasePage) {
     }
   }, {
     key: "initialiseRowNew",
-    value: function initialiseRowNew(row) {
+    value: function initialiseRowNew(tbody, row) {
-      stock_items_superPropGet(PageStoreStockItems, "initialiseRowNew", this, 3)([row]);
+      stock_items_superPropGet(PageStoreStockItems, "initialiseRowNew", this, 3)([tbody, row]);
       var ddlCategoryFilter = document.querySelector(idFormFilters + ' #' + attrIdProductCategory);
       var idProductCategoryFilter = DOM.getElementValueCurrent(ddlCategoryFilter);
-      var hasCategoryFilter = !(Validation.isEmpty(idProductCategoryFilter) || idProductCategoryFilter == '0');
+      var hasCategoryFilter = !(validation_Validation.isEmpty(idProductCategoryFilter) || idProductCategoryFilter == '0');
       var ddlProductFilter = document.querySelector(idFormFilters + ' #' + attrIdProduct);
       var idProductFilter = DOM.getElementValueCurrent(ddlProductFilter);
-      var hasProductFilter = !(Validation.isEmpty(idProductFilter) || idProductFilter == '0');
+      var hasProductFilter = !(validation_Validation.isEmpty(idProductFilter) || idProductFilter == '0');
       if (_verbose) {
         console.log("initialiseRowNew: ", row);
         console.log({
@@ -6150,8 +6188,8 @@ var PageStoreSuppliers = /*#__PURE__*/function (_TableBasePage) {
     }
   }, {
     key: "initialiseRowNew",
-    value: function initialiseRowNew(row) {
+    value: function initialiseRowNew(tbody, row) {
-      suppliers_superPropGet(PageStoreSuppliers, "initialiseRowNew", this, 3)([row]);
+      suppliers_superPropGet(PageStoreSuppliers, "initialiseRowNew", this, 3)([tbody, row]);
     }
   }, {
     key: "hookupTableMain",
@@ -6539,6 +6577,19 @@ var ProductPermutation = /*#__PURE__*/function () {
       });
       return preview;
     }
+  }, {
+    key: "getProductVariationsIdCsvFromVariationTypeList",
+    value: function getProductVariationsIdCsvFromVariationTypeList(variationTypeList) {
+      var csvVariations = '';
+      if (Validation.isEmpty(variationTypeList)) return csvVariations;
+      variationTypeList.forEach(function (variationType) {
+        if (csvVariations.length > 0) {
+          csvVariations += ',';
+        }
+        csvVariations += variationType[attrIdProductVariationType] + ':' + variationType[flagProductVariations][0][attrIdProductVariation];
+      });
+      return csvVariations;
+    }
   }]);
 }();
 
@@ -6654,8 +6705,8 @@ var PageStoreSupplierPurchaseOrders = /*#__PURE__*/function (_TableBasePage) {
     }
   }, {
     key: "initialiseRowNew",
-    value: function initialiseRowNew(row) {
+    value: function initialiseRowNew(tbody, row) {
-      supplier_purchase_orders_superPropGet(PageStoreSupplierPurchaseOrders, "initialiseRowNew", this, 3)([row]);
+      supplier_purchase_orders_superPropGet(PageStoreSupplierPurchaseOrders, "initialiseRowNew", this, 3)([tbody, row]);
     }
   }, {
     key: "hookupTableMain",
@@ -6700,9 +6751,10 @@ var PageStoreSupplierPurchaseOrders = /*#__PURE__*/function (_TableBasePage) {
     key: "hookupOrderItemsPreviews",
     value: function hookupOrderItemsPreviews() {
       var _this3 = this;
-      this.hookupEventHandler("click", idTableMain + ' td.' + flagOrderItems, function (event, td) {
+      this.hookupEventHandler("click", idTableMain + ' > tbody > tr > td.' + flagOrderItems + ' > div', function (event, div) {
+        var td = DOM.getCellFromElement(div);
         if (!td.classList.contains(flagCollapsed)) return;
-        _this3.handleClickOrderItemsPreview(event, td);
+        _this3.handleClickOrderItemsPreview(event, div);
       });
     }
   }, {
@@ -6713,11 +6765,16 @@ var PageStoreSupplierPurchaseOrders = /*#__PURE__*/function (_TableBasePage) {
         console.log("click order items preview");
       }
       this.toggleColumnHeaderCollapsed(flagOrderItems, false);
-      element.classList.remove(flagCollapsed);
+      /*
+      let td = DOM.getCellFromElement(element);
+      td.classList.remove(flagCollapsed);
+      */
+
       var row = DOM.getRowFromElement(element);
       var idSupplierPurchaseOrder = row.getAttribute(attrIdSupplierPurchaseOrder);
-      if (idSupplierPurchaseOrder == null || idSupplierPurchaseOrder < 1) return;
+      // if (idSupplierPurchaseOrder == null || idSupplierPurchaseOrder < 1) return;
       var supplierPurchaseOrder = supplierPurchaseOrders[idSupplierPurchaseOrder];
+      if (supplierPurchaseOrder == null) supplierPurchaseOrder = supplier_purchase_orders_defineProperty({}, flagOrderItems, []);
       var tblOrderItems = document.createElement("table");
       tblOrderItems.classList.add(flagOrderItems);
       var thead = document.createElement("thead");
@@ -6792,6 +6849,7 @@ var PageStoreSupplierPurchaseOrders = /*#__PURE__*/function (_TableBasePage) {
       var cell = DOM.getCellFromElement(element);
       var cellNew = cell.cloneNode(false);
       cellNew.appendChild(tblOrderItems);
+      cellNew.classList.remove(flagCollapsed);
       row.replaceChild(cellNew, cell);
       if (_verbose) {
         console.log("tblOrderItems: ", tblOrderItems);
@@ -6836,10 +6894,10 @@ var PageStoreSupplierPurchaseOrders = /*#__PURE__*/function (_TableBasePage) {
       var tdVariations = document.createElement("td");
       tdVariations.classList.add(flagProductVariations);
       tdVariations.classList.add(flagCollapsed);
-      DOM.setElementAttributesValuesCurrentAndPrevious(tdVariations, orderItem[attrIdProductVariation]);
+      DOM.setElementAttributesValuesCurrentAndPrevious(tdVariations, orderItem[flagProductVariations]);
       var divVariations = document.createElement("div");
       divVariations.classList.add(flagProductVariations);
-      DOM.setElementAttributesValuesCurrentAndPrevious(divVariations, orderItem[attrIdProductVariation]);
+      DOM.setElementAttributesValuesCurrentAndPrevious(divVariations, orderItem[flagProductVariations]);
       // divVariations.textContent = orderItem[flagProductVariations];
       var variationsText = ProductPermutation.getProductVariationsPreviewFromIdCsv(orderItem[flagProductVariations]);
       divVariations.textContent = variationsText;
@@ -6887,13 +6945,13 @@ var PageStoreSupplierPurchaseOrders = /*#__PURE__*/function (_TableBasePage) {
       tdCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
       var divCostUnitLocalVatExcl = document.createElement("div");
       divCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
-      DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatExcl, orderItem[flagCostUnitLocalVatExcl].toFixed(3));
+      DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatExcl, validation_Validation.toFixedOrDefault(orderItem[flagCostUnitLocalVatExcl], 3, null));
       tdCostUnitLocalVatExcl.appendChild(divCostUnitLocalVatExcl);
       var tdCostUnitLocalVatIncl = document.createElement("td");
       tdCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
       var divCostUnitLocalVatIncl = document.createElement("div");
       divCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
-      DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatIncl, orderItem[flagCostUnitLocalVatIncl].toFixed(3));
+      DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatIncl, validation_Validation.toFixedOrDefault(orderItem[flagCostUnitLocalVatIncl], 3, null));
       tdCostUnitLocalVatIncl.appendChild(divCostUnitLocalVatIncl);
       var tdLatencyDeliveryDays = document.createElement("td");
       tdLatencyDeliveryDays.classList.add(flagLatencyDeliveryDays);
@@ -6958,17 +7016,13 @@ var PageStoreSupplierPurchaseOrders = /*#__PURE__*/function (_TableBasePage) {
     hookupFieldsOrderItemProductVariations() {
         this.hookupEventHandler("click", idTableMain + ' td.' + flagOrderItems + ' td.' + flagProductVariations, (event, element) => this.handleClickProductPermutationVariationsPreview(event, element));
     }
+    hookupDdlsProductPermutationVariation() {
+        this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariation);
+    }
+    hookupDdlsProductPermutationVariationType() {
+        this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariationType);
+    }
     */
-  }, {
-    key: "hookupDdlsProductPermutationVariation",
-    value: function hookupDdlsProductPermutationVariation() {
-      this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariation);
-    }
-  }, {
-    key: "hookupDdlsProductPermutationVariationType",
-    value: function hookupDdlsProductPermutationVariationType() {
-      this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariationType);
-    }
   }, {
     key: "hookupFieldsOrderItemUnitQuantity",
     value: function hookupFieldsOrderItemUnitQuantity() {
@@ -7849,6 +7903,18 @@ window.app = app;
 
 })();
 
+// This entry need to be wrapped in an IIFE because it need to be isolated against other entry modules.
+(() => {
+// extracted by mini-css-extract-plugin
+
+})();
+
+// This entry need to be wrapped in an IIFE because it need to be isolated against other entry modules.
+(() => {
+// extracted by mini-css-extract-plugin
+
+})();
+
 /******/ })()
 ;
 //# sourceMappingURL=main.bundle.js.map

static/js/lib/business_objects/business_objects.js

@@ -22,7 +22,7 @@ export default class BusinessObjects {
     }
     */
     static getObjectText(objectJson) {
-        return objectJson[objectJson[flagNameAttrOptionText]];
+        return objectJson == null ? '' : objectJson[objectJson[flagNameAttrOptionText]];
     }
     static getListObjectsFromIdDictAndCsv(idDict, idCsv) {
         let listObjects = [];

static/js/lib/business_objects/store/product_permutation.js

@@ -31,4 +31,16 @@ export default class ProductPermutation {
         });
         return preview;
     }
+
+    static getProductVariationsIdCsvFromVariationTypeList(variationTypeList) {
+        let csvVariations = '';
+        if (Validation.isEmpty(variationTypeList)) return csvVariations;
+        variationTypeList.forEach((variationType) => {
+            if (csvVariations.length > 0) {
+                csvVariations += ',';
+            }
+            csvVariations += variationType[attrIdProductVariationType] + ':' + variationType[flagProductVariations][0][attrIdProductVariation];
+        });
+        return csvVariations;
+    }
 }

static/js/lib/validation.js

@@ -151,4 +151,8 @@ export default class Validation {
         img.onerror = function() { callback(false); };
         img.src = url;
     }
+
+    static toFixedOrDefault(value, decimalPlaces, defaultValue = null) {
+        return Validation.isValidNumber(value) ? parseFloat(value).toFixed(decimalPlaces) : defaultValue;
+    }
 }

static/js/pages/base_table.js

@@ -12,6 +12,8 @@ import OverlayConfirm from "../components/common/temporary/overlay_confirm.js";
 import OverlayError from "../components/common/temporary/overlay_error.js";
 
 export default class TableBasePage extends BasePage {
+    // static hash
+    // static attrIdRowObject
     // callFilterTableContent
     // callSaveTableContent
 
@@ -169,7 +171,6 @@ export default class TableBasePage extends BasePage {
             .catch(error => console.error('Error:', error));
     }
     getTableRecords(dirtyOnly = false) {
-        // let table = TableBasePage.getTableMain();
         let records = [];
         let record;
         document.querySelectorAll(idTableMain + ' > tbody > tr').forEach((row) => {
@@ -226,11 +227,11 @@ export default class TableBasePage extends BasePage {
         });
         let countRows = document.querySelectorAll(idTableMain + ' > tbody > tr').length;
         row.setAttribute(this.constructor.attrIdRowObject, -1 - countRows);
-        this.initialiseRowNew(row);
+        this.initialiseRowNew(tbody, row);
         tbody.appendChild(row);
         this.hookupTableMain();
     }
-    initialiseRowNew(row) {
+    initialiseRowNew(tbody, row) {
         if (this.constructor === TableBasePage) {
             throw new Error("Subclass of TableBasePage must implement method initialiseRowNew().");
         }
@@ -257,6 +258,17 @@ export default class TableBasePage extends BasePage {
         });
         _rowBlank.setAttribute(this.constructor.attrIdRowObject, -1 - countRows);
     }
+    initialiseSliderDisplayOrderRowNew(tbody, row) {
+        // let tdSelector = ':scope > tr > td.' + flagDisplayOrder;
+        // let tbody = document.querySelector('table' + (Validation.isEmpty(flagTable) ? '' : '.' + flagTable) + ' > tbody');
+        let slidersDisplayOrder = tbody.querySelectorAll(':scope > tr > td.' + flagDisplayOrder + ' input.' + flagSlider);
+        let maxDisplayOrder = 0;
+        slidersDisplayOrder.forEach((slider) => {
+            maxDisplayOrder = Math.max(maxDisplayOrder, parseFloat(DOM.getElementValueCurrent(slider)));
+        });
+        let sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
+        DOM.setElementValuesCurrentAndPrevious(sliderDisplayOrder, maxDisplayOrder + 1);
+    }
     hookupSlidersDisplayOrderTable() {
         let selectorDisplayOrder = idTableMain + ' tbody tr td.' + flagDisplayOrder + ' input.' + flagSlider + '.' + flagDisplayOrder;
         /*
@@ -362,7 +374,7 @@ export default class TableBasePage extends BasePage {
     */
     handleChangeNestedElementCellTable(event, element) {
         let wasDirtyParentRows = this.getAllIsDirtyRowsInParentTree(element);
-        let wasDirtyElement = DOM.isElementDirty(element);
+        let wasDirtyElement = element.classList.contains(flagDirty);
         let isDirtyElement = DOM.updateAndCheckIsElementDirty(element);
         if (_verbose) { console.log({isDirtyElement, wasDirtyElement, wasDirtyParentRows}); }
         if (isDirtyElement != wasDirtyElement) {
@@ -577,7 +589,6 @@ export default class TableBasePage extends BasePage {
         });
         tdNew.appendChild(ddl);
         let ddlSelector = cellSelector + ' select';
-        debugger;
         ddlHookup(ddlSelector);
     }
     /*
@@ -638,8 +649,8 @@ export default class TableBasePage extends BasePage {
     }
     hookupFieldsProductPermutationVariation() {
         this.hookupPreviewsProductPermutationVariation();
-        this.hookupDdlsProductPermutationVariation();
         this.hookupDdlsProductPermutationVariationType();
+        this.hookupDdlsProductPermutationVariation();
         this.hookupButtonsProductPermutationVariationAddDelete(); 
     }
     hookupPreviewsProductPermutationVariation() {
@@ -826,11 +837,38 @@ export default class TableBasePage extends BasePage {
         tr.appendChild(tdDelete);
         tbody.appendChild(tr);
     }
-    hookupDdlsProductPermutationVariation() {
-        this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariation);
-    }
     hookupDdlsProductPermutationVariationType() {
-        this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariationType);
+        this.hookupTableCellDdls(
+            idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariationType + ' select'
+            , (event, ddlVariationType) => { 
+                this.handleChangeDdlProductVariationOrVariationType(event, ddlVariationType);
+                let idVariationTypeSelected = DOM.getElementValueCurrent(ddlVariationType);
+                let row = DOM.getRowFromElement(ddlVariationType);
+                let tdVariation = row.querySelector('td.' + flagProductVariation);
+                tdVariation.dispatchEvent(new Event('click'));
+                let ddlVariation = row.querySelector('td.' + flagProductVariation + ' select');
+                ddlVariation.innerHTML = '';
+                ddlVariation.appendChild(DOM.createOption(null));
+                let optionJson, option;
+                let variationType = productVariationTypes[idVariationTypeSelected];
+                if (variationType == null) variationType = {
+                    [flagProductVariations]: [],
+                };
+                variationType[flagProductVariations].forEach((variation) => {
+                    optionJson = BusinessObjects.getOptionJsonFromObjectJson(variation);
+                    option = DOM.createOption(optionJson);
+                    ddlVariation.appendChild(option);
+                });
+                this.handleChangeDdlProductVariationOrVariationType(event, ddlVariation);
+            }
+        );
+    }
+    handleChangeDdlProductVariationOrVariationType(event, element) {
+        this.updateProductPermutationVariations(element);
+        this.handleChangeNestedElementCellTable(event, element);
+    }
+    hookupDdlsProductPermutationVariation() {
+        this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariation, (event, ddlVariation) => { this.handleChangeDdlProductVariationOrVariationType(event, ddlVariation); });
     }
     hookupButtonsProductPermutationVariationAddDelete() {
         let selectorButton = idTableMain + ' td.' + flagProductVariations + ' tr.' + flagProductVariation + ' button';
@@ -860,19 +898,20 @@ export default class TableBasePage extends BasePage {
     updateProductPermutationVariations(element) {
         let variationsCell = element.closest('td.' + flagProductVariations);
         let variationPairsString = this.getProductPermutationVariationsText(variationsCell);
-        variationsCell.setAttribute(attrValueCurrent, variationPairsString);
+        DOM.setElementAttributeValueCurrent(variationsCell, variationPairsString);
         DOM.isElementDirty(variationsCell);
     }
     getProductPermutationVariationsText(variationsTd) {
-        let rows = variationsTd.querySelectorAll('tr');
+        let rows = variationsTd.querySelectorAll(':scope tbody tr');
         let variationPairsString = '';
         let ddlVariationType, ddlVariation, idVariationType, idVariation;
         rows.forEach((row, index) => {
-            ddlVariationType = row.querySelector('td select.' + flagProductVariationType);
+            ddlVariationType = row.querySelector(':scope td select.' + flagProductVariationType);
-            ddlVariation = row.querySelector('td select.' + flagProductVariation);
+            ddlVariation = row.querySelector(':scope td select.' + flagProductVariation);
-            idVariationType = ddlVariationType.getAttribute(attrValueCurrent);
+            idVariationType = DOM.getElementValueCurrent(ddlVariationType);
-            idVariation = ddlVariation.getAttribute(attrValueCurrent);
+            idVariation = DOM.getElementValueCurrent(ddlVariation);
-            variationPairsString += idVariationType + ':' + idVariation + ',';
+            if (variationPairsString != '') variationPairsString += ',';
+            variationPairsString += idVariationType + ':' + idVariation;
         });
         return variationPairsString;
     }
@@ -936,7 +975,7 @@ export class PageStoreProductCategories extends TableBasePage {
     hookupFilters() {}
     loadRowTable(rowJson) {}
     getJsonRow(row) {}
-    initialiseRowNew(row) {}
+    initialiseRowNew(tbody, row) {}
     hookupTableMain() {}
     isDirtyRow(row) {}
     leave() {}

static/js/pages/store/manufacturing_purchase_orders.js

@@ -83,8 +83,8 @@ export default class PageStoreManufacturingPurchaseOrders extends TableBasePage
 
         return jsonRow;
     }
-    initialiseRowNew(row) {
+    initialiseRowNew(tbody, row) {
-        super.initialiseRowNew(row);
+        super.initialiseRowNew(tbody, row);
     }
 
     hookupTableMain() {

static/js/pages/store/product_categories.js

@@ -84,15 +84,9 @@ export default class PageStoreProductCategories extends TableBasePage {
         jsonCategory[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(sliderDisplayOrder);
         return jsonCategory;
     }
-    initialiseRowNew(row) {
+    initialiseRowNew(tbody, row) {
         if (row == null) return;
-        let slidersDisplayOrder = document.querySelectorAll('td.' + flagDisplayOrder + ' input.' + flagSlider);
+        this.initialiseSliderDisplayOrderRowNew(tbody, row);
-        let maxDisplayOrder = 0;
-        slidersDisplayOrder.forEach((slider) => {
-            maxDisplayOrder = Math.max(maxDisplayOrder, parseFloat(DOM.getElementValueCurrent(slider)));
-        });
-        let sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
-        DOM.setElementValuesCurrentAndPrevious(sliderDisplayOrder, maxDisplayOrder + 1);
     }
 
     hookupTableMain() {

static/js/pages/store/product_permutations.js

@@ -176,7 +176,7 @@ export default class PageStoreProductPermutations extends TableBasePage {
         jsonRow[flagActive] = checkboxActive.getAttribute(attrValueCurrent);
         return jsonRow;
     }
-    initialiseRowNew(row) {
+    initialiseRowNew(tbody, row) {
         let ddlCategoryFilter = document.querySelector(idFormFilters + ' #' + attrIdProductCategory);
         let idProductCategoryFilter = DOM.getElementValueCurrent(ddlCategoryFilter);
         let hasCategoryFilter = !(Validation.isEmpty(idProductCategoryFilter) || idProductCategoryFilter == '0');

static/js/pages/store/product_variations.js

@@ -10,7 +10,7 @@ import StoreTableMixinPage from "./mixin_table.js";
 
 export default class PageStoreProductVariations extends TableBasePage {
     static hash = hashPageStoreProductVariations;
-    static attrIdRowObject = attrIdProductVariation;
+    static attrIdRowObject = attrIdProductVariationType;
     callFilterTableContent = API.getProductVariationsByFilters;
     callSaveTableContent = API.saveProductVariations;
 
@@ -82,8 +82,9 @@ export default class PageStoreProductVariations extends TableBasePage {
 
         return jsonRow;
     }
-    initialiseRowNew(row) {
+    initialiseRowNew(tbody, row) {
-        super.initialiseRowNew(row);
+        super.initialiseRowNew(tbody, row);
+        this.initialiseSliderDisplayOrderRowNew(tbody, row);
     }
 
     hookupTableMain() {
@@ -106,20 +107,20 @@ export default class PageStoreProductVariations extends TableBasePage {
         this.hookupFieldsProductVariationActive();
     }
     hookupProductVariationsPreviews() {
-        this.hookupEventHandler("click", idTableMain + ' td.' + flagProductVariations, (event, td) => {
+        this.hookupEventHandler("click", idTableMain + ' td.' + flagProductVariations + ' div', (event, element) => {
+            let td = DOM.getCellFromElement(element);
             if (!td.classList.contains(flagCollapsed)) return;
-            this.handleClickProductVariationsPreview(event, td);
+            this.handleClickProductVariationsPreview(event, element);
         });
     }
     handleClickProductVariationsPreview(event, element) {
         if (_verbose) { console.log("click order items preview"); }
-        this.toggleColumnHeaderCollapsed(flagProductVariations, false);
-        element.classList.remove(flagCollapsed);
-
         let row = DOM.getRowFromElement(element);
         let idProductVariationType = row.getAttribute(attrIdProductVariationType);
-        if (idProductVariationType == null || idProductVariationType < 1) return;
         let productVariationType = productVariationTypes[idProductVariationType];
+        if (productVariationType == null) productVariationType = {
+            [flagProductVariations]: [],
+        };
         let tblProductVariations = document.createElement("table");
         tblProductVariations.classList.add(flagProductVariations);
         let thead = document.createElement("thead");
@@ -159,8 +160,10 @@ export default class PageStoreProductVariations extends TableBasePage {
         let cell = DOM.getCellFromElement(element);
         let cellNew = cell.cloneNode(false);
         cellNew.appendChild(tblProductVariations);
+        cellNew.classList.remove(flagCollapsed);
         row.replaceChild(cellNew, cell);
         if (_verbose) { console.log("tblProductVariations: ", tblProductVariations); }
+        this.toggleColumnHeaderCollapsed(flagProductVariations, false);
         this.hookupFieldsProductVariation();
     }
     addRowProductVariation(tbody, productVariation) {

static/js/pages/store/products.js

@@ -87,15 +87,9 @@ export default class PageStoreProducts extends TableBasePage {
         jsonProduct[flagDisplayOrder] = DOM.getElementAttributeValueCurrent(sliderDisplayOrder);
         return jsonProduct;
     }
-    initialiseRowNew(row) {
+    initialiseRowNew(tbody, row) {
         if (row == null) return;
-        let slidersDisplayOrder = document.querySelectorAll('td.' + flagDisplayOrder + ' input.' + flagSlider);
+        this.initialiseSliderDisplayOrderRowNew(tbody, row);
-        let maxDisplayOrder = 0;
-        slidersDisplayOrder.forEach((slider) => {
-            maxDisplayOrder = Math.max(maxDisplayOrder, parseFloat(DOM.getElementValueCurrent(slider)));
-        });
-        let sliderDisplayOrder = row.querySelector('td.' + flagDisplayOrder + ' .' + flagSlider);
-        DOM.setElementValuesCurrentAndPrevious(sliderDisplayOrder, maxDisplayOrder + 1);
     }
 
     hookupTableMain() {

static/js/pages/store/stock_items.js

@@ -107,8 +107,8 @@ export default class PageStoreStockItems extends TableBasePage {
         jsonRow[flagActive] = checkboxActive.getAttribute(attrValueCurrent);
         return jsonRow;
     }
-    initialiseRowNew(row) {
+    initialiseRowNew(tbody, row) {
-        super.initialiseRowNew(row);
+        super.initialiseRowNew(tbody, row);
         let ddlCategoryFilter = document.querySelector(idFormFilters + ' #' + attrIdProductCategory);
         let idProductCategoryFilter = DOM.getElementValueCurrent(ddlCategoryFilter);
         let hasCategoryFilter = !(Validation.isEmpty(idProductCategoryFilter) || idProductCategoryFilter == '0');

static/js/pages/store/supplier_purchase_orders.js

@@ -87,8 +87,8 @@ export default class PageStoreSupplierPurchaseOrders extends TableBasePage {
 
         return jsonRow;
     }
-    initialiseRowNew(row) {
+    initialiseRowNew(tbody, row) {
-        super.initialiseRowNew(row);
+        super.initialiseRowNew(tbody, row);
     }
 
     hookupTableMain() {
@@ -123,20 +123,27 @@ export default class PageStoreSupplierPurchaseOrders extends TableBasePage {
         this.hookupFieldsOrderItemAddDelete();
     }
     hookupOrderItemsPreviews() {
-        this.hookupEventHandler("click", idTableMain + ' td.' + flagOrderItems, (event, td) => {
+        this.hookupEventHandler("click", idTableMain + ' > tbody > tr > td.' + flagOrderItems + ' > div', (event, div) => {
+            let td = DOM.getCellFromElement(div);
             if (!td.classList.contains(flagCollapsed)) return;
-            this.handleClickOrderItemsPreview(event, td);
+            this.handleClickOrderItemsPreview(event, div);
         });
     }
     handleClickOrderItemsPreview(event, element) {
         if (_verbose) { console.log("click order items preview"); }
         this.toggleColumnHeaderCollapsed(flagOrderItems, false);
-        element.classList.remove(flagCollapsed);
+        /*
+        let td = DOM.getCellFromElement(element);
+        td.classList.remove(flagCollapsed);
+        */
 
         let row = DOM.getRowFromElement(element);
         let idSupplierPurchaseOrder = row.getAttribute(attrIdSupplierPurchaseOrder);
-        if (idSupplierPurchaseOrder == null || idSupplierPurchaseOrder < 1) return;
+        // if (idSupplierPurchaseOrder == null || idSupplierPurchaseOrder < 1) return;
         let supplierPurchaseOrder = supplierPurchaseOrders[idSupplierPurchaseOrder];
+        if (supplierPurchaseOrder == null) supplierPurchaseOrder = {
+            [flagOrderItems]: [],
+        };
         let tblOrderItems = document.createElement("table");
         tblOrderItems.classList.add(flagOrderItems);
         let thead = document.createElement("thead");
@@ -215,6 +222,7 @@ export default class PageStoreSupplierPurchaseOrders extends TableBasePage {
         let cell = DOM.getCellFromElement(element);
         let cellNew = cell.cloneNode(false);
         cellNew.appendChild(tblOrderItems);
+        cellNew.classList.remove(flagCollapsed);
         row.replaceChild(cellNew, cell);
         if (_verbose) { console.log("tblOrderItems: ", tblOrderItems); }
         this.hookupOrderItemsFields();
@@ -256,10 +264,10 @@ export default class PageStoreSupplierPurchaseOrders extends TableBasePage {
         let tdVariations = document.createElement("td");
         tdVariations.classList.add(flagProductVariations);
         tdVariations.classList.add(flagCollapsed);
-        DOM.setElementAttributesValuesCurrentAndPrevious(tdVariations, orderItem[attrIdProductVariation]);
+        DOM.setElementAttributesValuesCurrentAndPrevious(tdVariations, orderItem[flagProductVariations]);
         let divVariations = document.createElement("div");
         divVariations.classList.add(flagProductVariations);
-        DOM.setElementAttributesValuesCurrentAndPrevious(divVariations, orderItem[attrIdProductVariation]);
+        DOM.setElementAttributesValuesCurrentAndPrevious(divVariations, orderItem[flagProductVariations]);
         // divVariations.textContent = orderItem[flagProductVariations];
         let variationsText = ProductPermutation.getProductVariationsPreviewFromIdCsv(orderItem[flagProductVariations]);
         divVariations.textContent = variationsText;
@@ -313,14 +321,14 @@ export default class PageStoreSupplierPurchaseOrders extends TableBasePage {
         tdCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
         let divCostUnitLocalVatExcl = document.createElement("div");
         divCostUnitLocalVatExcl.classList.add(flagCostUnitLocalVatExcl);
-        DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatExcl, orderItem[flagCostUnitLocalVatExcl].toFixed(3));
+        DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatExcl, Validation.toFixedOrDefault(orderItem[flagCostUnitLocalVatExcl], 3, null));
         tdCostUnitLocalVatExcl.appendChild(divCostUnitLocalVatExcl);
 
         let tdCostUnitLocalVatIncl = document.createElement("td");
         tdCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
         let divCostUnitLocalVatIncl = document.createElement("div");
         divCostUnitLocalVatIncl.classList.add(flagCostUnitLocalVatIncl);
-        DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatIncl, orderItem[flagCostUnitLocalVatIncl].toFixed(3));
+        DOM.setElementValuesCurrentAndPrevious(divCostUnitLocalVatIncl, Validation.toFixedOrDefault(orderItem[flagCostUnitLocalVatIncl], 3, null));
         tdCostUnitLocalVatIncl.appendChild(divCostUnitLocalVatIncl);
 
         let tdLatencyDeliveryDays = document.createElement("td");
@@ -384,13 +392,13 @@ export default class PageStoreSupplierPurchaseOrders extends TableBasePage {
     hookupFieldsOrderItemProductVariations() {
         this.hookupEventHandler("click", idTableMain + ' td.' + flagOrderItems + ' td.' + flagProductVariations, (event, element) => this.handleClickProductPermutationVariationsPreview(event, element));
     }
-    */
     hookupDdlsProductPermutationVariation() {
         this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariation);
     }
     hookupDdlsProductPermutationVariationType() {
         this.hookupTableCellDdls(idTableMain + ' td.' + flagProductVariations + ' td.' + flagProductVariationType);
     }
+    */
     hookupFieldsOrderItemUnitQuantity() {
         this.hookupTableCellDdlPreviews(
             idTableMain + ' td.' + flagOrderItems + ' td.' + flagUnitMeasurementQuantity

static/js/pages/store/suppliers.js

@@ -85,8 +85,8 @@ export default class PageStoreSuppliers extends TableBasePage {
         });
         return supplierAddresses;
     }
-    initialiseRowNew(row) {
+    initialiseRowNew(tbody, row) {
-        super.initialiseRowNew(row);
+        super.initialiseRowNew(tbody, row);
     }
 
     hookupTableMain() {

webpack.config.js

@@ -11,6 +11,8 @@ module.exports = {
       path.resolve(__dirname, 'static/css/components/card.css'),
       path.resolve(__dirname, 'static/css/components/dialog.css'),
       path.resolve(__dirname, 'static/css/components/form.css'),
+      path.resolve(__dirname, 'static/css/components/image.css'),
+      path.resolve(__dirname, 'static/css/components/label.css'),
       path.resolve(__dirname, 'static/css/components/modal.css'),
       path.resolve(__dirname, 'static/css/components/navigation.css'),
       path.resolve(__dirname, 'static/css/components/overlay.css'),