Unified product-/chore-/battery-card modal handling

This commit is contained in:
Bernd Bestel 2023-05-23 17:32:54 +02:00
parent 2633d3d1a5
commit 08c1efa0ad
No known key found for this signature in database
GPG Key ID: 71BD34C0D4891300
24 changed files with 266 additions and 343 deletions

View File

@ -114,12 +114,6 @@ $(document).on('click', '.track-charge-cycle-button', function(e)
); );
}); });
$(document).on("click", ".battery-name-cell", function(e)
{
Grocy.Components.BatteryCard.Refresh($(e.currentTarget).attr("data-battery-id"));
$("#batteriesoverview-batterycard-modal").modal("show");
});
$(document).on('click', '.battery-grocycode-label-print', function(e) $(document).on('click', '.battery-grocycode-label-print', function(e)
{ {
e.preventDefault(); e.preventDefault();

View File

@ -210,12 +210,6 @@ $(document).on('click', '.track-chore-button', function(e)
); );
}); });
$(document).on("click", ".chore-name-cell", function(e)
{
Grocy.Components.ChoreCard.Refresh($(e.currentTarget).attr("data-chore-id"));
$("#choresoverview-chorecard-modal").modal("show");
});
$(document).on('click', '.chore-grocycode-label-print', function(e) $(document).on('click', '.chore-grocycode-label-print', function(e)
{ {
e.preventDefault(); e.preventDefault();

View File

@ -24,3 +24,9 @@ Grocy.Components.BatteryCard.Refresh = function(batteryId)
} }
); );
}; };
$(document).on("click", ".batterycard-trigger", function(e)
{
Grocy.Components.BatteryCard.Refresh($(e.currentTarget).attr("data-battery-id"));
$("#batterycard-modal").modal("show");
});

View File

@ -48,3 +48,9 @@ Grocy.Components.ChoreCard.Refresh = function(choreId)
} }
); );
}; };
$(document).on("click", ".chorecard-trigger", function(e)
{
Grocy.Components.ChoreCard.Refresh($(e.currentTarget).attr("data-chore-id"));
$("#chorecard-modal").modal("show");
});

View File

@ -265,3 +265,13 @@ $("#productcard-product-description").on("hidden.bs.collapse", function()
{ {
$(".expandable-text").find("a[data-toggle='collapse']").text(__t("Show more")); $(".expandable-text").find("a[data-toggle='collapse']").text(__t("Show more"));
}) })
$(document).on("click", ".productcard-trigger", function(e)
{
var productId = $(e.currentTarget).attr("data-product-id");
if (productId != "")
{
Grocy.Components.ProductCard.Refresh(productId);
$("#productcard-modal").modal("show");
}
});

View File

@ -264,7 +264,7 @@ $(".calendar").each(function()
element.html('\ element.html('\
<div> \ <div> \
<h5 class="text-truncate mb-1 cursor-link display-product-button ' + additionalTitleCssClasses + '" data-toggle="tooltip" title="' + __t("Display product") + '" data-product-id="' + productDetails.product.id.toString() + '">' + productDetails.product.name + '</h5> \ <h5 class="text-truncate mb-1 cursor-link productcard-trigger ' + additionalTitleCssClasses + '" data-toggle="tooltip" title="' + __t("Display product") + '" data-product-id="' + productDetails.product.id.toString() + '">' + productDetails.product.name + '</h5> \
<h5 class="small text-truncate mb-1"><span class="locale-number locale-number-quantity-amount">' + mealPlanEntry.product_amount + "</span> " + __n(mealPlanEntry.product_amount, productDetails.quantity_unit_stock.name, productDetails.quantity_unit_stock.name_plural, true) + '</h5> \ <h5 class="small text-truncate mb-1"><span class="locale-number locale-number-quantity-amount">' + mealPlanEntry.product_amount + "</span> " + __n(mealPlanEntry.product_amount, productDetails.quantity_unit_stock.name, productDetails.quantity_unit_stock.name_plural, true) + '</h5> \
<h5 class="small timeago-contextual text-truncate mb-1">' + fulfillmentIconHtml + " " + fulfillmentInfoHtml + '</h5> \ <h5 class="small timeago-contextual text-truncate mb-1">' + fulfillmentIconHtml + " " + fulfillmentInfoHtml + '</h5> \
' + costsAndCaloriesPerServing + ' \ ' + costsAndCaloriesPerServing + ' \
@ -951,14 +951,6 @@ $(document).on("click", ".display-recipe-button", function(e)
); );
}); });
$(document).on("click", ".display-product-button", function(e)
{
$(".tooltip").tooltip("hide");
Grocy.Components.ProductCard.Refresh($(e.currentTarget).attr('data-product-id'));
$("#mealplan-productcard-modal").modal("show");
});
$(document).on("click", ".mealplan-entry-done-button", function(e) $(document).on("click", ".mealplan-entry-done-button", function(e)
{ {
e.preventDefault(); e.preventDefault();

View File

@ -175,9 +175,3 @@ $("#merge-products-save-button").on("click", function(e)
} }
); );
}); });
$(document).on("click", ".product-name-cell", function(e)
{
Grocy.Components.ProductCard.Refresh($(e.currentTarget).attr("data-product-id"));
$("#productcard-modal").modal("show");
});

View File

@ -58,8 +58,6 @@ Grocy.Components.ProductPicker.GetPicker().on('change', function(e)
if (productId) if (productId)
{ {
Grocy.Components.ProductCard.Refresh(productId);
Grocy.Api.Get('stock/products/' + productId, Grocy.Api.Get('stock/products/' + productId,
function(productDetails) function(productDetails)
{ {

View File

@ -145,15 +145,6 @@ $(document).on('click', '.shoppinglist-delete-button', function(e)
); );
}); });
$(document).on("click", ".product-name-cell", function(e)
{
if ($(e.currentTarget).attr("data-product-id") != "")
{
Grocy.Components.ProductCard.Refresh($(e.currentTarget).attr("data-product-id"));
$("#shoppinglist-productcard-modal").modal("show");
}
});
$(document).on('click', '#add-products-below-min-stock-amount', function(e) $(document).on('click', '#add-products-below-min-stock-amount', function(e)
{ {
Grocy.Api.Post('stock/shoppinglist/add-missing-products', { "list_id": $("#selected-shopping-list").val() }, Grocy.Api.Post('stock/shoppinglist/add-missing-products', { "list_id": $("#selected-shopping-list").val() },

View File

@ -151,12 +151,6 @@ $(document).on('click', '.product-open-button', function(e)
); );
}); });
$(document).on("click", ".stock-name-cell", function(e)
{
Grocy.Components.ProductCard.Refresh($(e.currentTarget).attr("data-stock-id"));
$("#stockentry-productcard-modal").modal("show");
});
$(document).on('click', '.stockentry-grocycode-label-print', function(e) $(document).on('click', '.stockentry-grocycode-label-print', function(e)
{ {
e.preventDefault(); e.preventDefault();
@ -337,9 +331,3 @@ function UndoStockBookingEntry(bookingId, stockRowId)
} }
); );
}; };
$(document).on("click", ".product-name-cell", function(e)
{
Grocy.Components.ProductCard.Refresh($(e.currentTarget).attr("data-product-id"));
$("#productcard-modal").modal("show");
});

View File

@ -144,9 +144,3 @@ $(document).on('click', '.product-grocycode-label-print', function(e)
} }
}); });
}); });
$(document).on("click", ".product-name-cell", function(e)
{
Grocy.Components.ProductCard.Refresh($(e.currentTarget).attr("data-product-id"));
$("#stockjournal-productcard-modal").modal("show");
});

View File

@ -229,12 +229,6 @@ $(document).on('click', '.product-open-button', function(e)
); );
}); });
$(document).on("click", ".product-name-cell", function(e)
{
Grocy.Components.ProductCard.Refresh($(e.currentTarget).attr("data-product-id"));
$("#stockoverview-productcard-modal").modal("show");
});
function RefreshStatistics() function RefreshStatistics()
{ {
Grocy.Api.Get('stock', Grocy.Api.Get('stock',

View File

@ -129,7 +129,7 @@
<i class="fa-solid fa-ellipsis-v"></i> <i class="fa-solid fa-ellipsis-v"></i>
</button> </button>
<div class="table-inline-menu dropdown-menu dropdown-menu-right"> <div class="table-inline-menu dropdown-menu dropdown-menu-right">
<a class="dropdown-item battery-name-cell" <a class="dropdown-item batterycard-trigger"
data-battery-id="{{ $currentBatteryEntry->battery_id }}" data-battery-id="{{ $currentBatteryEntry->battery_id }}"
type="button" type="button"
href="#"> href="#">
@ -162,7 +162,7 @@
</div> </div>
</div> </div>
</td> </td>
<td class="battery-name-cell cursor-link" <td class="batterycard-trigger cursor-link"
data-battery-id="{{ $currentBatteryEntry->battery_id }}"> data-battery-id="{{ $currentBatteryEntry->battery_id }}">
{{ FindObjectInArrayByPropertyValue($batteries, 'id', $currentBatteryEntry->battery_id)->name }} {{ FindObjectInArrayByPropertyValue($batteries, 'id', $currentBatteryEntry->battery_id)->name }}
</td> </td>
@ -204,20 +204,7 @@
</div> </div>
</div> </div>
<div class="modal fade" @include('components.batterycard', [
id="batteriesoverview-batterycard-modal" 'asModal' => true
tabindex="-1"> ])
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@include('components.batterycard')
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div>
@stop @stop

View File

@ -174,7 +174,7 @@
<span>{{ $__t('Reschedule next execution') }}</span> <span>{{ $__t('Reschedule next execution') }}</span>
</a> </a>
<div class="dropdown-divider"></div> <div class="dropdown-divider"></div>
<a class="dropdown-item chore-name-cell" <a class="dropdown-item chorecard-trigger"
data-chore-id="{{ $curentChoreEntry->chore_id }}" data-chore-id="{{ $curentChoreEntry->chore_id }}"
type="button" type="button"
href="#"> href="#">
@ -207,7 +207,7 @@
</div> </div>
</div> </div>
</td> </td>
<td class="chore-name-cell cursor-link" <td class="chorecard-trigger cursor-link"
data-chore-id="{{ $curentChoreEntry->chore_id }}"> data-chore-id="{{ $curentChoreEntry->chore_id }}">
{{ FindObjectInArrayByPropertyValue($chores, 'id', $curentChoreEntry->chore_id)->name }} {{ FindObjectInArrayByPropertyValue($chores, 'id', $curentChoreEntry->chore_id)->name }}
</td> </td>
@ -286,22 +286,9 @@
</div> </div>
</div> </div>
<div class="modal fade" @include('components.chorecard', [
id="choresoverview-chorecard-modal" 'asModal' => true
tabindex="-1"> ])
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@include('components.chorecard')
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div>
<div class="modal fade" <div class="modal fade"
id="reschedule-chore-modal" id="reschedule-chore-modal"

View File

@ -4,7 +4,18 @@
@endpush @endpush
@endonce @endonce
<div class="card batterycard"> @php if(!isset($asModal)) { $asModal = false; } @endphp
@if($asModal)
<div class="modal fade"
id="batterycard-modal"
tabindex="-1">
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@endif
<div class="card batterycard">
<div class="card-header"> <div class="card-header">
<span class="float-left">{{ $__t('Battery overview') }}</span> <span class="float-left">{{ $__t('Battery overview') }}</span>
<a id="batterycard-battery-edit-button" <a id="batterycard-battery-edit-button"
@ -28,4 +39,16 @@
<strong>{{ $__t('Last charged') }}:</strong> <span id="batterycard-battery-last-charged"></span> <time id="batterycard-battery-last-charged-timeago" <strong>{{ $__t('Last charged') }}:</strong> <span id="batterycard-battery-last-charged"></span> <time id="batterycard-battery-last-charged-timeago"
class="timeago timeago-contextual"></time><br> class="timeago timeago-contextual"></time><br>
</div> </div>
</div>
@if($asModal)
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div> </div>
@endif

View File

@ -4,7 +4,18 @@
@endpush @endpush
@endonce @endonce
<div class="card chorecard"> @php if(!isset($asModal)) { $asModal = false; } @endphp
@if($asModal)
<div class="modal fade"
id="chorecard-modal"
tabindex="-1">
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@endif
<div class="card chorecard">
<div class="card-header"> <div class="card-header">
<span class="float-left">{{ $__t('Chore overview') }}</span> <span class="float-left">{{ $__t('Chore overview') }}</span>
<a id="chorecard-chore-edit-button" <a id="chorecard-chore-edit-button"
@ -35,4 +46,16 @@
<strong>{{ $__t('Last done by') }}:</strong> <span id="chorecard-chore-last-done-by"></span> <strong>{{ $__t('Last done by') }}:</strong> <span id="chorecard-chore-last-done-by"></span>
@endif @endif
</div> </div>
</div>
@if($asModal)
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div> </div>
@endif

View File

@ -6,7 +6,18 @@
@endpush @endpush
@endonce @endonce
<div class="card productcard"> @php if(!isset($asModal)) { $asModal = false; } @endphp
@if($asModal)
<div class="modal fade"
id="productcard-modal"
tabindex="-1">
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@endif
<div class="card productcard">
<div class="card-header"> <div class="card-header">
<span class="float-left">{{ $__t('Product overview') }}</span> <span class="float-left">{{ $__t('Product overview') }}</span>
<a id="productcard-product-edit-button" <a id="productcard-product-edit-button"
@ -94,4 +105,16 @@
class="font-italic d-none">{{ $__t('No price history available') }}</span> class="font-italic d-none">{{ $__t('No price history available') }}</span>
@endif @endif
</div> </div>
</div>
@if($asModal)
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div> </div>
@endif

View File

@ -356,20 +356,7 @@
</div> </div>
</div> </div>
<div class="modal fade" @include('components.productcard', [
id="mealplan-productcard-modal" 'asModal' => true
tabindex="-1"> ])
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@include('components.productcard')
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div>
@stop @stop

View File

@ -174,7 +174,7 @@
</div> </div>
</div> </div>
</td> </td>
<td class="product-name-cell cursor-link" <td class="productcard-trigger cursor-link"
data-product-id="{{ $product->id }}"> data-product-id="{{ $product->id }}">
{{ $product->name }} {{ $product->name }}
@if(!empty($product->picture_file_name)) @if(!empty($product->picture_file_name))
@ -285,20 +285,7 @@
</div> </div>
</div> </div>
<div class="modal fade" @include('components.productcard', [
id="productcard-modal" 'asModal' => true
tabindex="-1"> ])
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@include('components.productcard')
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div>
@stop @stop

View File

@ -136,9 +136,5 @@
</form> </form>
</div> </div>
<div class="col-12 col-md-6 col-xl-4 hide-when-embedded">
@include('components.productcard')
</div>
</div> </div>
@stop @stop

View File

@ -227,7 +227,7 @@
<i class="fa-solid fa-box"></i> <i class="fa-solid fa-box"></i>
</a> </a>
</td> </td>
<td class="product-name-cell cursor-link" <td class="productcard-trigger cursor-link"
data-product-id="{{ $listItem->product_id }}"> data-product-id="{{ $listItem->product_id }}">
@if(!empty($listItem->product_id)) {{ $listItem->product_name }}<br>@endif<em>{!! nl2br($listItem->note ?? '') !!}</em> @if(!empty($listItem->product_id)) {{ $listItem->product_name }}<br>@endif<em>{!! nl2br($listItem->note ?? '') !!}</em>
</td> </td>
@ -426,20 +426,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="modal fade"
id="shoppinglist-productcard-modal" @include('components.productcard', [
tabindex="-1"> 'asModal' => true
<div class="modal-dialog"> ])
<div class="modal-content text-center">
<div class="modal-body">
@include('components.productcard')
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div>
@stop @stop

View File

@ -199,7 +199,7 @@
</a> </a>
@endif @endif
<div class="dropdown-divider"></div> <div class="dropdown-divider"></div>
<a class="dropdown-item product-name-cell" <a class="dropdown-item productcard-trigger"
data-product-id="{{ $stockEntry->product_id }}" data-product-id="{{ $stockEntry->product_id }}"
type="button" type="button"
href="#"> href="#">
@ -247,7 +247,7 @@
data-product-id="{{ $stockEntry->product_id }}"> data-product-id="{{ $stockEntry->product_id }}">
{{ $stockEntry->product_id }} {{ $stockEntry->product_id }}
</td> </td>
<td class="product-name-cell cursor-link" <td class="productcard-trigger cursor-link"
data-product-id="{{ $stockEntry->product_id }}"> data-product-id="{{ $stockEntry->product_id }}">
{{ FindObjectInArrayByPropertyValue($products, 'id', $stockEntry->product_id)->name }} {{ FindObjectInArrayByPropertyValue($products, 'id', $stockEntry->product_id)->name }}
</td> </td>
@ -319,20 +319,7 @@
</div> </div>
</div> </div>
<div class="modal fade" @include('components.productcard', [
id="productcard-modal" 'asModal' => true
tabindex="-1"> ])
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@include('components.productcard')
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div>
@stop @stop

View File

@ -217,7 +217,7 @@
</a> </a>
@endif @endif
<div class="dropdown-divider"></div> <div class="dropdown-divider"></div>
<a class="dropdown-item product-name-cell" <a class="dropdown-item productcard-trigger"
data-product-id="{{ $stockLogEntry->product_id }}" data-product-id="{{ $stockLogEntry->product_id }}"
type="button" type="button"
href="#"> href="#">
@ -256,7 +256,7 @@
</div> </div>
</div> </div>
</td> </td>
<td class="product-name-cell cursor-link" <td class="productcard-trigger cursor-link"
data-product-id="{{ $stockLogEntry->product_id }}"> data-product-id="{{ $stockLogEntry->product_id }}">
<span class="name-anchor @if($stockLogEntry->undone == 1) text-strike-through @endif">{{ $stockLogEntry->product_name }}</span> <span class="name-anchor @if($stockLogEntry->undone == 1) text-strike-through @endif">{{ $stockLogEntry->product_name }}</span>
@if($stockLogEntry->undone == 1) @if($stockLogEntry->undone == 1)
@ -301,20 +301,7 @@
</div> </div>
</div> </div>
<div class="modal fade" @include('components.productcard', [
id="stockjournal-productcard-modal" 'asModal' => true
tabindex="-1"> ])
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@include('components.productcard')
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div>
@stop @stop

View File

@ -279,7 +279,7 @@
</a> </a>
@endif @endif
<div class="dropdown-divider"></div> <div class="dropdown-divider"></div>
<a class="dropdown-item product-name-cell" <a class="dropdown-item productcard-trigger"
data-product-id="{{ $currentStockEntry->product_id }}" data-product-id="{{ $currentStockEntry->product_id }}"
type="button" type="button"
href="#"> href="#">
@ -323,7 +323,7 @@
</div> </div>
</div> </div>
</td> </td>
<td class="product-name-cell cursor-link" <td class="productcard-trigger cursor-link"
data-product-id="{{ $currentStockEntry->product_id }}"> data-product-id="{{ $currentStockEntry->product_id }}">
{{ $currentStockEntry->product_name }} {{ $currentStockEntry->product_name }}
<span class="d-none">{{ $currentStockEntry->product_barcodes }}</span> <span class="d-none">{{ $currentStockEntry->product_barcodes }}</span>
@ -428,7 +428,7 @@
<td> <td>
{!! $currentStockEntry->product_description !!} {!! $currentStockEntry->product_description !!}
</td> </td>
<td class="product-name-cell cursor-link" <td class="productcard-trigger cursor-link"
data-product-id="{{ $currentStockEntry->parent_product_id }}"> data-product-id="{{ $currentStockEntry->parent_product_id }}">
{{ $currentStockEntry->parent_product_name }} {{ $currentStockEntry->parent_product_name }}
</td> </td>
@ -465,20 +465,7 @@
</div> </div>
</div> </div>
<div class="modal fade" @include('components.productcard', [
id="stockoverview-productcard-modal" 'asModal' => true
tabindex="-1"> ])
<div class="modal-dialog">
<div class="modal-content text-center">
<div class="modal-body">
@include('components.productcard')
</div>
<div class="modal-footer">
<button type="button"
class="btn btn-secondary"
data-dismiss="modal">{{ $__t('Close') }}</button>
</div>
</div>
</div>
</div>
@stop @stop