cerebrate-project
/
cerebrate
mirror of https://github.com/cerebrate-project/cerebrate
1
0
Fork 0
Code Issues Releases Wiki Activity

chg: [instance:search_all] Improved layout of displayed results

pull/72/head
mokaddem 2021-09-10 14:12:19 +02:00
parent b3c25f0cae
commit 1d541ff214
4 changed files with 52 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
templates/Instance/search_all.php
View File

@ -1,10 +1,27 @@
<ul>
<?php foreach ($data as $table => $tableResult): ?>
<li><strong><?= h($table) ?></strong></li>
<ul>
<?php foreach ($tableResult as $entry): ?>
<li><strong><?= h($entry['id']) ?></strong></li>
<?php endforeach; ?>
</ul>
<?php endforeach; ?>
</ul>
<?php
$sections = [];
foreach ($data as $tableName => $tableResult) {
$section = '';
$table = Cake\ORM\TableRegistry::get($tableName);
$fieldPath = !empty($table->getDisplayField()) ? $table->getDisplayField() : 'id';
$section .= sprintf('<span class="d-flex text-nowrap px-2 search-container-model">
<span class="text-uppercase text-muted mr-3 model-text">%s</span>
<span class="d-flex align-items-center search-container-divider">
<hr class="m-0"/>
</span>
</span>', h($tableName));
foreach ($tableResult as $entry) {
$section .= sprintf('<a class="dropdown-item" href="%s">%s</a>',
Cake\Routing\Router::URL([
'controller' => Cake\Utility\Inflector::pluralize($entry->getSource()),
'action' => 'view',
h($entry['id'])
]),
h($entry[$fieldPath])
);
}
$sections[] = $section;
}
echo implode('', $sections);

3
templates/element/layouts/header/header-right.php
View File

@ -4,7 +4,8 @@
<input type="text" class="form-control d-inline-block" id="globalSearch" placeholder="<?= __('Search in Cerebrate...') ?>">
<i class="icon <?= $this->FontAwesome->getClass('search') ?>"></i>
</span>
<div class="global-search-result-container dropdown-menu p-0">
<button type="button" class="dropdown-toggle d-none" id="dropdownMenuSearchAll" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-reference="parent"></button>
<div class="global-search-result-container dropdown-menu dropdown-menu-right p-0 pt-2" aria-labelledby="dropdownMenuSearchAll">
<?= __('- No result -') ?>
</div>
</div>

15
webroot/css/layout.css
View File

@ -139,6 +139,21 @@ main.content {
margin: auto 0;
}
.global-search-result-container .search-container-model .model-text {
font-size: 0.75rem;
font-weight: 600;
}
.global-search-result-container .search-container-model .search-container-divider {
flex: 1 0 0;
min-height: 20px;
}
.global-search-result-container .search-container-model .search-container-divider > hr {
height: 1px;
flex: 1 0 auto
}
.right-navbar div.header-menu a.nav-link {
margin: auto 0;
}

13
webroot/js/main.js
View File

@ -99,11 +99,14 @@ function syntaxHighlightJson(json, indent) {
});
}
function performGlobalSearch() {
function performGlobalSearch(evt) {
const $input = $('#globalSearch')
// const $resultContainer = $('.global-search-result-container')
const $resultContainer = $('.content')
const $resultContainer = $('.global-search-result-container')
const value = $input.val()
if (value.length < 3 && evt.keyCode != 13) {
$('#dropdownMenuSearchAll').dropdown('hide')
return;
}
const endpoint = '/instance/searchAll'
const searchParams = new URLSearchParams({search: value});
const url = endpoint + '?' + searchParams
@ -111,7 +114,7 @@ function performGlobalSearch() {
statusNode: $resultContainer
}
$resultContainer.dropdown('show')
$('#dropdownMenuSearchAll').dropdown('show')
AJAXApi.quickFetchURL(url, options).then((theHTML) => {
$resultContainer.html(theHTML)
$input.focus()
@ -126,5 +129,5 @@ $(document).ready(() => {
}
const debouncedGlobalSearch = debounce(performGlobalSearch, 400)
$('#globalSearch').keypress(debouncedGlobalSearch);
$('#globalSearch').keydown(debouncedGlobalSearch);
})