diff --git a/public/build/beike/shop/default/js/app.js b/public/build/beike/shop/default/js/app.js
index da464239..0469a502 100644
--- a/public/build/beike/shop/default/js/app.js
+++ b/public/build/beike/shop/default/js/app.js
@@ -2052,6 +2052,127 @@ module.exports = {
 };
 
 
+/***/ }),
+
+/***/ "./resources/beike/shop/default/js/global.js":
+/*!***************************************************!*\
+  !*** ./resources/beike/shop/default/js/global.js ***!
+  \***************************************************/
+/***/ (() => {
+
+// 创建 bk 对象
+window.bk = window.bk || {}; // 获取购物车数据
+
+bk.getCarts = function () {
+  $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 += '<div class="product-list d-flex align-items-center">';
+        html += "<div class=\"left\"><img src=\"".concat(e.image, "\" calss=\"img-fluid\"></div>");
+        html += '<div class="right flex-grow-1">';
+        html += "<div class=\"name fs-sm fw-bold mb-2\">".concat(e.name, "</div>");
+        html += '<div class="product-bottom d-flex justify-content-between align-items-center">';
+        html += "<div class=\"price\">".concat(e.price_format, " <span class=\"text-muted\">x ").concat(e.quantity, "<span></div>");
+        html += "<span class=\"offcanvas-products-delete\" data-id=\"".concat(e.cart_id, "\"><i class=\"bi bi-x-lg\"></i> \u5220\u9664</span>");
+        html += '</div>';
+        html += '</div>';
+        html += '</div>';
+      });
+      $('.offcanvas-right-products').html(html);
+    }
+  });
+}; // 加入购物车
+
+
+bk.addCart = function (sku_id) {
+  var quantity = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
+  var isBuyNow = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+  $http.post('/carts', {
+    sku_id: sku_id,
+    quantity: quantity
+  }).then(function (res) {
+    bk.getCarts();
+    layer.msg(res.message);
+
+    if (isBuyNow) {
+      location.href = 'checkout';
+    }
+  });
+}; // 滑动固定顶部
+
+
+bk.slidingFixed = function () {
+  $(document).ready(function () {
+    if (!$('.fixed-top-line').length) return;
+    if ($(window).width() < 768) return;
+    var totalWrapTop = $('.fixed-top-line').offset().top;
+    var totalWrapWidth = $('.fixed-top-line').outerWidth();
+    var totalWrapHeight = $('.fixed-top-line').outerHeight();
+    var totalWrapLeft = $('.fixed-top-line').offset().left;
+    var footerTop = $('footer').offset().top;
+    var footerMarginTop = Math.abs(parseInt($('footer').css("marginTop")));
+    $(window).scroll(function () {
+      if ($(this).scrollTop() > totalWrapTop) {
+        $('.fixed-top-line').css({
+          position: 'fixed',
+          top: 0,
+          bottom: 'auto',
+          'width': totalWrapWidth
+        });
+
+        if (!$('.total-old').length) {
+          $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
+        }
+
+        if ($(this).scrollTop() + totalWrapHeight > footerTop - footerMarginTop) {
+          $('.fixed-top-line').css({
+            position: 'absolute',
+            top: 'auto',
+            bottom: '0',
+            'width': totalWrapWidth
+          });
+        }
+      } else {
+        $('.total-old').remove();
+        $('.fixed-top-line').removeAttr('style');
+      }
+    });
+  });
+};
+
+/***/ }),
+
+/***/ "./resources/beike/shop/default/js/product.js":
+/*!****************************************************!*\
+  !*** ./resources/beike/shop/default/js/product.js ***!
+  \****************************************************/
+/***/ (() => {
+
+$(document).on('click', '.quantity-wrap .right i', function (event) {
+  event.stopPropagation();
+  var input = $(this).parent().siblings('input');
+
+  if ($(this).hasClass('bi-chevron-up')) {
+    input.val(input.val() * 1 + 1);
+    input.get(0).dispatchEvent(new Event('input'));
+    return;
+  }
+
+  if (input.val() * 1 <= input.attr('minimum') * 1) {
+    return;
+  }
+
+  input.val(input.val() * 1 - 1);
+  input.get(0).dispatchEvent(new Event('input'));
+});
+
 /***/ }),
 
 /***/ "./resources/js/http.js":
@@ -2430,6 +2551,18 @@ module.exports = JSON.parse('{"name":"axios","version":"0.21.4","description":"P
 /******/ 	}
 /******/ 	
 /************************************************************************/
+/******/ 	/* webpack/runtime/compat get default export */
+/******/ 	(() => {
+/******/ 		// getDefaultExport function for compatibility with non-harmony modules
+/******/ 		__webpack_require__.n = (module) => {
+/******/ 			var getter = module && module.__esModule ?
+/******/ 				() => (module['default']) :
+/******/ 				() => (module);
+/******/ 			__webpack_require__.d(getter, { a: getter });
+/******/ 			return getter;
+/******/ 		};
+/******/ 	})();
+/******/ 	
 /******/ 	/* webpack/runtime/define property getters */
 /******/ 	(() => {
 /******/ 		// define getter functions for harmony exports
@@ -2468,128 +2601,17 @@ var __webpack_exports__ = {};
   \************************************************/
 __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _js_http__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../../js/http */ "./resources/js/http.js");
+/* harmony import */ var _global__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./global */ "./resources/beike/shop/default/js/global.js");
+/* harmony import */ var _global__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_global__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _product__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./product */ "./resources/beike/shop/default/js/product.js");
+/* harmony import */ var _product__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_product__WEBPACK_IMPORTED_MODULE_2__);
 
-window.$http = _js_http__WEBPACK_IMPORTED_MODULE_0__["default"]; // 创建 bk 对象
-
-window.bk = window.bk || {};
-$(document).ready(function ($) {
-  $.ajaxSetup({
-    headers: {
-      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
-    },
-    beforeSend: function beforeSend() {
-      layer.load(2, {
-        shade: [0.3, '#fff']
-      });
-    },
-    complete: function complete() {
-      layer.closeAll('loading');
-    }
-  });
-  bk.getCarts();
-  $(document).on('click', '.offcanvas-products-delete', function (event) {
-    var $this = $(this);
-    var cartId = $(this).data('id');
-    $http["delete"]("/carts/".concat(cartId)).then(function (res) {
-      $this.parents('.product-list').remove();
-      $('.offcanvas-right-cart-count').html(res.data.quantity);
-      $('.offcanvas-right-cart-amount').html(res.data.amount_format);
-    });
-  });
-  $(document).on('click', '.quantity-wrap .right i', function (event) {
-    event.stopPropagation();
-    var input = $(this).parent().siblings('input');
-
-    if ($(this).hasClass('bi-chevron-up')) {
-      input.val(input.val() * 1 + 1);
-      input.get(0).dispatchEvent(new Event('input'));
-      return;
-    }
-
-    if (input.val() * 1 <= input.attr('minimum') * 1) {
-      return;
-    }
-
-    input.val(input.val() * 1 - 1);
-    input.get(0).dispatchEvent(new Event('input'));
-  }); // 滑动固定顶部
-
-  (function ($) {
-    if (!$('.fixed-top-line').length) return;
-    if ($(window).width() < 768) return;
-    var totalWrapTop = $('.fixed-top-line').offset().top;
-    var totalWrapWidth = $('.fixed-top-line').outerWidth();
-    var totalWrapHeight = $('.fixed-top-line').outerHeight();
-    var totalWrapLeft = $('.fixed-top-line').offset().left;
-    var footerTop = $('footer').offset().top;
-    var footerMarginTop = Math.abs(parseInt($('footer').css("marginTop")));
-    $(window).scroll(function () {
-      if ($(this).scrollTop() > totalWrapTop) {
-        $('.fixed-top-line').css({
-          position: 'fixed',
-          top: 0,
-          bottom: 'auto',
-          'width': totalWrapWidth
-        });
-
-        if (!$('.total-old').length) {
-          $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
-        }
-
-        if ($(this).scrollTop() + totalWrapHeight > footerTop - footerMarginTop) {
-          $('.fixed-top-line').css({
-            position: 'absolute',
-            top: 'auto',
-            bottom: '0',
-            'width': totalWrapWidth
-          });
-        }
-      } else {
-        $('.total-old').remove();
-        $('.fixed-top-line').removeAttr('style');
-      }
-    });
-  })(window.jQuery); // offcanvas-search-top
+window.$http = _js_http__WEBPACK_IMPORTED_MODULE_0__["default"];
 
 
-  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(); // 页面初始加载购物车数据
 
-bk.getCarts = function () {
-  $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 += '<div class="product-list d-flex align-items-center">';
-        html += "<div class=\"left\"><img src=\"".concat(e.image, "\" calss=\"img-fluid\"></div>");
-        html += '<div class="right flex-grow-1">';
-        html += "<div class=\"name fs-sm fw-bold mb-2\">".concat(e.name, "</div>");
-        html += '<div class="product-bottom d-flex justify-content-between align-items-center">';
-        html += "<div class=\"price\">".concat(e.price_format, " <span class=\"text-muted\">x ").concat(e.quantity, "<span></div>");
-        html += "<span class=\"offcanvas-products-delete\" data-id=\"".concat(e.cart_id, "\"><i class=\"bi bi-x-lg\"></i> \u5220\u9664</span>");
-        html += '</div>';
-        html += '</div>';
-        html += '</div>';
-      });
-      $('.offcanvas-right-products').html(html);
-    }
-  });
-};
+bk.slidingFixed();
 })();
 
 /******/ })()
diff --git a/resources/beike/shop/default/js/app.js b/resources/beike/shop/default/js/app.js
index 32602bc0..6a35abb5 100644
--- a/resources/beike/shop/default/js/app.js
+++ b/resources/beike/shop/default/js/app.js
@@ -1,111 +1,8 @@
 import http from "../../../../js/http";
 window.$http = http;
 
-// 创建 bk 对象
-window.bk = window.bk || {};
+import './global';
+import './product';
 
-$(document).ready(function ($) {
-  $.ajaxSetup({
-    headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
-    beforeSend: function() { layer.load(2, {shade: [0.3,'#fff'] }); },
-    complete: function() { layer.closeAll('loading'); },
-  });
-
-  bk.getCarts();
-
-  $(document).on('click', '.offcanvas-products-delete', function(event) {
-    const $this = $(this)
-    const cartId = $(this).data('id')
-
-    $http.delete(`/carts/${cartId}`).then((res) => {
-      $this.parents('.product-list').remove()
-      $('.offcanvas-right-cart-count').html(res.data.quantity);
-      $('.offcanvas-right-cart-amount').html(res.data.amount_format);
-    })
-  })
-
-  $(document).on('click', '.quantity-wrap .right i', function(event) {
-    event.stopPropagation();
-    let input = $(this).parent().siblings('input')
-
-    if ($(this).hasClass('bi-chevron-up')) {
-      input.val(input.val() * 1 + 1)
-      input.get(0).dispatchEvent(new Event('input'));
-      return;
-    }
-
-    if (input.val() * 1 <= input.attr('minimum') * 1) {
-      return;
-    }
-
-    input.val(input.val() * 1 - 1)
-    input.get(0).dispatchEvent(new Event('input'));
-  });
-
-  // 滑动固定顶部
-  (function ($) {
-    if (!$('.fixed-top-line').length) return;
-    if ($(window).width() < 768) return;
-    const totalWrapTop = $('.fixed-top-line').offset().top;
-    const totalWrapWidth = $('.fixed-top-line').outerWidth();
-    const totalWrapHeight = $('.fixed-top-line').outerHeight();
-    const totalWrapLeft = $('.fixed-top-line').offset().left;
-    const footerTop = $('footer').offset().top;
-    const footerMarginTop = Math.abs(parseInt($('footer').css("marginTop")));
-
-    $(window).scroll(function () {
-      if ($(this).scrollTop() > totalWrapTop) {
-        $('.fixed-top-line').css({position: 'fixed', top: 0, bottom: 'auto', 'width': totalWrapWidth})
-        if (!$('.total-old').length) {
-          $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
-        }
-
-        if ($(this).scrollTop() + totalWrapHeight > footerTop - footerMarginTop) {
-          $('.fixed-top-line').css({position: 'absolute', top: 'auto', bottom: '0', 'width': totalWrapWidth})
-        }
-      } else {
-        $('.total-old').remove();
-        $('.fixed-top-line').removeAttr('style')
-      }
-    })
-  })(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 () {
-  $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 += '<div class="product-list d-flex align-items-center">';
-          html += `<div class="left"><img src="${e.image}" calss="img-fluid"></div>`;
-          html += '<div class="right flex-grow-1">';
-            html += `<div class="name fs-sm fw-bold mb-2">${e.name}</div>`;
-            html += '<div class="product-bottom d-flex justify-content-between align-items-center">';
-              html += `<div class="price">${e.price_format} <span class="text-muted">x ${e.quantity}<span></div>`;
-              html += `<span class="offcanvas-products-delete" data-id="${e.cart_id}"><i class="bi bi-x-lg"></i> 删除</span>`;
-            html += '</div>';
-          html += '</div>';
-        html += '</div>';
-      })
-
-      $('.offcanvas-right-products').html(html)
-    }
-  })
-}
\ No newline at end of file
+bk.getCarts(); // 页面初始加载购物车数据
+bk.slidingFixed();
\ No newline at end of file
diff --git a/resources/beike/shop/default/js/global.js b/resources/beike/shop/default/js/global.js
new file mode 100644
index 00000000..21e30d54
--- /dev/null
+++ b/resources/beike/shop/default/js/global.js
@@ -0,0 +1,71 @@
+// 创建 bk 对象
+window.bk = window.bk || {};
+
+// 获取购物车数据
+bk.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 += '<div class="product-list d-flex align-items-center">';
+          html += `<div class="left"><img src="${e.image}" calss="img-fluid"></div>`;
+          html += '<div class="right flex-grow-1">';
+            html += `<div class="name fs-sm fw-bold mb-2">${e.name}</div>`;
+            html += '<div class="product-bottom d-flex justify-content-between align-items-center">';
+              html += `<div class="price">${e.price_format} <span class="text-muted">x ${e.quantity}<span></div>`;
+              html += `<span class="offcanvas-products-delete" data-id="${e.cart_id}"><i class="bi bi-x-lg"></i> 删除</span>`;
+            html += '</div>';
+          html += '</div>';
+        html += '</div>';
+      })
+
+      $('.offcanvas-right-products').html(html)
+    }
+  })
+}
+
+// 加入购物车
+bk.addCart = (sku_id, quantity = 1, isBuyNow = false) => {
+  $http.post('/carts', {sku_id, quantity}).then((res) => {
+    bk.getCarts();
+    layer.msg(res.message)
+    if (isBuyNow) {
+      location.href = 'checkout'
+    }
+  })
+}
+
+// 滑动固定顶部
+bk.slidingFixed = () => {
+  $(document).ready(() => {
+    if (!$('.fixed-top-line').length) return;
+    if ($(window).width() < 768) return;
+    const totalWrapTop = $('.fixed-top-line').offset().top;
+    const totalWrapWidth = $('.fixed-top-line').outerWidth();
+    const totalWrapHeight = $('.fixed-top-line').outerHeight();
+    const totalWrapLeft = $('.fixed-top-line').offset().left;
+    const footerTop = $('footer').offset().top;
+    const footerMarginTop = Math.abs(parseInt($('footer').css("marginTop")));
+
+    $(window).scroll(function () {
+      if ($(this).scrollTop() > totalWrapTop) {
+        $('.fixed-top-line').css({position: 'fixed', top: 0, bottom: 'auto', 'width': totalWrapWidth})
+        if (!$('.total-old').length) {
+          $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
+        }
+
+        if ($(this).scrollTop() + totalWrapHeight > footerTop - footerMarginTop) {
+          $('.fixed-top-line').css({position: 'absolute', top: 'auto', bottom: '0', 'width': totalWrapWidth})
+        }
+      } else {
+        $('.total-old').remove();
+        $('.fixed-top-line').removeAttr('style')
+      }
+    })
+  })
+};
\ No newline at end of file
diff --git a/resources/beike/shop/default/js/header.js b/resources/beike/shop/default/js/header.js
new file mode 100644
index 00000000..8ff85728
--- /dev/null
+++ b/resources/beike/shop/default/js/header.js
@@ -0,0 +1,11 @@
+// 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();
+    }
+  })
+})
\ No newline at end of file
diff --git a/resources/beike/shop/default/js/product.js b/resources/beike/shop/default/js/product.js
new file mode 100644
index 00000000..050d9e11
--- /dev/null
+++ b/resources/beike/shop/default/js/product.js
@@ -0,0 +1,17 @@
+$(document).on('click', '.quantity-wrap .right i', function(event) {
+  event.stopPropagation();
+  let input = $(this).parent().siblings('input')
+
+  if ($(this).hasClass('bi-chevron-up')) {
+    input.val(input.val() * 1 + 1)
+    input.get(0).dispatchEvent(new Event('input'));
+    return;
+  }
+
+  if (input.val() * 1 <= input.attr('minimum') * 1) {
+    return;
+  }
+
+  input.val(input.val() * 1 - 1)
+  input.get(0).dispatchEvent(new Event('input'));
+});
\ No newline at end of file
diff --git a/themes/default/product.blade.php b/themes/default/product.blade.php
index 0d6caaa6..a1d8e24c 100644
--- a/themes/default/product.blade.php
+++ b/themes/default/product.blade.php
@@ -226,13 +226,7 @@
         },
 
         addCart(isBuyNow = false) {
-          $http.post('/carts', {sku_id: this.product.id, quantity: this.quantity}).then((res) => {
-            bk.getCarts();
-            layer.msg(res.message)
-            if (isBuyNow) {
-              location.href = '{{ shop_route("checkout.index") }}'
-            }
-          })
+          bk.addCart(this.product.id, this.quantity, isBuyNow);
         },
 
         updateSelectedVariantsIndex() {