Add tabs to part detail view

- Currently each "tab" reloads the entire page but with the new tab selected
- We could use bootstrap js to do this without reloading (load ALL part data)

InvenTree/part/templates/base.html

@@ -10,8 +10,16 @@
 
 <!-- Bootstrap CSS -->
 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous">
+
+<!-- Local stylesheet -->
 <link rel="stylesheet" href="{% static 'css/inventree.css' %}">
 
+<!-- Bootstrap javascript -->
+<!--
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
+<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
+-->
+
 <title>
 {% block title %}
 InvenTree

InvenTree/part/templates/part/bom.html

@@ -2,6 +2,8 @@
 
 {% block details %}
 
+{% include 'part/tabs.html' with tab='bom' %}
+
 <table>
 <tr>
     <th>Part</th>

InvenTree/part/templates/part/detail.html

@@ -2,25 +2,9 @@
 
 {% block details  %}
 
-<br>
-<a href="{% url 'part-bom' part.id %}">There are <b>{{ part.bomItemCount }}</b> BOM items for this part.</a>
-<br>
-Used in {{ part.usedInCount }} other parts.<br>
+{% include 'part/tabs.html' with tab='detail' %}
 
-<a href="{% url 'part-stock' part.id %}">There are {{ part.stock }} units in stock.</a>
 
-<br>
-{% if part.supplier_parts.all|length > 0 %}
-This part is available from <a href="{% url 'part-suppliers' part.id %}">{{ part.supplier_parts.all|length }} suppliers</a>.
-{% else %}
-There are no suppliers defined for this part.
-{% endif %}
-
-<br><br>
-{% if part.trackable %}
-<a href="{% url 'part-track' part.id %}">Part tracking</a>
-{% else %}
-{{ part.name }} does not have part tracking enabled
-{% endif %}
+Part details go here...
 
 {% endblock %}

InvenTree/part/templates/part/index.html

@@ -7,11 +7,13 @@
 {% if children|length > 0 %}
 <table>
     <tr>
-        <th>Subcategories</th>
+        <th>Subcategory</th>
+        <th>Description</th>
     </tr>
 {% for child in children %}
 <tr>
     <td><a href="/part/list/?category={{ child.id }}">{{ child.name }}</a></td>
+    <td>{{ child.description }}</td>
 {% endfor %}
 </table>
 {% endif %}

InvenTree/part/templates/part/stock.html

@@ -2,6 +2,8 @@
 
 {% block details %}
 
+{% include 'part/tabs.html' with tab='stock' %}
+
 <br>
 Total in stock: {{ part.stock }}
 <br>

InvenTree/part/templates/part/supplier.html

@@ -2,6 +2,8 @@
 
 {% block details %}
 
+{% include 'part/tabs.html' with tab='suppliers' %}
+
 {% if part.supplier_parts.all|length > 0 %}
 <table>
 <tr>

InvenTree/part/templates/part/tabs.html

@@ -0,0 +1,12 @@
+<ul class="nav nav-tabs">
+    <li{% ifequal tab 'detail' %} class="active"{% endifequal %}><a href="{% url 'part-detail' part.id %}">Details</a></li>
+    <li{% ifequal tab 'bom' %} class="active"{% endifequal %}><a href="{% url 'part-bom' part.id %}">BOM ({{ part.bomItemCount }})</a></li>
+    {% if part.usedInCount > 0 %}
+    <li{% ifequal tab 'used' %} class="active"{% endifequal %}><a href="{% url 'part-used-in' part.id %}">Used In ({{ part.usedInCount }})</a></li>
+    {% endif %}
+    <li{% ifequal tab 'stock' %} class="active"{% endifequal %}><a href="{% url 'part-stock' part.id %}">Stock ({{ part.stock }})</a></li>
+    <li{% ifequal tab 'suppliers' %} class="active"{% endifequal %}><a href="{% url 'part-suppliers' part.id %}">Suppliers ({{ part.supplier_parts.all|length }})</a></li>
+    {% if part.trackable %}
+    <li{% ifequal tab 'track' %} class="active"{% endifequal %}><a href="{% url 'part-track' part.id %}">Tracking</a></li>
+    {% endif %}
+</ul>

InvenTree/part/templates/part/track.html

@@ -2,6 +2,8 @@
 
 {% block details %}
 
+{% include 'part/tabs.html' with tab='track' %}
+
 Part tracking for {{ part.name }}
 
 <table>

InvenTree/part/templates/part/used_in.html

@@ -0,0 +1,22 @@
+{% extends "part/part_base.html" %}
+
+{% block details %}
+
+{% include 'part/tabs.html' with tab='used' %}
+
+This part is used to make the following parts:
+
+<table>
+<tr>
+    <th>Part</th>
+    <th>Description</th>
+</tr>
+{% for item in part.used_in.all %}
+<tr>
+    <td><a href="{% url 'part-detail' item.part.id %}">{{ item.part.name }}</a></td>
+    <td>{{ item.part.description }}</td>
+</tr>
+{% endfor %}
+</table>
+
+{% endblock %}

InvenTree/part/urls.py

@@ -42,6 +42,7 @@ part_detail_urls = [
     url(r'^track/?', views.track, name='part-track'),
     url(r'^bom/?', views.bom, name='part-bom'),
     url(r'^stock/?', views.stock, name='part-stock'),
+    url(r'^used/?', views.used, name='part-used-in'),
     url(r'^suppliers/?', views.suppliers, name='part-suppliers'),
     url('', views.detail, name='part-detail'),
 ]

InvenTree/part/views.py

@@ -54,6 +54,11 @@ def bom(request, pk):
 
     return render(request, 'part/bom.html', {'part': part})
 
+def used(request, pk):
+    part = get_object_or_404(Part, pk=pk)
+
+    return render(request, 'part/used_in.html', {'part': part})
+
 def stock(request, pk):
     part = get_object_or_404(Part, pk=pk)