mirror of
https://github.com/TandoorRecipes/recipes.git
synced 2026-01-05 06:08:46 -05:00
small fixes
This commit is contained in:
vabene1111
@@ -20,4 +20,8 @@
|
||||
<button class="btn btn-success" type="submit"><i class="fas fa-save"></i> {% trans 'Create Superuser account' %}</button>
|
||||
</form>
|
||||
|
||||
<script>
|
||||
$('#id_name').focus()
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
@@ -19,14 +19,16 @@
|
||||
<label for="id_description">
|
||||
{{ $t("Description") }}
|
||||
</label>
|
||||
<textarea id="id_description" class="form-control" v-model="recipe.description" maxlength="512"></textarea>
|
||||
<textarea id="id_description" class="form-control" v-model="recipe.description"
|
||||
maxlength="512"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Image and misc properties -->
|
||||
<div class="row pt-2">
|
||||
<div class="col-md-6" style="max-height: 50vh; min-height: 30vh">
|
||||
<input id="id_file_upload" ref="file_upload" type="file" hidden @change="uploadImage($event.target.files[0])" />
|
||||
<input id="id_file_upload" ref="file_upload" type="file" hidden
|
||||
@change="uploadImage($event.target.files[0])"/>
|
||||
|
||||
<div
|
||||
class="h-100 w-100 border border-primary rounded"
|
||||
@@ -35,11 +37,16 @@
|
||||
@dragover.prevent
|
||||
@click="$refs.file_upload.click()"
|
||||
>
|
||||
<i class="far fa-image fa-10x text-primary" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)" v-if="!recipe.image"></i>
|
||||
<i class="far fa-image fa-10x text-primary"
|
||||
style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)"
|
||||
v-if="!recipe.image"></i>
|
||||
|
||||
<img :src="recipe.image" id="id_image" class="img img-fluid img-responsive" style="object-fit: cover; height: 100%" v-if="recipe.image" />
|
||||
<img :src="recipe.image" id="id_image" class="img img-fluid img-responsive"
|
||||
style="object-fit: cover; height: 100%" v-if="recipe.image"/>
|
||||
</div>
|
||||
<button style="bottom: 10px; left: 30px; position: absolute" class="btn btn-danger" @click="deleteImage" v-if="recipe.image">{{ $t("Delete") }}</button>
|
||||
<button style="bottom: 10px; left: 30px; position: absolute" class="btn btn-danger"
|
||||
@click="deleteImage" v-if="recipe.image">{{ $t("Delete") }}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mt-1">
|
||||
@@ -122,7 +129,9 @@
|
||||
<div class="card-body" v-if="recipe.nutrition !== null">
|
||||
<b-alert show>
|
||||
There is currently only very basic support for tracking nutritional information. A
|
||||
<a href="https://github.com/vabene1111/recipes/issues/896" target="_blank" rel="noreferrer nofollow">big update</a> is planned to improve on this in many different areas.
|
||||
<a href="https://github.com/vabene1111/recipes/issues/896" target="_blank"
|
||||
rel="noreferrer nofollow">big update</a> is planned to improve on this in many
|
||||
different areas.
|
||||
</b-alert>
|
||||
|
||||
<label for="id_name"> {{ $t(energy()) }}</label>
|
||||
@@ -130,7 +139,8 @@
|
||||
<input class="form-control" id="id_calories" v-model="recipe.nutrition.calories"/>
|
||||
|
||||
<label for="id_name"> {{ $t("Carbohydrates") }}</label>
|
||||
<input class="form-control" id="id_carbohydrates" v-model="recipe.nutrition.carbohydrates" />
|
||||
<input class="form-control" id="id_carbohydrates"
|
||||
v-model="recipe.nutrition.carbohydrates"/>
|
||||
|
||||
<label for="id_name"> {{ $t("Fats") }}</label>
|
||||
<input class="form-control" id="id_fats" v-model="recipe.nutrition.fats"/>
|
||||
@@ -141,7 +151,9 @@
|
||||
</b-collapse>
|
||||
</div>
|
||||
<b-card-header header-tag="header" class="p-1" role="tab">
|
||||
<b-button squared block v-b-toggle.additional_collapse class="text-left" variant="outline-primary">{{ $t("additional_options") }}</b-button>
|
||||
<b-button squared block v-b-toggle.additional_collapse class="text-left"
|
||||
variant="outline-primary">{{ $t("additional_options") }}
|
||||
</b-button>
|
||||
</b-card-header>
|
||||
<b-collapse id="additional_collapse" class="mt-2" v-model="additional_visible">
|
||||
<b-form-group>
|
||||
@@ -150,8 +162,12 @@
|
||||
<b-input-group-text squared>
|
||||
<b-form-checkbox v-model="recipe.create_food"></b-form-checkbox>
|
||||
</b-input-group-text>
|
||||
<b-input-group-text squared v-if="recipe.create_food"> {{ $t("Name") }}</b-input-group-text>
|
||||
<b-form-input squared v-if="recipe.create_food" v-model="recipe.food_name" id="food_name"></b-form-input>
|
||||
<b-input-group-text squared v-if="recipe.create_food"> {{
|
||||
$t("Name")
|
||||
}}
|
||||
</b-input-group-text>
|
||||
<b-form-input squared v-if="recipe.create_food" v-model="recipe.food_name"
|
||||
id="food_name"></b-form-input>
|
||||
</b-input-group-append>
|
||||
<em class="small text-muted">
|
||||
{{ $t("create_food_desc") }}
|
||||
@@ -162,7 +178,8 @@
|
||||
</div>
|
||||
|
||||
<!-- Steps -->
|
||||
<draggable :list="recipe.steps" group="steps" :empty-insert-threshold="10" handle=".handle" @sort="sortSteps()">
|
||||
<draggable :list="recipe.steps" group="steps" :empty-insert-threshold="10" handle=".handle"
|
||||
@sort="sortSteps()">
|
||||
<div v-for="(step, step_index) in recipe.steps" v-bind:key="step_index">
|
||||
<div class="card mt-2 mb-2">
|
||||
<div class="card-body pr-2 pl-2 pr-md-5 pl-md-5" :id="`id_card_step_${step_index}`">
|
||||
@@ -176,26 +193,33 @@
|
||||
</h4>
|
||||
</div>
|
||||
<div class="col-1" style="text-align: right">
|
||||
<a class="btn shadow-none btn-lg" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<a class="btn shadow-none btn-lg" href="#" role="button" id="dropdownMenuLink"
|
||||
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="fas fa-ellipsis-v text-muted"></i>
|
||||
</a>
|
||||
|
||||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuLink">
|
||||
<button class="dropdown-item" @click="removeStep(step)"><i class="fa fa-trash fa-fw"></i> {{ $t("Delete") }}</button>
|
||||
<button class="dropdown-item" @click="removeStep(step)"><i
|
||||
class="fa fa-trash fa-fw"></i> {{ $t("Delete") }}
|
||||
</button>
|
||||
|
||||
<button type="button" class="dropdown-item" v-if="!step.show_as_header" @click="step.show_as_header = true">
|
||||
<button type="button" class="dropdown-item" v-if="!step.show_as_header"
|
||||
@click="step.show_as_header = true">
|
||||
<i class="fas fa-eye fa-fw"></i> {{ $t("Show_as_header") }}
|
||||
</button>
|
||||
|
||||
<button type="button" class="dropdown-item" v-if="step.show_as_header" @click="step.show_as_header = false">
|
||||
<button type="button" class="dropdown-item" v-if="step.show_as_header"
|
||||
@click="step.show_as_header = false">
|
||||
<i class="fas fa-eye-slash fa-fw"></i> {{ $t("Hide_as_header") }}
|
||||
</button>
|
||||
|
||||
<button class="dropdown-item" @click="moveStep(step, step_index - 1)" v-if="step_index > 0">
|
||||
<button class="dropdown-item" @click="moveStep(step, step_index - 1)"
|
||||
v-if="step_index > 0">
|
||||
<i class="fa fa-arrow-up fa-fw"></i>
|
||||
{{ $t("Move_Up") }}
|
||||
</button>
|
||||
<button class="dropdown-item" @click="moveStep(step, step_index + 1)" v-if="step_index !== recipe.steps.length - 1">
|
||||
<button class="dropdown-item" @click="moveStep(step, step_index + 1)"
|
||||
v-if="step_index !== recipe.steps.length - 1">
|
||||
<i class="fa fa-arrow-down fa-fw"></i> {{ $t("Move_Down") }}
|
||||
</button>
|
||||
</div>
|
||||
@@ -206,30 +230,36 @@
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<label :for="'id_step_' + step.id + 'name'">{{ $t("Step_Name") }}</label>
|
||||
<input class="form-control" v-model="step.name" :id="'id_step_' + step.id + 'name'" />
|
||||
<input class="form-control" v-model="step.name"
|
||||
:id="'id_step_' + step.id + 'name'"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- step data visibility controller -->
|
||||
<div class="row pt-2">
|
||||
<div class="col col-md-12">
|
||||
<b-button pill variant="primary" size="sm" class="ml-1" @click="step.time_visible = true" v-if="!step.time_visible">
|
||||
<b-button pill variant="primary" size="sm" class="ml-1"
|
||||
@click="step.time_visible = true" v-if="!step.time_visible">
|
||||
<i class="fas fa-plus-circle"></i> {{ $t("Time") }}
|
||||
</b-button>
|
||||
|
||||
<b-button pill variant="primary" size="sm" class="ml-1" @click="step.ingredients_visible = true" v-if="!step.ingredients_visible">
|
||||
<b-button pill variant="primary" size="sm" class="ml-1"
|
||||
@click="step.ingredients_visible = true" v-if="!step.ingredients_visible">
|
||||
<i class="fas fa-plus-circle"></i> {{ $t("Ingredients") }}
|
||||
</b-button>
|
||||
|
||||
<b-button pill variant="primary" size="sm" class="ml-1" @click="step.instruction_visible = true" v-if="!step.instruction_visible">
|
||||
<b-button pill variant="primary" size="sm" class="ml-1"
|
||||
@click="step.instruction_visible = true" v-if="!step.instruction_visible">
|
||||
<i class="fas fa-plus-circle"></i> {{ $t("Instructions") }}
|
||||
</b-button>
|
||||
|
||||
<b-button pill variant="primary" size="sm" class="ml-1" @click="step.step_recipe_visible = true" v-if="!step.step_recipe_visible">
|
||||
<b-button pill variant="primary" size="sm" class="ml-1"
|
||||
@click="step.step_recipe_visible = true" v-if="!step.step_recipe_visible">
|
||||
<i class="fas fa-plus-circle"></i> {{ $t("Recipe") }}
|
||||
</b-button>
|
||||
|
||||
<b-button pill variant="primary" size="sm" class="ml-1" @click="step.file_visible = true" v-if="!step.file_visible">
|
||||
<b-button pill variant="primary" size="sm" class="ml-1"
|
||||
@click="step.file_visible = true" v-if="!step.file_visible">
|
||||
<i class="fas fa-plus-circle"></i> {{ $t("File") }}
|
||||
</b-button>
|
||||
<b-button
|
||||
@@ -250,7 +280,8 @@
|
||||
<div class="row pt-2" v-if="step.time_visible">
|
||||
<div class="col-md-12">
|
||||
<label :for="'id_step_' + step.id + '_time'">{{ $t("step_time_minutes") }}</label>
|
||||
<input class="form-control" v-model="step.time" :id="'id_step_' + step.id + '_time'" />
|
||||
<input class="form-control" v-model="step.time"
|
||||
:id="'id_step_' + step.id + '_time'"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -333,16 +364,23 @@
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12 pr-0 pl-0 pr-md-2 pl-md-2 mt-2">
|
||||
<draggable :list="step.ingredients" group="ingredients" :empty-insert-threshold="10" handle=".handle" @sort="sortIngredients(step)">
|
||||
<div v-for="(ingredient, index) in step.ingredients" :key="ingredient.id">
|
||||
<draggable :list="step.ingredients" group="ingredients"
|
||||
:empty-insert-threshold="10" handle=".handle"
|
||||
@sort="sortIngredients(step)">
|
||||
<div v-for="(ingredient, index) in step.ingredients"
|
||||
:key="ingredient.id">
|
||||
<hr class="d-md-none"/>
|
||||
<div class="d-flex">
|
||||
<div class="flex-grow-0 handle align-self-start">
|
||||
<button type="button" class="btn btn-lg shadow-none pr-0 pl-1 pr-md-2 pl-md-2"><i class="fas fa-arrows-alt-v"></i></button>
|
||||
<button type="button"
|
||||
class="btn btn-lg shadow-none pr-0 pl-1 pr-md-2 pl-md-2">
|
||||
<i class="fas fa-arrows-alt-v"></i></button>
|
||||
</div>
|
||||
|
||||
<div class="flex-fill row" style="margin-left: 4px; margin-right: 4px">
|
||||
<div class="col-lg-2 col-md-6 small-padding" v-if="!ingredient.is_header">
|
||||
<div class="flex-fill row"
|
||||
style="margin-left: 4px; margin-right: 4px">
|
||||
<div class="col-lg-2 col-md-6 small-padding"
|
||||
v-if="!ingredient.is_header">
|
||||
<input
|
||||
class="form-control"
|
||||
v-model="ingredient.amount"
|
||||
@@ -353,7 +391,8 @@
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2 col-md-6 small-padding" v-if="!ingredient.is_header">
|
||||
<div class="col-lg-2 col-md-6 small-padding"
|
||||
v-if="!ingredient.is_header">
|
||||
<!-- search set to false to allow API to drive results & order -->
|
||||
<multiselect
|
||||
v-if="!ingredient.no_amount"
|
||||
@@ -380,10 +419,14 @@
|
||||
:loading="units_loading"
|
||||
@search-change="searchUnits"
|
||||
>
|
||||
<template v-slot:noOptions>{{ $t("empty_list") }}</template>
|
||||
<template v-slot:noOptions>{{
|
||||
$t("empty_list")
|
||||
}}
|
||||
</template>
|
||||
</multiselect>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 small-padding" v-if="!ingredient.is_header">
|
||||
<div class="col-lg-4 col-md-6 small-padding"
|
||||
v-if="!ingredient.is_header">
|
||||
<!-- search set to false to allow API to drive results & order -->
|
||||
|
||||
<multiselect
|
||||
@@ -410,10 +453,14 @@
|
||||
:loading="foods_loading"
|
||||
@search-change="searchFoods"
|
||||
>
|
||||
<template v-slot:noOptions>{{ $t("empty_list") }}</template>
|
||||
<template v-slot:noOptions>{{
|
||||
$t("empty_list")
|
||||
}}
|
||||
</template>
|
||||
</multiselect>
|
||||
</div>
|
||||
<div class="small-padding" v-bind:class="{ 'col-lg-4 col-md-6': !ingredient.is_header, 'col-lg-12 col-md-12': ingredient.is_header }">
|
||||
<div class="small-padding"
|
||||
v-bind:class="{ 'col-lg-4 col-md-6': !ingredient.is_header, 'col-lg-12 col-md-12': ingredient.is_header }">
|
||||
<input
|
||||
class="form-control"
|
||||
maxlength="256"
|
||||
@@ -444,32 +491,43 @@
|
||||
<i class="fas fa-ellipsis-v text-muted"></i>
|
||||
</a>
|
||||
|
||||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuLink2">
|
||||
<button type="button" class="dropdown-item" @click="removeIngredient(step, ingredient)">
|
||||
<div class="dropdown-menu dropdown-menu-right"
|
||||
aria-labelledby="dropdownMenuLink2">
|
||||
<button type="button" class="dropdown-item"
|
||||
@click="removeIngredient(step, ingredient)">
|
||||
<i class="fa fa-trash fa-fw"></i>
|
||||
{{ $t("Delete") }}
|
||||
</button>
|
||||
|
||||
<button type="button" class="dropdown-item" v-if="!ingredient.is_header" @click="ingredient.is_header = true">
|
||||
<button type="button" class="dropdown-item"
|
||||
v-if="!ingredient.is_header"
|
||||
@click="ingredient.is_header = true">
|
||||
<i class="fas fa-heading fa-fw"></i>
|
||||
{{ $t("Make_Header") }}
|
||||
</button>
|
||||
|
||||
<button type="button" class="dropdown-item" v-if="ingredient.is_header" @click="ingredient.is_header = false">
|
||||
<button type="button" class="dropdown-item"
|
||||
v-if="ingredient.is_header"
|
||||
@click="ingredient.is_header = false">
|
||||
<i class="fas fa-leaf fa-fw"></i>
|
||||
{{ $t("Make_Ingredient") }}
|
||||
</button>
|
||||
|
||||
<button type="button" class="dropdown-item" v-if="!ingredient.no_amount" @click="ingredient.no_amount = true">
|
||||
<button type="button" class="dropdown-item"
|
||||
v-if="!ingredient.no_amount"
|
||||
@click="ingredient.no_amount = true">
|
||||
<i class="fas fa-balance-scale-right fa-fw"></i>
|
||||
{{ $t("Disable_Amount") }}
|
||||
</button>
|
||||
|
||||
<button type="button" class="dropdown-item" v-if="ingredient.no_amount" @click="ingredient.no_amount = false">
|
||||
<button type="button" class="dropdown-item"
|
||||
v-if="ingredient.no_amount"
|
||||
@click="ingredient.no_amount = false">
|
||||
<i class="fas fa-balance-scale-right fa-fw"></i>
|
||||
{{ $t("Enable_Amount") }}
|
||||
</button>
|
||||
<button type="button" class="dropdown-item" @click="copyTemplateReference(index, ingredient)">
|
||||
<button type="button" class="dropdown-item"
|
||||
@click="copyTemplateReference(index, ingredient)">
|
||||
<i class="fas fa-code"></i>
|
||||
{{ $t("Copy_template_reference") }}
|
||||
</button>
|
||||
@@ -481,8 +539,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-2 offset-md-5" style="text-align: center; margin-top: 8px">
|
||||
<button class="btn btn-success btn-block" @click="addIngredient(step)"><i class="fa fa-plus"></i></button>
|
||||
<div class="col-md-2 offset-md-5"
|
||||
style="text-align: center; margin-top: 8px">
|
||||
<button class="btn btn-success btn-block" @click="addIngredient(step)">
|
||||
<i class="fa fa-plus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -515,13 +575,26 @@
|
||||
{{ $t("Add_Step") }}
|
||||
</button>
|
||||
|
||||
<button type="button" v-b-modal:id_modal_sort class="btn btn-warning shadow-none"><i class="fas fa-sort-amount-down-alt fa-lg"></i></button>
|
||||
<button type="button" v-b-modal:id_modal_sort class="btn btn-warning shadow-none"><i
|
||||
class="fas fa-sort-amount-down-alt fa-lg"></i></button>
|
||||
</b-button-group>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</draggable>
|
||||
|
||||
|
||||
<div class="row" v-if="recipe.steps.length === 0">
|
||||
<div class="col col-md-12 text-center">
|
||||
<b-button-group>
|
||||
<button type="button" @click="addStep(0)" class="btn btn-success shadow-none">
|
||||
{{ $t("Add_Step") }}
|
||||
</button>
|
||||
</b-button-group>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<br/>
|
||||
<br/>
|
||||
<br/>
|
||||
@@ -530,9 +603,11 @@
|
||||
<br/>
|
||||
|
||||
<!-- bottom buttons save/close/view -->
|
||||
<div class="row fixed-bottom p-2 b-2 border-top text-center" style="background: white" v-if="recipe !== undefined">
|
||||
<div class="row fixed-bottom p-2 b-2 border-top text-center" style="background: white"
|
||||
v-if="recipe !== undefined">
|
||||
<div class="col-md-3 col-6">
|
||||
<a :href="resolveDjangoUrl('delete_recipe', recipe.id)" class="btn btn-block btn-danger shadow-none">{{ $t("Delete") }}</a>
|
||||
<a :href="resolveDjangoUrl('delete_recipe', recipe.id)"
|
||||
class="btn btn-block btn-danger shadow-none">{{ $t("Delete") }}</a>
|
||||
</div>
|
||||
<div class="col-md-3 col-6">
|
||||
<a :href="resolveDjangoUrl('view_recipe', recipe.id)">
|
||||
@@ -540,12 +615,15 @@
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-3 col-6">
|
||||
<button type="button" @click="updateRecipe(false)" v-b-tooltip.hover :title="`${$t('Key_Ctrl')} + S`" class="btn btn-sm btn-block btn-info shadow-none">
|
||||
<button type="button" @click="updateRecipe(false)" v-b-tooltip.hover
|
||||
:title="`${$t('Key_Ctrl')} + S`" class="btn btn-sm btn-block btn-info shadow-none">
|
||||
{{ $t("Save") }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-md-3 col-6">
|
||||
<button type="button" @click="updateRecipe(true)" v-b-tooltip.hover :title="`${$t('Key_Ctrl')} + ${$t('Key_Shift')} + S`" class="btn btn-sm btn-block btn-success shadow-none">
|
||||
<button type="button" @click="updateRecipe(true)" v-b-tooltip.hover
|
||||
:title="`${$t('Key_Ctrl')} + ${$t('Key_Shift')} + S`"
|
||||
class="btn btn-sm btn-block btn-success shadow-none">
|
||||
{{ $t("Save_and_View") }}
|
||||
</button>
|
||||
</div>
|
||||
@@ -553,9 +631,11 @@
|
||||
|
||||
<!-- modal for sorting steps -->
|
||||
<b-modal id="id_modal_sort" v-bind:title="$t('Sort')" ok-only>
|
||||
<draggable :list="recipe.steps" group="step_sorter" :empty-insert-threshold="10" handle=".handle" @sort="sortSteps()" class="list-group" tag="ul">
|
||||
<draggable :list="recipe.steps" group="step_sorter" :empty-insert-threshold="10" handle=".handle"
|
||||
@sort="sortSteps()" class="list-group" tag="ul">
|
||||
<li class="list-group-item" v-for="(step, step_index) in recipe.steps" v-bind:key="step_index">
|
||||
<button type="button" class="btn btn-lg shadow-none handle"><i class="fas fa-arrows-alt-v"></i></button>
|
||||
<button type="button" class="btn btn-lg shadow-none handle"><i class="fas fa-arrows-alt-v"></i>
|
||||
</button>
|
||||
<template v-if="step.name !== ''">{{ step.name }}</template>
|
||||
<template v-else>{{ $t("Step") }} {{ step_index + 1 }}</template>
|
||||
</li>
|
||||
@@ -570,11 +650,13 @@
|
||||
@cancel="paste_ingredients = paste_step = undefined"
|
||||
@close="paste_ingredients = paste_step = undefined"
|
||||
>
|
||||
<b-form-textarea id="paste_ingredients" v-model="paste_ingredients" :placeholder="$t('paste_ingredients_placeholder')" rows="10"></b-form-textarea>
|
||||
<b-form-textarea id="paste_ingredients" v-model="paste_ingredients"
|
||||
:placeholder="$t('paste_ingredients_placeholder')" rows="10"></b-form-textarea>
|
||||
</b-modal>
|
||||
|
||||
<!-- form to create files on the fly -->
|
||||
<generic-modal-form :model="Models.USERFILE" :action="Actions.CREATE" :show="show_file_create" @finish-action="fileCreated" />
|
||||
<generic-modal-form :model="Models.USERFILE" :action="Actions.CREATE" :show="show_file_create"
|
||||
@finish-action="fileCreated"/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -586,7 +668,14 @@ import { BootstrapVue } from "bootstrap-vue"
|
||||
import "bootstrap-vue/dist/bootstrap-vue.css"
|
||||
|
||||
import draggable from "vuedraggable"
|
||||
import { ApiMixin, resolveDjangoUrl, ResolveUrlMixin, StandardToasts, convertEnergyToCalories, energyHeading } from "@/utils/utils"
|
||||
import {
|
||||
ApiMixin,
|
||||
resolveDjangoUrl,
|
||||
ResolveUrlMixin,
|
||||
StandardToasts,
|
||||
convertEnergyToCalories,
|
||||
energyHeading
|
||||
} from "@/utils/utils"
|
||||
import Multiselect from "vue-multiselect"
|
||||
import {ApiApiFactory} from "@/utils/openapi/api"
|
||||
import LoadingSpinner from "@/components/LoadingSpinner"
|
||||
@@ -761,7 +850,10 @@ export default {
|
||||
StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
|
||||
this.recipe_changed = false
|
||||
if (this.create_food) {
|
||||
apiFactory.createFood({ name: this.recipe.food_name, recipe: { id: this.recipe.id, name: this.recipe.name } })
|
||||
apiFactory.createFood({
|
||||
name: this.recipe.food_name,
|
||||
recipe: {id: this.recipe.id, name: this.recipe.name}
|
||||
})
|
||||
}
|
||||
if (view_after) {
|
||||
location.href = resolveDjangoUrl("view_recipe", this.recipe_id)
|
||||
@@ -985,7 +1077,12 @@ export default {
|
||||
document.getElementById("id_step_" + step_index).scrollIntoView({behavior: "smooth"})
|
||||
},
|
||||
addNutrition: function () {
|
||||
this.recipe.nutrition = {}
|
||||
this.recipe.nutrition = {
|
||||
carbohydrates: 0,
|
||||
fats: 0,
|
||||
proteins: 0,
|
||||
calories: 0,
|
||||
}
|
||||
},
|
||||
removeNutrition: function () {
|
||||
this.recipe.nutrition = null
|
||||
|
||||
@@ -8,15 +8,21 @@
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 col-lg-10 col-xl-8 mt-3 mb-3">
|
||||
<b-input-group>
|
||||
<b-input class="form-control form-control-lg form-control-borderless form-control-search" v-model="search.search_input" v-bind:placeholder="$t('Search')"></b-input>
|
||||
<b-input
|
||||
class="form-control form-control-lg form-control-borderless form-control-search"
|
||||
v-model="search.search_input" v-bind:placeholder="$t('Search')"></b-input>
|
||||
<b-input-group-append>
|
||||
<b-button v-b-tooltip.hover :title="$t('show_sql')" @click="showSQL()" v-if="debug && ui.sql_debug">
|
||||
<b-button v-b-tooltip.hover :title="$t('show_sql')" @click="showSQL()"
|
||||
v-if="debug && ui.sql_debug">
|
||||
<i class="fas fa-bug" style="font-size: 1.5em"></i>
|
||||
</b-button>
|
||||
<b-button variant="light" v-b-tooltip.hover :title="$t('Random Recipes')" @click="openRandom()">
|
||||
<b-button variant="light" v-b-tooltip.hover :title="$t('Random Recipes')"
|
||||
@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-b-tooltip.hover :title="$t('advanced_search_settings')" v-bind:variant="searchFiltered(true) ? 'danger' : 'primary'">
|
||||
<b-button v-b-toggle.collapse_advanced_search v-b-tooltip.hover
|
||||
:title="$t('advanced_search_settings')"
|
||||
v-bind:variant="searchFiltered(true) ? 'danger' : 'primary'">
|
||||
<!-- TODO consider changing this icon to a filter -->
|
||||
<i class="fas fa-caret-down" v-if="!search.advanced_search_visible"></i>
|
||||
<i class="fas fa-caret-up" v-if="search.advanced_search_visible"></i>
|
||||
@@ -26,15 +32,18 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<b-collapse id="collapse_advanced_search" class="mt-2 shadow-sm" v-model="search.advanced_search_visible">
|
||||
<b-collapse id="collapse_advanced_search" class="mt-2 shadow-sm"
|
||||
v-model="search.advanced_search_visible">
|
||||
<div class="card">
|
||||
<div class="card-body p-4">
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<a class="btn btn-primary btn-block text-uppercase" :href="resolveDjangoUrl('new_recipe')">{{ $t("New_Recipe") }}</a>
|
||||
<a class="btn btn-primary btn-block text-uppercase"
|
||||
:href="resolveDjangoUrl('new_recipe')">{{ $t("New_Recipe") }}</a>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<a class="btn btn-primary btn-block text-uppercase" :href="resolveDjangoUrl('data_import_url')">{{ $t("Import") }}</a>
|
||||
<a class="btn btn-primary btn-block text-uppercase"
|
||||
:href="resolveDjangoUrl('data_import_url')">{{ $t("Import") }}</a>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<button
|
||||
@@ -53,99 +62,191 @@
|
||||
</div>
|
||||
|
||||
<div class="col-md-3">
|
||||
<button id="id_settings_button" class="btn btn-primary btn-block text-uppercase"><i class="fas fa-cog fa-lg m-1"></i></button>
|
||||
<button id="id_settings_button"
|
||||
class="btn btn-primary btn-block text-uppercase"><i
|
||||
class="fas fa-cog fa-lg m-1"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<b-popover target="id_settings_button" triggers="click" placement="bottom">
|
||||
<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="8" class="mb-1">
|
||||
<b-form-input type="number" v-model="ui.recently_viewed" id="popover-input-1" size="sm" class="mt-1"></b-form-input>
|
||||
<b-form-group v-bind:label="$t('Recently_Viewed')"
|
||||
label-for="popover-input-1" label-cols="8" class="mb-1">
|
||||
<b-form-input type="number" v-model="ui.recently_viewed"
|
||||
id="popover-input-1" size="sm"
|
||||
class="mt-1"></b-form-input>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group v-bind:label="$t('Recipes_per_page')" label-for="popover-input-page-count" label-cols="8" class="mb-1">
|
||||
<b-form-input type="number" v-model="ui.page_size" id="popover-input-page-count" size="sm" class="mt-1"></b-form-input>
|
||||
<b-form-group v-bind:label="$t('Recipes_per_page')"
|
||||
label-for="popover-input-page-count" label-cols="8"
|
||||
class="mb-1">
|
||||
<b-form-input type="number" v-model="ui.page_size"
|
||||
id="popover-input-page-count" size="sm"
|
||||
class="mt-1"></b-form-input>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group v-bind:label="$t('Meal_Plan')" label-for="popover-input-2" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_meal_plan" id="popover-input-2" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group v-bind:label="$t('Meal_Plan')" label-for="popover-input-2"
|
||||
label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_meal_plan"
|
||||
id="popover-input-2" size="sm"
|
||||
class="mt-2"></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="8" class="mb-1">
|
||||
<b-form-input type="number" v-model="ui.meal_plan_days" id="popover-input-5" size="sm" class="mt-1"></b-form-input>
|
||||
<b-form-group v-if="ui.show_meal_plan"
|
||||
v-bind:label="$t('Meal_Plan_Days')"
|
||||
label-for="popover-input-5" label-cols="8" class="mb-1">
|
||||
<b-form-input type="number" v-model="ui.meal_plan_days"
|
||||
id="popover-input-5" size="sm"
|
||||
class="mt-1"></b-form-input>
|
||||
</b-form-group>
|
||||
|
||||
<b-form-group v-bind:label="$t('Sort_by_new')" label-for="popover-input-3" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.sort_by_new" id="popover-input-3" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group v-bind:label="$t('Sort_by_new')"
|
||||
label-for="popover-input-3" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.sort_by_new"
|
||||
id="popover-input-3" size="sm"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<div class="row" style="margin-top: 1vh">
|
||||
<div class="col-12">
|
||||
<a :href="resolveDjangoUrl('view_settings') + '#search'">{{ $t("Search Settings") }}</a>
|
||||
<a :href="resolveDjangoUrl('view_settings') + '#search'">{{
|
||||
$t("Search Settings")
|
||||
}}</a>
|
||||
</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="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_keywords" id="popover-show_keywords" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<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"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<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" class="mt-2"></b-form-checkbox>
|
||||
<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"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<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" class="mt-2"></b-form-checkbox>
|
||||
<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"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<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" class="mt-2"></b-form-checkbox>
|
||||
<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"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<b-form-group 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" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group 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"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<b-form-group 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" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group 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"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<b-form-group v-bind:label="$t('show_sortby')" label-for="popover-show_sortby" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_sortby" id="popover-show_sortby" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group v-bind:label="$t('show_sortby')"
|
||||
label-for="popover-show_sortby" label-cols="8"
|
||||
class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_sortby"
|
||||
id="popover-show_sortby" size="sm"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<b-form-group v-bind:label="$t('times_cooked')" label-for="popover-show_timescooked" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_timescooked" id="popover-show_cooked" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group v-bind:label="$t('times_cooked')"
|
||||
label-for="popover-show_timescooked" label-cols="8"
|
||||
class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_timescooked"
|
||||
id="popover-show_cooked" size="sm"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<b-form-group v-bind:label="$t('make_now')" label-for="popover-show_makenow" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_makenow" id="popover-show_makenow" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group v-bind:label="$t('make_now')"
|
||||
label-for="popover-show_makenow" label-cols="8"
|
||||
class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_makenow"
|
||||
id="popover-show_makenow" size="sm"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<b-form-group v-bind:label="$t('last_cooked')" label-for="popover-show_cookedon" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_cookedon" id="popover-show_cookedon" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group v-bind:label="$t('last_cooked')"
|
||||
label-for="popover-show_cookedon" label-cols="8"
|
||||
class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_cookedon"
|
||||
id="popover-show_cookedon" size="sm"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<b-form-group v-bind:label="$t('last_viewed')" label-for="popover-show_viewedon" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_viewedon" id="popover-show_viewedon" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group v-bind:label="$t('last_viewed')"
|
||||
label-for="popover-show_viewedon" label-cols="8"
|
||||
class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_viewedon"
|
||||
id="popover-show_viewedon" size="sm"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<b-form-group v-bind:label="$t('created_on')" label-for="popover-show_createdon" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_createdon" id="popover-show_createdon" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group v-bind:label="$t('created_on')"
|
||||
label-for="popover-show_createdon" label-cols="8"
|
||||
class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_createdon"
|
||||
id="popover-show_createdon" size="sm"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
<b-form-group v-bind:label="$t('updatedon')" label-for="popover-show_updatedon" label-cols="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_updatedon" id="popover-show_updatedon" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<b-form-group v-bind:label="$t('updatedon')"
|
||||
label-for="popover-show_updatedon" label-cols="8"
|
||||
class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.show_updatedon"
|
||||
id="popover-show_updatedon" size="sm"
|
||||
class="mt-2"></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="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.remember_search" id="popover-rem-search" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<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"
|
||||
class="mt-2"></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="8" class="mb-1">
|
||||
<b-form-input type="number" v-model="ui.remember_hours" id="popover-rem-hours" size="sm" class="mt-1"></b-form-input>
|
||||
<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"
|
||||
class="mt-1"></b-form-input>
|
||||
</b-form-group>
|
||||
<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" class="mt-2"></b-form-checkbox>
|
||||
<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"
|
||||
class="mt-2"></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="8" class="mb-1">
|
||||
<b-form-checkbox switch v-model="ui.sql_debug" id="popover-input-sqldebug" size="sm" class="mt-2"></b-form-checkbox>
|
||||
<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"
|
||||
class="mt-2"></b-form-checkbox>
|
||||
</b-form-group>
|
||||
</b-tab>
|
||||
</b-tabs>
|
||||
|
||||
<div class="row" style="margin-top: 1vh">
|
||||
<div class="col-12" style="text-align: right">
|
||||
<b-button size="sm" variant="secondary" style="margin-right: 8px" @click="$root.$emit('bv::hide::popover')">{{ $t("Close") }} </b-button>
|
||||
<b-button size="sm" variant="secondary" style="margin-right: 8px"
|
||||
@click="$root.$emit('bv::hide::popover')">{{ $t("Close") }}
|
||||
</b-button>
|
||||
</div>
|
||||
</div>
|
||||
</b-popover>
|
||||
@@ -185,18 +286,23 @@
|
||||
<h6 class="mb-0" v-if="ui.expert_mode && search.keywords_fields > 1">
|
||||
{{ $t("Keywords") }}
|
||||
</h6>
|
||||
<span class="text-sm-left text-warning" v-if="ui.expert_mode && search.keywords_fields > 1 && hasDuplicateFilter(search.search_keywords, search.keywords_fields)">{{
|
||||
<span class="text-sm-left text-warning"
|
||||
v-if="ui.expert_mode && search.keywords_fields > 1 && hasDuplicateFilter(search.search_keywords, search.keywords_fields)">{{
|
||||
$t("warning_duplicate_filter")
|
||||
}}</span>
|
||||
<div class="row" v-if="ui.show_keywords">
|
||||
<div class="col-12">
|
||||
<b-input-group class="mt-2" v-for="(k, a) in keywordFields" :key="a">
|
||||
<template #prepend v-if="ui.expert_mode">
|
||||
<b-input-group-text style="width: 3em" @click="addField('keywords', k)">
|
||||
<i class="fas fa-plus-circle text-primary" v-if="k == search.keywords_fields && k < 4" />
|
||||
<b-input-group-text style="width: 3em"
|
||||
@click="addField('keywords', k)">
|
||||
<i class="fas fa-plus-circle text-primary"
|
||||
v-if="k == search.keywords_fields && k < 4"/>
|
||||
</b-input-group-text>
|
||||
<b-input-group-text style="width: 3em" @click="removeField('keywords', k)">
|
||||
<i class="fas fa-minus-circle text-primary" v-if="k == search.keywords_fields && k > 1" />
|
||||
<b-input-group-text style="width: 3em"
|
||||
@click="removeField('keywords', k)">
|
||||
<i class="fas fa-minus-circle text-primary"
|
||||
v-if="k == search.keywords_fields && k > 1"/>
|
||||
</b-input-group-text>
|
||||
</template>
|
||||
<treeselect
|
||||
@@ -233,14 +339,20 @@
|
||||
switch
|
||||
style="width: 5em"
|
||||
>
|
||||
<span class="text-uppercase" v-if="search.search_keywords[a].operator">{{ $t("or") }}</span>
|
||||
<span class="text-uppercase"
|
||||
v-if="search.search_keywords[a].operator">{{
|
||||
$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-append v-if="ui.expert_mode">
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.search_keywords[a].not" name="check-button" @change="refreshData(false)" class="shadow-none">
|
||||
<b-form-checkbox v-model="search.search_keywords[a].not"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none">
|
||||
<span class="text-uppercase">{{ $t("not") }}</span>
|
||||
</b-form-checkbox>
|
||||
</b-input-group-text>
|
||||
@@ -253,18 +365,23 @@
|
||||
<h6 class="mt-2 mb-0" v-if="ui.expert_mode && search.foods_fields > 1">
|
||||
{{ $t("Foods") }}
|
||||
</h6>
|
||||
<span class="text-sm-left text-warning" v-if="ui.expert_mode && search.foods_fields > 1 && hasDuplicateFilter(search.search_foods, search.foods_fields)">{{
|
||||
<span class="text-sm-left text-warning"
|
||||
v-if="ui.expert_mode && search.foods_fields > 1 && hasDuplicateFilter(search.search_foods, search.foods_fields)">{{
|
||||
$t("warning_duplicate_filter")
|
||||
}}</span>
|
||||
<div class="row" v-if="ui.show_foods">
|
||||
<div class="col-12">
|
||||
<b-input-group class="mt-2" v-for="(f, i) in foodFields" :key="i">
|
||||
<template #prepend v-if="ui.expert_mode">
|
||||
<b-input-group-text style="width: 3em" @click="addField('foods', f)">
|
||||
<i class="fas fa-plus-circle text-primary" v-if="f == search.foods_fields && f < 4" />
|
||||
<b-input-group-text style="width: 3em"
|
||||
@click="addField('foods', f)">
|
||||
<i class="fas fa-plus-circle text-primary"
|
||||
v-if="f == search.foods_fields && f < 4"/>
|
||||
</b-input-group-text>
|
||||
<b-input-group-text style="width: 3em" @click="removeField('foods', f)">
|
||||
<i class="fas fa-minus-circle text-primary" v-if="f == search.foods_fields && f > 1" />
|
||||
<b-input-group-text style="width: 3em"
|
||||
@click="removeField('foods', f)">
|
||||
<i class="fas fa-minus-circle text-primary"
|
||||
v-if="f == search.foods_fields && f > 1"/>
|
||||
</b-input-group-text>
|
||||
</template>
|
||||
<treeselect
|
||||
@@ -293,15 +410,24 @@
|
||||
/>
|
||||
<b-input-group-append>
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.search_foods[i].operator" name="check-button" @change="refreshData(false)" class="shadow-none" switch style="width: 5em">
|
||||
<span class="text-uppercase" v-if="search.search_foods[i].operator">{{ $t("or") }}</span>
|
||||
<b-form-checkbox v-model="search.search_foods[i].operator"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" switch style="width: 5em">
|
||||
<span class="text-uppercase"
|
||||
v-if="search.search_foods[i].operator">{{
|
||||
$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-append v-if="ui.expert_mode">
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.search_foods[i].not" name="check-button" @change="refreshData(false)" class="shadow-none">
|
||||
<b-form-checkbox v-model="search.search_foods[i].not"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none">
|
||||
<span class="text-uppercase">{{ $t("not") }}</span>
|
||||
</b-form-checkbox>
|
||||
</b-input-group-text>
|
||||
@@ -314,18 +440,23 @@
|
||||
<h6 class="mt-2 mb-0" v-if="ui.expert_mode && search.books_fields > 1">
|
||||
{{ $t("Books") }}
|
||||
</h6>
|
||||
<span class="text-sm-left text-warning" v-if="ui.expert_mode && search.books_fields > 1 && hasDuplicateFilter(search.search_books, search.books_fields)">{{
|
||||
<span class="text-sm-left text-warning"
|
||||
v-if="ui.expert_mode && search.books_fields > 1 && hasDuplicateFilter(search.search_books, search.books_fields)">{{
|
||||
$t("warning_duplicate_filter")
|
||||
}}</span>
|
||||
<div class="row" v-if="ui.show_books">
|
||||
<div class="col-12">
|
||||
<b-input-group class="mt-2" v-for="(b, i) in bookFields" :key="i">
|
||||
<template #prepend v-if="ui.expert_mode">
|
||||
<b-input-group-text style="width: 3em" @click="addField('books', b)">
|
||||
<i class="fas fa-plus-circle text-primary" v-if="b == search.books_fields && b < 4" />
|
||||
<b-input-group-text style="width: 3em"
|
||||
@click="addField('books', b)">
|
||||
<i class="fas fa-plus-circle text-primary"
|
||||
v-if="b == search.books_fields && b < 4"/>
|
||||
</b-input-group-text>
|
||||
<b-input-group-text style="width: 3em" @click="removeField('books', b)">
|
||||
<i class="fas fa-minus-circle text-primary" v-if="b == search.books_fields && b > 1" />
|
||||
<b-input-group-text style="width: 3em"
|
||||
@click="removeField('books', b)">
|
||||
<i class="fas fa-minus-circle text-primary"
|
||||
v-if="b == search.books_fields && b > 1"/>
|
||||
</b-input-group-text>
|
||||
</template>
|
||||
<generic-multiselect
|
||||
@@ -339,15 +470,24 @@
|
||||
></generic-multiselect>
|
||||
<b-input-group-append>
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.search_books[i].operator" name="check-button" @change="refreshData(false)" class="shadow-none" style="width: 5em" switch>
|
||||
<span class="text-uppercase" v-if="search.search_books[i].operator">{{ $t("or") }}</span>
|
||||
<b-form-checkbox v-model="search.search_books[i].operator"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" style="width: 5em" switch>
|
||||
<span class="text-uppercase"
|
||||
v-if="search.search_books[i].operator">{{
|
||||
$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-append v-if="ui.expert_mode">
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.search_books[i].not" name="check-button" @change="refreshData(false)" class="shadow-none">
|
||||
<b-form-checkbox v-model="search.search_books[i].not"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none">
|
||||
<span class="text-uppercase">{{ $t("not") }}</span>
|
||||
</b-form-checkbox>
|
||||
</b-input-group-text>
|
||||
@@ -371,8 +511,12 @@
|
||||
/>
|
||||
<b-input-group-append>
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.search_rating_gte" name="check-button" @change="refreshData(false)" class="shadow-none" switch style="width: 5em">
|
||||
<span class="text-uppercase" v-if="search.search_rating_gte">>=</span>
|
||||
<b-form-checkbox v-model="search.search_rating_gte"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" switch style="width: 5em">
|
||||
<span class="text-uppercase"
|
||||
v-if="search.search_rating_gte">>=</span>
|
||||
<span class="text-uppercase" v-else><=</span>
|
||||
</b-form-checkbox>
|
||||
</b-input-group-text>
|
||||
@@ -395,8 +539,13 @@
|
||||
></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" style="width: 4em" switch>
|
||||
<span class="text-uppercase" v-if="search.search_units_or">{{ $t("or") }}</span>
|
||||
<b-form-checkbox v-model="search.search_units_or"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" style="width: 4em" 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>
|
||||
@@ -406,17 +555,23 @@
|
||||
</div>
|
||||
|
||||
<!-- special switches -->
|
||||
<div class="row g-0" v-if="ui.show_timescooked || ui.show_makenow || ui.show_cookedon">
|
||||
<div class="row g-0"
|
||||
v-if="ui.show_timescooked || ui.show_makenow || ui.show_cookedon">
|
||||
<div class="col-12">
|
||||
<b-input-group class="mt-2">
|
||||
<!-- times cooked -->
|
||||
<b-input-group-prepend is-text v-if="ui.show_timescooked">
|
||||
{{ $t("times_cooked") }}
|
||||
</b-input-group-prepend>
|
||||
<b-form-input id="timescooked" type="number" min="0" v-model="search.timescooked" v-if="ui.show_timescooked"></b-form-input>
|
||||
<b-form-input id="timescooked" type="number" min="0"
|
||||
v-model="search.timescooked"
|
||||
v-if="ui.show_timescooked"></b-form-input>
|
||||
<b-input-group-append v-if="ui.show_timescooked">
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.timescooked_gte" name="check-button" @change="refreshData(false)" class="shadow-none" switch style="width: 4em">
|
||||
<b-form-checkbox v-model="search.timescooked_gte"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" switch style="width: 4em">
|
||||
<span class="text-uppercase" v-if="search.timescooked_gte">>=</span>
|
||||
<span class="text-uppercase" v-else><=</span>
|
||||
</b-form-checkbox>
|
||||
@@ -435,7 +590,10 @@
|
||||
@input="refreshData(false)"
|
||||
/>
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.cookedon_gte" name="check-button" @change="refreshData(false)" class="shadow-none" switch style="width: 4em">
|
||||
<b-form-checkbox v-model="search.cookedon_gte"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" switch style="width: 4em">
|
||||
<span class="text-uppercase" v-if="search.cookedon_gte">>=</span>
|
||||
<span class="text-uppercase" v-else><=</span>
|
||||
</b-form-checkbox>
|
||||
@@ -455,7 +613,10 @@
|
||||
@input="refreshData(false)"
|
||||
/>
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.createdon_gte" name="check-button" @change="refreshData(false)" class="shadow-none" switch style="width: 4em">
|
||||
<b-form-checkbox v-model="search.createdon_gte"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" switch style="width: 4em">
|
||||
<span class="text-uppercase" v-if="search.createdon_gte">>=</span>
|
||||
<span class="text-uppercase" v-else><=</span>
|
||||
</b-form-checkbox>
|
||||
@@ -473,7 +634,10 @@
|
||||
@input="refreshData(false)"
|
||||
/>
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.viewedon_gte" name="check-button" @change="refreshData(false)" class="shadow-none" switch style="width: 4em">
|
||||
<b-form-checkbox v-model="search.viewedon_gte"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" switch style="width: 4em">
|
||||
<span class="text-uppercase" v-if="search.viewedon_gte">>=</span>
|
||||
<span class="text-uppercase" v-else><=</span>
|
||||
</b-form-checkbox>
|
||||
@@ -491,7 +655,10 @@
|
||||
@input="refreshData(false)"
|
||||
/>
|
||||
<b-input-group-text>
|
||||
<b-form-checkbox v-model="search.updatedon_gte" name="check-button" @change="refreshData(false)" class="shadow-none" switch style="width: 4em">
|
||||
<b-form-checkbox v-model="search.updatedon_gte"
|
||||
name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" switch style="width: 4em">
|
||||
<span class="text-uppercase" v-if="search.updatedon_gte">>=</span>
|
||||
<span class="text-uppercase" v-else><=</span>
|
||||
</b-form-checkbox>
|
||||
@@ -500,7 +667,9 @@
|
||||
<b-input-group-append v-if="ui.show_makenow">
|
||||
<b-input-group-text>
|
||||
{{ $t("make_now") }}
|
||||
<b-form-checkbox v-model="search.makenow" name="check-button" @change="refreshData(false)" class="shadow-none" switch style="width: 4em" />
|
||||
<b-form-checkbox v-model="search.makenow" name="check-button"
|
||||
@change="refreshData(false)"
|
||||
class="shadow-none" switch style="width: 4em"/>
|
||||
</b-input-group-text>
|
||||
</b-input-group-append>
|
||||
</b-input-group>
|
||||
@@ -510,14 +679,16 @@
|
||||
<!-- Buttons -->
|
||||
<div class="row justify-content-end small">
|
||||
<div class="col-auto">
|
||||
<b-button class="my-0" variant="link" size="sm" @click="search.explain_visible = !search.explain_visible">
|
||||
<b-button class="my-0" variant="link" size="sm"
|
||||
@click="search.explain_visible = !search.explain_visible">
|
||||
<div v-if="!search.explain_visible">
|
||||
<i class="far fa-eye"></i>
|
||||
{{ $t("explain") }}
|
||||
</div>
|
||||
<div v-else><i class="far fa-eye-slash"></i> {{ $t("explain") }}</div>
|
||||
</b-button>
|
||||
<b-button class="my-0" variant="link" size="sm" @click="ui.expert_mode = !ui.expert_mode">
|
||||
<b-button class="my-0" variant="link" size="sm"
|
||||
@click="ui.expert_mode = !ui.expert_mode">
|
||||
<div v-if="!ui.expert_mode">
|
||||
<i class="fas fa-circle"></i>
|
||||
{{ $t("expert_mode") }}
|
||||
@@ -551,7 +722,8 @@
|
||||
and
|
||||
<b v-if="k.not">don't</b>
|
||||
contain
|
||||
<b v-if="k.operator">any</b><b v-else>all</b> of the following <span class="text-success">keywords</span>:
|
||||
<b v-if="k.operator">any</b><b
|
||||
v-else>all</b> of the following <span class="text-success">keywords</span>:
|
||||
<i>{{ k.items.flatMap((x) => x.name).join(", ") }}</i>
|
||||
<br/>
|
||||
</template>
|
||||
@@ -562,7 +734,9 @@
|
||||
and
|
||||
<b v-if="k.not">don't</b>
|
||||
contain
|
||||
<b v-if="k.operator">any</b><b v-else>all</b> of the following <span class="text-success">foods</span>:
|
||||
<b v-if="k.operator">any</b><b
|
||||
v-else>all</b> of the following <span
|
||||
class="text-success">foods</span>:
|
||||
<i>{{ k.items.flatMap((x) => x.name).join(", ") }}</i>
|
||||
<br/>
|
||||
</template>
|
||||
@@ -573,7 +747,9 @@
|
||||
and
|
||||
<b v-if="k.not">don't</b>
|
||||
contain
|
||||
<b v-if="k.operator">any</b><b v-else>all</b> of the following <span class="text-success">books</span>:
|
||||
<b v-if="k.operator">any</b><b
|
||||
v-else>all</b> of the following <span
|
||||
class="text-success">books</span>:
|
||||
<i>{{ k.items.flatMap((x) => x.name).join(", ") }}</i>
|
||||
<br/>
|
||||
</template>
|
||||
@@ -582,24 +758,30 @@
|
||||
<span v-if="search.makenow"> and you can <span class="text-success">make right now</span> (based on the on hand flag) <br/></span>
|
||||
|
||||
<span v-if="search.search_units.length > 0">
|
||||
and contain <b v-if="search.search_units_or">any</b><b v-else>all</b> of the following <span class="text-success">units</span>:
|
||||
and contain <b v-if="search.search_units_or">any</b><b
|
||||
v-else>all</b> of the following <span
|
||||
class="text-success">units</span>:
|
||||
<i>{{ search.search_units.flatMap((x) => x.name).join(", ") }}</i
|
||||
><br/>
|
||||
</span>
|
||||
|
||||
<span v-if="search.search_rating !== undefined">
|
||||
and have a <span class="text-success">rating</span> <template v-if="search.search_rating_gte">greater than</template><template v-else> less than</template> or
|
||||
and have a <span class="text-success">rating</span> <template
|
||||
v-if="search.search_rating_gte">greater than</template><template
|
||||
v-else> less than</template> or
|
||||
equal to {{ search.search_rating }}<br/>
|
||||
</span>
|
||||
|
||||
<span v-if="search.lastcooked !== undefined">
|
||||
and have been <span class="text-success">last cooked</span> <template v-if="search.lastcooked_gte"> after</template><template v-else> before</template>
|
||||
and have been <span class="text-success">last cooked</span> <template
|
||||
v-if="search.lastcooked_gte"> after</template><template v-else> before</template>
|
||||
<i>{{ search.lastcooked }}</i
|
||||
><br/>
|
||||
</span>
|
||||
|
||||
<span v-if="search.timescooked !== undefined">
|
||||
and have <span class="text-success">been cooked</span> <template v-if="search.timescooked_gte"> at least</template><template v-else> less than</template> or
|
||||
and have <span class="text-success">been cooked</span> <template
|
||||
v-if="search.timescooked_gte"> at least</template><template v-else> less than</template> or
|
||||
equal to<i>{{ search.timescooked }}</i> times <br/>
|
||||
</span>
|
||||
|
||||
@@ -617,10 +799,10 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="recipes.length > 0">
|
||||
<div class="row align-content-center">
|
||||
<div class="col col-md-6" style="margin-top: 2vh">
|
||||
<b-dropdown id="sortby" :text="sortByLabel" variant="link" toggle-class="text-decoration-none " class="m-0 p-0">
|
||||
<b-dropdown id="sortby" :text="sortByLabel" variant="link" toggle-class="text-decoration-none "
|
||||
class="m-0 p-0">
|
||||
<div v-for="o in sortOptions" :key="o.id">
|
||||
<b-dropdown-item
|
||||
v-on:click="
|
||||
@@ -635,15 +817,19 @@
|
||||
</div>
|
||||
<div class="col col-md-6 text-right" style="margin-top: 2vh">
|
||||
<span class="text-muted">
|
||||
{{ $t("Page") }} {{ search.pagination_page }}/{{ Math.ceil(pagination_count / ui.page_size) }}
|
||||
{{ $t("Page") }} {{
|
||||
search.pagination_page
|
||||
}}/{{ Math.ceil(pagination_count / ui.page_size) }}
|
||||
<a href="#" @click="resetSearch()"><i class="fas fa-times-circle"></i> {{ $t("Reset") }}</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="recipes.length > 0">
|
||||
<div class="row">
|
||||
<div class="col col-md-12">
|
||||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); grid-gap: 0.8rem">
|
||||
<div
|
||||
style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); grid-gap: 0.8rem">
|
||||
<template v-if="!searchFiltered()">
|
||||
<recipe-card
|
||||
v-bind:key="`mp_${m.id}`"
|
||||
@@ -654,14 +840,17 @@
|
||||
footer_icon="far fa-calendar-alt"
|
||||
></recipe-card>
|
||||
</template>
|
||||
<recipe-card v-for="r in recipes" v-bind:key="r.id" :recipe="r" :footer_text="isRecentOrNew(r)[0]" :footer_icon="isRecentOrNew(r)[1]"></recipe-card>
|
||||
<recipe-card v-for="r in recipes" v-bind:key="r.id" :recipe="r"
|
||||
:footer_text="isRecentOrNew(r)[0]"
|
||||
:footer_icon="isRecentOrNew(r)[1]"></recipe-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row" style="margin-top: 2vh" v-if="!random_search">
|
||||
<div class="col col-md-12">
|
||||
<b-pagination pills v-model="search.pagination_page" :total-rows="pagination_count" :per-page="ui.page_size" @change="pageChange" align="center"></b-pagination>
|
||||
<b-pagination pills v-model="search.pagination_page" :total-rows="pagination_count"
|
||||
:per-page="ui.page_size" @change="pageChange" align="center"></b-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2 d-none d-md-block"></div>
|
||||
@@ -681,7 +870,9 @@
|
||||
{{ $t("search_import_help_text") }}
|
||||
</b-card-text>
|
||||
|
||||
<b-button variant="primary" :href="resolveDjangoUrl('data_import_url')"><i class="fas fa-file-import"></i> {{ $t("Import") }} </b-button>
|
||||
<b-button variant="primary" :href="resolveDjangoUrl('data_import_url')"><i
|
||||
class="fas fa-file-import"></i> {{ $t("Import") }}
|
||||
</b-button>
|
||||
</b-card>
|
||||
|
||||
<b-card v-bind:title="$t('Create')" class="text-center">
|
||||
@@ -689,7 +880,9 @@
|
||||
{{ $t("search_create_help_text") }}
|
||||
</b-card-text>
|
||||
|
||||
<b-button variant="primary" :href="resolveDjangoUrl('new_recipe')"><i class="fas fa-plus"></i> {{ $t("Create") }} </b-button>
|
||||
<b-button variant="primary" :href="resolveDjangoUrl('new_recipe')"><i
|
||||
class="fas fa-plus"></i> {{ $t("Create") }}
|
||||
</b-button>
|
||||
</b-card>
|
||||
</b-card-group>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user