mirror of
https://github.com/inventree/InvenTree
synced 2024-08-30 18:33:04 +00:00
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)
This commit is contained in:
Oliver
parent
830d33763e
commit
0e2c5e6af5
@ -17,6 +17,8 @@ from supplier.urls import supplier_urls
|
||||
from django.conf import settings
|
||||
from django.conf.urls.static import static
|
||||
|
||||
from django.views.generic.base import RedirectView
|
||||
|
||||
#from project.urls import prj_urls, prj_part_urls, prj_cat_urls, prj_run_urls
|
||||
#from track.urls import unique_urls, part_track_urls
|
||||
|
||||
@ -83,4 +85,7 @@ urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
|
||||
|
||||
if settings.DEBUG:
|
||||
# Media file access
|
||||
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
|
||||
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
|
||||
|
||||
# Send any unknown URLs to the parts page
|
||||
urlpatterns += [url(r'^.*$', RedirectView.as_view(url='part/', permanent=False), name='part-index')]
|
||||
@ -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
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
|
||||
{% block details %}
|
||||
|
||||
{% include 'part/tabs.html' with tab='bom' %}
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<th>Part</th>
|
||||
|
||||
@ -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 %}
|
||||
@ -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 %}
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
|
||||
{% block details %}
|
||||
|
||||
{% include 'part/tabs.html' with tab='stock' %}
|
||||
|
||||
<br>
|
||||
Total in stock: {{ part.stock }}
|
||||
<br>
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
|
||||
{% block details %}
|
||||
|
||||
{% include 'part/tabs.html' with tab='suppliers' %}
|
||||
|
||||
{% if part.supplier_parts.all|length > 0 %}
|
||||
<table>
|
||||
<tr>
|
||||
|
||||
12
InvenTree/part/templates/part/tabs.html
Normal file
12
InvenTree/part/templates/part/tabs.html
Normal file
@ -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>
|
||||
@ -2,6 +2,8 @@
|
||||
|
||||
{% block details %}
|
||||
|
||||
{% include 'part/tabs.html' with tab='track' %}
|
||||
|
||||
Part tracking for {{ part.name }}
|
||||
|
||||
<table>
|
||||
|
||||
22
InvenTree/part/templates/part/used_in.html
Normal file
22
InvenTree/part/templates/part/used_in.html
Normal file
@ -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 %}
|
||||
@ -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'),
|
||||
]
|
||||
|
||||
@ -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)
|
||||
|
||||
|
||||
@ -19,14 +19,18 @@ table tr:nth-child(odd) {
|
||||
}
|
||||
|
||||
.part-thumb {
|
||||
width: 250px;
|
||||
height: 250px;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
border: 1px black solid;
|
||||
margin: 5px;
|
||||
padding: 5px;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.media {
|
||||
padding-top: 15px;
|
||||
}
|
||||
|
||||
.media-body {
|
||||
padding-top: 10px;
|
||||
}
|
||||
@ -40,4 +44,65 @@ table tr:nth-child(odd) {
|
||||
.inventree-content {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.nav-tabs>.active li {
|
||||
border-color: #d45500;
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
|
||||
.nav-tabs li {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
border-bottom: 1px solid #d45500;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
color : white;
|
||||
background-color: #428bca;
|
||||
padding : 5px 15px;
|
||||
}
|
||||
|
||||
.nav-tabs:after,
|
||||
.nav-pills:after {
|
||||
clear: both;
|
||||
}
|
||||
.nav-tabs > li,
|
||||
.nav-pills > li {
|
||||
float: left;
|
||||
}
|
||||
.nav-tabs > li > a,
|
||||
.nav-pills > li > a {
|
||||
padding-right: 12px;
|
||||
padding-left: 12px;
|
||||
margin-right: 2px;
|
||||
line-height: 14px;
|
||||
}
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
.nav-tabs > li {
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
.nav-tabs > li > a {
|
||||
padding-top: 8px;
|
||||
padding-bottom: 8px;
|
||||
line-height: 20px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
.nav-tabs > li > a:hover,
|
||||
.nav-tabs > li > a:focus {
|
||||
border-color: #eeeeee #eeeeee #dddddd;
|
||||
}
|
||||
.nav-tabs > .active > a,
|
||||
.nav-tabs > .active > a:hover,
|
||||
.nav-tabs > .active > a:focus {
|
||||
color: #555555;
|
||||
background-color: #ffffff;
|
||||
border: 1px solid #ddd;
|
||||
border-bottom-color: transparent;
|
||||
cursor: default;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user