From 14e6055bf9459a918ccc949ba790c16eabda5fe6 Mon Sep 17 00:00:00 2001 From: pushuo <229102104@qq.com> Date: Mon, 15 Aug 2022 15:43:28 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E8=B4=AD=E7=89=A9=E8=BD=A6?= =?UTF-8?q?=20=E4=BC=98=E5=8C=96menu?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Shop/Http/Controllers/CartController.php | 7 ++-- public/build/beike/shop/default/css/app.css | 6 +-- public/build/beike/shop/default/js/app.js | 41 +++++-------------- resources/beike/shop/default/css/header.scss | 3 +- resources/beike/shop/default/js/app.js | 19 ++++----- resources/beike/shop/default/js/common.js | 23 +---------- themes/default/{ => cart}/cart.blade.php | 6 ++- themes/default/cart/mini.blade.php | 30 ++++++++++++++ themes/default/layout/header.blade.php | 34 ++++----------- 9 files changed, 70 insertions(+), 99 deletions(-) rename themes/default/{ => cart}/cart.blade.php (94%) create mode 100644 themes/default/cart/mini.blade.php diff --git a/beike/Shop/Http/Controllers/CartController.php b/beike/Shop/Http/Controllers/CartController.php index c0b35b14..8ad15953 100644 --- a/beike/Shop/Http/Controllers/CartController.php +++ b/beike/Shop/Http/Controllers/CartController.php @@ -17,7 +17,7 @@ class CartController extends Controller $data = [ 'data' => CartService::reloadData() ]; - return view("cart", $data); + return view("cart/cart", $data); } /** @@ -74,10 +74,11 @@ class CartController extends Controller * 右上角购物车 * @return array */ - public function miniCart(): array + public function miniCart() { $data = CartService::reloadData(); - return json_success('获取成功', $data); + // return json_success('获取成功', $data); + return view('cart/mini', $data); } diff --git a/public/build/beike/shop/default/css/app.css b/public/build/beike/shop/default/css/app.css index 31f252c8..4baa4679 100644 --- a/public/build/beike/shop/default/css/app.css +++ b/public/build/beike/shop/default/css/app.css @@ -505,16 +505,16 @@ header .top-wrap { background: #F7F8FA; display: flex; } -header .top-wrap .dropdown:hover { +header .top-wrap .dropdown:hover, header .header-content .dropdown:hover { background-color: #fff; } -header .top-wrap .dropdown:hover .dropdown-menu { +header .top-wrap .dropdown:hover .dropdown-menu, header .header-content .dropdown:hover .dropdown-menu { margin: 0; display: block; box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); border: none; } -header .top-wrap .dropdown:hover .dropdown-menu.dropdown-menu-end { +header .top-wrap .dropdown:hover .dropdown-menu.dropdown-menu-end, header .header-content .dropdown:hover .dropdown-menu.dropdown-menu-end { right: 0; } header .header-content { diff --git a/public/build/beike/shop/default/js/app.js b/public/build/beike/shop/default/js/app.js index 599dbf23..89be302e 100644 --- a/public/build/beike/shop/default/js/app.js +++ b/public/build/beike/shop/default/js/app.js @@ -2081,26 +2081,7 @@ __webpack_require__.r(__webpack_exports__); $http.get('carts/mini', null, { hload: true }).then(function (res) { - $('.offcanvas-right-cart-amount').html(res.data.amount_format); - - if (res.data.carts.length) { - $('.navbar-icon-link-badge').html(res.data.carts.length > 99 ? '99+' : res.data.carts.length).show(); - $('.offcanvas-right-cart-count').html(res.data.quantity); - var html = ''; - res.data.carts.forEach(function (e) { - html += '
'; - html += "
"); - html += '
'; - html += "
".concat(e.name, "
"); - html += '
'; - html += "
".concat(e.price_format, " x ").concat(e.quantity, "
"); - html += " \u5220\u9664"); - html += '
'; - html += '
'; - html += '
'; - }); - $('.offcanvas-right-products').html(html); - } + $('#offcanvas-right-cart').html(res); }); }, @@ -2712,17 +2693,15 @@ var base = document.querySelector('base').href; $(document).ready(function ($) { - $.ajaxSetup({ - headers: { - 'X-CSRF-TOKEN': token - }, - // beforeSend: function() { layer.load(2, {shade: [0.3,'#fff'] }); }, - // complete: function() { layer.closeAll('loading'); }, - error: function error(xhr, ajaxOptions, thrownError) { - if (xhr.responseJSON.message) { - layer.msg(xhr.responseJSON.message, function () {}); - } - } + $(document).on('click', '.offcanvas-products-delete', function () { + var _this = this; + + var id = $(this).data('id'); + $http["delete"]("carts/".concat(id)).then(function (res) { + $(_this).parents('.product-list').remove(); + $('.offcanvas-right-cart-count').text(res.data.quantity); + $('.offcanvas-right-cart-amount').text(res.data.amount_format); + }); }); }); bk.getCarts(); // 页面初始加载购物车数据 diff --git a/resources/beike/shop/default/css/header.scss b/resources/beike/shop/default/css/header.scss index c812d7bd..a00f8576 100644 --- a/resources/beike/shop/default/css/header.scss +++ b/resources/beike/shop/default/css/header.scss @@ -15,7 +15,9 @@ header { // max-height: 50px; background: #F7F8FA; display: flex; + } + .top-wrap, .header-content { .dropdown { &:hover { background-color: #fff; @@ -23,7 +25,6 @@ header { .dropdown-menu { margin: 0; display: block; - // box-shadow: 0 6px 6px 0 rgb(0, 0, 0, .08); box-shadow: 0 0 15px rgb(0, 0, 0, .1); border: none; diff --git a/resources/beike/shop/default/js/app.js b/resources/beike/shop/default/js/app.js index 916101a6..d67b79de 100644 --- a/resources/beike/shop/default/js/app.js +++ b/resources/beike/shop/default/js/app.js @@ -10,16 +10,15 @@ import './product'; import './header' $(document).ready(function ($) { - $.ajaxSetup({ - headers: {'X-CSRF-TOKEN': token}, - // beforeSend: function() { layer.load(2, {shade: [0.3,'#fff'] }); }, - // complete: function() { layer.closeAll('loading'); }, - error: function(xhr, ajaxOptions, thrownError) { - if (xhr.responseJSON.message) { - layer.msg(xhr.responseJSON.message,() => {}) - } - }, - }); + $(document).on('click', '.offcanvas-products-delete', function () { + const id = $(this).data('id'); + + $http.delete(`carts/${id}`).then((res) => { + $(this).parents('.product-list').remove(); + $('.offcanvas-right-cart-count').text(res.data.quantity); + $('.offcanvas-right-cart-amount').text(res.data.amount_format); + }) + }) }); bk.getCarts(); // 页面初始加载购物车数据 diff --git a/resources/beike/shop/default/js/common.js b/resources/beike/shop/default/js/common.js index 6203a95c..a190958d 100644 --- a/resources/beike/shop/default/js/common.js +++ b/resources/beike/shop/default/js/common.js @@ -12,28 +12,7 @@ export default { */ getCarts() { $http.get('carts/mini', null, {hload: true}).then((res) => { - $('.offcanvas-right-cart-amount').html(res.data.amount_format); - - if (res.data.carts.length) { - $('.navbar-icon-link-badge').html(res.data.carts.length > 99 ? '99+' : res.data.carts.length).show(); - $('.offcanvas-right-cart-count').html(res.data.quantity); - - let html = ''; - res.data.carts.forEach(e => { - html += '
'; - html += `
`; - html += '
'; - html += `
${e.name}
`; - html += '
'; - html += `
${e.price_format} x ${e.quantity}
`; - html += ` 删除`; - html += '
'; - html += '
'; - html += '
'; - }) - - $('.offcanvas-right-products').html(html) - } + $('#offcanvas-right-cart').html(res); }) }, diff --git a/themes/default/cart.blade.php b/themes/default/cart/cart.blade.php similarity index 94% rename from themes/default/cart.blade.php rename to themes/default/cart/cart.blade.php index 2368f66d..995ce2d0 100644 --- a/themes/default/cart.blade.php +++ b/themes/default/cart/cart.blade.php @@ -56,8 +56,10 @@ @{{ product.subtotal_format }} -
- +
+ diff --git a/themes/default/cart/mini.blade.php b/themes/default/cart/mini.blade.php new file mode 100644 index 00000000..2ac6d693 --- /dev/null +++ b/themes/default/cart/mini.blade.php @@ -0,0 +1,30 @@ +
+
您的购物车
+ +
+
+
+ @foreach ($carts as $cart) +
+
+
+
{{ $cart['name'] }}
+
+
{{ $cart['price_format'] }} x {{ $cart['quantity'] }}
+ 删除 +
+
+
+ @endforeach +
+
+
+
+ 小计（{{ $quantity }}） + {{ $amount_format }} +
+
+ 去结账 + 查看购物车 +
+
\ No newline at end of file diff --git a/themes/default/layout/header.blade.php b/themes/default/layout/header.blade.php index 329205f9..65bc8d97 100644 --- a/themes/default/layout/header.blade.php +++ b/themes/default/layout/header.blade.php @@ -51,24 +51,23 @@