mirror of
https://github.com/inventree/InvenTree.git
synced 2025-06-17 12:35:46 +00:00
Add javascript to dynamically switch between views
This commit is contained in:
@ -149,22 +149,23 @@
|
||||
<!-- translated -->
|
||||
<script type='text/javascript' src="{% i18n_static 'api.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'attachment.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'forms.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'model_renderers.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'barcode.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'bom.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'build.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'calendar.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'company.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'part.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'modals.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'filters.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'forms.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'label.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'nav.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'modals.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'model_renderers.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'order.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'part.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'report.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'stock.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'build.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'order.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'calendar.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'tables.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'table_filters.js' %}"></script>
|
||||
<script type='text/javascript' src="{% i18n_static 'filters.js' %}"></script>
|
||||
|
||||
<script type='text/javascript' src="{% static 'fontawesome/js/solid.js' %}"></script>
|
||||
<script type='text/javascript' src="{% static 'fontawesome/js/brands.js' %}"></script>
|
||||
|
60
InvenTree/templates/js/nav.js
Normal file
60
InvenTree/templates/js/nav.js
Normal file
@ -0,0 +1,60 @@
|
||||
|
||||
/*
|
||||
* Attach callbacks to navigation bar elements.
|
||||
*
|
||||
* Searches for elements with the class 'nav-toggle'.
|
||||
* A callback is added to each element,
|
||||
* to display the matching panel.
|
||||
*
|
||||
* The 'id' of the .nav-toggle element should be of the form "select-<x>",
|
||||
* and point to a matching "panel-<x>"
|
||||
*/
|
||||
function attachNavCallbacks(options={}) {
|
||||
|
||||
$('.nav-toggle').click(function() {
|
||||
var el = $(this);
|
||||
|
||||
// Find the matching "panel" element
|
||||
var panelName = el.attr('id').replace('select-', '');
|
||||
|
||||
activatePanel(panelName, options);
|
||||
});
|
||||
|
||||
|
||||
var panelClass = options.name || 'unknown';
|
||||
|
||||
// Look for a default panel to initialize
|
||||
var defaultPanel = localStorage.getItem(`selected-panel-${panelClass}`) || options.default;
|
||||
|
||||
if (defaultPanel) {
|
||||
activatePanel(defaultPanel);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function activatePanel(panelName, options={}) {
|
||||
|
||||
var panelClass = options.name || 'unknown';
|
||||
|
||||
// Save the selected panel
|
||||
localStorage.setItem(`selected-panel-${panelClass}`, panelName);
|
||||
|
||||
// First, cause any other panels to "fade out"
|
||||
$('.panel-visible').hide();
|
||||
$('.panel-visible').removeClass('panel-visible');
|
||||
|
||||
// Find the target panel
|
||||
var panel = `#panel-${panelName}`;
|
||||
|
||||
// Display the panel
|
||||
$(panel).addClass('panel-visible');
|
||||
$(panel).fadeIn(50);
|
||||
|
||||
// Un-select all selectors
|
||||
$('.nav-item').removeClass('active');
|
||||
|
||||
// Find the associated selector
|
||||
var select = `#select-${panelName}`;
|
||||
|
||||
$(select).parent('.nav-item').addClass('active');
|
||||
}
|
Reference in New Issue
Block a user