update bag when adding product

master
Gustavo Luigi 2022-08-30 10:56:44 +02:00
parent 7db0780544
commit e4497e2d3c
2 changed files with 35 additions and 30 deletions

View File

@ -54,17 +54,17 @@
<div class="row mt-5"> <div class="row mt-5">


<div class="col-6"> <div class="col-6">
<button data-bs-toggle="modal" id="btn-add-to-bag" data-id="{{$content->id}}" data-bs-target="#ShoppingCart" class="btn btn-outline-success mb-5" style="padding-top: 6px; padding-bottom: 6px; padding-right: 20px; padding-left: 20px;"> <button id="btn-add-to-bag" data-id="{{$content->id}}" class="btn btn-outline-success mb-5" style="padding-top: 6px; padding-bottom: 6px; padding-right: 20px; padding-left: 20px;">
<svg style="fill: currentColor; width: 19px; margin-right: 8px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M352 128C352 57.42 294.579 0 224 0 153.42 0 96 57.42 96 128H0v304c0 44.183 35.817 80 80 80h288c44.183 0 80-35.817 80-80V128h-96zM224 48c44.112 0 80 35.888 80 80H144c0-44.112 35.888-80 80-80zm176 384c0 17.645-14.355 32-32 32H80c-17.645 0-32-14.355-32-32V176h48v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h160v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h48v256z"/></svg> <svg style="fill: currentColor; width: 19px; margin-right: 8px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M352 128C352 57.42 294.579 0 224 0 153.42 0 96 57.42 96 128H0v304c0 44.183 35.817 80 80 80h288c44.183 0 80-35.817 80-80V128h-96zM224 48c44.112 0 80 35.888 80 80H144c0-44.112 35.888-80 80-80zm176 384c0 17.645-14.355 32-32 32H80c-17.645 0-32-14.355-32-32V176h48v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h160v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h48v256z"/></svg>
In den Einkaufswagen In den Einkaufswagen
</button> </button>
</div> </div>


<div class="col-12 col-md-6"> <div class="col-12 col-md-6">
<a href="{{url('/checkout')}}" id="btn-check-out" data-id="{{$content->id}}" class="btn btn-primary mb-5" style="padding-top: 6px; padding-bottom: 6px; padding-right: 20px; padding-left: 20px;"> <button id="btn-check-out" data-id="{{$content->id}}" class="btn btn-primary mb-5" style="padding-top: 6px; padding-bottom: 6px; padding-right: 20px; padding-left: 20px;">
<svg style="fill: white; width: 19px; margin-right: 8px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M352 128C352 57.42 294.579 0 224 0 153.42 0 96 57.42 96 128H0v304c0 44.183 35.817 80 80 80h288c44.183 0 80-35.817 80-80V128h-96zM224 48c44.112 0 80 35.888 80 80H144c0-44.112 35.888-80 80-80zm176 384c0 17.645-14.355 32-32 32H80c-17.645 0-32-14.355-32-32V176h48v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h160v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h48v256z"/></svg> <svg style="fill: white; width: 19px; margin-right: 8px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M352 128C352 57.42 294.579 0 224 0 153.42 0 96 57.42 96 128H0v304c0 44.183 35.817 80 80 80h288c44.183 0 80-35.817 80-80V128h-96zM224 48c44.112 0 80 35.888 80 80H144c0-44.112 35.888-80 80-80zm176 384c0 17.645-14.355 32-32 32H80c-17.645 0-32-14.355-32-32V176h48v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h160v40c0 13.255 10.745 24 24 24s24-10.745 24-24v-40h48v256z"/></svg>
Unverbindlich anfragen Unverbindlich anfragen
</a> </button>
</div> </div>





View File

@ -101,16 +101,13 @@
@insert("content.includes.scripts") @insert("content.includes.scripts")
<script> <script>
let objProducts = []; let objProducts = [];
function updateProductsInLocalStorage(){ localStorage.setItem("products", JSON.stringify(objProducts)); } function updateProductsInLocalStorage(){
function addToBag(productId){ localStorage.setItem("products", JSON.stringify(objProducts));
if(objProducts.indexOf(productId) == -1) objProducts.push(productId); if(objProducts.length > 0) {
updateProductsInLocalStorage();
}
$(window).on('load', function(){
if(localStorage.getItem("products") != null) objProducts = JSON.parse(localStorage.getItem("products"));
$.get("{{url('/contents/all')}}/"+objProducts.join(","), function(response, status){ $.get("{{url('/contents/all')}}/"+objProducts.join(","), function(response, status){
$('#count-products-in-bag').text(response.contents.length); $('#count-products-in-bag').text(response.contents.length);
if(response.contents.length > 0) response.contents.forEach(function(item){ $('#list-products-in-bag').html('');
response.contents.forEach(function(item){
$('#list-products-in-bag').append(` $('#list-products-in-bag').append(`
<tr> <tr>
<td class="text-start"> <td class="text-start">
@ -130,8 +127,16 @@
<td class="align-middle text-end">18,00€</td> <td class="align-middle text-end">18,00€</td>
</tr>`); </tr>`);
}); });
else $('#count-products-in-bag').hide();
}); });
}else $('#count-products-in-bag').hide();
}
function addToBag(productId){
if(objProducts.indexOf(productId) == -1) objProducts.push(productId);
updateProductsInLocalStorage();
}
$(window).on('load', function(){
if(localStorage.getItem("products") != null) objProducts = JSON.parse(localStorage.getItem("products"));
updateProductsInLocalStorage();
}); });
</script> </script>
@yield('scripts') @yield('scripts')