mirror/Part-DB.Part-DB-server
1
0
Fork 1
mirror of https://github.com/Part-DB/Part-DB-server.git synced 2025-07-03 06:54:34 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Added search function to the 3 main trees too.

Browse source
This commit is contained in:
Jan Böhmer 2019-04-05 19:31:41 +02:00
parent da16e27fcb
commit 058b3a6b6b
3 changed files with 90 additions and 60 deletions
Download patch file Download diff file Expand all files Collapse all files

12
assets/ts_src/ajax_ui.ts
View file

@ -211,6 +211,8 @@ class AjaxUI {
enableLinks: false,
showIcon: false,
showBorder: true,
searchResultBackColor: '#ffc107',
searchResultColor: '#000',
onNodeSelected: function(event, data) {
if(data.href) {
ajaxUI.navigateTo(data.href);
@ -220,6 +222,16 @@ class AjaxUI {
expandIcon: "fas fa-plus fa-fw fa-treeview", collapseIcon: "fas fa-minus fa-fw fa-treeview"})
.on('initialized', function() {
$(this).treeview('collapseAll', { silent: true });
//Implement searching if needed.
if($(this).data('treeSearch')) {
let _this = this;
let $search = $($(this).data('treeSearch'));
$search.on( 'input', function() {
$(_this).treeview('collapseAll', { silent: true });
$(_this).treeview('search', [$search.val()]);
});
}
});
});
}

2
templates/AdminPages/EntityAdminBase.html.twig
View file

@ -6,7 +6,7 @@
<div class="row">
<div class="col-8">
<input id="tree-search" type="search" class="form-control" placeholder="{% trans %}search{% endtrans %}">
<input id="tree-search" type="search" class="form-control" placeholder="{% trans %}search.placeholder{% endtrans %}">
</div>
<div class="btn-group btn-group-sm col-4" role="group">
<button type="button" class="btn btn-outline-secondary" id="tree-expand"

48
templates/base.html.twig
View file

@ -156,10 +156,11 @@
<nav class="fixed-sidebar col-md-3 col-lg-2 " id="fixed-sidebar">
<ul class="nav flex-column">
<li id="treeBox-categories">
<div class="dropdown">
<button class="btn-text dropdown-toggle mb-2" type="button" id="dropdownCat" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<span class="sidebar-title" id="tree-categories-title">{% trans %}category.labelp{% endtrans %}</span>
</button>
<div class="input-group input-group-sm mb-2 mt-1">
<div class="input-group-prepend">
<button class="btn btn-light dropdown-toggle" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
><span class="sidebar-title" id="tree-categories-title">{% trans %}category.labelp{% endtrans %}</span></button>
<ul class="dropdown-menu" aria-labelledby="dropdownCat">
<li class="dropdown-header">{% trans %}actions{% endtrans %}</li>
<li><a href="#" class="tree-btns dropdown-item" data-mode="expand" data-target="tree-categories">{% trans %}expandAll{% endtrans %}</a></li>
@ -175,13 +176,18 @@
<li><a href="#" class="tree-btns dropdown-item" data-mode="tools" data-target="tree-categories">{% trans %}tools.label{% endtrans %}</a></li>
</ul>
</div>
<div id="tree-categories"></div>
<input type="search" class="form-control bg-light border-0" id="tree-category-search" placeholder="{% trans %}search.placeholder{% endtrans %}">
</div>
<div id="tree-categories" data-tree-search="#tree-category-search"></div>
</li>
<li id="treeBox-devices">
<div class="dropdown">
<button class="btn-text dropdown-toggle mb-2 mt-2" type="button" id="dropdownDev" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<span class="sidebar-title" id="tree-devices-title">{% trans %}device.labelp{% endtrans %}</span>
</button>
<div class="input-group input-group-sm mb-2 mt-2">
<div class="input-group-prepend">
<button class="btn btn-light dropdown-toggle" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
><span class="sidebar-title" id="tree-devices-title">{% trans %}device.labelp{% endtrans %}</span></button>
<ul class="dropdown-menu" aria-labelledby="dropdownDev">
<li class="dropdown-header">{% trans %}actions{% endtrans %}</li>
<li><a href="#" class="tree-btns dropdown-item" data-mode="expand" data-target="tree-devices">{% trans %}expandAll{% endtrans %}</a></li>
@ -197,14 +203,19 @@
<li><a href="#" class="tree-btns dropdown-item" data-mode="tools" data-target="tree-devices">{% trans %}tools.label{% endtrans %}</a></li>
</ul>
</div>
<div id="tree-devices"></div>
<input type="search" class="form-control bg-light border-0" id="tree-devices-search" placeholder="{% trans %}search.placeholder{% endtrans %}">
</div>
<div id="tree-devices" data-tree-search="#tree-devices-search"></div>
</li>
<li id="treeBox-tools">
<div class="dropdown">
<button class="btn-text dropdown-toggle mb-2 mt-2" type="button" id="dropdownTools" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<span class="sidebar-title" id="tree-tools-title">{% trans %}tools.label{% endtrans %}</span>
</button>
<div class="input-group input-group-sm mb-2 mt-2">
<div class="input-group-prepend">
<button class="btn btn-light dropdown-toggle" type="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
><span class="sidebar-title" id="tree-tools-title">{% trans %}tools.label{% endtrans %}</span></button>
<ul class="dropdown-menu" aria-labelledby="dropdownTools">
<li class="dropdown-header">{% trans %}actions{% endtrans %}</li>
<li><a href="#" class="tree-btns dropdown-item" data-mode="expand" data-target="tree-tools">{% trans %}expandAll{% endtrans %}</a></li>
@ -220,7 +231,14 @@
<li><a href="#" class="tree-btns dropdown-item" data-mode="tools" data-target="tree-tools">{% trans %}tools.label{% endtrans %}</a></li>
</ul>
</div>
<div id="tree-tools"></div>
<input type="search" class="form-control bg-light border-0" id="tree-tools-search" placeholder="{% trans %}search.placeholder{% endtrans %}">
</div>
<div id="tree-tools" data-tree-search="#tree-tools-search"></div>
</li>
</ul>