Merge pull request #78 from Simple2B/kostia/fix/quick_search_empty

added nothing found message for quick search
This commit is contained in:
Костя Столярский 2023-05-26 15:01:35 +03:00 committed by GitHub
commit bf8e132c87
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 22 additions and 3 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -9,8 +9,19 @@
</button>
<!-- Modal body -->
<div class="p-1 space-y-1">
<div id="emptyQuickSearchDiv" class="hidden h-32">
<table>
<thead class="text-xs text-gray-900 uppercase dark:text-gray-400">
<tr><th scope="col" class="flex items-center justify-start px-1 py-1">
<!-- prettier-ignore -->
Nothing found
</th>
</tr>
</thead>
</table>
</div>
<div id="quickSearchBlock-interpretations">
<table>
<table>
<thead class="text-xs text-gray-900 uppercase dark:text-gray-400">
<tr><th scope="col" class="flex items-center justify-start px-1 py-1">
<!-- prettier-ignore -->

View File

@ -44,16 +44,20 @@ const onInputChange = async (e: any) => {
const res = await fetch('/quick_search?' + urlParams);
const json = await res.json();
if (res.status === 200) {
let emptyEntityArr = [];
for (const entity in json) {
// iterate over json from back end
const el: HTMLDivElement = document.querySelector(
`#quickSearchBlock-${entity}`,
);
const secondUnusedLink = document.querySelector(`.${entity}Text-1`);
const emptySearchDiv = document.querySelector('#emptyQuickSearchDiv');
if (secondUnusedLink) {
secondUnusedLink.classList.remove('hidden');
}
if (json[entity].length < 1) {
emptyEntityArr.push(entity);
if (el) {
el.classList.add('hidden');
}
@ -63,10 +67,14 @@ const onInputChange = async (e: any) => {
secondUnusedLink.classList.add('hidden');
}
}
if (emptyEntityArr.length === 4) {
emptySearchDiv.classList.remove('hidden');
}
for (const obj in json[entity]) {
// iterate over every entity in json
el.classList.remove('hidden');
emptySearchDiv.classList.add('hidden');
const link = document.querySelector(`#${entity}Text-${obj}`);
// taking needed html element for markup
if (link) {