persistent search settings
This commit is contained in:
parent
6d065cb939
commit
9982cae7c3
File diff suppressed because one or more lines are too long
@ -13,7 +13,7 @@
|
|||||||
|
|
||||||
|
|
||||||
<b-input-group class="mt-3">
|
<b-input-group class="mt-3">
|
||||||
<b-input class="form-control" v-model="search_input" v-bind:placeholder="$t('Search')"></b-input>
|
<b-input class="form-control" v-model="settings.search_input" v-bind:placeholder="$t('Search')"></b-input>
|
||||||
<b-input-group-append>
|
<b-input-group-append>
|
||||||
<b-button v-b-toggle.collapse_advanced_search variant="primary" class="shadow-none"><i
|
<b-button v-b-toggle.collapse_advanced_search variant="primary" class="shadow-none"><i
|
||||||
class="fas fa-caret-down" v-if="!settings.advanced_search_visible"></i><i class="fas fa-caret-up"
|
class="fas fa-caret-down" v-if="!settings.advanced_search_visible"></i><i class="fas fa-caret-up"
|
||||||
@ -42,7 +42,7 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-2" style="position: relative; margin-top: 1vh">
|
<div class="col-md-2" style="position: relative; margin-top: 1vh">
|
||||||
<b-form-checkbox v-model="search_internal" name="check-button" @change="refreshData"
|
<b-form-checkbox v-model="settings.search_internal" name="check-button" @change="refreshData"
|
||||||
class="shadow-none"
|
class="shadow-none"
|
||||||
style="position:relative;top: 50%; transform: translateY(-50%);" switch>
|
style="position:relative;top: 50%; transform: translateY(-50%);" switch>
|
||||||
{{ $t('show_only_internal') }}
|
{{ $t('show_only_internal') }}
|
||||||
@ -103,7 +103,7 @@
|
|||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<b-input-group style="margin-top: 1vh">
|
<b-input-group style="margin-top: 1vh">
|
||||||
<generic-multiselect @change="genericSelectChanged" parent_variable="search_keywords"
|
<generic-multiselect @change="genericSelectChanged" parent_variable="search_keywords"
|
||||||
:initial_selection="search_keywords"
|
:initial_selection="settings.search_keywords"
|
||||||
search_function="listKeywords" label="label"
|
search_function="listKeywords" label="label"
|
||||||
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
|
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
|
||||||
v-bind:placeholder="$t('Keywords')"></generic-multiselect>
|
v-bind:placeholder="$t('Keywords')"></generic-multiselect>
|
||||||
@ -125,7 +125,7 @@
|
|||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<b-input-group style="margin-top: 1vh">
|
<b-input-group style="margin-top: 1vh">
|
||||||
<generic-multiselect @change="genericSelectChanged" parent_variable="search_foods"
|
<generic-multiselect @change="genericSelectChanged" parent_variable="search_foods"
|
||||||
:initial_selection="search_foods"
|
:initial_selection="settings.search_foods"
|
||||||
search_function="listFoods" label="name"
|
search_function="listFoods" label="name"
|
||||||
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
|
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
|
||||||
v-bind:placeholder="$t('Ingredients')"></generic-multiselect>
|
v-bind:placeholder="$t('Ingredients')"></generic-multiselect>
|
||||||
@ -147,7 +147,7 @@
|
|||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<b-input-group style="margin-top: 1vh">
|
<b-input-group style="margin-top: 1vh">
|
||||||
<generic-multiselect @change="genericSelectChanged" parent_variable="search_books"
|
<generic-multiselect @change="genericSelectChanged" parent_variable="search_books"
|
||||||
:initial_selection="search_books"
|
:initial_selection="settings.search_books"
|
||||||
search_function="listRecipeBooks" label="name"
|
search_function="listRecipeBooks" label="name"
|
||||||
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
|
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
|
||||||
v-bind:placeholder="$t('Books')"></generic-multiselect>
|
v-bind:placeholder="$t('Books')"></generic-multiselect>
|
||||||
@ -179,7 +179,7 @@
|
|||||||
<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: 1rem;">
|
||||||
|
|
||||||
<template
|
<template
|
||||||
v-if="search_input === '' && search_keywords.length === 0 && search_foods.length === 0 && search_books.length === 0">
|
v-if="settings.search_input === '' && settings.search_keywords.length === 0 && settings.search_foods.length === 0 && settings.search_books.length === 0">
|
||||||
<recipe-card v-bind:key="`mp_${m.id}`" v-for="m in meal_plans" :recipe="m.recipe"
|
<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"
|
:meal_plan="m" :footer_text="m.meal_type_name"
|
||||||
footer_icon="far fa-calendar-alt"></recipe-card>
|
footer_icon="far fa-calendar-alt"></recipe-card>
|
||||||
@ -249,13 +249,13 @@ export default {
|
|||||||
meal_plans: [],
|
meal_plans: [],
|
||||||
last_viewed_recipes: [],
|
last_viewed_recipes: [],
|
||||||
|
|
||||||
search_input: '',
|
|
||||||
search_internal: false,
|
|
||||||
search_keywords: [],
|
|
||||||
search_foods: [],
|
|
||||||
search_books: [],
|
|
||||||
|
|
||||||
settings: {
|
settings: {
|
||||||
|
search_input: '',
|
||||||
|
search_internal: false,
|
||||||
|
search_keywords: [],
|
||||||
|
search_foods: [],
|
||||||
|
search_books: [],
|
||||||
|
|
||||||
search_keywords_or: true,
|
search_keywords_or: true,
|
||||||
search_foods_or: true,
|
search_foods_or: true,
|
||||||
search_books_or: true,
|
search_books_or: true,
|
||||||
@ -272,16 +272,13 @@ export default {
|
|||||||
mounted() {
|
mounted() {
|
||||||
this.$nextTick(function () {
|
this.$nextTick(function () {
|
||||||
if (this.$cookies.isKey('search_settings')) {
|
if (this.$cookies.isKey('search_settings')) {
|
||||||
console.log('loaded cookie settings', this.$cookies.get("search_settings"))
|
|
||||||
this.settings = this.$cookies.get("search_settings")
|
this.settings = this.$cookies.get("search_settings")
|
||||||
}
|
}
|
||||||
|
|
||||||
this.loadMealPlan()
|
this.loadMealPlan()
|
||||||
this.loadRecentlyViewed()
|
this.loadRecentlyViewed()
|
||||||
|
this.refreshData()
|
||||||
})
|
})
|
||||||
|
|
||||||
this.refreshData()
|
|
||||||
|
|
||||||
this.$i18n.locale = window.CUSTOM_LOCALE
|
this.$i18n.locale = window.CUSTOM_LOCALE
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
@ -297,30 +294,29 @@ export default {
|
|||||||
'settings.recently_viewed': function () {
|
'settings.recently_viewed': function () {
|
||||||
this.loadRecentlyViewed()
|
this.loadRecentlyViewed()
|
||||||
},
|
},
|
||||||
search_input: _debounce(function () {
|
'settings.search_input': _debounce(function () {
|
||||||
this.refreshData()
|
this.refreshData()
|
||||||
}, 300),
|
}, 300),
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
refreshData: function () {
|
refreshData: function () {
|
||||||
let apiClient = new ApiApiFactory()
|
let apiClient = new ApiApiFactory()
|
||||||
|
|
||||||
apiClient.listRecipes(
|
apiClient.listRecipes(
|
||||||
this.search_input,
|
this.settings.search_input,
|
||||||
this.search_keywords.map(function (A) {
|
this.settings.search_keywords.map(function (A) {
|
||||||
return A["id"];
|
return A["id"];
|
||||||
}),
|
}),
|
||||||
this.search_foods.map(function (A) {
|
this.settings.search_foods.map(function (A) {
|
||||||
return A["id"];
|
return A["id"];
|
||||||
}),
|
}),
|
||||||
this.search_books.map(function (A) {
|
this.settings.search_books.map(function (A) {
|
||||||
return A["id"];
|
return A["id"];
|
||||||
}),
|
}),
|
||||||
this.settings.search_keywords_or,
|
this.settings.search_keywords_or,
|
||||||
this.settings.search_foods_or,
|
this.settings.search_foods_or,
|
||||||
this.settings.search_books_or,
|
this.settings.search_books_or,
|
||||||
|
|
||||||
this.search_internal,
|
this.settings.search_internal,
|
||||||
undefined,
|
undefined,
|
||||||
this.pagination_page,
|
this.pagination_page,
|
||||||
).then(result => {
|
).then(result => {
|
||||||
@ -350,7 +346,7 @@ export default {
|
|||||||
let apiClient = new ApiApiFactory()
|
let apiClient = new ApiApiFactory()
|
||||||
if (this.settings.recently_viewed > 0) {
|
if (this.settings.recently_viewed > 0) {
|
||||||
apiClient.listRecipes(undefined, undefined, undefined, undefined, undefined, undefined,
|
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, undefined, undefined, {query: {last_viewed: this.settings.recently_viewed}}).then(result => {
|
||||||
this.last_viewed_recipes = result.data.results
|
this.last_viewed_recipes = result.data.results
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
@ -358,15 +354,15 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
genericSelectChanged: function (obj) {
|
genericSelectChanged: function (obj) {
|
||||||
this[obj.var] = obj.val
|
this.settings[obj.var] = obj.val
|
||||||
this.refreshData()
|
this.refreshData()
|
||||||
},
|
},
|
||||||
resetSearch: function () {
|
resetSearch: function () {
|
||||||
this.search_input = ''
|
this.settings.search_input = ''
|
||||||
this.search_internal = false
|
this.settings.search_internal = false
|
||||||
this.search_keywords = []
|
this.settings.search_keywords = []
|
||||||
this.search_foods = []
|
this.settings.search_foods = []
|
||||||
this.search_books = []
|
this.settings.search_books = []
|
||||||
this.refreshData()
|
this.refreshData()
|
||||||
},
|
},
|
||||||
pageChange: function (page) {
|
pageChange: function (page) {
|
||||||
|
Loading…
Reference in New Issue
Block a user