feat(web): update ui for pure sqlite3

This commit is contained in:
arkohut 2024-10-08 19:58:02 +08:00
parent 549bcb6de4
commit e7e47f84cc

View File

@ -234,30 +234,32 @@
<div class="mx-auto flex flex-col sm:flex-row"> <div class="mx-auto flex flex-col sm:flex-row">
<!-- Left panel for tags and created_date --> <!-- Left panel for tags and created_date -->
{#if searchResult && searchResult.facet_counts && searchResult.facet_counts.length > 0}
<div class="xl:w-1/7 lg:w-1/6 md:w-1/5 sm:w-full pr-4"> <div class="xl:w-1/7 lg:w-1/6 md:w-1/5 sm:w-full pr-4">
{#if searchResult && searchResult.facet_counts} {#each searchResult.facet_counts as facet}
{#each searchResult.facet_counts as facet} {#if facet.field_name === 'tags' || facet.field_name === 'created_date'}
{#if facet.field_name === 'tags' || facet.field_name === 'created_date'} <FacetFilter
<FacetFilter {facet}
{facet} selectedItems={facet.field_name === 'tags' ? selectedTags : selectedDates}
selectedItems={facet.field_name === 'tags' ? selectedTags : selectedDates} onItemChange={facet.field_name === 'tags' ? handleTagChange : handleDateChange}
onItemChange={facet.field_name === 'tags' ? handleTagChange : handleDateChange} />
/> {/if}
{/if} {/each}
{/each}
{/if}
</div> </div>
{/if}
<!-- Right panel for search results --> <!-- Right panel for search results -->
<div class="xl:w-6/7 lg:w-5/6 md:w-4/5"> <div class="{searchResult && searchResult.facet_counts && searchResult.facet_counts.length > 0 ? 'xl:w-6/7 lg:w-5/6 md:w-4/5' : 'w-full'}">
{#if isLoading} {#if isLoading}
<p>Loading...</p> <p class="text-center">Loading...</p>
{:else if searchResult && searchResult.hits.length > 0} {:else if searchResult && searchResult.hits.length > 0}
<p class="search-summary mb-4"> {#if searchResult['search_time_ms'] > 0}
{searchResult['found'].toLocaleString()} results found - Searched {searchResult[ <p class="search-summary mb-4 text-center">
'out_of' {searchResult['found'].toLocaleString()} results found - Searched {searchResult[
].toLocaleString()} recipes in {searchResult['search_time_ms']}ms. 'out_of'
</p> ].toLocaleString()} recipes in {searchResult['search_time_ms']}ms.
</p>
{/if}
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"> <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
{#each searchResult.hits as hit, index} {#each searchResult.hits as hit, index}
<!-- svelte-ignore a11y-click-events-have-key-events --> <!-- svelte-ignore a11y-click-events-have-key-events -->
@ -298,9 +300,9 @@
{/each} {/each}
</div> </div>
{:else if searchString} {:else if searchString}
<p>No results found.</p> <p class="text-center">No results found.</p>
{:else} {:else}
<p>Type something to start searching...</p> <p class="text-center">Type something to start searching...</p>
{/if} {/if}
</div> </div>
</div> </div>