inventree/InvenTree
2
0
Fork 0
mirror of https://github.com/inventree/InvenTree.git synced 2025-04-30 04:26:44 +00:00
Code

Adds a new "offcanvas" section for search results

Browse Source
This commit is contained in:
Oliver Walters 2022-03-28 10:02:55 +11:00
parent ab7eda9d2c
commit 2976545988
3 changed files with 25 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
InvenTree/InvenTree/static/script/inventree/inventree.js
View File

@ -231,8 +231,8 @@ function inventreeDocReady() {
stopNotificationWatcher(); stopNotificationWatcher();
}); });
$('#offcanvasRight').on('show.bs.offcanvas', openNotificationPanel); // listener for opening the notification panel $('#offcanvas-notification').on('show.bs.offcanvas', openNotificationPanel); // listener for opening the notification panel
$('#offcanvasRight').on('hidden.bs.offcanvas', closeNotificationPanel); // listener for closing the notification panel $('#offcanvas-notification').on('hidden.bs.offcanvas', closeNotificationPanel); // listener for closing the notification panel
} }

4
InvenTree/templates/navbar.html
View File

@ -91,7 +91,7 @@
<ul class='navbar-nav flex-row'> <ul class='navbar-nav flex-row'>
<li class='nav-item me-2'> <li class='nav-item me-2'>
<button data-bs-toggle='offcanvas' data-bs-target="#offcanvasSearch" class='btn position-relative' title='{% trans "Search" %}'> <button data-bs-toggle='offcanvas' data-bs-target="#offcanvas-search" class='btn position-relative' title='{% trans "Search" %}'>
<span class='fas fa-search'></span> <span class='fas fa-search'></span>
</button> </button>
</li> </li>
@ -105,7 +105,7 @@
{% endif %} {% endif %}
<li class='nav-item me-2'> <li class='nav-item me-2'>
<button data-bs-toggle="offcanvas" data-bs-target="#offcanvasRight" class='btn position-relative' title='{% trans "Show Notifications" %}'> <button data-bs-toggle="offcanvas" data-bs-target="#offcanvas-notification" class='btn position-relative' title='{% trans "Show Notifications" %}'>
<span class='fas fa-bell'></span> <span class='fas fa-bell'></span>
<span class="position-absolute top-100 start-100 translate-middle badge rounded-pill bg-danger d-none" id="notification-alert"> <span class="position-absolute top-100 start-100 translate-middle badge rounded-pill bg-danger d-none" id="notification-alert">
<span class="visually-hidden">{% trans "New Notifications" %}</span> <span class="visually-hidden">{% trans "New Notifications" %}</span>

24
InvenTree/templates/notifications.html
View File

@ -1,7 +1,8 @@
{% load i18n %} {% load i18n %}
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasRight" data-bs-scroll="true" aria-labelledby="offcanvasRightLabel">
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvas-notification" data-bs-scroll="true" aria-labelledby="offcanvas-notification-label">
<div class="offcanvas-header"> <div class="offcanvas-header">
<h5 id="offcanvasRightLabel">{% trans "Notifications" %}</h5> <h5 id="offcanvas-notification-label">{% trans "Notifications" %}</h5>
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button> <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div> </div>
<div class="offcanvas-body"> <div class="offcanvas-body">
@ -11,4 +12,21 @@
<hr> <hr>
<a href="{% url 'notifications' %}">{% trans "Show all notifications and history" %}</a> <a href="{% url 'notifications' %}">{% trans "Show all notifications and history" %}</a>
</div> </div>
</div> </div>
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvas-search" data-bs-scroll="true" aria-labelledby="offcanvas-search-label">
<div class="offcanvas-header">
<div class='input-group'>
<input type="text" name='search' class="form-control" aria-label='{% trans "Search" %}' id="search-bar" placeholder="{% trans 'Search' %}"{% if query_text %} value="{{ query }}"{% endif %}>
<button type="submit" id='search-submit' class="btn btn-secondary" title='{% trans "Search" %}'>
<span class='fas fa-search'></span>
</button>
</div>
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
<div id="search-center">
<p id='serach-no-results' class='text-muted'><em>{% trans "No results" %}</em></p>
</div>
</div>
</div>