From 2e8d9b408335b1e9339b5a58c8282803c53ae785 Mon Sep 17 00:00:00 2001
From: pushuo <229102104@qq.com>
Date: Mon, 29 Aug 2022 11:53:02 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B4=A6=E5=8D=95=E5=9C=B0=E5=9D=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/build/beike/shop/default/css/app.css   | 10 ----
 .../beike/shop/default/css/page-checkout.scss | 20 +++----
 resources/lang/en/shop/checkout.php           |  2 +
 resources/lang/zh_cn/shop/checkout.php        |  4 +-
 themes/default/checkout.blade.php             | 57 ++++++++++++++++---
 5 files changed, 64 insertions(+), 29 deletions(-)

diff --git a/public/build/beike/shop/default/css/app.css b/public/build/beike/shop/default/css/app.css
index 80f7a263..54d3b7cb 100644
--- a/public/build/beike/shop/default/css/app.css
+++ b/public/build/beike/shop/default/css/app.css
@@ -1062,20 +1062,10 @@ body.page-checkout .checkout-title, body.page-bk-stripe .checkout-title {
   padding-bottom: 16px;
   margin-bottom: 16px;
   position: relative;
-  padding-left: 10px;
   display: flex;
   align-items: center;
   justify-content: space-between;
 }
-body.page-checkout .checkout-title:before, body.page-bk-stripe .checkout-title:before {
-  content: "";
-  position: absolute;
-  top: 2px;
-  left: 0;
-  background-color: #fd560f;
-  width: 3px;
-  height: 16px;
-}
 body.page-checkout .checkout-title .btn, body.page-bk-stripe .checkout-title .btn {
   margin-bottom: -10px;
 }
diff --git a/resources/beike/shop/default/css/page-checkout.scss b/resources/beike/shop/default/css/page-checkout.scss
index 885ad042..eee97b00 100644
--- a/resources/beike/shop/default/css/page-checkout.scss
+++ b/resources/beike/shop/default/css/page-checkout.scss
@@ -84,20 +84,20 @@ body.page-checkout, body.page-bk-stripe {
     padding-bottom: 16px;
     margin-bottom: 16px;
     position: relative;
-    padding-left: 10px;
+    // padding-left: 10px;
     display: flex;
     align-items: center; // flex-start | center
     justify-content: space-between; // flex-end | center | space-between
 
-    &:before {
-      content: '';
-      position: absolute;
-      top: 2px;
-      left: 0;
-      background-color: $primary;
-      width: 3px;
-      height: 16px;
-    }
+    // &:before {
+    //   content: '';
+    //   position: absolute;
+    //   top: 2px;
+    //   left: 0;
+    //   background-color: $primary;
+    //   width: 3px;
+    //   height: 16px;
+    // }
 
     .btn {
       margin-bottom: -10px;
diff --git a/resources/lang/en/shop/checkout.php b/resources/lang/en/shop/checkout.php
index d2cedc66..477edd94 100644
--- a/resources/lang/en/shop/checkout.php
+++ b/resources/lang/en/shop/checkout.php
@@ -12,6 +12,8 @@
 return [
     'index' => 'Checkouts',
     'address' => 'Address',
+    'payment_address' => 'Payment Address',
+    'same_as_shipping_address' => 'Same As Shipping Address',
     'chosen' => 'Chosen',
     'edit' => 'Edit',
     'choose_another_address' => 'Choose Another Address',
diff --git a/resources/lang/zh_cn/shop/checkout.php b/resources/lang/zh_cn/shop/checkout.php
index 5505e5c0..3c0ddb2f 100644
--- a/resources/lang/zh_cn/shop/checkout.php
+++ b/resources/lang/zh_cn/shop/checkout.php
@@ -11,7 +11,9 @@
 
 return [
     'index' => '结账',
-    'address' => '地址',
+    'address' => '配送地址',
+    'payment_address' => '账单地址',
+    'same_as_shipping_address' => '账单地址同收货地址',
     'chosen' => '已选择',
     'edit' => '编辑',
     'choose_another_address' => '选择其他地址',
diff --git a/themes/default/checkout.blade.php b/themes/default/checkout.blade.php
index 0a111aed..68c5d94f 100644
--- a/themes/default/checkout.blade.php
+++ b/themes/default/checkout.blade.php
@@ -18,10 +18,13 @@
     </div>
 
     <div class="row mt-5">
-      <div class="col-12 col-md-8">
+      <div class="col-12 col-md-8 left-column">
         <div class="checkout-black">
           <div class="checkout-title">
-            <h5 class="mb-0">{{ __('shop/checkout.address') }}</h5>
+            <div class="d-flex">
+              <h5 class="mb-0 me-4">{{ __('shop/checkout.address') }}</h5>
+              <el-checkbox v-model="form.same_as_shipping_address">{{ __('shop/checkout.same_as_shipping_address') }}</el-checkbox>
+            </div>
             <button class="btn btn-sm icon" v-if="isAllAddress" @click="isAllAddress = false"><i class="bi bi-x-lg"></i></button>
           </div>
           <div class="addresses-wrap">
@@ -37,16 +40,50 @@
                   <div class="address-bottom">
                     <div>
                       <span class="badge bg-success" v-if="form.shipping_address_id == address.id">{{ __('shop/checkout.chosen') }}</span>
-                      {{-- <span class="badge bg-info" v-if="address.default">{{ __('shop/account.addresses.default_address') }}</span> --}}
                     </div>
-                    <a class="" @click.stop="editAddress(index)">{{ __('shop/checkout.edit') }}</a>
+                    <a class="" @click.stop="editAddress(index, 'shipping_address_id')">{{ __('shop/checkout.edit') }}</a>
                   </div>
                 </div>
               </div>
               <div class="col-6" v-if="!isAllAddress">
                 <div class="item address-right">
                   <button class="btn btn-outline-dark w-100 mb-3" v-if="source.addresses.length > 1" @click="isAllAddress = true">{{ __('shop/checkout.choose_another_address') }}</button>
-                  <button class="btn btn-outline-dark w-100" @click="editAddress"><i class="bi bi-plus-square-dotted"></i> {{ __('shop/checkout.add_new_address') }}</button>
+                  <button class="btn btn-outline-dark w-100" @click="editAddress(null, 'shipping_address_id')"><i class="bi bi-plus-square-dotted"></i> {{ __('shop/checkout.add_new_address') }}</button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="checkout-black" v-if='!form.same_as_shipping_address'>
+          <div class="checkout-title">
+            <div class="d-flex">
+              <h5 class="mb-0 me-4">{{ __('shop/checkout.payment_address') }}</h5>
+            </div>
+            <button class="btn btn-sm icon" v-if="isAllAddressPayment" @click="isAllAddressPayment = false"><i class="bi bi-x-lg"></i></button>
+          </div>
+          <div class="addresses-wrap">
+            <div class="row">
+              <div class="col-6" v-for="address, index in source.addresses" :key="index" v-if="source.addresses.length &&( address.id == form.payment_address_id || isAllAddressPayment)">
+                <div :class="['item', address.id == form.payment_address_id ? 'active' : '']" @click="updateCheckout(address.id, 'payment_address_id')">
+                  <div class="name-wrap">
+                    <span class="name">@{{ address.name }}</span>
+                    <span class="phone">@{{ address.phone }}</span>
+                  </div>
+                  <div class="zipcode">@{{ address.zipcode }}</div>
+                  <div class="address-info">@{{ address.country }} @{{ address.zone }} @{{ address.city }} @{{ address.address_1 }}</div>
+                  <div class="address-bottom">
+                    <div>
+                      <span class="badge bg-success" v-if="form.payment_address_id == address.id">{{ __('shop/checkout.chosen') }}</span>
+                    </div>
+                    <a class="" @click.stop="editAddress(index, 'payment_address_id')">{{ __('shop/checkout.edit') }}</a>
+                  </div>
+                </div>
+              </div>
+              <div class="col-6" v-if="!isAllAddressPayment">
+                <div class="item address-right">
+                  <button class="btn btn-outline-dark w-100 mb-3" v-if="source.addresses.length > 1" @click="isAllAddressPayment = true">{{ __('shop/checkout.choose_another_address') }}</button>
+                  <button class="btn btn-outline-dark w-100" @click="editAddress(null, 'payment_address_id')"><i class="bi bi-plus-square-dotted"></i> {{ __('shop/checkout.add_new_address') }}</button>
                 </div>
               </div>
             </div>
@@ -134,9 +171,11 @@
           payment_address_id: @json($current['payment_address_id']),
           payment_method_code: @json($current['payment_method_code']),
           shipping_method_code: @json($current['shipping_method_code']),
+          same_as_shipping_address: @json($current['same_as_shipping_address'] ?? true) ,
         },
 
         isAllAddress: false,
+        isAllAddressPayment: false,
 
         source: {
           addresses: @json($addresses ?? []),
@@ -150,6 +189,7 @@
         dialogAddress: {
           show: false,
           index: null,
+          type: 'shipping_address_id',
           form: {
             name: '',
             phone: '',
@@ -188,7 +228,7 @@
       },
 
       methods: {
-        editAddress(index) {
+        editAddress(index, type) {
           if (typeof index == 'number') {
             this.dialogAddress.index = index;
 
@@ -197,6 +237,7 @@
             })
           }
 
+          this.dialogAddress.type = type
           this.dialogAddress.show = true
         },
 
@@ -215,8 +256,8 @@
             $http[type](url, this.dialogAddress.form).then((res) => {
               if (type == 'post') {
                 this.source.addresses.push(res.data)
-                this.updateCheckout(res.data.id, 'shipping_address_id')
-                this.form.shipping_address_id = res.data.id
+                this.updateCheckout(res.data.id, this.dialogAddress.form.type)
+                this.form[this.dialogAddress.form.type] = res.data.id
 
               } else {
                 this.source.addresses[this.dialogAddress.index] = res.data