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

搜索

This commit is contained in:
pushuo 2022-07-29 14:08:49 +08:00
parent 2120581011
commit c279cede8b
5 changed files with 76 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
public/build/beike/shop/default/css/app.css vendored
View File

@ -465,6 +465,24 @@ header .navbar-icon-link-badge {
line-height: 19px;
}
#offcanvas-search-top {
height: 100px;
justify-content: center;
}
#offcanvas-search-top .offcanvas-header {
width: 100%;
}
#offcanvas-search-top input:focus {
box-shadow: none;
}
#offcanvas-search-top .btn-close {
padding: 1rem;
opacity: 1;
}
#offcanvas-search-top .btn-close:hover {
background-color: #eee;
}
#offcanvas-right-cart .offcanvas-right-products .product-list {
padding: 1rem 0;
border-top: 1px solid #eee;

24
public/build/beike/shop/default/js/app.js vendored
View File

@ -2545,17 +2545,21 @@ $(document).ready(function ($) {
} else {
$('.total-old').remove();
$('.fixed-top-line').removeAttr('style');
} // if ($(this).scrollTop() > totalWrapTop) {
// $('.fixed-top-line').addClass('fixed-top-line-fixed').css({'left': totalWrapLeft, 'width': totalWrapWidth})
// if ($('.total-old').length > 0) return;
// $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
// } else {
// $('.total-old').remove();
// $('.fixed-top-line').removeClass('fixed-top-line-fixed').css({'left': 0, 'width': 'auto'})
// }
}
});
})(window.jQuery);
})(window.jQuery); // offcanvas-search-top
var myOffcanvas = document.getElementById('offcanvas-search-top');
myOffcanvas.addEventListener('shown.bs.offcanvas', function () {
$('#offcanvas-search-top input').focus();
$('#offcanvas-search-top input').keydown(function (e) {
if (e.keyCode == 13) {
console.log('enter');
$('#offcanvas-search-top .btn-search').click();
}
});
});
});
bk.getCarts = function () {

24
resources/beike/shop/default/css/header.scss vendored
View File

@ -90,6 +90,30 @@ header {
}
}
#offcanvas-search-top {
height: 100px;
justify-content: center;
.offcanvas-header {
width: 100%;
}
input {
&:focus {
box-shadow: none;
}
}
.btn-close {
padding: 1rem;
opacity: 1;
&:hover {
background-color: #eee;
}
}
}
#offcanvas-right-cart {
.offcanvas-right-products {
.product-list {

22
resources/beike/shop/default/js/app.js vendored
View File

@ -65,18 +65,20 @@ $(document).ready(function ($) {
$('.total-old').remove();
$('.fixed-top-line').removeAttr('style')
}
// if ($(this).scrollTop() > totalWrapTop) {
// $('.fixed-top-line').addClass('fixed-top-line-fixed').css({'left': totalWrapLeft, 'width': totalWrapWidth})
// if ($('.total-old').length > 0) return;
// $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
// } else {
// $('.total-old').remove();
// $('.fixed-top-line').removeClass('fixed-top-line-fixed').css({'left': 0, 'width': 'auto'})
// }
})
})(window.jQuery);
// offcanvas-search-top
var myOffcanvas = document.getElementById('offcanvas-search-top')
myOffcanvas.addEventListener('shown.bs.offcanvas', function () {
$('#offcanvas-search-top input').focus();
$('#offcanvas-search-top input').keydown(function (e) {
if (e.keyCode == 13) {
console.log('enter');
$('#offcanvas-search-top .btn-search').click();
}
})
})
});
bk.getCarts = function () {

23
themes/default/layout/header.blade.php
View File

@ -63,7 +63,7 @@
</div>
<div class="right-btn">
<ul class="navbar-nav flex-row">
<li class="nav-item"><a href="" class="nav-link"><i class="iconfont">&#xe8d6;</i></a></li>
<li class="nav-item"><a href="#offcanvas-search-top" data-bs-toggle="offcanvas" aria-controls="offcanvasExample" class="nav-link"><i class="iconfont">&#xe8d6;</i></a></li>
<li class="nav-item"><a href="{{ shop_route('account.wishlist.index') }}" class="nav-link"><i class="iconfont">&#xe662;</i></a></li>
<li class="nav-item dropdown">
<a href="{{ shop_route('account.index') }}" class="nav-link"><i class="iconfont">&#xe619;</i></a>
@ -82,7 +82,6 @@
</ul>
</li>
<li class="nav-item">
{{-- <a href="javascript:vido(0)" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-right-cart" aria-controls="offcanvas-right-cart" class="nav-link"><i class="iconfont">&#xe634;</i></a> --}}
<a class="nav-link" data-bs-toggle="offcanvas" href="#offcanvas-right-cart" role="button" aria-controls="offcanvasExample">
<i class="iconfont">&#xe634;</i>
<div class="navbar-icon-link-badge"></div>
@ -99,19 +98,6 @@
</div>
<div class="offcanvas-body">
<div class="offcanvas-right-products">
{{-- @for ($i = 0; $i < 20; $i++)
<div class="product-list d-flex align-items-center">
<div class="left"><img src="https://via.placeholder.com/140x140.png/eeeeee" calss="img-fluid"></div>
<div class="right flex-grow-1">
<div class="name fs-sm fw-bold mb-2">测试商品名称事实上</div>
<div class="price mb-2">22.22</div>
<div class="product-bottom d-flex justify-content-between align-items-center">
@include('shared.quantity', ['quantity' => '1'])
<span>删除</span>
</div>
</div>
</div>
@endfor --}}
</div>
</div>
<div class="offcanvas-footer">
@ -125,5 +111,12 @@
</div>
</div>
</div>
<div class="offcanvas offcanvas-top" tabindex="-1" id="offcanvas-search-top" aria-labelledby="offcanvasTopLabel">
<div class="offcanvas-header">
<input type="text" class="form-control input-group-lg border-0 fs-4" focus placeholder="Type your search here" aria-label="Type your search here" aria-describedby="button-addon2">
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
</div>
</header>