Add calculations on basket

This commit is contained in:
Ludovic CANDELLIER
2022-03-24 14:57:39 +01:00
parent 193f5cf4ad
commit c90dd98319
5 changed files with 107 additions and 17 deletions

View File

@@ -17,6 +17,7 @@ var jsCompat = [
var jsSite = [
jsBase,
jsBootstrap,
'node_modules/currency.js/dist/currency.min.js',
'build/js/site.js',
]
@@ -437,6 +438,12 @@ module.exports = function(grunt) {
src: ['**'],
dest: 'public/assets/plugins/moment',
},
{
expand: true,
cwd: 'node_modules/currency.js/dist/',
src: ['**'],
dest: 'public/assets/plugins/currency',
},
{
expand: true,
cwd: 'node_modules/bootstrap-fileinput/css/',

View File

@@ -47,6 +47,7 @@
"bootstrap4-duallistbox": "^4.0.2",
"bootstrap4-toggle": "^3.6.1",
"chart.js": "^3.3.2",
"currency.js": "^2.0.4",
"datatables.net-bs4": "1.10.18",
"datatables.net-buttons-bs4": "^1.7.1",
"datatables.net-colreorder-bs4": "^1.5.4",

View File

@@ -24,11 +24,43 @@
@include('Shop.Baskets.partials.article')
@endforeach
</div>
</div>
@endforeach
</div>
<div class="col-4">
@component('components.card')
Tarif appliqué :
<div class="row mb-3">
<div class="col-6 text-uppercase">
Tarif appliqué
</div>
<div class="col-6">
</div>
</div>
<div class="row m-3">
<div class="col-6">
<span id="basket-count"></span> ARTICLES
</div>
<div class="col-6 text-right">
<span id="basket-total"></span>
</div>
</div>
<div class="row m-3">
<div class="col-6">
LIVRAISON
</div>
<div class="col-6 text-right">
<span id="shipping">5</span>
</div>
</div>
<hr>
<div class="row m-3" style="font-size: 1.6em; font-weight: 600;">
<div class="col-6">
TOTAL TTC
</div>
<div class="col-6 text-right">
<span id="basket-total-shipped"></span>
</div>
</div>
@endcomponent
</div>
</div>
@@ -37,13 +69,61 @@
@push('js')
<script>
function handleBasket() {
calculateTotal();
$('.basket-quantity').change(function() {
var offer_id = $(this).parent('row');
console.log(offer_id);
calculatePrice($(this).parents('.basket-row'));
});
$('.basket-delete').change(function() {
$('.basket-delete').click(function() {
var offer_id = $(this).data('id');
console.log(offer_id);
var data = {offer_id: offer_id, quantity: 0};
$.post("{{ route('Shop.Basket.addBasket') }}", data, function() {
$('#basket_offer-' + offer_id).remove();
calculateTotal();
});
});
}
function calculatePrice($that) {
var quantity = $that.find('.basket-quantity').val();
var price = $that.find('.basket-price').text();
var total_price = fixNumber(quantity * price);
$that.find('.basket-total-row').html(total_price);
calculateTotal();
return total_price;
}
function calculateTotal() {
countBasket();
var total = 0;
$('.basket-total-row').each(function() {
total += parseFloat($(this).text());
});
$('#basket-total').html(fixNumber(total));
calculateTotalShipped();
return total;
}
function countBasket() {
var count = 0;
$('.basket-quantity').each(function() {
count += parseInt($(this).val());
});
$('#basket-count').html(count);
return count;
}
function calculateTotalShipped() {
var total_shipped = parseFloat($('#basket-total').html()) + 5;
$('#basket-total-shipped').html(fixNumber(total_shipped));
}
function fixNumber(value) {
return parseFloat(value).toFixed(2);
}
handleBasket();
</script>
@endpush

View File

@@ -1,4 +1,4 @@
<div class="row mb-3" id="basket_offer-{{ $item['id'] }}">
<div class="row mb-3 basket-row" id="basket_offer-{{ $item['id'] }}" data-id={{ $item['id'] }}>
<div class="col-2 text-center">
<img src="{{ $item['image'] }}" class="img-fluid">
</div>
@@ -7,7 +7,7 @@
{{ $item['variation'] }}<br/>
<div class="row">
<div class="col-6">
{{ $item['price'] }} / unité
<span class="basket-price">{{ $item['price'] }}</span> / unité
</div>
<div class="col-2">
@include('components.form.inputs.number', [
@@ -17,10 +17,10 @@
])
</div>
<div class="col-2 text-right" style="font-size: 2em;" id="basket_total-{{ $item['id'] }}">
{{ $item['quantity'] * $item['price'] }}
<span class="basket-total-row">{{ $item['quantity'] * $item['price'] }}</span>
</div>
<div class="col-2" style="font-size: 2em;">
<i class="fa fa-fw fa-trash basket-delete" data-id={{ $item['id'] }}></i>
<div class="col-2">
<i class="btn fa fa-fw fa-trash basket-delete" style="font-size: 1.6em;" data-id={{ $item['id'] }}></i>
</div>
</div>
</div>

View File

@@ -1,13 +1,15 @@
<div class="row">
<div class="col-6">
<div class="col-6 d-none">
<div id="header-favorite" class="text-light" data-refresh-url="/favorite">
<i class="fa fa-3x fa-heart"></i>
</div>
</div>
<div class="col-6">
<div class="col-6 text-center">
<div id="header-basket" class="text-light mr-3" data-refresh-url="/basket">
<a href="{{ route('Shop.Basket.basket') }}" style="color: white;">
<i class="fa fa-3x fa-shopping-basket"></i>
</a>
</div>
</div>
</div>