Refactor PurchaseOrder display

InvenTree/order/templates/order/order_notes.html

@@ -1,54 +0,0 @@
-{% extends "order/order_base.html" %}
-
-{% load inventree_extras %}
-{% load i18n %}
-{% load static %}
-{% load markdownify %}
-
-{% block menubar %}
-{% include 'order/po_navbar.html' with tab='notes' %}
-{% endblock %}
-
-{% block heading %}
-{% trans "Order Notes" %}
-{% if roles.purchase_order.change and not editing %}
-<button title='{% trans "Edit notes" %}' class='btn btn-default' id='edit-notes'><span class='fas fa-edit'></span></button>
-{% endif %}
-{% endblock %}
-
-{% block details %}
-
-{% if editing %}
-<form method='POST'>
-    {% csrf_token %}
-
-    {{ form }}
-    <hr>
-    <button type="submit" class='btn btn-default'>{% trans "Save" %}</button>
-</form>
-
-{{ form.media }}
-
-{% else %}
-
-<div class='panel panel-default'>
-    <div class='panel-content'>
-        {{ order.notes | markdownify }}
-    </div>
-</div>
-{% endif %}
-
-{% endblock %}
-
-{% block js_ready %}
-
-{{ block.super }}
-
-{% if editing %}
-{% else %}
-$("#edit-notes").click(function() {
-    location.href = "{% url 'po-notes' order.id %}?edit=1";
-});
-{% endif %}
-
-{% endblock %}

InvenTree/order/templates/order/po_attachments.html

@@ -1,83 +0,0 @@
-{% extends "order/order_base.html" %}
-
-{% load inventree_extras %}
-{% load i18n %}
-{% load static %}
-
-{% block menubar %}
-{% include 'order/po_navbar.html' with tab='attachments' %}
-{% endblock %}
-
-{% block heading %}
-{% trans "Purchase Order Attachments" %}
-{% endblock %}
-
-{% block details %}
-{% include "attachment_table.html" with attachments=order.attachments.all %}
-
-{% endblock %}
-
-{% block js_ready %}
-{{ block.super }}
-
-enableDragAndDrop(
-    '#attachment-dropzone',
-    '{% url "api-po-attachment-list" %}',
-    {
-        data: {
-            order: {{ order.id }},
-        },
-        label: 'attachment',
-        success: function(data, status, xhr) {
-            location.reload();
-        }
-    }
-);
-
-loadAttachmentTable(
-    '{% url "api-po-attachment-list" %}',
-    {
-        filters: {
-            order: {{ order.pk }},
-        },
-        onEdit: function(pk) {
-            var url = `/api/order/po/attachment/${pk}/`;
-
-            constructForm(url, {
-                fields: {
-                    comment: {},
-                },
-                onSuccess: reloadAttachmentTable,
-                title: '{% trans "Edit Attachment" %}',
-            });
-        },
-        onDelete: function(pk) {
-
-            constructForm(`/api/order/po/attachment/${pk}/`, {
-                method: 'DELETE',
-                confirmMessage: '{% trans "Confirm Delete Operation" %}',
-                title: '{% trans "Delete Attachment" %}',
-                onSuccess: reloadAttachmentTable,
-            });
-        }
-    }
-);
-
-$("#new-attachment").click(function() {
-
-    constructForm('{% url "api-po-attachment-list" %}', {
-        method: 'POST',
-        fields: {
-            attachment: {},
-            comment: {},
-            order: {
-                value: {{ order.pk }},
-                hidden: true,
-            },
-        },
-        reload: true,
-        title: '{% trans "Add Attachment" %}',
-    });
-});
-
-{% endblock %}

InvenTree/order/templates/order/po_navbar.html

@@ -9,34 +9,34 @@
             <span class='menu-tab-icon fas fa-expand-arrows-alt'></span>
         </a>
     </li>
-    <li class='list-group-item {% if tab == "details" %}active{% endif %}' title='{% trans "Purchase Order Details" %}'>
+    <li class='list-group-item' title='{% trans "Purchase Order Line Items" %}'>
-        <a href='{% url "po-detail" order.id %}'>
+        <a href='#' id='select-order-items' class='nav-toggle'>
-            <span class='fas fa-info-circle side-icon'></span>
+            <span class='fas fa-list-ol side-icon'></span>
-            {% trans "Details" %}
+            {% trans "Order Items" %}
         </a>
     </li>
     {% if order.status == PurchaseOrderStatus.PENDING and roles.purchase_order.change %}
-    <li class='list-group-item {% if tab == "upload" %}active{% endif %}' title='{% trans "Upload File" %}'>
+    <li class='list-group-item' title='{% trans "Upload File" %}'>
         <a href='{% url "po-upload" order.id %}'>
             <span class='fas fa-file-upload side-icon'></span>
             {% trans "Upload File" %}
         </a>
     </li>
     {% endif %}
-    <li class='list-group-item {% if tab == "received" %}active{% endif %}' title='{% trans "Received Stock Items" %}'>
+    <li class='list-group-item' title='{% trans "Received Stock Items" %}'>
-        <a href='{% url "po-received" order.id %}'>
+        <a href='#' id='select-received-items' class='nav-toggle'>
             <span class='fas fa-sign-in-alt side-icon'></span>
             {% trans "Received Items" %}
         </a>
     </li>
-    <li class='list-group-item {% if tab == "attachments" %}active{% endif %}' title='{% trans "Purchase Order Attachments" %}'>
+    <li class='list-group-item' title='{% trans "Purchase Order Attachments" %}'>
-        <a href='{% url "po-attachments" order.id %}'>
+        <a href='#' id='select-order-attachments' class='nav-toggle'>
             <span class='fas fa-paperclip side-icon'></span>
             {% trans "Attachments" %}
         </a>
     </li>
-    <li class='list-group-item {% if tab == "notes" %}active{% endif %}' title='{% trans "Notes" %}'>
+    <li class='list-group-item' title='{% trans "Notes" %}'>
-        <a href='{% url "po-notes" order.id %}'>
+        <a href='#' id='select-order-notes' class='nav-toggle'>
             <span class='fas fa-clipboard side-icon'></span>
             {% trans "Notes" %}
         </a>

InvenTree/order/templates/order/po_received_items.html

@@ -1,37 +0,0 @@
-{% extends "order/order_base.html" %}
-
-{% load inventree_extras %}
-{% load i18n %}
-{% load static %}
-
-{% block menubar %}
-{% include 'order/po_navbar.html' with tab='received' %}
-{% endblock %}
-
-{% block heading %}
-{% trans "Received Items" %}
-{% endblock %}
-
-{% block details %}
-
-{% include "stock_table.html" with read_only=True %}
-
-{% endblock %}
-
-{% block js_ready %}
-{{ block.super }}
-
-loadStockTable($("#stock-table"), {
-    params: {
-        purchase_order: {{ order.id }},
-        part_detail: true,
-        supplier_part_detail: true,
-        location_detail: true,
-    },
-    buttons: [
-        '#stock-options',
-    ],
-    filterkey: "postock"
-});
-
-{% endblock %}

InvenTree/order/templates/order/purchase_order_detail.html

@@ -4,20 +4,20 @@
 {% load status_codes %}
 {% load i18n %}
 {% load static %}
+{% load markdownify %}
 
 {% block menubar %}
 {% include 'order/po_navbar.html' with tab='details' %}
 
 {% endblock %}
 
-{% block heading %}
+{% block page_content %}
-{% trans "Purchase Order Items" %}
-{% endblock %}
-
-
-{% block details %}
-
 
+<div class='panel panel-default panel-inventree panel-hidden' id='panel-order-items'>
+    <div class='panel-heading'>
+        <h4>{% trans "Purchase Order Items" %}</h4>
+    </div>
+    <div class='panel-content'>
         <div id='order-toolbar-buttons' class='btn-group' style='float: right;'>
             {% if order.status == PurchaseOrderStatus.PENDING and roles.purchase_order.change %}
             <button type='button' class='btn btn-primary' id='new-po-line'>
@@ -26,9 +26,49 @@
             {% endif %}
         </div>
         
-
         <table class='table table-striped table-condensed' id='po-table' data-toolbar='#order-toolbar-buttons'>
         </table>
+    </div>
+</div>
+
+<div class='panel panel-default panel-inventree panel-hidden' id='panel-received-items'>
+    <div class='panel-heading'>
+        <h4>{% trans "Received Items" %}</h4>
+    </div>
+    <div class='panel-content'>
+        {% include "stock_table.html" with read_only=True %}
+    </div>
+</div>
+
+<div class='panel panel-default panel-inventree panel-hidden' id='panel-order-attachments'>
+    <div class='panel-heading'>
+        <h4>{% trans "Purchase Order Attachments" %}</h4>
+    </div>
+    <div class='panel-content'>
+        {% include "attachment_table.html" %}
+    </div>
+</div>
+
+<div class='panel panel-default panel-inventree panel-hidden' id='panel-order-notes'>
+    <div class='panel-heading'>
+        <div class='row'>
+            <div class='col-sm-6'>
+                <h4>{% trans "Order Notes" %}</h4>
+            </div>
+            <div class='col-sm-6'>
+                <div class='btn-group float-right'>
+                    <button type='button' id='edit-notes' title='{% trans "Edit Notes" %}' class='btn btn-small btn-default'>
+                        <span class='fas fa-edit'>      
+                        </span>
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class='panel-content'>
+        {{ order.notes | markdownify }}
+    </div>
+</div>
 
 {% endblock %}
 
@@ -36,6 +76,91 @@
 
 {{ block.super }}
 
+    $('#edit-notes').click(function() {
+        constructForm('{% url "api-po-detail" order.pk %}', {
+            fields: {
+                notes: {
+                    multiline: true,
+                }
+            },
+            title: '{% trans "Edit Notes" %}',
+            reload: true,
+        });
+    });
+
+    enableDragAndDrop(
+        '#attachment-dropzone',
+        '{% url "api-po-attachment-list" %}',
+        {
+            data: {
+                order: {{ order.id }},
+            },
+            label: 'attachment',
+            success: function(data, status, xhr) {
+                location.reload();
+            }
+        }
+    );
+
+    loadAttachmentTable(
+        '{% url "api-po-attachment-list" %}',
+        {
+            filters: {
+                order: {{ order.pk }},
+            },
+            onEdit: function(pk) {
+                var url = `/api/order/po/attachment/${pk}/`;
+
+                constructForm(url, {
+                    fields: {
+                        comment: {},
+                    },
+                    onSuccess: reloadAttachmentTable,
+                    title: '{% trans "Edit Attachment" %}',
+                });
+            },
+            onDelete: function(pk) {
+
+                constructForm(`/api/order/po/attachment/${pk}/`, {
+                    method: 'DELETE',
+                    confirmMessage: '{% trans "Confirm Delete Operation" %}',
+                    title: '{% trans "Delete Attachment" %}',
+                    onSuccess: reloadAttachmentTable,
+                });
+            }
+        }
+    );
+
+    $("#new-attachment").click(function() {
+
+        constructForm('{% url "api-po-attachment-list" %}', {
+            method: 'POST',
+            fields: {
+                attachment: {},
+                comment: {},
+                order: {
+                    value: {{ order.pk }},
+                    hidden: true,
+                },
+            },
+            reload: true,
+            title: '{% trans "Add Attachment" %}',
+        });
+    });
+
+    loadStockTable($("#stock-table"), {
+        params: {
+            purchase_order: {{ order.id }},
+            part_detail: true,
+            supplier_part_detail: true,
+            location_detail: true,
+        },
+        buttons: [
+            '#stock-options',
+        ],
+        filterkey: "postock"
+    });
+
 {% if order.status == PurchaseOrderStatus.PENDING %}
 $('#new-po-line').click(function() {
 
@@ -301,4 +426,9 @@ $("#po-table").inventreeTable({
     ]
 });
 
+    attachNavCallbacks({
+        name: 'purchase-order',
+        default: 'order-items'
+    });
+
 {% endblock %}

InvenTree/order/templates/order/sales_order_detail.html

@@ -51,7 +51,7 @@
     <div class='panel-heading'>
         <div class='row'>
             <div class='col-sm-6'>
-                <h4>{% trans "Notes" %}</h4>
+                <h4>{% trans "Order Notes" %}</h4>
             </div>
             <div class='col-sm-6'>
                 <div class='btn-group float-right'>

InvenTree/order/templates/order/so_navbar.html

@@ -9,28 +9,28 @@
         </a>
     </li>
 
-    <li class='list-group-item nav-item' title='{% trans "Sales Order Line Items" %}'>
+    <li class='list-group-item' title='{% trans "Sales Order Line Items" %}'>
         <a href='#' id='select-order-items' class='nav-toggle'>
             <span class='fas fa-list-ol sidebar-icon'></span>
             {% trans "Order Items" %}
         </a>
     </li>
 
-    <li class='list-group-item nav-item' title='{% trans "Build Orders" %}'>
+    <li class='list-group-item' title='{% trans "Build Orders" %}'>
         <a href='#' id='select-order-builds' class='nav-toggle'>
             <span class='fas fa-tools sidebar-icon'></span>
             {% trans "Build Orders" %}
         </a>
     </li>
 
-    <li class='list-group-item nav-item' title='{% trans "Sales Order Attachments" %}'>
+    <li class='list-group-item' title='{% trans "Sales Order Attachments" %}'>
         <a href='#' id='select-order-attachments' class='nav-toggle'>
             <span class='fas fa-paperclip sidebar-icon'></span>
             {% trans "Attachments" %}
         </a>
     </li>
 
-    <li class='list-group-item nav-item' title='{% trans "Notes" %}'>
+    <li class='list-group-item' title='{% trans "Notes" %}'>
         <a href='#' id='select-order-notes' class='nav-toggle'>
             <span class='fas fa-clipboard sidebar-icon'></span>
             {% trans "Notes" %}

InvenTree/order/urls.py

@@ -19,10 +19,6 @@ purchase_order_detail_urls = [
     url(r'^upload/', views.PurchaseOrderUpload.as_view(), name='po-upload'),
     url(r'^export/', views.PurchaseOrderExport.as_view(), name='po-export'),
 
-    url(r'^notes/', views.PurchaseOrderNotes.as_view(), name='po-notes'),
-
-    url(r'^received/', views.PurchaseOrderDetail.as_view(template_name='order/po_received_items.html'), name='po-received'),
-    url(r'^attachments/', views.PurchaseOrderDetail.as_view(template_name='order/po_attachments.html'), name='po-attachments'),
     url(r'^.*$', views.PurchaseOrderDetail.as_view(), name='po-detail'),
 ]
 

InvenTree/order/views.py

@@ -13,7 +13,7 @@ from django.core.exceptions import ValidationError
 from django.urls import reverse
 from django.http import HttpResponseRedirect
 from django.utils.translation import ugettext_lazy as _
-from django.views.generic import DetailView, ListView, UpdateView
+from django.views.generic import DetailView, ListView
 from django.views.generic.edit import FormMixin
 from django.forms import HiddenInput, IntegerField
 
@@ -97,31 +97,6 @@ class SalesOrderDetail(InvenTreeRoleMixin, DetailView):
     template_name = 'order/sales_order_detail.html'
 
 
-class PurchaseOrderNotes(InvenTreeRoleMixin, UpdateView):
-    """ View for updating the 'notes' field of a PurchaseOrder """
-
-    context_object_name = 'order'
-    template_name = 'order/order_notes.html'
-    model = PurchaseOrder
-
-    # Override the default permission roles
-    role_required = 'purchase_order.view'
-
-    fields = ['notes']
-
-    def get_success_url(self):
-
-        return reverse('po-notes', kwargs={'pk': self.get_object().id})
-
-    def get_context_data(self, **kwargs):
-
-        ctx = super().get_context_data(**kwargs)
-
-        ctx['editing'] = str2bool(self.request.GET.get('edit', False))
-
-        return ctx
-
-
 class PurchaseOrderCancel(AjaxUpdateView):
     """ View for cancelling a purchase order """
 

InvenTree/templates/js/nav.js

@@ -24,7 +24,7 @@ function attachNavCallbacks(options={}) {
     var panelClass = options.name || 'unknown';
 
     // Look for a default panel to initialize
-    var defaultPanel = localStorage.getItem(`selected-panel-${panelClass}`) || options.default;
+    var defaultPanel = localStorage.getItem(`inventree-selected-panel-${panelClass}`) || options.default;
 
     if (defaultPanel) {
         activatePanel(defaultPanel);
@@ -37,7 +37,7 @@ function activatePanel(panelName, options={}) {
     var panelClass = options.name || 'unknown';
 
     // Save the selected panel
-    localStorage.setItem(`selected-panel-${panelClass}`, panelName);
+    localStorage.setItem(`inventree-selected-panel-${panelClass}`, panelName);
 
     // First, cause any other panels to "fade out"
     $('.panel-visible').hide();
@@ -48,13 +48,13 @@ function activatePanel(panelName, options={}) {
 
     // Display the panel
     $(panel).addClass('panel-visible');
-    $(panel).fadeIn(50);
+    $(panel).fadeIn(100);
 
     // Un-select all selectors
-    $('.nav-item').removeClass('active');
+    $('.list-group-item').removeClass('active');
 
     // Find the associated selector
     var select = `#select-${panelName}`;
 
-    $(select).parent('.nav-item').addClass('active');
+    $(select).parent('.list-group-item').addClass('active');
 }