wuhui_zzw
/
wyyl
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add product image lazy loading

This commit is contained in:
pushuo 2023-05-04 15:06:09 +08:00 committed by Edward Yang
parent 10eb858ef1
commit 773d1469bd
5 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
public/vendor/lazysizes/lazysizes.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

2
themes/default/cart/cart.blade.php
View File

@ -47,7 +47,7 @@
<td>
<div class="d-flex align-items-center p-image">
<input class="form-check-input" type="checkbox" @change="checkedCartTr(index)" v-model="product.selected">
<div class="border d-flex align-items-center justify-content-between wh-80 ms-3"><img :src="product.image" class="img-fluid"></div>
<div class="border d-flex align-items-center justify-content-between wh-80 ms-3"><img :src="product.image_url" class="img-fluid"></div>
</div>
</td>
<td>

2
themes/default/cart/mini.blade.php
View File

@ -14,7 +14,7 @@
<i class="bi {{ $cart['selected'] ? 'bi-check-circle-fill' : 'bi-circle' }}" data-id="{{ $cart['cart_id'] }}"></i>
</div>
<div class="product-info d-flex align-items-center">
<div class="left"><a href="{{ shop_route('products.show', $cart['product_id']) }}" class="d-flex justify-content-between align-items-center h-100"><img src="{{ $cart['image'] ?: image_resize('', 160, 160) }}" class="img-fluid"></a></div>
<div class="left"><a href="{{ shop_route('products.show', $cart['product_id']) }}" class="d-flex justify-content-between align-items-center h-100"><img src="{{ $cart['image_url'] ?: image_resize('', 160, 160) }}" class="img-fluid"></a></div>
<div class="right flex-grow-1">
<a href="{{ shop_route('products.show', $cart['product_id']) }}" class="name fs-sm fw-bold mb-2 text-dark text-truncate-2" title="{{ $cart['name'] }}">{{ $cart['name'] }}</a>
<div class="text-muted mb-1 text-size-min">{{ $cart['variant_labels'] }}</div>

1
themes/default/layout/master.blade.php
View File

@ -13,6 +13,7 @@
<link rel="stylesheet" type="text/css" href="{{ mix('/build/beike/shop/'.system_setting('base.theme').'/css/bootstrap.css') }}">
<script src="{{ asset('vendor/jquery/jquery-3.6.0.min.js') }}"></script>
<script src="{{ asset('vendor/layer/3.5.1/layer.js') }}"></script>
<script src="{{ asset('vendor/lazysizes/lazysizes.min.js') }}"></script>
<link rel="shortcut icon" href="{{ image_origin(system_setting('base.favicon')) }}">
<script src="{{ asset('vendor/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ mix('/build/beike/shop/'.system_setting('base.theme').'/js/app.js') }}"></script>

6
themes/default/shared/product.blade.php
View File

@ -2,7 +2,11 @@
<div class="image">
<a href="{{ $product['url'] }}">
<div class="image-old">
<img src="{{ $product['images'][0] ?? image_resize('', 400, 400) }}" class="img-fluid">
<img
data-sizes="auto"
data-src="{{ $product['images'][0] ?? image_resize('', 400, 400) }}"
src="{{ image_resize('', 400, 400) }}"
class="img-fluid lazyload">
</div>
</a>
@if (!request('style_list') || request('style_list') == 'grid')