fix multiselect

This commit is contained in:
smilerz
2022-01-18 15:40:01 -06:00
committed by Chris Scoggins
parent 97224fa6a0
commit a6a136c892

View File

@@ -63,25 +63,25 @@
</div>
<b-popover target="id_settings_button" triggers="click" placement="bottom">
<b-tabs content-class="mt-1" small>
<b-tabs content-class="mt-1 text-nowrap" small>
<b-tab :title="$t('Settings')" active :title-link-class="['mx-0']">
<b-form-group v-bind:label="$t('Recently_Viewed')" label-for="popover-input-1" label-cols="6" class="mb-3">
<b-form-group v-bind:label="$t('Recently_Viewed')" label-for="popover-input-1" label-cols="6" class="mb-1">
<b-form-input type="number" v-model="ui.recently_viewed" id="popover-input-1" size="sm"></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-group v-bind:label="$t('Recipes_per_page')" label-for="popover-input-page-count" label-cols="6" class="mb-1">
<b-form-input type="number" v-model="ui.page_size" 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" label-cols="6" class="mb-3">
<b-form-group v-bind:label="$t('Meal_Plan')" label-for="popover-input-2" label-cols="6" class="mb-1">
<b-form-checkbox switch v-model="ui.show_meal_plan" id="popover-input-2" size="sm"></b-form-checkbox>
</b-form-group>
<b-form-group v-if="ui.show_meal_plan" v-bind:label="$t('Meal_Plan_Days')" label-for="popover-input-5" label-cols="6" class="mb-3">
<b-form-group v-if="ui.show_meal_plan" v-bind:label="$t('Meal_Plan_Days')" label-for="popover-input-5" label-cols="6" class="mb-1">
<b-form-input type="number" v-model="ui.meal_plan_days" id="popover-input-5" size="sm"></b-form-input>
</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-group v-bind:label="$t('Sort_by_new')" label-for="popover-input-3" label-cols="6" class="mb-1">
<b-form-checkbox switch v-model="ui.sort_by_new" id="popover-input-3" size="sm"></b-form-checkbox>
</b-form-group>
<div class="row" style="margin-top: 1vh">
@@ -90,41 +90,41 @@
</div>
</div>
</b-tab>
<b-tab :title="$t('fields')" :title-link-class="['mx-0']">
<b-form-group v-bind:label="$t('show_keywords')" label-for="popover-show_keywords" label-cols="6" class="mb-3">
<b-tab :title="$t('fields')" :title-link-class="['mx-0']" v-if="ui.enable_expert">
<b-form-group v-bind:label="$t('show_keywords')" label-for="popover-show_keywords" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.show_keywords" id="popover-show_keywords" size="sm"></b-form-checkbox>
</b-form-group>
<b-form-group v-bind:label="$t('show_foods')" label-for="popover-show_foods" label-cols="6" class="mb-3">
<b-form-group v-bind:label="$t('show_foods')" label-for="popover-show_foods" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.show_foods" id="popover-show_foods" size="sm"></b-form-checkbox>
</b-form-group>
<b-form-group v-bind:label="$t('show_books')" label-for="popover-input-show_books" label-cols="6" class="mb-3">
<b-form-group v-bind:label="$t('show_books')" label-for="popover-input-show_books" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.show_books" id="popover-input-show_books" size="sm"></b-form-checkbox>
</b-form-group>
<b-form-group v-bind:label="$t('show_rating')" label-for="popover-show_rating" label-cols="6" class="mb-3">
<b-form-group v-bind:label="$t('show_rating')" label-for="popover-show_rating" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.show_rating" id="popover-show_rating" size="sm"></b-form-checkbox>
</b-form-group>
<b-form-group v-if="ui.enable_expert" v-bind:label="$t('show_units')" label-for="popover-show_units" label-cols="6" class="mb-3">
<b-form-group v-if="ui.enable_expert" v-bind:label="$t('show_units')" label-for="popover-show_units" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.show_units" id="popover-show_units" size="sm"></b-form-checkbox>
</b-form-group>
<b-form-group v-if="ui.enable_expert" v-bind:label="$t('show_filters')" label-for="popover-show_filters" label-cols="6" class="mb-3">
<b-form-group v-if="ui.enable_expert" v-bind:label="$t('show_filters')" label-for="popover-show_filters" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.show_filters" id="popover-show_filters" size="sm"></b-form-checkbox>
</b-form-group>
</b-tab>
<b-tab :title="$t('advanced')" :title-link-class="['mx-0']">
<b-form-group v-bind:label="$t('remember_search')" label-for="popover-rem-search" label-cols="6" class="mb-3">
<b-form-group v-bind:label="$t('remember_search')" label-for="popover-rem-search" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.remember_search" id="popover-rem-search" size="sm"></b-form-checkbox>
</b-form-group>
<b-form-group v-if="ui.remember_search" v-bind:label="$t('remember_hours')" label-for="popover-input-rem-hours" label-cols="6" class="mb-3">
<b-form-group v-if="ui.remember_search" v-bind:label="$t('remember_hours')" label-for="popover-input-rem-hours" label-cols="8" class="mb-1">
<b-form-input type="number" v-model="ui.remember_hours" id="popover-rem-hours" size="sm"></b-form-input>
</b-form-group>
<b-form-group v-bind:label="$t('tree_select')" label-for="popover-input-treeselect" label-cols="6" class="mb-3">
<b-form-group v-bind:label="$t('tree_select')" label-for="popover-input-treeselect" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.tree_select" id="popover-input-treeselect" size="sm"></b-form-checkbox>
</b-form-group>
<b-form-group v-bind:label="$t('enable_expert')" label-for="popover-input-expert" label-cols="6" class="mb-3">
<b-form-group v-bind:label="$t('enable_expert')" label-for="popover-input-expert" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.enable_expert" id="popover-input-expert" size="sm"></b-form-checkbox>
</b-form-group>
<b-form-group v-if="debug" v-bind:label="$t('sql_debug')" label-for="popover-input-sqldebug" label-cols="6" class="mb-3">
<b-form-group v-if="debug" v-bind:label="$t('sql_debug')" label-for="popover-input-sqldebug" label-cols="8" class="mb-1">
<b-form-checkbox switch v-model="ui.sql_debug" id="popover-input-sqldebug" size="sm"></b-form-checkbox>
</b-form-group>
</b-tab>
@@ -138,7 +138,7 @@
</b-popover>
<!-- keywords filter -->
<div class="row">
<div class="row" v-if="ui.show_keywords">
<div class="col-12">
<b-input-group class="mt-2">
<treeselect
@@ -156,8 +156,8 @@
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
/>
<generic-multiselect
v-if="!ui.tree_select"
@change="genericSelectChanged"
v-if="!ui.tree_select"
parent_variable="search_keywords"
:initial_selection="search.search_keywords"
:model="Models.KEYWORD"
@@ -178,7 +178,7 @@
</div>
<!-- foods filter -->
<div class="row">
<div class="row" v-if="ui.show_foods">
<div class="col-12">
<b-input-group class="mt-2">
<treeselect
@@ -196,8 +196,8 @@
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
/>
<generic-multiselect
v-if="!ui.tree_select"
@change="genericSelectChanged"
v-if="!ui.tree_select"
parent_variable="search_foods"
:initial_selection="search.search_foods"
:model="Models.FOOD"
@@ -218,7 +218,7 @@
</div>
<!-- books filter -->
<div class="row">
<div class="row" v-if="ui.show_books">
<div class="col-12">
<b-input-group class="mt-2">
<generic-multiselect
@@ -243,7 +243,7 @@
</div>
<!-- ratings filter -->
<div class="row">
<div class="row" v-if="ui.show_rating">
<div class="col-12">
<b-input-group class="mt-2">
<treeselect
@@ -261,6 +261,30 @@
</b-input-group>
</div>
</div>
<!-- units filter -->
<div class="row" v-if="ui.show_units">
<div class="col-12">
<b-input-group class="mt-2">
<generic-multiselect
@change="genericSelectChanged"
parent_variable="search_units"
:initial_selection="search.search_units"
:model="Models.UNIT"
style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
v-bind:placeholder="$t('Units')"
:limit="50"
></generic-multiselect>
<b-input-group-append>
<b-input-group-text>
<b-form-checkbox v-model="search.search_units_or" name="check-button" @change="refreshData(false)" class="shadow-none" tyle="width: 100%" switch>
<span class="text-uppercase" v-if="search.search_units_or">{{ $t("or") }}</span>
<span class="text-uppercase" v-else>{{ $t("and") }}</span>
</b-form-checkbox>
</b-input-group-text>
</b-input-group-append>
</b-input-group>
</div>
</div>
</div>
</div>
</b-collapse>
@@ -340,10 +364,12 @@ export default {
search_keywords: [],
search_foods: [],
search_books: [],
search_units: [],
search_ratings: undefined,
search_keywords_or: true,
search_foods_or: true,
search_books_or: true,
search_units_or: true,
pagination_page: 1,
expert_mode: false,
},
@@ -490,15 +516,23 @@ export default {
this.random_search = random
let params = {
query: this.search.search_input,
keywords: this.search.search_keywords,
foods: this.search.search_foods,
keywords: this.search.search_keywords.map(function (A) {
return A?.["id"] ?? A
}),
foods: this.search.search_foods.map(function (A) {
return A?.["id"] ?? A
}),
rating: this.search.search_ratings,
units: this.search.search_units.map(function (A) {
return A["id"]
}),
books: this.search.search_books.map(function (A) {
return A["id"]
}),
keywordsOr: this.search.search_keywords_or,
foodsOr: this.search.search_foods_or,
booksOr: this.search.search_books_or,
unitsOr: this.search.search_units_or,
internal: this.search.search_internal,
random: this.random_search,
_new: this.ui.sort_by_new,
@@ -561,6 +595,7 @@ export default {
this.search.search_keywords = []
this.search.search_foods = []
this.search.search_books = []
this.search.search_units = []
this.search.search_ratings = undefined
this.search.pagination_page = 1
this.refreshData(false)