Recipe updates (#795)

This commit is contained in:
Zack Arnett 2020-04-24 11:41:57 -04:00 committed by GitHub
parent 385e7287fe
commit f076b0d0c6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 440 additions and 350 deletions

View File

@ -17,26 +17,40 @@ class RecipesController extends BaseController
$recipesResolved = $this->getRecipesService()->GetRecipesResolved();
$selectedRecipe = null;
$selectedRecipePositionsResolved = null;
if (isset($request->getQueryParams()['recipe']))
{
$selectedRecipe = $this->getDatabase()->recipes($request->getQueryParams()['recipe']);
$selectedRecipePositionsResolved = $this->getDatabase()->recipes_pos_resolved()->where('recipe_id = :1 AND is_nested_recipe_pos = 0', $request->getQueryParams()['recipe'])->orderBy('ingredient_group', 'ASC', 'product_group', 'ASC');
}
else
{
foreach ($recipes as $recipe)
{
$selectedRecipe = $recipe;
$selectedRecipePositionsResolved = $this->getDatabase()->recipes_pos_resolved()->where('recipe_id = :1 AND is_nested_recipe_pos = 0', $recipe->id)->orderBy('ingredient_group', 'ASC', 'product_group', 'ASC');
break;
}
}
$selectedRecipePositionsResolved = $this->getDatabase()->recipes_pos_resolved()->where('recipe_id = :1 AND is_nested_recipe_pos = 0', $selectedRecipe->id)->orderBy('ingredient_group', 'ASC', 'product_group', 'ASC');
$renderArray = [
'recipes' => $recipes,
'recipesResolved' => $recipesResolved,
'recipePositionsResolved' => $this->getDatabase()->recipes_pos_resolved()->where('recipe_type', RecipesService::RECIPE_TYPE_NORMAL),
'selectedRecipe' => $selectedRecipe,
'selectedRecipePositionsResolved' => $selectedRecipePositionsResolved,
'products' => $this->getDatabase()->products(),
'quantityUnits' => $this->getDatabase()->quantity_units(),
'userfields' => $this->getUserfieldsService()->GetFields('recipes'),
'userfieldValues' => $this->getUserfieldsService()->GetAllValues('recipes'),
'quantityUnitConversionsResolved' => $this->getDatabase()->quantity_unit_conversions_resolved(),
'selectedRecipeTotalCosts' => FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $selectedRecipe->id)->costs,
'selectedRecipeTotalCalories' => FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $selectedRecipe->id)->calories
];
if ($selectedRecipe)
{
$selectedRecipeSubRecipes = $this->getDatabase()->recipes()->where('id IN (SELECT includes_recipe_id FROM recipes_nestings_resolved WHERE recipe_id = :1 AND includes_recipe_id != :1)', $selectedRecipe->id)->orderBy('name')->fetchAll();
$selectedRecipeSubRecipesPositions = $this->getDatabase()->recipes_pos_resolved()->where('recipe_id = :1', $selectedRecipe->id)->orderBy('ingredient_group', 'ASC', 'product_group', 'ASC')->fetchAll();
$includedRecipeIdsAbsolute = array();
$includedRecipeIdsAbsolute[] = $selectedRecipe->id;
@ -45,38 +59,15 @@ class RecipesController extends BaseController
$includedRecipeIdsAbsolute[] = $subRecipe->id;
}
$renderArray = [
'recipes' => $recipes,
'recipesResolved' => $recipesResolved,
'recipePositionsResolved' => $this->getDatabase()->recipes_pos_resolved()->where('recipe_type', RecipesService::RECIPE_TYPE_NORMAL),
'selectedRecipe' => $selectedRecipe,
'selectedRecipePositionsResolved' => $selectedRecipePositionsResolved,
'products' => $this->getDatabase()->products(),
'quantityUnits' => $this->getDatabase()->quantity_units(),
'selectedRecipeSubRecipes' => $selectedRecipeSubRecipes,
'selectedRecipeSubRecipesPositions' => $selectedRecipeSubRecipesPositions,
'includedRecipeIdsAbsolute' => $includedRecipeIdsAbsolute,
'selectedRecipeTotalCosts' => FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $selectedRecipe->id)->costs,
'selectedRecipeTotalCalories' => FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $selectedRecipe->id)->calories,
'userfields' => $this->getUserfieldsService()->GetFields('recipes'),
'userfieldValues' => $this->getUserfieldsService()->GetAllValues('recipes'),
'quantityUnitConversionsResolved' => $this->getDatabase()->quantity_unit_conversions_resolved()
];
}
else
$allRecipePositions = array();
foreach($includedRecipeIdsAbsolute as $id)
{
$renderArray = [
'recipes' => $recipes,
'recipesResolved' => $recipesResolved,
'recipePositionsResolved' => $this->getDatabase()->recipes_pos_resolved()->where('recipe_type', RecipesService::RECIPE_TYPE_NORMAL),
'selectedRecipe' => $selectedRecipe,
'selectedRecipePositionsResolved' => $selectedRecipePositionsResolved,
'products' => $this->getDatabase()->products(),
'quantityUnits' => $this->getDatabase()->quantity_units(),
'userfields' => $this->getUserfieldsService()->GetFields('recipes'),
'userfieldValues' => $this->getUserfieldsService()->GetAllValues('recipes'),
'quantityUnitConversionsResolved' => $this->getDatabase()->quantity_unit_conversions_resolved()
];
$allRecipePositions[$id] = $this->getDatabase()->recipes_pos_resolved()->where('recipe_id = :1 AND is_nested_recipe_pos = 0', $id)->orderBy('ingredient_group', 'ASC', 'product_group', 'ASC');
}
$renderArray['selectedRecipeSubRecipes'] = $selectedRecipeSubRecipes;
$renderArray['includedRecipeIdsAbsolute'] = $includedRecipeIdsAbsolute;
$renderArray['allRecipePositions'] = $allRecipePositions;
}
return $this->renderPage($response, 'recipes', $renderArray);
@ -85,20 +76,11 @@ class RecipesController extends BaseController
public function RecipeEditForm(\Psr\Http\Message\ServerRequestInterface $request, \Psr\Http\Message\ResponseInterface $response, array $args)
{
$recipeId = $args['recipeId'];
if ($recipeId == 'new')
{
$newRecipe = $this->getDatabase()->recipes()->where('type', RecipesService::RECIPE_TYPE_NORMAL)->createRow(array(
'name' => $this->getLocalizationService()->__t('New recipe')
));
$newRecipe->save();
$recipeId = $this->getDatabase()->lastInsertId();
}
return $this->renderPage($response, 'recipeform', [
'recipe' => $this->getDatabase()->recipes($recipeId),
'recipePositions' => $this->getDatabase()->recipes_pos()->where('recipe_id', $recipeId),
'mode' => 'edit',
'mode' => $recipeId == 'new' ? "create" : "edit",
'products' => $this->getDatabase()->products()->orderBy('name'),
'quantityunits' => $this->getDatabase()->quantity_units(),
'recipePositionsResolved' => $this->getRecipesService()->GetRecipesPosResolved(),

View File

@ -31,22 +31,24 @@ a.discrete-link:focus {
text-decoration: none !important;
}
.card {
border: 2px solid;
border-color: #d6d6d6;
border-radius: 0;
.grocy-card .card-header {
background-color: inherit;
}
.card-header {
background-color: #e5e5e5;
.grocy-card .card-title {
color: #495157;
}
.card-header:first-child {
border-radius: 0;
.grocy-card .card-icons a {
font-size: 18px;
color: #495157;
padding: 2px 4px;
text-decoration: none;
text-align: center;
}
.card-body {
flex-grow: 0;
.grocy-card .card-icons i {
width: 18px;
}
.content-text .invalid-feedback {
@ -86,6 +88,11 @@ a.discrete-link:focus {
display: none;
}
.fullscreen.card .card-img-top {
width: 50%;
margin: 0 auto;
}
.form-check-input.is-valid ~ .form-check-label,
.was-validated .form-check-input:valid ~ .form-check-label {
color: inherit;
@ -505,17 +512,6 @@ canvas.drawingBuffer {
height: 1.25rem;
}
.recipe-card-name {
font-size: 16px;
text-align: center;
width: 100%;
}
.recipe-expand {
right: 1.25rem;
top: .75rem;
}
.recipe-servings-input {
width: 125px;
}
@ -523,3 +519,65 @@ canvas.drawingBuffer {
.fc-event{
cursor: pointer;
}
.grocy-tabs .nav-link {
color: #767676;
text-transform: uppercase;
}
.grocy-tabs .nav-link {
border: 2px solid transparent;
transition: border-bottom-color ease-in 0.1s;
}
.grocy-tabs .nav-link.active {
border: 2px solid transparent;
border-bottom-color: #0b024c !important;
}
.grocy-tabs .nav-link:hover {
border: 2px solid transparent;
border-bottom-color: #0b024c7d;
}
.grocy-tabs .nav-item {
margin-bottom: -2px;
}
.grocy-tabs.card-header-tabs {
margin-bottom: -.65rem;
}
.grocy-tabs.tab-content > .active {
display: flex;
flex-direction: column;
}
.recipe-card img {
height: 14rem;
width: 100%;
object-fit: cover;
}
@media print {
.grocy-tabs.print.tab-content > .tab-pane {
display: flex !important;
flex-direction: column !important;
opacity: 1 !important;
visibility: visible !important;
overflow: visible !important;
width: auto !important;
height: auto !important;
}
.grocy-tabs.break > .tab-pane {
page-break-after: always;
}
.print-view {
width: 100%;
max-width: 100%;
flex-basis: 100%;
}
}

View File

@ -1,4 +1,30 @@
$('#save-recipe-button').on('click', function(e)
function saveRecipePicture(result, location)
{
$recipeId = Grocy.EditObjectId || result.created_object_id;
Grocy.Components.UserfieldsForm.Save(() =>
{
if (jsonData.hasOwnProperty("picture_file_name") && !Grocy.DeleteRecipePictureOnSave)
{
Grocy.Api.UploadFile($("#recipe-picture")[0].files[0], 'recipepictures', jsonData.picture_file_name,
(result) =>
{
window.location.href = U(location + $recipeId);
},
(xhr) =>
{
Grocy.FrontendHelpers.EndUiBusy("recipe-form");
Grocy.FrontendHelpers.ShowGenericError('Error while saving, probably this item already exists', xhr.response)
}
);
}
else
{
window.location.href = U(location + $recipeId);
}
});
}
$('.save-recipe').on('click', function(e)
{
e.preventDefault();
@ -11,6 +37,15 @@
jsonData.picture_file_name = someRandomStuff + $("#recipe-picture")[0].files[0].name;
}
const location = $(e.currentTarget).attr('data-location') == 'return' ? '/recipes?recipe=' : '/recipe/';
if(Grocy.EditMode == 'create') {
console.log(jsonData);
Grocy.Api.Post('objects/recipes', jsonData,
(result) => saveRecipePicture(result, location));
return;
}
if (Grocy.DeleteRecipePictureOnSave)
{
jsonData.picture_file_name = null;
@ -29,30 +64,7 @@
}
Grocy.Api.Put('objects/recipes/' + Grocy.EditObjectId, jsonData,
function(result)
{
Grocy.Components.UserfieldsForm.Save(function()
{
if (jsonData.hasOwnProperty("picture_file_name") && !Grocy.DeleteRecipePictureOnSave)
{
Grocy.Api.UploadFile($("#recipe-picture")[0].files[0], 'recipepictures', jsonData.picture_file_name,
function (result)
{
window.location.href = U('/recipes?recipe=' + Grocy.EditObjectId);
},
function (xhr)
{
Grocy.FrontendHelpers.EndUiBusy("recipe-form");
Grocy.FrontendHelpers.ShowGenericError('Error while saving, probably this item already exists', xhr.response)
}
);
}
else
{
window.location.href = U('/recipes?recipe=' + Grocy.EditObjectId);
}
});
},
(result) => saveRecipePicture(result, location),
function(xhr)
{
Grocy.FrontendHelpers.EndUiBusy("recipe-form");
@ -354,7 +366,7 @@ $(window).on("message", function(e)
Grocy.Api.Put('objects/recipes/' + Grocy.EditObjectId, $('#recipe-form').serializeJSON(),
function(result)
{
window.location.href = U('/recipe/' + Grocy.EditObjectId);
// window.location.href = U('/recipe/' + Grocy.EditObjectId);
},
function(xhr)
{
@ -364,35 +376,35 @@ $(window).on("message", function(e)
}
});
Grocy.Components.RecipePicker.GetPicker().on('change', function (e)
{
var value = Grocy.Components.RecipePicker.GetValue();
if (value.toString().isEmpty())
{
return;
}
// Grocy.Components.RecipePicker.GetPicker().on('change', function (e)
// {
// var value = Grocy.Components.RecipePicker.GetValue();
// if (value.toString().isEmpty())
// {
// return;
// }
Grocy.Api.Get('objects/recipes/' + value,
function(recipe)
{
$("#includes_servings").val(recipe.servings);
},
function(xhr)
{
console.error(xhr);
}
);
});
// Grocy.Api.Get('objects/recipes/' + value,
// function(recipe)
// {
// $("#includes_servings").val(recipe.servings);
// },
// function(xhr)
// {
// console.error(xhr);
// }
// );
// });
Grocy.Components.ProductPicker.GetPicker().on('change', function(e)
{
// Just save the current recipe on every change of the product picker as a workflow could be started which leaves the page...
Grocy.Api.Put('objects/recipes/' + Grocy.EditObjectId, $('#recipe-form').serializeJSON(), function () { }, function () { });
});
// Grocy.Components.ProductPicker.GetPicker().on('change', function(e)
// {
// // Just save the current recipe on every change of the product picker as a workflow could be started which leaves the page...
// Grocy.Api.Put('objects/recipes/' + Grocy.EditObjectId, $('#recipe-form').serializeJSON(), function () { }, function () { });
// });
// As the /recipe/new route immediately creates a new recipe on load,
// always replace the current location by the created recipes edit page location
if (window.location.pathname.toLowerCase() === "/recipe/new")
{
window.history.replaceState(null, null, U("/recipe/" + Grocy.EditObjectId));
}
// if (window.location.pathname.toLowerCase() === "/recipe/new")
// {
// window.history.replaceState(null, null, U("/recipe/" + Grocy.EditObjectId));
// }

View File

@ -1,6 +1,8 @@
var recipesTables = $('#recipes-table').DataTable({
'order': [[0, 'asc']],
'order': [[1, 'asc']],
'columnDefs': [
{ 'orderable': false, 'targets': 0 },
{ 'searchable': false, "targets": 0 },
{ 'orderData': 2, 'targets': 1 }
],
'select': 'single',
@ -24,18 +26,14 @@ if (typeof recipe !== "undefined")
var rowId = "#recipe-row-" + recipe;
$(rowId).addClass("selected")
var cardId = "#recipe-card-" + recipe;
$(cardId).addClass("bg-primary").addClass("text-white");
var cardId = "#RecipeGalleryCard-" + recipe;
$(cardId).addClass("border-primary");
if ($(window).width() < 768)
{
// Scroll to recipe card on mobile
$("#selectedRecipeCard")[0].scrollIntoView();
}
else
{
$(cardId)[0].scrollIntoView();
}
}
if (GetUriParam("search") !== undefined)
@ -59,8 +57,10 @@ $("#search").on("keyup", Delay(function()
recipesTables.search(value).draw();
$(".recipe-gallery-item-container").removeClass("d-none");
$(".recipe-gallery-item-container .card-title:not(:contains_case_insensitive(" + value + "))").parent().parent().parent().parent().addClass("d-none");
$(".recipe-gallery-item").removeClass("d-none");
console.log( $(".recipe-gallery-item .card-title:not(:contains_case_insensitive(" + value + "))"));
$(".recipe-gallery-item .card-title:not(:contains_case_insensitive(" + value + "))").parent().parent().parent().addClass("d-none");
}, 200));
$("#status-filter").on("change", function()
@ -71,15 +71,13 @@ $("#status-filter").on("change", function()
value = "";
}
// Transfer CSS classes of selected element to dropdown element (for background)
$(this).attr("class", $("#" + $(this).attr("id") + " option[value='" + value + "']").attr("class") + " form-control");
recipesTables.column(4).search(value).draw();
recipesTables.column(5).search(value).draw();
});
$("#selectedRecipeDeleteButton").on('click', function(e)
$(".recipe-delete").on('click', function(e)
{
e.preventDefault();
var objectName = $(e.currentTarget).attr('data-recipe-name');
var objectId = $(e.currentTarget).attr('data-recipe-id');
@ -115,7 +113,7 @@ $("#selectedRecipeDeleteButton").on('click', function(e)
});
});
$(document).on('click', '.recipe-order-missing-button', function(e)
$(document).on('click', '.recipe-shopping-list', function(e)
{
var objectName = $(e.currentTarget).attr('data-recipe-name');
var objectId = $(e.currentTarget).attr('data-recipe-id');
@ -161,7 +159,7 @@ $(document).on('click', '.recipe-order-missing-button', function(e)
});
});
$("#selectedRecipeConsumeButton").on('click', function(e)
$(".recipe-consume").on('click', function(e)
{
var objectName = $(e.currentTarget).attr('data-recipe-name');
var objectId = $(e.currentTarget).attr('data-recipe-id');
@ -223,7 +221,7 @@ $(".recipe-gallery-item").on("click", function(e)
window.location.href = U('/recipes?tab=gallery&recipe=' + $(this).data("recipe-id"));
});
$("#selectedRecipeToggleFullscreenButton").on('click', function(e)
$(".recipe-fullscreen").on('click', function(e)
{
e.preventDefault();
@ -242,6 +240,19 @@ $("#selectedRecipeToggleFullscreenButton").on('click', function(e)
}
});
$(".recipe-print").on('click', function(e)
{
e.preventDefault();
$("#selectedRecipeCard").removeClass("fullscreen");
$("body").removeClass("fullscreen-card");
$("#selectedRecipeCard .card-header").removeClass("fixed-top");
$("#selectedRecipeCard .card-body").removeClass("mt-5");
window.history.replaceState(null, null, " ");
window.print();
});
$('#servings-scale').keyup(function(event)
{
var data = { };

View File

@ -44,7 +44,7 @@
<div class="form-group">
<label for="name">{{ $__t('Name') }}</label>
<input type="text" class="form-control" required id="name" name="name" value="@if($mode == 'edit'){{ $recipe->name }}@endif">
<input type="text" class="form-control" required id="name" name="name" placeholder="{{ $__t('New Recipe')}}" value="@if($mode == 'edit'){{ $recipe->name }}@endif">
<div class="invalid-feedback">{{ $__t('A name is required') }}</div>
</div>
@ -96,7 +96,7 @@
'products' => $products,
'isRequired' => false,
'label' => 'Produces product',
'prefillById' => $recipe->product_id,
'prefillById' => $mode == 'edit' ? $recipe->product_id : '',
'hint' => $__t('When a product is selected, one unit (per serving in purchase quantity unit) will be added to stock on consuming this recipe')
))
@ -110,12 +110,15 @@
<textarea id="description" class="form-control wysiwyg-editor" name="description">@if($mode == 'edit'){{ $recipe->description }}@endif</textarea>
</div>
<button id="save-recipe-button" class="btn btn-success mb-2">{{ $__t('Save') }}</button>
<small class="my-2 form-text text-muted @if($mode == 'edit') d-none @endif">{{ $__t('Save & Continue to add Ingredients and Included Recipes') }}</small>
<button class="save-recipe btn btn-success mb-2" data-location="continue">{{ $__t('Save & Continue') }}</button>
<button class="save-recipe btn btn-info mb-2" data-location="return">{{ $__t('Save & Return to Recipes') }}</button>
</form>
</div>
<div class="col-xs-12 col-md-5 pb-3">
<div class="col-xs-12 col-md-5 pb-3 @if($mode == 'create') d-none @endif">
<div class="row">
<div class="col">
@if(!empty($recipe->picture_file_name))

View File

@ -12,7 +12,7 @@
<div class="row">
<div class="col-xs-12 col-md-6 pb-3">
<div class="col-xs-12 col-md-6 pb-3 d-print-none">
<div>
<h2 class="title">@yield('title')</h2>
</div>
@ -50,7 +50,7 @@
</div>
</div>
<ul class="nav nav-tabs mt-3">
<ul class="nav nav-tabs mt-3 mb-1 grocy-tabs">
<li class="nav-item">
<a class="nav-link active" id="list-tab" data-toggle="tab" href="#list">{{ $__t('List') }}</a>
</li>
@ -59,12 +59,12 @@
</li>
</ul>
<div class="tab-content">
<div class="tab-content grocy-tabs">
<div class="tab-pane show active" id="list">
<table id="recipes-table" class="table table-striped dt-responsive">
<table id="recipes-table" class="table table-sm table-striped dt-responsive">
<thead>
<tr>
<th class="border-right"></th>
<th>{{ $__t('Name') }}</th>
<th>{{ $__t('Desired servings') }}</th>
<th>{{ $__t('Requirements fulfilled') }}</th>
@ -81,6 +81,14 @@
<tbody class="d-none">
@foreach($recipes as $recipe)
<tr id="recipe-row-{{ $recipe->id }}" data-recipe-id="{{ $recipe->id }}">
<td class="fit-content border-right">
<a class="btn btn-info btn-sm hide-when-embedded hide-on-fullscreen-card" href="{{ $U('/recipe/') }}{{ $recipe->id }}">
<i class="fas fa-edit"></i>
</a>
<a class="btn btn-sm btn-danger hide-when-embedded hide-on-fullscreen-card recipe-delete" href="#" data-recipe-id="{{ $recipe->id }}" data-recipe-name="{{ $recipe->name }}">
<i class="fas fa-trash"></i>
</a>
</td>
<td>
{{ $recipe->name }}
</td>
@ -115,13 +123,12 @@
</div>
<div class="tab-pane show" id="gallery">
<div class="row no-gutters">
<div class="card-columns no-gutters">
@foreach($recipes as $recipe)
<div class="col-6 recipe-gallery-item-container">
<a class="discrete-link recipe-gallery-item" data-recipe-id="{{ $recipe->id }}" href="#">
<div id="recipe-card-{{ $recipe->id }}" class="card border-white mb-0 recipe-card">
<div id="RecipeGalleryCard-{{ $recipe->id }}" class="card recipe-card">
@if(!empty($recipe->picture_file_name))
<img data-src="{{ $U('/api/files/recipepictures/' . base64_encode($recipe->picture_file_name) . '?force_serve_as=picture&best_fit_width=400') }}" class="img-fluid lazy">
<img data-src="{{ $U('/api/files/recipepictures/' . base64_encode($recipe->picture_file_name) . '?force_serve_as=picture&best_fit_width=400') }}" class="card-img-top lazy">
@endif
<div class="card-body text-center">
<h5 class="card-title mb-1">{{ $recipe->name }}</h5>
@ -132,151 +139,160 @@
</div>
</div>
</a>
</div>
@endforeach
</div>
</div>
</div>
</div>
@if($selectedRecipe !== null)
<div class="col-xs-12 col-md-6">
<div id="selectedRecipeCard" class="card">
<div class="card-header card-header-fullscreen position-relative">
<div class="position-absolute">
<a id="selectedRecipeEditButton" class="btn btn-sm btn-outline-info hide-when-embedded hide-on-fullscreen-card py-0" href="{{ $U('/recipe/') }}{{ $selectedRecipe->id }}">
<i class="fas fa-edit"></i>
</a>
<a id="selectedRecipeDeleteButton" class="btn btn-sm btn-outline-danger hide-when-embedded hide-on-fullscreen-card py-0 mr-2" href="#" data-recipe-id="{{ $selectedRecipe->id }}" data-recipe-name="{{ $selectedRecipe->name }}">
<i class="fas fa-trash"></i>
</a>
<a id="selectedRecipeConsumeButton" class="btn btn-sm btn-outline-success py-0 hide-when-embedded hide-on-fullscreen-card @if(FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $selectedRecipe->id)->need_fulfilled == 0) disabled @endif" href="#" data-toggle="tooltip" title="{{ $__t('Consume all ingredients needed by this recipe') }}" data-recipe-id="{{ $selectedRecipe->id }}" data-recipe-name="{{ $selectedRecipe->name }}">
@php
$allRecipes = $selectedRecipeSubRecipes;
array_unshift($allRecipes, $selectedRecipe);
@endphp
<div class="col-xs-12 col-md-6 print-view">
<div id="selectedRecipeCard" class="card grocy-card">
@if(count($allRecipes) > 1)
<div class="card-header card-header-fullscreen d-print-none">
<ul class="nav nav-tabs grocy-tabs card-header-tabs">
@foreach($allRecipes as $index=>$recipe)
<li class="nav-item">
<a class="nav-link @if($index == 0) active @endif" data-toggle="tab" href="#recipe-{{ $index + 1 }}">{{ $recipe->name }}</a>
</li>
@endforeach
</ul>
</div>
@endif
<div class="tab-content grocy-tabs print break">
@foreach($allRecipes as $index=>$recipe)
<div class="tab-pane @if($index == 0) active @endif" id="recipe-{{ $index + 1 }}" role="tabpanel">
@if(!empty($recipe->picture_file_name))
<img class="card-img-top lazy" src="{{ $U('/api/files/recipepictures/' . base64_encode($recipe->picture_file_name) . '?force_serve_as=picture') }}">
@endif
<div class="card-body">
<div class="shadow p-4 mb-5 bg-white rounded mt-n5 d-print-none @if(empty($recipe->picture_file_name)) d-none @endif">
<div class="d-flex justify-content-between align-items-center">
<h3 class="card-title mb-0">{{ $recipe->name }}</h3>
<div class="card-icons d-flex flex-wrap justify-content-end flex-shrink-1">
<a class="recipe-consume hide-when-embedded @if(FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $recipe->id)->need_fulfilled == 0) disabled @endif"
href="#"
data-toggle="tooltip"
title="{{ $__t('Consume all ingredients needed by this recipe') }}"
data-recipe-id="{{ $recipe->id }}"
data-recipe-name="{{ $recipe->name }}">
<i class="fas fa-utensils"></i>
</a>
<a class="btn btn-sm btn-outline-primary py-0 recipe-order-missing-button hide-when-embedded hide-on-fullscreen-card @if(FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $selectedRecipe->id)->need_fulfilled_with_shopping_list == 1) disabled @endif" href="#" data-toggle="tooltip" title="{{ $__t('Put missing products on shopping list') }}" data-recipe-id="{{ $selectedRecipe->id }}" data-recipe-name="{{ $selectedRecipe->name }}">
<a class="recipe-shopping-list hide-when-embedded @if(FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $recipe->id)->need_fulfilled_with_shopping_list == 1) disabled @endif"
href="#"
data-toggle="tooltip"
title="{{ $__t('Put missing products on shopping list') }}"
data-recipe-id="{{ $recipe->id }}"
data-recipe-name="{{ $recipe->name }}">
<i class="fas fa-cart-plus"></i>
</a>
</div>
<div class="recipe-card-name">{{ $selectedRecipe->name }}</div>
<div class="recipe-expand position-absolute">
<a id="selectedRecipeToggleFullscreenButton" class="btn btn-sm btn-outline-secondary py-0 hide-when-embedded" href="#" data-toggle="tooltip" title="{{ $__t('Expand to fullscreen') }}">
<a class="recipe-fullscreen hide-when-embedded"
href="#"
data-toggle="tooltip"
title="{{ $__t('Expand to fullscreen') }}">
<i class="fas fa-expand-arrows-alt"></i>
</a>
<a class="recipe-print hide-when-embedded" href="#" data-toggle="tooltip" title="{{ $__t('Print') }}">
<i class="fas fa-print"></i>
</a>
</div>
</div>
</div>
<div class="mb-4 @if(!empty($recipe->picture_file_name)) d-none @else d-flex @endif d-print-block justify-content-between align-items-center">
<h1 class="card-title mb-0">{{ $recipe->name }}</h1>
<div class="card-icons d-flex flex-wrap justify-content-end flex-shrink-1 d-print-none">
<a class="recipe-consume hide-when-embedded @if(FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $recipe->id)->need_fulfilled == 0) disabled @endif"
href="#"
data-toggle="tooltip"
title="{{ $__t('Consume all ingredients needed by this recipe') }}"
data-recipe-id="{{ $recipe->id }}"
data-recipe-name="{{ $recipe->name }}">
<i class="fas fa-utensils"></i>
</a>
<a class="recipe-shopping-list hide-when-embedded @if(FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $recipe->id)->need_fulfilled_with_shopping_list == 1) disabled @endif"
href="#"
data-toggle="tooltip"
title="{{ $__t('Put missing products on shopping list') }}"
data-recipe-id="{{ $recipe->id }}"
data-recipe-name="{{ $recipe->name }}">
<i class="fas fa-cart-plus"></i>
</a>
<a class="recipe-fullscreen hide-when-embedded"
href="#"
data-toggle="tooltip"
title="{{ $__t('Expand to fullscreen') }}">
<i class="fas fa-expand-arrows-alt"></i>
</a>
<a class="recipe-print hide-when-embedded PrintRecipe" href="#" data-toggle="tooltip" title="{{ $__t('Print') }}">
<i class="fas fa-print"></i>
</a>
</div>
</div>
<div class="card-body mb-0 pb-0">
@php
$calories = FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $recipe->id)->calories;
$costs = FindObjectInArrayByPropertyValue($recipesResolved, 'recipe_id', $recipe->id)->costs;
@endphp
<div class="row">
@if(!empty($selectedRecipeTotalCalories) && intval($selectedRecipeTotalCalories) > 0)
<div class="col-2">
<div class="row ml-1">
@if(!empty($calories) && intval($calories) > 0)
<div class="col-6 col-xl-3">
<label>{{ $__t('Calories') }}</label>
<p class="mb-0">
<h3 class="locale-number locale-number-generic pt-0">{{ $selectedRecipeTotalCalories }}</h3>
</p>
<h3 class="locale-number locale-number-generic pt-0">{{ $calories }}</h3>
</div>
@endif
@if(GROCY_FEATURE_FLAG_STOCK_PRICE_TRACKING)
<div class="col-6">
<div class="col-5">
<label>{{ $__t('Costs') }}&nbsp;</label>
<i class="fas fa-question-circle" data-toggle="tooltip" title="{{ $__t('Based on the prices of the last purchase per product') }}"></i>
<p class="mb-0">
<h3 class="locale-number locale-number-currency pt-0">{{ $selectedRecipeTotalCosts }}</h3>
</p>
<h3 class="locale-number locale-number-currency pt-0">{{ $costs }}</h3>
</div>
@endif
</div>
<div class="row py-3">
<div class="col-4">
@if($index == 0)
<div class="col-12 col-xl-4 d-print-none">
@include('components.numberpicker', array(
'id' => 'servings-scale',
'label' => 'Desired servings',
'min' => 1,
'value' => $selectedRecipe->desired_servings,
'value' => $recipe->desired_servings,
'invalidFeedback' => $__t('This cannot be lower than %s', '1'),
'additionalAttributes' => 'data-recipe-id="' . $selectedRecipe->id . '"',
'hint' => $__t('Base: %s', $selectedRecipe->base_servings)
'additionalAttributes' => 'data-recipe-id="' . $recipe->id . '"',
'hint' => $__t('Base: %s', $recipe->base_servings)
))
</div>
@endif
</div>
<!-- Subrecipes first -->
@foreach($selectedRecipeSubRecipes as $selectedRecipeSubRecipe)
<h3 class="mb-2">{{ $selectedRecipeSubRecipe->name }}</h3>
@if(!empty($selectedRecipeSubRecipe->picture_file_name))
<p class="w-75 mx-auto text-center"><img src="{{ $U('/api/files/recipepictures/' . base64_encode($selectedRecipeSubRecipe->picture_file_name) . '?force_serve_as=picture&best_fit_width=400') }}" class="img-fluid img-thumbnail lazy"></p>
@endif
@php $selectedRecipeSubRecipePositionsFiltered = FindAllObjectsInArrayByPropertyValue($selectedRecipeSubRecipesPositions, 'child_recipe_id', $selectedRecipeSubRecipe->id); @endphp
@if(count($selectedRecipeSubRecipePositionsFiltered) > 0)
<h5 class="mb-0">{{ $__t('Ingredients') }}</h5>
<ul class="list-group list-group-flush">
@php
$lastIngredientGroup = 'undefined';
$lastProductGroup = 'undefined';
$hasIngredientGroups = false;
$hasProductGroups = false;
$recipePositionsFiltered = FindAllObjectsInArrayByPropertyValue($allRecipePositions[$recipe->id], 'recipe_id', $recipe->id);
@endphp
@foreach($selectedRecipeSubRecipePositionsFiltered as $selectedRecipePosition)
@if($lastIngredientGroup != $selectedRecipePosition->ingredient_group && !empty($selectedRecipePosition->ingredient_group))
@php $hasIngredientGroups = true; @endphp
<h5 class="mb-2 mt-2 ml-1"><strong>{{ $selectedRecipePosition->ingredient_group }}</strong></h5>
@endif
@if(boolval($userSettings['recipe_ingredients_group_by_product_group']) && $lastProductGroup != $selectedRecipePosition->product_group && !empty($selectedRecipePosition->product_group))
@php $hasProductGroups = true; @endphp
<h6 class="mb-2 mt-2 @if($hasIngredientGroups) ml-3 @else ml-1 @endif"><strong>{{ $selectedRecipePosition->product_group }}</strong></h6>
@endif
<li class="list-group-item px-0 @if($hasIngredientGroups && $hasProductGroups) ml-4 @elseif($hasIngredientGroups || $hasProductGroups) ml-2 @else ml-0 @endif">
@php
$product = FindObjectInArrayByPropertyValue($products, 'id', $selectedRecipePosition->product_id);
$productQuConversions = FindAllObjectsInArrayByPropertyValue($quantityUnitConversionsResolved, 'product_id', $product->id);
$productQuConversions = FindAllObjectsInArrayByPropertyValue($productQuConversions, 'from_qu_id', $product->qu_id_stock);
$productQuConversion = FindObjectInArrayByPropertyValue($productQuConversions, 'to_qu_id', $selectedRecipePosition->qu_id);
if ($productQuConversion)
{
$selectedRecipePosition->recipe_amount = $selectedRecipePosition->recipe_amount * $productQuConversion->factor;
}
@endphp
@if(!empty($selectedRecipePosition->recipe_variable_amount))
{{ $selectedRecipePosition->recipe_variable_amount }}
@else
<span class="locale-number locale-number-quantity-amount">@if($selectedRecipePosition->recipe_amount == round($selectedRecipePosition->recipe_amount, 2)){{ round($selectedRecipePosition->recipe_amount, 2) }}@else{{ $selectedRecipePosition->recipe_amount }}@endif</span>
@endif
{{ $__n($selectedRecipePosition->recipe_amount, FindObjectInArrayByPropertyValue($quantityUnits, 'id', $selectedRecipePosition->qu_id)->name, FindObjectInArrayByPropertyValue($quantityUnits, 'id', $selectedRecipePosition->qu_id)->name_plural) }} {{ FindObjectInArrayByPropertyValue($products, 'id', $selectedRecipePosition->product_id)->name }}
@if($selectedRecipePosition->need_fulfilled == 1)<i class="fas fa-check text-success"></i>@elseif($selectedRecipePosition->need_fulfilled_with_shopping_list == 1)<i class="fas fa-exclamation text-warning"></i>@else<i class="fas fa-times text-danger"></i>@endif
<span class="timeago-contextual">@if(FindObjectInArrayByPropertyValue($selectedRecipeSubRecipesPositions, 'recipe_pos_id', $selectedRecipePosition->id)->need_fulfilled == 1) {{ $__t('Enough in stock') }} @else {{ $__t('Not enough in stock, %1$s missing, %2$s already on shopping list', round(FindObjectInArrayByPropertyValue($selectedRecipeSubRecipesPositions, 'recipe_pos_id', $selectedRecipePosition->id)->missing_amount, 2), round(FindObjectInArrayByPropertyValue($selectedRecipeSubRecipesPositions, 'recipe_pos_id', $selectedRecipePosition->id)->amount_on_shopping_list, 2)) }} @endif</span>
@if(!empty($selectedRecipePosition->recipe_variable_amount))
<div class="small text-muted font-italic">{{ $__t('Variable amount') }}</div>
@endif
@if(!empty($selectedRecipePosition->note))
<div class="text-muted">{!! nl2br($selectedRecipePosition->note) !!}</div>
@endif
<ul class="nav nav-tabs grocy-tabs mb-3 d-print-none" role="tablist">
@if(count($recipePositionsFiltered) > 0)
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#ingredients-{{ $index }}" role="tab">{{ $__t('Ingredients') }}</a>
</li>
@php $lastProductGroup = $selectedRecipePosition->product_group; @endphp
@php $lastIngredientGroup = $selectedRecipePosition->ingredient_group; @endphp
@endforeach
@endif
@if(!empty($recipe->description))
<li class="nav-item">
<a class="nav-link @if(count($recipePositionsFiltered) == 0) active @endif" data-toggle="tab" href="#prep-{{ $index }}" role="tab">{{ $__t('Preparation') }}</a>
</li>
@endif
</ul>
@endif
@if(!empty($selectedRecipeSubRecipe->description))
<h5 class="mt-4">{{ $__t('Preparation') }}</h5>
{!! $selectedRecipeSubRecipe->description !!}
@endif
@endforeach
<!-- Selected recipe -->
@if(!empty($selectedRecipe->picture_file_name))
<img src="{{ $U('/api/files/recipepictures/' . base64_encode($selectedRecipe->picture_file_name) . '?force_serve_as=picture&best_fit_width=400') }}"
class="img-thumbnail lazy mx-auto d-block mb-5">
@endif
@if($selectedRecipePositionsResolved->count() > 0)
<h4 class="mb-2">{{ $__t('Ingredients') }}</h4>
<div class="tab-content grocy-tabs p-2 print">
@if(count($recipePositionsFiltered) > 0)
<div class="tab-pane active" id="ingredients-{{ $index }}" role="tabpanel">
<div class="mb-2 mt-3 d-none d-print-block">
<h3 class="mb-0">{{ $__t('Ingredients') }}</h3>
</div>
<ul class="list-group list-group-flush mb-5">
@php
$lastIngredientGroup = 'undefined';
@ -284,7 +300,7 @@
$hasIngredientGroups = false;
$hasProductGroups = false;
@endphp
@foreach($selectedRecipePositionsResolved as $selectedRecipePosition)
@foreach($recipePositionsFiltered as $selectedRecipePosition)
@if($lastIngredientGroup != $selectedRecipePosition->ingredient_group && !empty($selectedRecipePosition->ingredient_group))
@php $hasIngredientGroups = true; @endphp
<h5 class="mb-2 mt-2 ml-1"><strong>{{ $selectedRecipePosition->ingredient_group }}</strong></h5>
@ -325,19 +341,21 @@
@php $lastIngredientGroup = $selectedRecipePosition->ingredient_group; @endphp
@endforeach
</ul>
</div>
@endif
<div class="tab-pane @if(count($recipePositionsFiltered) == 0) active @endif" id="prep-{{ $index }}" role="tabpanel">
<div class="mb-2 d-none d-print-block">
<h3 class="mb-0">{{ $__t('Preparation') }}</h3>
</div>
@if(!empty($recipe->description))
{!! $recipe->description !!}
@endif
</div>
</div>
</div>
</div>
@if(!empty($selectedRecipe->description))
<h4 class="mt-1 mb-2">{{ $__t('Preparation') }}</h4>
{!! $selectedRecipe->description !!}
@endif
</div>
</div>
</div>
@endif
</div>
<div id="missing-recipe-pos-list" class="list-group d-none mt-3">
<div id="missing-recipe-pos-list" class="list-group d-none mt-3">
@foreach($recipePositionsResolved as $recipePos)
@if(in_array($recipePos->recipe_id, $includedRecipeIdsAbsolute) && $recipePos->missing_amount > 0)
<a href="#" class="list-group-item list-group-item-action list-group-item-primary missing-recipe-pos-select-button">
@ -348,5 +366,11 @@
</a>
@endif
@endforeach
</div>
@endforeach
</div>
</div>
</div>
@endif
</div>
@stop