mirrors/recipes
1
0
Fork 0
mirror of https://github.com/TandoorRecipes/recipes.git synced 2026-01-02 04:39:54 -05:00
Code Issues Packages Projects Releases Wiki Activity

several search related improvements

Browse Source
This commit is contained in:
vabene1111
2021-07-07 17:45:05 +02:00
parent b42e6ac0f6
commit da57e656eb
13 changed files with 104 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
vue/src/apps/RecipeSearchView/RecipeSearchView.vue
View File

@@ -10,6 +10,9 @@
<b-input class="form-control form-control-lg form-control-borderless form-control-search" v-model="settings.search_input"
v-bind:placeholder="$t('Search')"></b-input>
<b-input-group-append>
<b-button class="shadow-none btn btn-light" @click="openRandom()">
<i class="fas fa-dice-five" style="font-size: 1.5em"></i>
</b-button>
<b-button v-b-toggle.collapse_advanced_search
v-bind:class="{'btn-primary': !isAdvancedSettingsSet(), 'btn-danger': isAdvancedSettingsSet()}"
class="shadow-none btn"><i
@@ -73,6 +76,21 @@
></b-form-input>
</b-form-group>
<b-form-group
v-bind:label="$t('Recipes_per_page')"
label-for="popover-input-page-count"
label-cols="6"
class="mb-3">
<b-form-input
type="number"
v-model="settings.page_count"
id="popover-input-page-count"
size="sm"
></b-form-input>
</b-form-group>
<b-form-group
v-bind:label="$t('Meal_Plan')"
label-for="popover-input-2"
@@ -85,6 +103,19 @@
size="sm"
></b-form-checkbox>
</b-form-group>
<b-form-group
v-bind:label="$t('Sort_by_new')"
label-for="popover-input-3"
label-cols="6"
class="mb-3">
<b-form-checkbox
switch
v-model="settings.sort_by_new"
id="popover-input-3"
size="sm"
></b-form-checkbox>
</b-form-group>
</div>
<div class="row" style="margin-top: 1vh">
<div class="col-12" style="text-align: right">
@@ -173,7 +204,7 @@
<div class="row">
<div class="col col-md-12 text-right" style="margin-top: 2vh">
<span class="text-muted">
{{ $t('Page') }} {{ settings.pagination_page }}/{{ pagination_count }} <a href="#" @click="resetSearch"><i
{{ $t('Page') }} {{ settings.pagination_page }}/{{ Math.ceil(pagination_count/settings.page_count) }} <a href="#" @click="resetSearch"><i
class="fas fa-times-circle"></i> {{ $t('Reset') }}</a>
</span>
</div>
@@ -181,10 +212,10 @@
<div class="row">
<div class="col col-md-12">
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));grid-gap: 1rem;">
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));grid-gap: 0.8rem;" >
<template
v-if="settings.search_input === '' && settings.search_keywords.length === 0 && settings.search_foods.length === 0 && settings.search_books.length === 0">
v-if="settings.search_input === '' && settings.search_keywords.length === 0 && settings.search_foods.length === 0 && settings.search_books.length === 0 && this.settings.pagination_page === 1 && !random_search">
<recipe-card v-bind:key="`mp_${m.id}`" v-for="m in meal_plans" :recipe="m.recipe"
:meal_plan="m" :footer_text="m.meal_type_name"
footer_icon="far fa-calendar-alt"></recipe-card>
@@ -198,12 +229,12 @@
</div>
</div>
<div class="row" style="margin-top: 2vh">
<div class="row" style="margin-top: 2vh" v-if="!random_search">
<div class="col col-md-12">
<b-pagination pills
v-model="settings.pagination_page"
:total-rows="pagination_count"
per-page="25"
:per-page="settings.page_count"
@change="pageChange"
align="center">
@@ -269,11 +300,13 @@ export default {
advanced_search_visible: false,
show_meal_plan: true,
recently_viewed: 5,
sort_by_new: true,
pagination_page: 1,
page_count: 25,
},
pagination_count: 0,
random_search: false,
}
},
@@ -333,9 +366,13 @@ export default {
'settings.search_input': _debounce(function () {
this.refreshData(false)
}, 300),
'settings.page_count': _debounce(function () {
this.refreshData(false)
}, 300),
},
methods: {
refreshData: function (page_load) {
refreshData: function (random) {
this.random_search = random
let apiClient = new ApiApiFactory()
apiClient.listRecipes(
this.settings.search_input,
@@ -353,14 +390,19 @@ export default {
this.settings.search_books_or,
this.settings.search_internal,
undefined,
random,
this.settings.sort_by_new,
this.settings.pagination_page,
this.settings.page_count
).then(result => {
window.scrollTo(0, 0);
this.pagination_count = result.data.count
this.recipes = result.data.results
})
},
openRandom: function () {
this.refreshData(true)
},
loadMealPlan: function () {
let apiClient = new ApiApiFactory()
@@ -383,7 +425,7 @@ export default {
let apiClient = new ApiApiFactory()
if (this.settings.recently_viewed > 0) {
apiClient.listRecipes(undefined, undefined, undefined, undefined, undefined, undefined,
undefined, undefined, undefined, undefined, undefined, {query: {last_viewed: this.settings.recently_viewed}}).then(result => {
undefined, undefined, undefined, this.settings.sort_by_new, 1, this.settings.recently_viewed, {query: {last_viewed: this.settings.recently_viewed}}).then(result => {
this.last_viewed_recipes = result.data.results
})
} else {
@@ -405,7 +447,7 @@ export default {
},
pageChange: function (page) {
this.settings.pagination_page = page
this.refreshData()
this.refreshData(false)
},
isAdvancedSettingsSet() {
return ((this.settings.search_keywords.length + this.settings.search_foods.length + this.settings.search_books.length) > 0)