Merge pull request #14 from bagisto/jitendra

Checkout shipping and payment steps added
2018-09-21 15:48:25 +05:30 · 2018-09-21 15:48:25 +05:30 · 4c89e334f5
parent 51b4278262 facf3de81a
commit 4c89e334f5
20 changed files with 278 additions and 110 deletions
--- a/config/app.php
+++ b/config/app.php
@ -180,15 +180,13 @@ return [
        Webkul\User\Providers\UserServiceProvider::class,
        Webkul\Admin\Providers\AdminServiceProvider::class,
        Webkul\Ui\Providers\UiServiceProvider::class,
-        // Webkul\Category\Providers\CategoryServiceProvider::class,
+        Webkul\Category\Providers\CategoryServiceProvider::class,
        Webkul\Attribute\Providers\AttributeServiceProvider::class,
        Webkul\Core\Providers\CoreServiceProvider::class,
        Webkul\Shop\Providers\ShopServiceProvider::class,
        Webkul\Customer\Providers\CustomerServiceProvider::class,
        Webkul\Inventory\Providers\InventoryServiceProvider::class,
        Webkul\Product\Providers\ProductServiceProvider::class,
-        Webkul\Shop\Providers\ShopServiceProvider::class,
-        Webkul\Customer\Providers\CustomerServiceProvider::class,
        Webkul\Theme\Providers\ThemeServiceProvider::class,
        Webkul\Cart\Providers\CartServiceProvider::class,
        Webkul\Shipping\Providers\ShippingServiceProvider::class,
--- a/config/carriers.php
+++ b/config/carriers.php
@ -3,7 +3,7 @@
 return [
    'flatrate' => [
        'code' => 'flatrate',
-        'title' => 'Flatrate',
+        'title' => 'Flat Rate',
        'description' => 'This is a flat rate',
        'active' => true,
        'default_rate' => '10',
--- a/config/paymentmethods.php
+++ b/config/paymentmethods.php
@ -4,7 +4,17 @@ return [
    'cashondelivery' => [
        'code' => 'cashondelivery',
        'title' => 'Cash On Delivery',
-        'class' => 'Webkul\Payment\Payment\Payment',
+        'description' => 'Cash On Delivery',
+        'class' => 'Webkul\Payment\Payment\CashOnDelivery',
+        'order_status' => 'Pending',
+        'active' => true
+    ],
+
+    'moneytransfer' => [
+        'code' => 'moneytransfer',
+        'title' => 'Money Transfer',
+        'description' => 'Money Transfer',
+        'class' => 'Webkul\Payment\Payment\MoneyTransfer',
        'order_status' => 'Pending',
        'active' => true
    ]
--- a/packages/Webkul/Cart/src/Database/Migrations/2018_09_05_150915_create_cart_items_table.php
+++ b/packages/Webkul/Cart/src/Database/Migrations/2018_09_05_150915_create_cart_items_table.php
@ -4,7 +4,7 @@ use Illuminate\Support\Facades\Schema;
 use Illuminate\Database\Schema\Blueprint;
 use Illuminate\Database\Migrations\Migration;

-class CreateCartProductsTable extends Migration
+class CreateCartItemsTable extends Migration
 {
    /**
     * Run the migrations.
--- a/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php
+++ b/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php
@ -6,6 +6,8 @@ use Illuminate\Http\Request;
 use Illuminate\Http\Response;
 use Auth;
 use Webkul\Shipping\Facades\Shipping;
+use Webkul\Payment\Facades\Payment;
+use Webkul\Cart\Facades\Cart;

 /**
 * Chekout controller for the customer
@ -51,9 +53,7 @@ class CheckoutController extends Controller
    public function saveAddress()
    {

-        return response()->json([
-                'shipping' => Shipping::collectRates()
-            ]);
+        return response()->json(Shipping::collectRates());
    }

    /**
@ -63,6 +63,7 @@ class CheckoutController extends Controller
    */
    public function saveShipping()
    {
+        return response()->json(Payment::getSupportedPaymentMethods());
    }

    /**
--- a/packages/Webkul/Core/src/Core.php
+++ b/packages/Webkul/Core/src/Core.php
@ -140,8 +140,8 @@ class Core

        $channel = $this->getCurrentChannel();

-        // $currencyCode = $channel->base_currency->code;
-        $currencyCode = $channel->base_currency;
+        $currencyCode = $channel->base_currency->code;
+        // $currencyCode = $channel->base_currency;

        return currency($price, $currencyCode);
    }
--- a/packages/Webkul/Payment/Payment.php
+++ b/packages/Webkul/Payment/Payment.php
@ -1,32 +0,0 @@
-<?php
-
-namespace Webkul\Payment;
-
-use Illuminate\Support\Facades\Config;
-
-class Payment
-{
-    /**
-     * Returns all supported payment methods
-     *
-     * @return array
-     */
-    public function getSupportedPaymentMethods()
-    {
-        $paymentMethods = [];
-
-        foreach (Config::get('paymentmethods') as $paymentMethod) {
-            if($paymentMethod['active']) {
-                $object = new $paymentMethod['class'];
-
-                $paymentMethods[] = [
-                    'code' => $object->getCode(),
-                    'title' => $object->getTitle(),
-                    'description' => $object->getDescription(),
-                ];
-            }
-        }
-
-        return $paymentMethods;
-    }
-}
--- a/packages/Webkul/Payment/src/Payment.php
+++ b/packages/Webkul/Payment/src/Payment.php
@ -0,0 +1,35 @@
+<?php
+
+namespace Webkul\Payment;
+
+use Illuminate\Support\Facades\Config;
+
+class Payment
+{
+    /**
+     * Returns all supported payment methods
+     *
+     * @return array
+     */
+    public function getSupportedPaymentMethods()
+    {
+        $paymentMethods = [];
+
+        foreach (Config::get('paymentmethods') as $paymentMethod) {
+                $object = new $paymentMethod['class'];
+
+                if($object->isAvailable()) {
+                    $paymentMethods[] = [
+                        'method' => $object->getCode(),
+                        'title' => $object->getTitle(),
+                        'description' => $object->getDescription(),
+                    ];
+                }
+        }
+
+        return [
+                'jump_to_section' => 'payment',
+                'html' => view('shop::checkout.onepage.payment', compact('paymentMethods'))->render()
+            ];
+    }
+}
--- a/packages/Webkul/Payment/src/Payment/MoneyTransfer.php
+++ b/packages/Webkul/Payment/src/Payment/MoneyTransfer.php
@ -0,0 +1,13 @@
+<?php
+
+namespace Webkul\Payment\Payment;
+
+class MoneyTransfer extends Payment
+{
+    /**
+     * Payment method code
+     *
+     * @var string
+     */
+    protected $code  = 'moneytransfer';
+}
--- a/packages/Webkul/Payment/src/Payment/Payment.php
+++ b/packages/Webkul/Payment/src/Payment/Payment.php
@ -27,7 +27,7 @@ abstract class Payment
            // throw exception
        }

-        return $this->_code;
+        return $this->code;
    }

    /**
@ -41,13 +41,13 @@ abstract class Payment
    }

    /**
-     * Returns payment method decription
+     * Returns payment method description
     *
     * @return array
     */
-    public function getDecription()
+    public function getDescription()
    {
-        return $this->getConfigData('decription');
+        return $this->getConfigData('description');
    }

    /**
@ -61,10 +61,10 @@ abstract class Payment
    public function getConfigData($field, $channelId = null)
    {
        if (null === $channelId) {
-            $channelId = core()->getCurrentChannel()->getId();
+            $channelId = core()->getCurrentChannel()->id;
        }

-        $paymentConfig = Config::get('paymentmethods' . $this->getCode());
+        $paymentConfig = Config::get('paymentmethods.' . $this->getCode());

        return $paymentConfig[$field];
    }
--- a/packages/Webkul/Shipping/src/Carriers/FlatRate.php
+++ b/packages/Webkul/Shipping/src/Carriers/FlatRate.php
@ -4,6 +4,7 @@ namespace Webkul\Shipping\Carriers;

 use Config;
 use Webkul\Cart\Models\CartShipping;
+use Webkul\Shipping\Facades\Shipping;

 /**
 * Class Rate.
@ -20,31 +21,18 @@ class FlatRate extends AbstractShipping

    public function calculate()
    {
-        return [
-            'carrier_code' => 'flatrate',
-            'carrier_title' => 'Flat Rate',
-            'carrier_description' => '',
-            'rates' => [
-                [
-                    'method' => 'flatrate_flatrate',
-                    'method_title' => 'Flat Rate',
-                    'price' => 10,
-                    'price_formated' => core()->currency(10),
-                ]
-            ]
-        ];
-        
+        if(!$this->isAvailable())
+            return false;
+
        $object = new CartShipping;

-        $object->carrier = 'flatrate_flatrate';
-        $object->carrier_title = $this->getConfigData('description');
-        $object->method = 'flatrate';
+        $object->carrier = 'flatrate';
+        $object->carrier_title = $this->getConfigData('title');
+        $object->method = 'flatrate_flatrate';
        $object->method_title = $this->getConfigData('title');
        $object->method_description = $this->getConfigData('description');
        $object->price = 10;

-        return [
-                'flatrate' => [$object]
-            ];
+        return $object;
    }
 }
--- a/packages/Webkul/Shipping/src/Shipping.php
+++ b/packages/Webkul/Shipping/src/Shipping.php
@ -10,20 +10,43 @@ use Illuminate\Support\Facades\Config;
 */
 class Shipping
 {
+    protected $rates = [];
+
    public function collectRates()
    {
-        $rates = [];
-
        foreach(Config::get('carriers') as $shippingMethod) {
            $object = new $shippingMethod['class'];

-            if($object->isAvailable()) {
-                $rates[] = $object->calculate();
+            if($rates = $object->calculate()) {
+                if(is_array($rates)) {
+                    $this->rates = array_merge($this->rates, $rates);
+                } else {
+                    $this->rates[] = $rates;
+                }
            }
        }

-        return $rates;
+        return [
+                'jump_to_section' => 'shipping',
+                'html' => view('shop::checkout.onepage.shipping', ['shippingRateGroups' => $this->getGroupedAllShippingRates()])->render()
+            ];
+    }

-        // return view('shop::checkout.onepage.shipping', compact('rates'));
+    public function getGroupedAllShippingRates()
+    {
+        $rates = [];
+
+        foreach ($this->rates as $rate) {
+            if (!isset($rates[$rate->carrier])) {
+                $rates[$rate->carrier] = [
+                    'carrier_title' => $rate->carrier_title,
+                    'rates' => []
+                ];
+            }
+
+            $rates[$rate->carrier]['rates'][] = $rate;
+        }
+
+        return $rates;
    }
 }
--- a/packages/Webkul/Shop/src/Resources/assets/js/components/cart-dropdown.vue
+++ b/packages/Webkul/Shop/src/Resources/assets/js/components/cart-dropdown.vue
@ -76,7 +76,7 @@ export default {
        initializeDropdown: function() {
            this.totalitems = this.items.length;
            this.cart_items = this.items;
-            console.log("The cart items here are = ",cart_items);
+            console.log("The cart items here are = ",this.cart_items);
        }
    }
 }
--- a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
@ -798,6 +798,7 @@ section.slider-block {

        .product-image {
            margin-bottom: 10px;
+            background: #F2F2F2;

            img {
                align-self: center;
@ -2216,6 +2217,16 @@ section.cart {
                    margin: 0;
                }
            }
+
+            .payment-methods {
+                .radio {
+                    font-weight: 600;
+                }
+
+                .control-info {
+                    margin-left: 28px;
+                }
+            }
        }
    }

--- a/packages/Webkul/Shop/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Shop/src/Resources/lang/en/app.php
@ -85,7 +85,8 @@ return [
            'shipping-address' => 'Shipping Address',
            'use_for_shipping' => 'Ship to this address',
            'continue' => 'Continue',
-            'shipping-method' => 'Shipping Method'
+            'shipping-method' => 'Shipping Method',
+            'payment-information' => 'Payment Information'
        ]
    ]
 ];
--- a/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php
@ -54,8 +54,8 @@
                </div>

                <div class="step-content shipping" v-show="currentStep == 2">
-                    
-                    @include('shop::checkout.onepage.shipping')
+
+                    <shipping-section v-if="currentStep == 2"></shipping-section>

                    <div class="button-group">

@ -69,7 +69,15 @@

                <div class="step-content payment" v-show="currentStep == 3">

-                    @include('shop::checkout.onepage.payment')
+                    <payment-section v-if="currentStep == 3"></payment-section>
+
+                    <div class="button-group">
+
+                        <button type="button" class="btn btn-lg btn-primary" @click="validateForm('payment-form')">
+                            {{ __('shop::app.checkout.onepage.continue') }}
+                        </button>
+
+                    </div>

                </div>

@ -87,6 +95,10 @@
    </script>

    <script>
+
+        var shippingHtml = '';
+        var paymentHtml = '';
+
        Vue.component('checkout', {

            template: '#checkout-template',
@ -98,10 +110,6 @@

                completedStep: 0,

-                shipping_methods: [],
-
-                payment_methods: [],
-
                address: {
                    billing: {
                        use_for_shipping: true
@ -114,13 +122,9 @@

                selected_payment: {
                    method: ''
-                }
+                },
            }),

-            created () {
-
-            },
-
            methods: {
                navigateToStep (step) {
                    if(step <= this.completedStep) {
@ -136,6 +140,8 @@
                                this.saveAddress()
                            } else if(scope == 'shipping-form') {
                                this.saveShipping()
+                            } else if(scope == 'payment-form') {
+                                this.savePayment()
                            }
                        }
                    });
@ -143,11 +149,10 @@

                saveAddress () {
                    var this_this = this;
-
                    this.$http.post("{{ route('shop.checkout.save-address') }}", this.address)
                        .then(function(response) {
-                            if(response.data.shipping) {
-                                this_this.shipping_methods = response.data.shipping
+                            if(response.data.jump_to_section == 'shipping') {
+                                shippingHtml = Vue.compile(response.data.html)
                                this_this.completedStep = 1;
                                this_this.currentStep = 2;
                            }
@ -155,22 +160,89 @@
                },

                saveShipping () {
-                    // this.$http.get('https://api.coindesk.com/v1/bpi/currentprice.json')
-                    //     .then(function(response) {
-                            this.completedStep = 2;
-                            this.currentStep = 3;
-                        // })
+                    var this_this = this;
+                    this.$http.post("{{ route('shop.checkout.save-shipping') }}", {'shipping_method': this.selected_shipping_method})
+                        .then(function(response) {
+                            if(response.data.jump_to_section == 'payment') {
+                                shippingHtml = Vue.compile(response.data.html)
+                                this_this.completedStep = 2;
+                                this_this.currentStep = 3;
+                            }
+                        })
                },

                savePayment () {
-                    // this.$http.get('https://api.coindesk.com/v1/bpi/currentprice.json')
-                    //     .then(function(response) {
-                            this.completedStep = 1;
-                            this.currentStep = 2;
-                        // })
+                    var this_this = this;
+                    this.$http.post("{{ route('shop.checkout.save-payment') }}", {'shipping_method': this.selected_shipping_method})
+                        .then(function(response) {
+                            if(response.data.jump_to_section == 'payment') {
+                                shippingHtml = Vue.compile(response.data.html)
+                                this_this.completedStep = 3;
+                                this_this.currentStep = 4;
+                            }
+                        })
                }
            }
        })
+
+        var shippingTemplateRenderFns = [];
+        Vue.component('shipping-section', {
+
+            inject: ['$validator'],
+
+            data: () => ({
+                templateRender: null,
+
+                selected_shipping_method: '',
+            }),
+
+            staticRenderFns: shippingTemplateRenderFns,
+
+            mounted() {
+                this.templateRender = shippingHtml.render;
+                for (var i in shippingHtml.staticRenderFns) {
+                    shippingTemplateRenderFns.push(shippingHtml.staticRenderFns[i]);
+                }
+            },
+
+            render(h) {
+                return h('div', [
+                    (this.templateRender ?
+                        this.templateRender() :
+                        '')
+                    ]);
+            }
+        })
+
+        var paymentTemplateRenderFns = [];
+        Vue.component('payment-section', {
+
+            inject: ['$validator'],
+
+            data: () => ({
+                templateRender: null,
+
+                selected_payment_method: '',
+            }),
+
+            staticRenderFns: paymentTemplateRenderFns,
+
+            mounted() {
+                this.templateRender = shippingHtml.render;
+
+                for (var i in shippingHtml.staticRenderFns) {
+                    paymentTemplateRenderFns.push(shippingHtml.staticRenderFns[i]);
+                }
+            },
+
+            render(h) {
+                return h('div', [
+                    (this.templateRender ?
+                        this.templateRender() :
+                        '')
+                    ]);
+            }
+        })
    </script>

@endpush
--- a/packages/Webkul/Shop/src/Resources/views/checkout/onepage/payment.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/checkout/onepage/payment.blade.php
@ -0,0 +1,30 @@
+<form data-vv-scope="payment-form">
+    <div class="form-container">
+        <div class="form-header">
+            <h1>{{ __('shop::app.checkout.onepage.payment-information') }}</h1>
+        </div>
+
+        <div class="payment-methods">
+
+            <div class="control-group" :class="[errors.has('payment-form.payment[method]') ? 'has-error' : '']">
+
+                @foreach ($paymentMethods as $payment)
+
+                    <span class="radio" >
+                        <input v-validate="'required'" type="radio" id="{{ $payment['method'] }}" name="payment[method]" value="{{ $payment['method'] }}" v-model="selected_payment_method">
+                        <label class="radio-view" for="{{ $payment['method'] }}"></label>
+                        {{ $payment['title'] }}
+                    </span>
+                    
+                    <span class="control-info">{{ $payment['description'] }}</span>
+
+                @endforeach
+
+                <span class="control-error" v-if="errors.has('payment-form.payment[method]')">
+                    @{{ errors.first('payment-form.payment[method]') }}
+                </span>
+
+            </div>
+        </div>
+    </div>
+</form>
--- a/packages/Webkul/Shop/src/Resources/views/checkout/onepage/shipping.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/checkout/onepage/shipping.blade.php
@ -6,19 +6,26 @@

        <div class="shipping-methods">

-            <div class="control-group" v-for='(shipping_method, index) in shipping_methods' :class="[errors.has('shipping-form.shipping_method') ? 'has-error' : '']">
-                <h4 for="">@{{ shipping_method.carrier_title }}</h4>
+            <div class="control-group" :class="[errors.has('shipping-form.shipping_method') ? 'has-error' : '']">

-                <span class="radio"  v-for='(rate, index) in shipping_method.rates'>
-                    <input v-validate="'required'" type="radio" :id="rate.method" name="shipping_method" :value="rate.method">
-                    <label class="radio-view" :for="rate.method"></label>
-                    @{{ rate.method_title }}
-                    <b>@{{ rate.price_formated }}</b>
-                </span>
+                @foreach ($shippingRateGroups as $rateGroup)
+                    <h4 for="">{{ $rateGroup['carrier_title'] }}</h4>
+
+                    @foreach ($rateGroup['rates'] as $rate)
+                        <span class="radio" >
+                            <input v-validate="'required'" type="radio" id="{{ $rate->method }}" name="shipping_method" value="{{ $rate->method }}" v-model="selected_shipping_method">
+                            <label class="radio-view" for="{{ $rate->method }}"></label>
+                            {{ $rate->method_title }}
+                            <b>{{ $rate->price }}</b>
+                        </span>
+                    @endforeach
+                        
+                @endforeach

                <span class="control-error" v-if="errors.has('shipping-form.shipping_method')">
                    @{{ errors.first('shipping-form.shipping_method') }}
                </span>
+
            </div>

        </div>
--- a/public/themes/default/assets/css/shop.css
+++ b/public/themes/default/assets/css/shop.css
@ -850,6 +850,7 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {

 .main-container-wrapper .product-card .product-image {
  margin-bottom: 10px;
+  background: #F2F2F2;
 }

 .main-container-wrapper .product-card .product-image img {
@ -2328,6 +2329,14 @@ section.cart .cart-content .right-side .coupon-section .after-coupon-amount .amo
  margin: 0;
 }

+.checkout-process .col-main .step-content .payment-methods .radio {
+  font-weight: 600;
+}
+
+.checkout-process .col-main .step-content .payment-methods .control-info {
+  margin-left: 28px;
+}
+
 .checkout-process .col-right {
  width: 35%;
  padding-left: 40px;
--- a/public/themes/default/assets/js/shop.js
+++ b/public/themes/default/assets/js/shop.js
@ -31659,6 +31659,8 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });

        initializeDropdown: function initializeDropdown() {
            this.totalitems = this.items.length;
+            this.cart_items = this.items;
+            console.log("The cart items here are = ", this.cart_items);
        }
    }
 });