From 33a887c5f279dfd01e1b3659e352b481945a8fa0 Mon Sep 17 00:00:00 2001
From: pushuo <229102104@qq.com>
Date: Wed, 29 Jun 2022 13:53:26 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E8=B4=AD=E7=89=A9=E8=BD=A6?=
 =?UTF-8?q?=E5=92=8C=E7=BB=93=E8=B4=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/build/beike/shop/default/css/app.css   | 20 +++++++++++--
 .../beike/shop/default/css/bootstrap.css      | 30 +++++++++++--------
 .../shop/default/css/bootstrap/bootstrap.scss | 17 ++++++++++-
 resources/beike/shop/default/css/cart.scss    |  8 ++++-
 resources/beike/shop/default/css/header.scss  |  6 ++++
 .../beike/shop/default/css/page-checkout.scss |  9 +++++-
 themes/default/cart.blade.php                 | 18 +++++++++++
 themes/default/checkout.blade.php             | 17 +++++++++++
 themes/default/layout/header.blade.php        | 13 +++++---
 9 files changed, 117 insertions(+), 21 deletions(-)

diff --git a/public/build/beike/shop/default/css/app.css b/public/build/beike/shop/default/css/app.css
index 40a6ff2b..a57f6c4a 100644
--- a/public/build/beike/shop/default/css/app.css
+++ b/public/build/beike/shop/default/css/app.css
@@ -118,9 +118,14 @@ header {
 body:not(.page-home) header {
   box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.04);
 }
+header .dropdown:hover {
+  background-color: #fff;
+}
 header .dropdown:hover .dropdown-menu {
   margin: 0;
   display: block;
+  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
+  border: none;
 }
 header .dropdown:hover .dropdown-menu.dropdown-menu-end {
   right: 0;
@@ -432,12 +437,17 @@ body.page-cart .cart-products-wrap .table .p-image input {
 }
 body.page-cart .cart-products-wrap .table .p-image img {
   max-width: 80px;
-  margin-left: 10px;
+  margin-left: 14px;
 }
 body.page-cart .total-wrap {
   border: none;
   background-color: #F8F9FA;
 }
+body.page-cart .total-wrap.total-wrap-fixed {
+  position: fixed;
+  top: 0;
+  right: 0;
+}
 body.page-cart .total-wrap .card-header {
   padding-top: 1rem;
   border-bottom: none;
@@ -468,6 +478,10 @@ body.page-checkout .total-wrap {
   padding: 1.4rem;
   border: 3px solid #efefef;
 }
+body.page-checkout .total-wrap.total-wrap-fixed {
+  position: fixed;
+  top: 0;
+}
 body.page-checkout .total-wrap .card-body {
   padding: 0;
 }
@@ -484,12 +498,14 @@ body.page-checkout .total-wrap .products-wrap {
   border-bottom: 1px solid #E6E6E6;
   margin-bottom: 1.3rem;
   padding-bottom: 0.3rem;
+  max-height: 380px;
+  overflow-y: auto;
 }
 body.page-checkout .total-wrap .products-wrap .item {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  margin-bottom: 1rem;
+  margin-bottom: 0.8rem;
 }
 body.page-checkout .total-wrap .products-wrap .item .image {
   display: flex;
diff --git a/public/build/beike/shop/default/css/bootstrap.css b/public/build/beike/shop/default/css/bootstrap.css
index 8088a9c2..5f058900 100644
--- a/public/build/beike/shop/default/css/bootstrap.css
+++ b/public/build/beike/shop/default/css/bootstrap.css
@@ -9207,18 +9207,18 @@ textarea.form-control-lg {
 .form-check {
   display: block;
   min-height: 1.2rem;
-  padding-left: 1.5em;
+  padding-left: 1.7em;
   margin-bottom: 0.125rem;
 }
 .form-check .form-check-input {
   float: left;
-  margin-left: -1.5em;
+  margin-left: -1.7em;
 }
 
 .form-check-input {
-  width: 1em;
-  height: 1em;
-  margin-top: 0.25em;
+  width: 1.2em;
+  height: 1.2em;
+  margin-top: 0.15em;
   vertical-align: top;
   background-color: #fff;
   background-repeat: no-repeat;
@@ -9232,7 +9232,7 @@ textarea.form-control-lg {
           color-adjust: exact;
 }
 .form-check-input[type=checkbox] {
-  border-radius: 0.25em;
+  border-radius: 0;
 }
 .form-check-input[type=radio] {
   border-radius: 50%;
@@ -10306,7 +10306,7 @@ textarea.form-control-lg {
   list-style: none;
   background-color: #fff;
   background-clip: padding-box;
-  border: 1px solid rgba(0, 0, 0, 0.15);
+  border: 1px solid rgba(0, 0, 0, 0.1);
   border-radius: 0;
 }
 .dropdown-menu[data-bs-popper] {
@@ -10496,13 +10496,13 @@ textarea.form-control-lg {
   height: 0;
   margin: 0.5rem 0;
   overflow: hidden;
-  border-top: 1px solid rgba(0, 0, 0, 0.15);
+  border-top: 1px solid rgba(0, 0, 0, 0.1);
 }
 
 .dropdown-item {
   display: block;
   width: 100%;
-  padding: 0.25rem 1rem;
+  padding: 0.4rem 1rem;
   clear: both;
   font-weight: 400;
   color: #212529;
@@ -10541,14 +10541,14 @@ textarea.form-control-lg {
 
 .dropdown-item-text {
   display: block;
-  padding: 0.25rem 1rem;
+  padding: 0.4rem 1rem;
   color: #212529;
 }
 
 .dropdown-menu-dark {
   color: #dee2e6;
   background-color: #343a40;
-  border-color: rgba(0, 0, 0, 0.15);
+  border-color: rgba(0, 0, 0, 0.1);
 }
 .dropdown-menu-dark .dropdown-item {
   color: #dee2e6;
@@ -10565,7 +10565,7 @@ textarea.form-control-lg {
   color: #adb5bd;
 }
 .dropdown-menu-dark .dropdown-divider {
-  border-color: rgba(0, 0, 0, 0.15);
+  border-color: rgba(0, 0, 0, 0.1);
 }
 .dropdown-menu-dark .dropdown-item-text {
   color: #dee2e6;
@@ -18026,3 +18026,9 @@ textarea.form-control-lg {
   padding-right: 50px;
   padding-left: 50px;
 }
+
+.dropdown .dropdown-divider {
+  margin-left: 1rem;
+  margin-right: 1rem;
+  opacity: 0.1;
+}
diff --git a/resources/beike/shop/default/css/bootstrap/bootstrap.scss b/resources/beike/shop/default/css/bootstrap/bootstrap.scss
index b8fd28fc..0dff6df5 100644
--- a/resources/beike/shop/default/css/bootstrap/bootstrap.scss
+++ b/resources/beike/shop/default/css/bootstrap/bootstrap.scss
@@ -11,8 +11,11 @@
 $primary: #fd560f;
 $font-size-base: 0.8rem;
 
-// Breadcrumbs
+$border-radius: 0;
+$form-check-input-width: 1.2em;
+$form-check-input-border-radius: 0;
 
+// Breadcrumbs
 // scss-docs-start breadcrumb-variables
 // $breadcrumb-font-size:              null !default;
 $breadcrumb-padding-y:              1.4rem;
@@ -34,6 +37,7 @@ $input-btn-font-size:         0.9rem;
 $link-decoration: none;
 $link-color: #1f1f1f;
 $link-hover-color: $primary;
+$btn-focus-box-shadow: 0  0 11px 0 rgba($color: $primary, $alpha: .1);
 $input-btn-focus-box-shadow:  0  0 11px 0 rgba($color: $primary, $alpha: .1);
 $form-select-focus-box-shadow: 0  0 11px 0 rgba($color: $primary, $alpha: .1);
 $btn-focus-box-shadow: 0  0 11px 0 rgba($color: $primary, $alpha: .1);
@@ -43,6 +47,9 @@ $form-floating-input-padding-b:   .625rem;
 $form-floating-padding-y:         .8rem;
 $form-floating-height:        50px;
 
+$dropdown-border-color: rgba(0, 0, 0, 0.1);
+$dropdown-item-padding-y: .4rem;
+// $dropdown-divider-bg:               rgba(0, 0, 0, 0.1);
 @import './bootstrap-icons';
 @import 'node_modules/bootstrap-5.1.3/scss/bootstrap';
 
@@ -53,4 +60,12 @@ $form-floating-height:        50px;
 .container-fluid {
   padding-right: 50px;
   padding-left: 50px;
+}
+
+.dropdown {
+  .dropdown-divider {
+    margin-left: 1rem;
+    margin-right: 1rem;
+    opacity: .1;
+  }
 }
\ No newline at end of file
diff --git a/resources/beike/shop/default/css/cart.scss b/resources/beike/shop/default/css/cart.scss
index 35031887..4e0a27ee 100644
--- a/resources/beike/shop/default/css/cart.scss
+++ b/resources/beike/shop/default/css/cart.scss
@@ -28,7 +28,7 @@ body.page-cart {
 
         img {
           max-width: 80px;
-          margin-left: 10px;
+          margin-left: 14px;
         }
       }
     }
@@ -38,6 +38,12 @@ body.page-cart {
     border: none;
     background-color: #F8F9FA;
 
+    &.total-wrap-fixed {
+      position: fixed;
+      top: 0;
+      right: 0;
+    }
+
     .card-header {
       padding-top: 1rem;
       border-bottom: none;
diff --git a/resources/beike/shop/default/css/header.scss b/resources/beike/shop/default/css/header.scss
index 940cdd13..b131b5e5 100644
--- a/resources/beike/shop/default/css/header.scss
+++ b/resources/beike/shop/default/css/header.scss
@@ -10,9 +10,15 @@ header {
 
   .dropdown {
     &:hover {
+      background-color: #fff;
+
       .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;
+
         &.dropdown-menu-end {
           right: 0;
         }
diff --git a/resources/beike/shop/default/css/page-checkout.scss b/resources/beike/shop/default/css/page-checkout.scss
index dd7c404c..e71cf8d2 100644
--- a/resources/beike/shop/default/css/page-checkout.scss
+++ b/resources/beike/shop/default/css/page-checkout.scss
@@ -11,6 +11,11 @@ body.page-checkout {
     padding: 1.4rem;
     border: 3px solid #efefef;
 
+    &.total-wrap-fixed {
+      position: fixed;
+      top: 0;
+    }
+
     .card-body {
       padding: 0;
     }
@@ -29,12 +34,14 @@ body.page-checkout {
       border-bottom: 1px solid #E6E6E6;
       margin-bottom: 1.3rem;
       padding-bottom: .3rem;
+      max-height: 380px;
+      overflow-y: auto;
 
       .item {
         display: flex;
         align-items: center; // flex-start | center
         justify-content: space-between; // flex-end | center | space-between
-        margin-bottom: 1rem;
+        margin-bottom: .8rem;
 
         .image {
           display: flex;
diff --git a/themes/default/cart.blade.php b/themes/default/cart.blade.php
index 382e7d21..9c585052 100644
--- a/themes/default/cart.blade.php
+++ b/themes/default/cart.blade.php
@@ -91,6 +91,22 @@
 @endsection
 
 @push('add-scripts')
+  <script>
+    $(function() {
+      const totalWrapTop = $('.total-wrap').offset().top;
+      const totalWrapWidth = $('.total-wrap').outerWidth();
+      const totalWrapLeft = $('.total-wrap').offset().left;
+
+      $(window).scroll(function () {
+        if ($(this).scrollTop() > totalWrapTop) {
+          $('.total-wrap').addClass('total-wrap-fixed').css({'left': totalWrapLeft, 'width': totalWrapWidth})
+        } else {
+          $('.total-wrap').removeClass('total-wrap-fixed').css({'left': 0, 'width': 'auto'})
+        }
+      })
+    });
+  </script>
+
   <script>
     var app = new Vue({
       el: "#app-cart",
@@ -123,6 +139,8 @@
             layer.msg('请选择至少一个商品', ()=>{})
             return
           }
+
+          location = '{{ shop_route("checkout.index") }}'
         },
 
         quantityChange(quantity, cart_id) {
diff --git a/themes/default/checkout.blade.php b/themes/default/checkout.blade.php
index 7042b44c..75901e58 100644
--- a/themes/default/checkout.blade.php
+++ b/themes/default/checkout.blade.php
@@ -135,3 +135,20 @@
     </div>
   </div>
 @endsection
+@push('add-scripts')
+  <script>
+    $(function() {
+      const totalWrapTop = $('.total-wrap').offset().top;
+      const totalWrapWidth = $('.total-wrap').outerWidth();
+      const totalWrapLeft = $('.total-wrap').offset().left;
+
+      $(window).scroll(function () {
+        if ($(this).scrollTop() > totalWrapTop) {
+          $('.total-wrap').addClass('total-wrap-fixed').css({'left': totalWrapLeft, 'width': totalWrapWidth})
+        } else {
+          $('.total-wrap').removeClass('total-wrap-fixed').css({'left': 0, 'width': 'auto'})
+        }
+      })
+    });
+  </script>
+@endpush
\ No newline at end of file
diff --git a/themes/default/layout/header.blade.php b/themes/default/layout/header.blade.php
index ff9b7229..23bd07c4 100644
--- a/themes/default/layout/header.blade.php
+++ b/themes/default/layout/header.blade.php
@@ -61,13 +61,18 @@
           <li class="nav-item"><a href="" class="nav-link"><i class="iconfont">&#xe8d6;</i></a></li>
           <li class="nav-item"><a href="" class="nav-link"><i class="iconfont">&#xe662;</i></a></li>
           <li class="nav-item dropdown">
-            <a href="" class="nav-link"><i class="iconfont">&#xe619;</i></a>
+            <a href="{{ shop_route('account.index') }}" class="nav-link"><i class="iconfont">&#xe619;</i></a>
             <ul class="dropdown-menu dropdown-menu-end">
               @auth('web_shop')
-                <li><a href="{{ shop_route('account.index') }}" class="dropdown-item">个人中心</a></li>
-                <li><a href="{{ shop_route('logout') }}" class="dropdown-item">退出登录</a></li>
+                <li class="dropdown-item"><h6 class="mb-0">Pu Shuo</h6></li>
+                <li><hr class="dropdown-divider"></li>
+                <li><a href="{{ shop_route('account.index') }}" class="dropdown-item"><i class="bi bi-person me-1"></i> 个人中心</a></li>
+                <li><a href="{{ shop_route('account.index') }}" class="dropdown-item"><i class="bi bi-clipboard-check me-1"></i> 我的订单</a></li>
+                <li><a href="{{ shop_route('account.index') }}" class="dropdown-item"><i class="bi bi-heart me-1"></i> 我的收藏</a></li>
+                <li><hr class="dropdown-divider"></li>
+                <li><a href="{{ shop_route('logout') }}" class="dropdown-item"><i class="bi bi-box-arrow-left me-1"></i> 退出登录</a></li>
               @else
-                <li><a href="{{ shop_route('login.index') }}" class="dropdown-item">登录/注册</a></li>
+                <li><a href="{{ shop_route('login.index') }}" class="dropdown-item"><i class="bi bi-box-arrow-right me-1"></i> 登录/注册</a></li>
               @endauth
             </ul>
           </li>