From 8784fffe9280244b661bad160d2fd2c8abde99ee Mon Sep 17 00:00:00 2001
From: prashant-webkul <prashant.singh852@webkul.com>
Date: Mon, 15 Oct 2018 17:19:28 +0530
Subject: [PATCH 1/8] before merge

---
 .../Shop/src/Resources/assets/sass/app.scss   |  22 +--
 .../src/Resources/assets/sass/components.scss | 106 +++++------
 .../Webkul/Shop/src/Resources/lang/en/app.php |  13 +-
 .../account/address/address.blade.php         |   2 +-
 .../account/address/create.blade.php          |   2 +-
 .../customers/account/address/edit.blade.php  |   2 +-
 .../customers/account/profile/index.blade.php |   2 +-
 .../account/reviews/reviews.blade.php         |  62 +++----
 .../account/wishlist/wishlist.blade.php       |   6 +-
 .../views/products/list/card.blade.php        |  18 +-
 .../views/products/reviews/create.blade.php   |  39 ++--
 .../views/products/view/reviews.blade.php     |   6 +
 .../Resources/assets/js/components/flash.vue  |   2 +-
 .../src/Resources/assets/sass/_variables.scss |   1 +
 .../Ui/src/Resources/assets/sass/app.scss     |   4 +
 public/themes/default/assets/css/shop.css     | 167 +++++++++---------
 16 files changed, 229 insertions(+), 225 deletions(-)

diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
index fb61d7967..75a500526 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
@@ -1657,62 +1657,52 @@ section.review {
 
     .review-layouter {
         display: flex;
-        flex-flow: row;
-        margin-top: 20px;
+        flex-direction: row;
 
         .product-info {
 
-            .image {
-                border:1px solid red;
-
+            .product-image {
                 img {
+                    display: block;
                     height: 280px;
                     width: 280px;
                 }
             }
 
-            .heading {
+            .product-name {
                 margin-top: 20px;
 
                 span {
                     font-size: 24px;
-
                 }
             }
 
-            .price {
+            .product-price {
                 margin-top: 10px;
 
                 .pro-price {
                     font-size: 24px;
                     color: $disc-price;
-
                 }
 
                 .pro-price-not {
                     margin-left: 10px;
                     color: $disc-price-pro;
-
                 }
 
                 .offer {
                     margin-left: 10px;
-
                 }
             }
         }
 
-        .review-info {
+        .review-form {
             margin-left: 20px;
             width: 49%;
 
             .heading {
                 margin-top: 10px;
 
-                span {
-
-                }
-
                 .btn.btn-primary.right {
                    float: right;
                    margin-top: -10px;
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/components.scss b/packages/Webkul/Shop/src/Resources/assets/sass/components.scss
index b37e216e4..08e17227b 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/components.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/components.scss
@@ -1,3 +1,58 @@
+.product-card {
+
+    .product-image {
+        max-height: 350px;
+        max-width: 280px;
+        margin-bottom: 10px;
+        background: #F2F2F2;
+
+        img {
+            display: block;
+            width: 100%;
+        }
+    }
+
+    .product-name {
+        margin-bottom: 14px;
+        width: 100%;
+        color: $font-color;
+
+        a {
+            color: $font-color;
+        }
+    }
+
+    .product-description {
+        display: none;
+    }
+
+    .product-ratings {
+        width: 100%;
+
+        .icon {
+            width: 16px;
+            height: 16px;
+        }
+    }
+
+    .cart-wish-wrap {
+        display: inline-flex;
+        justify-content: flex-start;
+        align-items: center;
+        height: 40px;
+
+        .addtocart {
+            margin-right: 10px;
+            text-transform: uppercase;
+
+        }
+
+        .add-to-wishlist {
+            margin-top: 5px;
+        }
+    }
+}
+
 // product card, requires no changes for responsiveness.
 .product-grid-4 {
     display: grid;
@@ -43,55 +98,6 @@
     }
 }
 
-.product-card {
-
-    .product-image {
-        max-height: 350px;
-        max-width: 280px;
-        margin-bottom: 10px;
-        background: #F2F2F2;
-
-        img {
-            display: block;
-            width: 100%;
-        }
-    }
-
-    .product-name {
-        margin-bottom: 14px;
-        width: 100%;
-        color: $font-color;
-
-        a {
-            color: $font-color;
-        }
-    }
-
-    .product-description {
-        display: none;
-    }
-
-    .product-ratings {
-        width: 100%;
-
-        .icon {
-            width: 16px;
-            height: 16px;
-        }
-    }
-
-    .cart-fav-seg {
-        display: inline-flex;
-        align-items: center;
-
-        .addtocart {
-            margin-right: 10px;
-            text-transform: uppercase;
-            white-space: nowrap;
-        }
-
-    }
-}
 
 //wishlist icon hover properties
 .add-to-wishlist {
@@ -140,7 +146,7 @@
         text-align: left;
     }
 
-    .account-edit {
+    .account-action {
         font-size: 17px;
         margin-top: 1%;
         color: $brand-color;
diff --git a/packages/Webkul/Shop/src/Resources/lang/en/app.php b/packages/Webkul/Shop/src/Resources/lang/en/app.php
index f2b5db5ed..04c1f45f2 100644
--- a/packages/Webkul/Shop/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Shop/src/Resources/lang/en/app.php
@@ -11,6 +11,13 @@ return [
         ]
     ],
 
+    'reviews' => [
+        'add-review-page-title' => 'Add Review',
+        'write-review' => 'Write a review',
+        'review-title' => 'Give Your Review a Title',
+        'empty' => 'You Haven\'t Reviewed Any Product Yet'
+    ],
+
     'customer' => [
         'signup-text' => [
             'account_exists' => 'Already have an account',
@@ -139,7 +146,11 @@ return [
     'wishlist' => [
         'title' => 'Wishlist',
         'deleteall' => 'Delete All',
-        'moveall' => 'Move All Products To Cart'
+        'moveall' => 'Move All Products To Cart',
+        'move-to-cart' => 'Move To Cart',
+        'empty' => 'You Have No Items In Your Wishlist',
+        'add' => 'Item Successfully Added To Wishlist',
+        'remove' => 'Item Successfully Removed From Wishlist'
     ],
 
     'checkout' => [
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/address/address.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/address/address.blade.php
index 2e29b4de5..ce7c36d75 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/address/address.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/address/address.blade.php
@@ -16,7 +16,7 @@
             <span class="account-heading">{{ __('shop::app.customer.account.address.index.title') }}</span>
 
             @if(!$address->isEmpty())
-            <span class="account-edit">
+            <span class="account-action">
                 <a href="{{ route('customer.address.edit') }}">
                     {{ __('shop::app.customer.account.address.index.edit') }}
                 </a>
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/address/create.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/address/create.blade.php
index aa2752cb7..e6bdef52b 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/address/create.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/address/create.blade.php
@@ -7,7 +7,7 @@
         @include('shop::customers.account.partials.sidemenu')
 
         <div class="account-layout">
-            <div class="account-head mb-10">
+            <div class="account-head mb-15">
                 <div class="account-heading">{{ __('shop::app.customer.account.address.create.title') }}</div>
             </div>
             <form method="post" action="{{ route('customer.address.create') }}" @submit.prevent="onSubmit">
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/address/edit.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/address/edit.blade.php
index 15a6a7881..443bcd0d1 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/address/edit.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/address/edit.blade.php
@@ -8,7 +8,7 @@
 
         <div class="account-layout">
 
-            <div class="account-head mb-10">
+            <div class="account-head mb-15">
                 <div class="account-heading">{{ __('shop::app.customer.account.address.edit.title') }}</div>
             </div>
 
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/profile/index.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/profile/index.blade.php
index e79d74552..e0f03bd94 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/profile/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/profile/index.blade.php
@@ -14,7 +14,7 @@
 
             <span class="account-heading">{{ __('shop::app.customer.account.profile.index.title') }}</span>
 
-            <span class="account-edit">
+            <span class="account-action">
                 <a href="{{ route('customer.profile.edit') }}">{{ __('shop::app.customer.account.profile.index.edit') }}</a>
             </span>
 
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php
index 0c90c8cd5..0123bc81e 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php
@@ -6,59 +6,41 @@
         @include('shop::customers.account.partials.sidemenu')
 
         <div class="account-layout">
-
             <div class="account-head">
                 <span class="account-heading">Reviews</span>
                 <div class="horizontal-rule"></div>
             </div>
 
             <div class="account-items-list">
-                {{-- <div class="account-item-card mt-15 mb-15">
-                    <div class="media-info">
-                        @php
-                            $image = $productImageHelper->getProductBaseImage($item);
-                        @endphp
-                        <img class="media" src="{{ $image['small_image_url'] }}" />
+                @if(count($reviews))
+                    @foreach($reviews as $review)
+                    <div class="account-item-card mt-15 mb-15">
+                        <div class="media-info">
+                            <?php $image = $productImageHelper->getGalleryImages($review->product); ?>
+                            <img class="media" src="{{ $image[0]['small_image_url'] }}" />
 
-                        <div class="info mt-20">
-                            <div class="product-name">{{$item->name}}</div>
-                        </div>
-                    </div>
+                            <div class="info mt-20">
+                                <div class="product-name">{{$review->product->name}}</div>
 
-                    <div class="operations">
-                        <a class="mb-50" href="{{ route('customer.wishlist.remove', $item->id) }}"><span class="icon trash-icon"></span></a>
+                                <div>
+                                    @for($i=0 ; $i < $review->rating ; $i++)
+                                        <span class="icon star-icon"></span>
+                                    @endfor
+                                </div>
 
-                        <button class="btn btn-primary btn-md">Move To Cart</button>
-                    </div>
-                </div> --}}
-                @foreach($reviews as $review)
-                <div class="account-item-card mt-15 mb-15">
-                    <div class="media-info">
-                        <?php $image = $productImageHelper->getGalleryImages($review->product); ?>
-                        <img class="media" src="{{ $image[0]['small_image_url'] }}" />
-
-                        <div class="info mt-20">
-                            <div class="product-name">{{$review->product->name}}</div>
-
-                            <div>
-                                @for($i=0 ; $i < $review->rating ; $i++)
-                                    <span class="icon star-icon"></span>
-                                @endfor
-                            </div>
-
-                            <div>
-                                {{ $review->comment }}
+                                <div>
+                                    {{ $review->comment }}
+                                </div>
                             </div>
                         </div>
                     </div>
-
-                    <div class="operations">
-
+                    <div class="horizontal-rule mb-10 mt-10"></div>
+                    @endforeach
+                @else
+                    <div class="empty">
+                        {{ __('customer::app.reviews.empty') }}
                     </div>
-
-                </div>
-                <div class="horizontal-rule mb-10 mt-10"></div>
-                @endforeach
+                @endif
             </div>
         </div>
     </div>
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php
index 022577654..f4149dd7a 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php
@@ -9,11 +9,11 @@
 
     <div class="account-layout">
 
-        <div class="account-head">
+        <div class="account-head mb-15">
             <span class="account-heading">{{ __('shop::app.wishlist.title') }}</span>
 
             @if(count($items))
-            <div class="account-edit">
+            <div class="account-action">
                 <a href="" style="margin-right: 15px;">{{ __('shop::app.wishlist.deleteall') }}</a>
                 <a href="">{{ __('shop::app.wishlist.moveall') }}</a>
             </div>
@@ -40,7 +40,7 @@
                     <div class="operations">
                         <a class="mb-50" href="{{ route('customer.wishlist.remove', $item->id) }}"><span class="icon trash-icon"></span></a>
 
-                        <button class="btn btn-primary btn-md">Move To Cart</button>
+                        <button class="btn btn-primary btn-md">{{ __('shop::app.wishlist.move-to-cart') }}</button>
                     </div>
                 </div>
                 <div class="horizontal-rule mb-10 mt-10"></div>
diff --git a/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php b/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
index ef8f10c1f..8a1c976b5 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
@@ -34,14 +34,16 @@
             @if($product->type == "configurable")
                 <a href="{{ route('cart.add.configurable', $product->url_key) }}" class="btn btn-lg btn-primary addtocart">{{ __('shop::app.home.product-card.add-to-cart') }}</a>
             @else
-                <form action="{{route('cart.add', $product->id)}}" method="POST">
-                    @csrf
-                    <input type="hidden" name="product" value="{{ $product->id }}">
-                    <input type="hidden" name="quantity" value="1">
-                    <input type="hidden" value="false" name="is_configurable">
-                    <button class="btn btn-lg btn-primary addtocart">{{ __('shop::app.home.product-card.add-to-cart') }}</button>
-                </form>
-                @include('shop::products.wishlist')
+                <div class="cart-wish-wrap">
+                    <form action="{{route('cart.add', $product->id)}}" method="POST">
+                        @csrf
+                        <input type="hidden" name="product" value="{{ $product->id }}">
+                        <input type="hidden" name="quantity" value="1">
+                        <input type="hidden" value="false" name="is_configurable">
+                        <button class="btn btn-lg btn-primary addtocart">{{ __('shop::app.home.product-card.add-to-cart') }}</button>
+                    </form>
+                    @include('shop::products.wishlist')
+                </div>
             @endif
         @endif
     </div>
diff --git a/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php b/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php
index ff30bddea..66d5c1bcc 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php
@@ -1,26 +1,25 @@
 @extends('shop::layouts.master')
-
+@section('page_title')
+    {{ __('shop::app.reviews.add-review-page-title') }} - {{ $product->name }}
+@endsection
 @section('content-wrapper')
     <section class="review">
 
-        <div class="category-breadcrumbs">
+        {{-- <div class="category-breadcrumbs">
             <span class="breadcrumb">Home</span> > <span class="breadcrumb">Men</span> > <span class="breadcrumb">Slit Open Jeans</span>
-        </div>
-
-        <div class="review-layouter">
+        </div> --}}
 
+        <div class="review-layouter mb-20">
             <div class="product-info">
-
-                <div class="image">
+                <div class="product-image">
                     <img src="{{ bagisto_asset('images/jeans_big.jpg') }}" />
                 </div>
 
-                <div class="heading">
+                <div class="product-name">
                     <span>{{ $product->name }}</span>
                 </div>
 
-
-                <div class="price">
+                <div class="product-price">
 
                     @inject ('priceHelper', 'Webkul\Product\Product\Price')
 
@@ -34,37 +33,37 @@
                         @endif
                     @endif
 
-                    <span class="pro-price-not">
+                    {{-- <span class="pro-price-not">
                         <strike> $45.00 </strike>
                     </span>
 
-                    <span class="offer"> 10% Off </span>
-
+                    <span class="offer"> 10% Off </span> --}}
                 </div>
-
-
             </div>
 
-            <div class="review-info">
-
+            <div class="review-form">
                 <form method="POST" action="{{ route('shop.reviews.store', $product->id ) }}">
                     @csrf
-
                     <div class="heading">
-                        <span> Write a review </span>
+                        <span>{{ __('shop::app.reviews.write-review') }}</span>
                     </div>
 
                     <div class="rating">
                         <span> {{ __('admin::app.customers.reviews.rating') }} </span>
                     </div>
+
                     <div class="stars">
                         <label class="star star-5" for="star-5" onclick="calculateRating(id)" id="1"></label>
+
                         <label class="star star-4" for="star-4" onclick="calculateRating(id)" id="2"></label>
+
                         <label class="star star-3" for="star-3" onclick="calculateRating(id)" id="3"></label>
+
                         <label class="star star-2" for="star-2" onclick="calculateRating(id)" id="4"></label>
+
                         <label class="star star-1" for="star-1" onclick="calculateRating(id)" id="5"></label>
 
-                        <input type="name" name="title" class="form-control" placeholder="title">
+                        <input type="name" name="title" class="form-control" placeholder="{{ __('shop::app.reviews.review-title') }}">
 
                         <input type="hidden" id="rating" name="rating">
 
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php
index 8fc334b12..b5ed0e389 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php
@@ -70,4 +70,10 @@
 
     </div>
 </div>
+@else
+    @if(!is_null($customer))
+        <a href="{{ route('shop.reviews.create', $product->url_key) }}" class="btn btn-lg btn-primary">
+            {{ __('shop::app.products.write-review-btn') }}
+        </a>
+    @endif
 @endif
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/assets/js/components/flash.vue b/packages/Webkul/Ui/src/Resources/assets/js/components/flash.vue
index f4c3c2ab3..665700d27 100644
--- a/packages/Webkul/Ui/src/Resources/assets/js/components/flash.vue
+++ b/packages/Webkul/Ui/src/Resources/assets/js/components/flash.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="alert" v-bind:class="flash.type">
         <span class="icon white-cross-sm-icon" @click="remove"></span>
-        <p>{{ flash.message }}</p>  
+        <p>{{ flash.message }}</p>
     </div>
 </template>
 
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/_variables.scss b/packages/Webkul/Ui/src/Resources/assets/sass/_variables.scss
index afe55ad04..ef8f97015 100644
--- a/packages/Webkul/Ui/src/Resources/assets/sass/_variables.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/_variables.scss
@@ -1,5 +1,6 @@
 $font-color: #3a3a3a;
 $brand-color: #0041FF;
+$info-color: #204d74;
 $danger-color: #FC6868;
 $success-color: #4CAF50;
 $warning-color: #FFC107;
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/app.scss b/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
index 0325a8463..58e16a504 100644
--- a/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
@@ -513,6 +513,10 @@ h2 {
             background: $danger-color;
         }
 
+        &.alert-info {
+            background: $info-color;
+        }
+
         &.alert-success {
             background: $success-color;
         }
diff --git a/public/themes/default/assets/css/shop.css b/public/themes/default/assets/css/shop.css
index fa93efd98..380af5e74 100644
--- a/public/themes/default/assets/css/shop.css
+++ b/public/themes/default/assets/css/shop.css
@@ -97,6 +97,63 @@
   height: 32px;
 }
 
+.product-card .product-image {
+  max-height: 350px;
+  max-width: 280px;
+  margin-bottom: 10px;
+  background: #F2F2F2;
+}
+
+.product-card .product-image img {
+  display: block;
+  width: 100%;
+}
+
+.product-card .product-name {
+  margin-bottom: 14px;
+  width: 100%;
+  color: #242424;
+}
+
+.product-card .product-name a {
+  color: #242424;
+}
+
+.product-card .product-description {
+  display: none;
+}
+
+.product-card .product-ratings {
+  width: 100%;
+}
+
+.product-card .product-ratings .icon {
+  width: 16px;
+  height: 16px;
+}
+
+.product-card .cart-wish-wrap {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: flex-start;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  height: 40px;
+}
+
+.product-card .cart-wish-wrap .addtocart {
+  margin-right: 10px;
+  text-transform: uppercase;
+}
+
+.product-card .cart-wish-wrap .add-to-wishlist {
+  margin-top: 5px;
+}
+
 .product-grid-4 {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
@@ -139,56 +196,6 @@
   }
 }
 
-.product-card .product-image {
-  max-height: 350px;
-  max-width: 280px;
-  margin-bottom: 10px;
-  background: #F2F2F2;
-}
-
-.product-card .product-image img {
-  display: block;
-  width: 100%;
-}
-
-.product-card .product-name {
-  margin-bottom: 14px;
-  width: 100%;
-  color: #242424;
-}
-
-.product-card .product-name a {
-  color: #242424;
-}
-
-.product-card .product-description {
-  display: none;
-}
-
-.product-card .product-ratings {
-  width: 100%;
-}
-
-.product-card .product-ratings .icon {
-  width: 16px;
-  height: 16px;
-}
-
-.product-card .cart-fav-seg {
-  display: -webkit-inline-box;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-}
-
-.product-card .cart-fav-seg .addtocart {
-  margin-right: 10px;
-  text-transform: uppercase;
-  white-space: nowrap;
-}
-
 .add-to-wishlist .wishlist-icon:hover {
   background-image: url("../images/wishadd.svg");
 }
@@ -227,7 +234,7 @@
   text-align: left;
 }
 
-.account-head .account-edit {
+.account-head .account-action {
   font-size: 17px;
   margin-top: 1%;
   color: #0031F0;
@@ -2332,94 +2339,90 @@ section.review .review-layouter {
   display: flex;
   -webkit-box-orient: horizontal;
   -webkit-box-direction: normal;
-      -ms-flex-flow: row;
-          flex-flow: row;
-  margin-top: 20px;
+      -ms-flex-direction: row;
+          flex-direction: row;
 }
 
-section.review .review-layouter .product-info .image {
-  border: 1px solid red;
-}
-
-section.review .review-layouter .product-info .image img {
+section.review .review-layouter .product-info .product-image img {
+  display: block;
   height: 280px;
   width: 280px;
 }
 
-section.review .review-layouter .product-info .heading {
+section.review .review-layouter .product-info .product-name {
   margin-top: 20px;
 }
 
-section.review .review-layouter .product-info .heading span {
+section.review .review-layouter .product-info .product-name span {
   font-size: 24px;
 }
 
-section.review .review-layouter .product-info .price {
+section.review .review-layouter .product-info .product-price {
   margin-top: 10px;
 }
 
-section.review .review-layouter .product-info .price .pro-price {
+section.review .review-layouter .product-info .product-price .pro-price {
   font-size: 24px;
   color: #FF6472;
 }
 
-section.review .review-layouter .product-info .price .pro-price-not {
+section.review .review-layouter .product-info .product-price .pro-price-not {
   margin-left: 10px;
   color: #A5A5A5;
 }
 
-section.review .review-layouter .product-info .price .offer {
+section.review .review-layouter .product-info .product-price .offer {
   margin-left: 10px;
 }
 
-section.review .review-layouter .review-info {
+section.review .review-layouter .review-form {
   margin-left: 20px;
   width: 49%;
 }
 
-section.review .review-layouter .review-info .heading {
+section.review .review-layouter .review-form .heading {
   margin-top: 10px;
 }
 
-section.review .review-layouter .review-info .heading .btn.btn-primary.right {
+section.review .review-layouter .review-form .heading .btn.btn-primary.right {
   float: right;
   margin-top: -10px;
 }
 
-section.review .review-layouter .review-info .rating {
+section.review .review-layouter .review-form .rating {
   margin-top: 25px;
   color: #A5A5A5;
 }
 
-section.review .review-layouter .review-info .rating span {
+section.review .review-layouter .review-form .rating span {
   display: inline;
 }
 
-section.review .review-layouter .review-info .stars {
+section.review .review-layouter .review-form .stars {
   width: 270px;
   display: inline-block;
 }
 
-section.review .review-layouter .review-info .stars label.star {
+section.review .review-layouter .review-form .stars label.star {
   font-size: 36px;
   color: #d4d4d4;
   -webkit-transition: all .2s;
   transition: all .2s;
 }
 
-section.review .review-layouter .review-info .stars label.star:before {
+section.review .review-layouter .review-form .stars label.star:before {
   content: '\2605';
 }
 
-section.review .review-layouter .review-info .write-review {
+section.review .review-layouter .review-form .write-review {
   margin-top: 25px;
 }
 
-section.review .review-layouter .review-info .write-review .control-group {
+section.review .review-layouter .review-form .write-review .control-group {
   margin-bottom: 0px;
 }
 
-section.review .review-layouter .review-info .write-review .control-group textarea {
+section.review .review-layouter .review-form .write-review .control-group textarea {
   margin-top: 5px;
   border: 2px solid #E8E8E8;
   border-radius: 3px;
@@ -2427,11 +2430,11 @@ section.review .review-layouter .review-info .write-review .control-group textar
   height: 120px;
 }
 
-section.review .review-layouter .review-info .submit-button {
+section.review .review-layouter .review-form .submit-button {
   margin-top: 10px;
 }
 
-section.review .review-layouter .review-info .submit-button button {
+section.review .review-layouter .review-form .submit-button button {
   background: #0031F0;
   font-size: 14px;
   color: #F2F2F2;
@@ -2441,7 +2444,7 @@ section.review .review-layouter .review-info .submit-button button {
   border: none;
 }
 
-section.review .review-layouter .review-info .review-detail {
+section.review .review-layouter .review-form .review-detail {
   height: 150px;
   border: 1px solid firebrick;
   margin-top: 30px;
@@ -2454,18 +2457,18 @@ section.review .review-layouter .review-info .review-detail {
           flex-direction: row;
 }
 
-section.review .review-layouter .review-info .review-detail .rating-review {
+section.review .review-layouter .review-form .review-detail .rating-review {
   margin-top: 40px;
   margin-left: 20px;
   width: 48%;
 }
 
-section.review .review-layouter .review-info .review-detail .rating-review .avg-rating-count span {
+section.review .review-layouter .review-form .review-detail .rating-review .avg-rating-count span {
   font-size: 34px;
   text-align: center;
 }
 
-section.review .review-layouter .review-info .review-detail .rating-calculate .progress-only {
+section.review .review-layouter .review-form .review-detail .rating-calculate .progress-only {
   width: 20px;
   border: 1px solid blue;
 }

From 3a17aacd9040a9b5472f3eb102d38ca072f45460 Mon Sep 17 00:00:00 2001
From: prashant-webkul <prashant.singh852@webkul.com>
Date: Mon, 15 Oct 2018 20:18:58 +0530
Subject: [PATCH 2/8] Wishlist Move To Cart For Simple Products Done

---
 packages/Webkul/Checkout/src/Cart.php         | 22 +++++++-
 .../Http/Controllers/WishlistController.php   | 54 +++++++++++++++++--
 .../Customer/src/Resources/lang/en/app.php    |  3 +-
 .../Webkul/Product/src/Product/Review.php     |  4 +-
 packages/Webkul/Shop/src/Http/routes.php      |  4 ++
 .../src/Resources/assets/sass/components.scss |  1 -
 .../account/wishlist/wishlist.blade.php       |  2 +-
 .../views/layouts/header/index.blade.php      | 25 ---------
 .../views/products/list/card.blade.php        |  1 +
 .../Resources/views/products/view.blade.php   | 40 +-------------
 .../views/products/wishlist.blade.php         |  6 +--
 public/themes/default/assets/css/shop.css     | 45 ----------------
 public/themes/default/assets/js/shop.js       |  6 +--
 .../themes/default/assets/mix-manifest.json   |  2 +-
 14 files changed, 89 insertions(+), 126 deletions(-)

diff --git a/packages/Webkul/Checkout/src/Cart.php b/packages/Webkul/Checkout/src/Cart.php
index 287b5cecc..c5dc5d5b5 100644
--- a/packages/Webkul/Checkout/src/Cart.php
+++ b/packages/Webkul/Checkout/src/Cart.php
@@ -107,8 +107,6 @@ class Cart {
     {
         $product = $this->product->findOneByField('id', $productId);
 
-        // dd($product);
-
         //Check if the product's information is proper or not.
         if(!isset($data['product']) || !isset($data['quantity'])) {
             session()->flash('error', trans('shop::app.checkout.cart.integrity.missing_fields'));
@@ -961,4 +959,24 @@ class Cart {
 
         return $finalData;
     }
+
+    /**
+     * Move to Cart
+     *
+     * Move a wishlist item to cart
+     */
+    public function moveToCart($productId) {
+        $data = [
+            'product' => $productId,
+            'quantity' => 1,
+        ];
+
+        $result = $this->add($productId, $data);
+
+        if($result instanceof Collection || $result == true) {
+            return true;
+        } else {
+            return false;
+        }
+    }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Customer/src/Http/Controllers/WishlistController.php b/packages/Webkul/Customer/src/Http/Controllers/WishlistController.php
index 5b3e1a7af..600431d22 100644
--- a/packages/Webkul/Customer/src/Http/Controllers/WishlistController.php
+++ b/packages/Webkul/Customer/src/Http/Controllers/WishlistController.php
@@ -5,7 +5,9 @@ namespace Webkul\Customer\Http\Controllers;
 use Illuminate\Http\Request;
 use Illuminate\Http\Response;
 use Webkul\Customer\Repositories\CustomerRepository;
+use Webkul\Product\Repositories\ProductRepository;
 use Webkul\Customer\Repositories\WishlistRepository;
+use Cart;
 use Auth;
 
 /**
@@ -26,13 +28,15 @@ class WishlistController extends Controller
 
     protected $wishlist;
 
+    protected $product;
+
     /**
      * Initializes the required repository instances.
      *
      * @param $customer
      * @param $wishlist
      */
-    public function __construct(CustomerRepository $customer, WishlistRepository $wishlist)
+    public function __construct(CustomerRepository $customer, WishlistRepository $wishlist, ProductRepository $product)
     {
         $this->middleware('customer');
 
@@ -41,6 +45,8 @@ class WishlistController extends Controller
         $this->customer = $customer;
 
         $this->wishlist = $wishlist;
+
+        $this->product = $product;
     }
 
     /**
@@ -67,6 +73,15 @@ class WishlistController extends Controller
      * @param integer $itemId
      */
     public function add($itemId) {
+        $product = $this->product->findOneByField('id', $itemId);
+
+        if($product->type == "configurable") {
+            $slug = $product->url_key;
+
+            session()->flash('warning', trans('customer::app.wishlist.select-options'));
+
+            return redirect()->route('shop.products.index', $slug);
+        }
 
         $data = [
             'channel_id' => core()->getCurrentChannel()->id,
@@ -111,12 +126,45 @@ class WishlistController extends Controller
         }
     }
 
+    /**
+     * Add the configurable product
+     * to the wishlist.
+     *
+     * @return response
+     */
+    public function addconfigurable($urlkey) {
+        dd($urlkey);
+        session()->flash('warning', trans('Select options before adding to wishlist'));
+        return redirect()->route('shop.products.index', $urlkey);
+    }
+
     /**
      * Function to move item from wishlist to cart.
      *
      * @param integer $itemId
      */
-    public function moveToCart() {
-        dd('adding item to wishlist');
+    public function moveAll() {
+        Cart::moveAllToCart();
+    }
+
+    /**
+     * Function to move item from wishlist to cart.
+     *
+     * @param integer $itemId
+     */
+    public function move($productId) {
+        $result = Cart::moveToCart($productId);
+
+        $wishlist = $this->wishlist->findWhere(['customer_id' => auth()->guard('customer')->user()->id, 'product_id' => $productId]);
+
+        if($this->wishlist->delete($wishlist[0]->id)) {
+            session()->flash('success', 'Item Moved To Cart Successfully');
+
+            return redirect()->back();
+        } else {
+            session()->flash('error', 'Item Cannot Be Moved To Cart Successfully');
+
+            return redirect()->back();
+        }
     }
 }
diff --git a/packages/Webkul/Customer/src/Resources/lang/en/app.php b/packages/Webkul/Customer/src/Resources/lang/en/app.php
index 470145c57..30f59002c 100644
--- a/packages/Webkul/Customer/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Customer/src/Resources/lang/en/app.php
@@ -7,6 +7,7 @@ return [
         'already' => 'Item Already Present In Your Wishlist',
         'removed' => 'Item Successfully Added To Wishlist',
         'remove-fail' => 'Item Cannot Be Removed From Wishlist',
-        'empty' => 'You Don\'t Have Any Items In Your Wishlist'
+        'empty' => 'You Don\'t Have Any Items In Your Wishlist',
+        'select-options' => 'Need To Select Options Before Adding To Wishlist'
     ],
 ];
\ No newline at end of file
diff --git a/packages/Webkul/Product/src/Product/Review.php b/packages/Webkul/Product/src/Product/Review.php
index dd14117fd..a2c276e99 100644
--- a/packages/Webkul/Product/src/Product/Review.php
+++ b/packages/Webkul/Product/src/Product/Review.php
@@ -7,7 +7,7 @@ class Review extends AbstractProduct
     /**
      * Returns the product's avg rating
      *
-    * @param Product $product
+     * @param Product $product
      * @return float
      */
     public function getReviews($product)
@@ -18,7 +18,7 @@ class Review extends AbstractProduct
     /**
      * Returns the product's avg rating
      *
-    * @param Product $product
+     * @param Product $product
      * @return float
      */
     public function getAverageRating($product)
diff --git a/packages/Webkul/Shop/src/Http/routes.php b/packages/Webkul/Shop/src/Http/routes.php
index 597295d7c..ffdd15983 100644
--- a/packages/Webkul/Shop/src/Http/routes.php
+++ b/packages/Webkul/Shop/src/Http/routes.php
@@ -119,6 +119,10 @@ Route::group(['middleware' => ['web']], function () {
 
             Route::get('wishlist/remove/{id}', 'Webkul\Customer\Http\Controllers\WishlistController@remove')->name('customer.wishlist.remove');
 
+            Route::get('wishlist/move/{id}', 'Webkul\Customer\Http\Controllers\WishlistController@move')->name('customer.wishlist.move');
+
+            Route::get('wishlist/moveall', 'Webkul\Customer\Http\Controllers\WishlistController@moveAll')->name('customer.wishlist.moveall');
+
             //customer account
             Route::prefix('account')->group(function () {
 
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/components.scss b/packages/Webkul/Shop/src/Resources/assets/sass/components.scss
index 08e17227b..de24f9f32 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/components.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/components.scss
@@ -44,7 +44,6 @@
         .addtocart {
             margin-right: 10px;
             text-transform: uppercase;
-
         }
 
         .add-to-wishlist {
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php
index f4149dd7a..6d4bff826 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php
@@ -40,7 +40,7 @@
                     <div class="operations">
                         <a class="mb-50" href="{{ route('customer.wishlist.remove', $item->id) }}"><span class="icon trash-icon"></span></a>
 
-                        <button class="btn btn-primary btn-md">{{ __('shop::app.wishlist.move-to-cart') }}</button>
+                        <a href="{{ route('customer.wishlist.move', $item->id) }}" class="btn btn-primary btn-md">{{ __('shop::app.wishlist.move-to-cart') }}</a>
                     </div>
                 </div>
                 <div class="horizontal-rule mb-10 mt-10"></div>
diff --git a/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php b/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
index 3a7564f23..ebc599d08 100644
--- a/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
@@ -277,35 +277,10 @@
         var layerFilter = document.getElementsByClassName('responsive-layred-filter')[0];
         var navResponsive = document.getElementsByClassName('responsive-nav')[0];
         var thumbList = document.getElementsByClassName('thumb-list')[0];
-        var thumbFrame = document.getElementsByClassName('thumb-frame');
-        var productHeroImage = document.getElementsByClassName('product-hero-image')[0];
 
         search.addEventListener("click", header);
         hamMenu.addEventListener("click", header);
 
-        // activate on window resize
-        window.addEventListener('resize', function(){
-            if(window.innerWidth > 720){
-                searchResponsive.style.display = 'none';
-                navResponsive.style.display = 'none';
-                if(layerFilter && sortLimit){
-                    layerFilter.style.display ="none";
-                    sortLimit.style.display ="none";
-                }
-            }
-            if(window.innerWidth < 1313 && window.innerWidth > 720){
-                if(thumbList){
-                    thumbList.style.maxHeight = productHeroImage.offsetHeight + "px";
-                    for(let i=0 ; i < thumbFrame.length ; i++){
-                        thumbFrame[i].style.height = (productHeroImage.offsetHeight/4) + "px";
-                    }
-                }
-            }else {
-                for(let i=0 ; i < thumbFrame.length ; i++){
-                    thumbFrame[i].style.height = 120 + "px";
-                }
-            }
-        });
 
         // for header responsive icon
         function header(){
diff --git a/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php b/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
index 8a1c976b5..577e52944 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
@@ -33,6 +33,7 @@
         @else
             @if($product->type == "configurable")
                 <a href="{{ route('cart.add.configurable', $product->url_key) }}" class="btn btn-lg btn-primary addtocart">{{ __('shop::app.home.product-card.add-to-cart') }}</a>
+                @include('shop::products.wishlist')
             @else
                 <div class="cart-wish-wrap">
                     <form action="{{route('cart.add', $product->id)}}" method="POST">
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
index 3f7f25fab..4ffa896e3 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
@@ -65,52 +65,14 @@
                     </accordian>
 
                     @include ('shop::products.view.attributes')
+
                     @include ('shop::products.view.reviews')
                 </div>
             </form>
         </div>
-
         @include ('shop::products.view.up-sells')
     </section>
-
 @endsection
 
-@push('scripts')
-<script>
-
-    document.onreadystatechange = function () {
-        var state = document.readyState
-        var galleryTemplate = document.getElementById('product-gallery-template');
-        var addTOButton = document.getElementsByClassName('add-to-buttons')[0];
-
-        if(galleryTemplate){
-            if (state == 'interactive') {
-                galleryTemplate.style.display="none";
-            } else  {
-                document.getElementById('loader').style.display="none";
-                addTOButton.style.display="flex";
-            }
-        }
-    }
-
-    $(document).ready(function() {
-
-        var thumbList = document.getElementsByClassName('thumb-list')[0];
-        var thumbFrame = document.getElementsByClassName('thumb-frame');
-        var productHeroImage = document.getElementsByClassName('product-hero-image')[0];
-
-        // for product page resize image
-        if(thumbList && productHeroImage){
-            thumbList.style.maxHeight = productHeroImage.offsetHeight + "px";
-            for(let i=0 ; i < thumbFrame.length ; i++){
-                thumbFrame[i].style.height = (productHeroImage.offsetHeight/4) + "px";
-            }
-        }
-    })
-
-</script>
-@endpush
-
-
 
 
diff --git a/packages/Webkul/Shop/src/Resources/views/products/wishlist.blade.php b/packages/Webkul/Shop/src/Resources/views/products/wishlist.blade.php
index 07c17d4be..4cb6e668a 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/wishlist.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/wishlist.blade.php
@@ -1,5 +1,5 @@
 @auth('customer')
-<a class="add-to-wishlist" href="{{ route('customer.wishlist.add', $product->id) }}">
-    <span class="icon wishlist-icon"></span>
-</a>
+    <a class="add-to-wishlist" href="{{ route('customer.wishlist.add', $product->id) }}">
+        <span class="icon wishlist-icon"></span>
+    </a>
 @endauth
diff --git a/public/themes/default/assets/css/shop.css b/public/themes/default/assets/css/shop.css
index 32890abf5..e0ddf3162 100644
--- a/public/themes/default/assets/css/shop.css
+++ b/public/themes/default/assets/css/shop.css
@@ -97,8 +97,6 @@
   height: 32px;
 }
 
-<<<<<<< HEAD
-=======
 .icon-arrow-up {
   background-image: url("../images/arrow-up.svg");
   width: 16px;
@@ -123,49 +121,6 @@
   height: 18px;
 }
 
-.product-grid-4 {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
-  grid-auto-rows: auto;
-  grid-column-gap: 48px;
-  grid-row-gap: 15px;
-}
-
-.product-grid-3 {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
-  grid-gap: 27px;
-  grid-auto-rows: auto;
-}
-
-@media only screen and (max-width: 854px) {
-  .product-grid-4 {
-    grid-template-columns: 29.5% 29.5% 29.5%;
-    grid-column-gap: 35px;
-  }
-}
-
-@media only screen and (max-width: 653px) {
-  .product-grid-4 {
-    grid-template-columns: 48.5% 48.5%;
-    grid-column-gap: 17px;
-  }
-}
-
-@media only screen and (max-width: 425px) {
-  .product-card {
-    font-size: 90%;
-  }
-  .product-card .btn.btn-md {
-    padding: 5px;
-  }
-  .product-grid-4 {
-    grid-template-columns: 48.5% 48.5%;
-    grid-column-gap: 10px;
-  }
-}
-
->>>>>>> 0b9568132497b959c68dbcbf51488f2780f13c0d
 .product-card .product-image {
   max-height: 350px;
   max-width: 280px;
diff --git a/public/themes/default/assets/js/shop.js b/public/themes/default/assets/js/shop.js
index 198b1ae5f..007147784 100644
--- a/public/themes/default/assets/js/shop.js
+++ b/public/themes/default/assets/js/shop.js
@@ -11535,7 +11535,7 @@ return jQuery;
 
 "use strict";
 /* WEBPACK VAR INJECTION */(function(global, setImmediate) {/*!
- * Vue.js v2.5.17
+ * Vue.js v2.5.16
  * (c) 2014-2018 Evan You
  * Released under the MIT License.
  */
@@ -16624,7 +16624,7 @@ Object.defineProperty(Vue, 'FunctionalRenderContext', {
   value: FunctionalRenderContext
 });
 
-Vue.version = '2.5.17';
+Vue.version = '2.5.16';
 
 /*  */
 
@@ -31526,7 +31526,7 @@ if (false) {
 /* 50 */
 /***/ (function(module, exports, __webpack_require__) {
 
-!function(t,e){ true?module.exports=e():"function"==typeof define&&define.amd?define("vue-slider-component",[],e):"object"==typeof exports?exports["vue-slider-component"]=e():t["vue-slider-component"]=e()}(this,function(){return function(t){function e(s){if(i[s])return i[s].exports;var r=i[s]={i:s,l:!1,exports:{}};return t[s].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var i={};return e.m=t,e.c=i,e.i=function(t){return t},e.d=function(t,i,s){e.o(t,i)||Object.defineProperty(t,i,{configurable:!1,enumerable:!0,get:s})},e.n=function(t){var i=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(i,"a",i),i},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=2)}([function(t,e,i){i(7);var s=i(5)(i(1),i(6),null,null);t.exports=s.exports},function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var s=function(){var t="undefined"!=typeof window?window.devicePixelRatio||1:1;return function(e){return Math.round(e*t)/t}}();e.default={name:"VueSliderComponent",props:{width:{type:[Number,String],default:"auto"},height:{type:[Number,String],default:6},data:{type:Array,default:null},dotSize:{type:Number,default:16},dotWidth:{type:Number,required:!1},dotHeight:{type:Number,required:!1},min:{type:Number,default:0},max:{type:Number,default:100},interval:{type:Number,default:1},show:{type:Boolean,default:!0},disabled:{type:[Boolean,Array],default:!1},piecewise:{type:Boolean,default:!1},tooltip:{type:[String,Boolean],default:"always"},eventType:{type:String,default:"auto"},direction:{type:String,default:"horizontal"},reverse:{type:Boolean,default:!1},lazy:{type:Boolean,default:!1},clickable:{type:Boolean,default:!0},speed:{type:Number,default:.5},realTime:{type:Boolean,default:!1},stopPropagation:{type:Boolean,default:!1},value:{type:[String,Number,Array,Object],default:0},piecewiseLabel:{type:Boolean,default:!1},debug:{type:Boolean,default:!0},fixed:{type:Boolean,default:!1},processDragable:{type:Boolean,default:!1},useKeyboard:{type:Boolean,default:!1},actionsKeyboard:{type:Array,default:function(){return[function(t){return t-1},function(t){return t+1}]}},tooltipMerge:{type:Boolean,default:!0},startAnimation:{type:Boolean,default:!1},sliderStyle:[Array,Object,Function],focusStyle:[Array,Object,Function],tooltipDir:[Array,String],formatter:[String,Function],mergeFormatter:[String,Function],piecewiseStyle:Object,disabledStyle:Object,piecewiseActiveStyle:Object,processStyle:Object,bgStyle:Object,tooltipStyle:[Array,Object,Function],disabledDotStyle:[Array,Object,Function],labelStyle:Object,labelActiveStyle:Object},data:function(){return{flag:!1,keydownFlag:null,focusFlag:!1,processFlag:!1,processSign:null,size:0,fixedValue:0,focusSlider:0,currentValue:0,currentSlider:0,isComponentExists:!0,isMounted:!1}},computed:{dotWidthVal:function(){return"number"==typeof this.dotWidth?this.dotWidth:this.dotSize},dotHeightVal:function(){return"number"==typeof this.dotHeight?this.dotHeight:this.dotSize},flowDirection:function(){return"vue-slider-"+this.direction+(this.reverse?"-reverse":"")},tooltipMergedPosition:function(){if(!this.isMounted)return{};var t=this.tooltipDirection[0];if(this.$refs.dot0){if("vertical"===this.direction){var e={};return e[t]="-"+(this.dotHeightVal/2-this.width/2+9)+"px",e}var i={};return i[t]="-"+(this.dotWidthVal/2-this.height/2+9)+"px",i.left="50%",i}},tooltipDirection:function(){var t=this.tooltipDir||("vertical"===this.direction?"left":"top");return Array.isArray(t)?this.isRange?t:t[1]:this.isRange?[t,t]:t},tooltipStatus:function(){return"hover"===this.tooltip&&this.flag?"vue-slider-always":this.tooltip?"vue-slider-"+this.tooltip:""},tooltipClass:function(){return["vue-slider-tooltip-"+this.tooltipDirection,"vue-slider-tooltip"]},disabledArray:function(){return Array.isArray(this.disabled)?this.disabled:[this.disabled,this.disabled]},boolDisabled:function(){return this.disabledArray.every(function(t){return!0===t})},isDisabled:function(){return"none"===this.eventType||this.boolDisabled},disabledClass:function(){return this.boolDisabled?"vue-slider-disabled":""},stateClass:function(){return{"vue-slider-state-process-drag":this.processFlag,"vue-slider-state-drag":this.flag&&!this.processFlag&&!this.keydownFlag,"vue-slider-state-focus":this.focusFlag}},isRange:function(){return Array.isArray(this.value)},slider:function(){return this.isRange?[this.$refs.dot0,this.$refs.dot1]:this.$refs.dot},minimum:function(){return this.data?0:this.min},val:{get:function(){return this.data?this.isRange?[this.data[this.currentValue[0]],this.data[this.currentValue[1]]]:this.data[this.currentValue]:this.currentValue},set:function(t){if(this.data)if(this.isRange){var e=this.data.indexOf(t[0]),i=this.data.indexOf(t[1]);e>-1&&i>-1&&(this.currentValue=[e,i])}else{var s=this.data.indexOf(t);s>-1&&(this.currentValue=s)}else this.currentValue=t}},currentIndex:function(){return this.isRange?this.data?this.currentValue:[this.getIndexByValue(this.currentValue[0]),this.getIndexByValue(this.currentValue[1])]:this.getIndexByValue(this.currentValue)},indexRange:function(){return this.isRange?this.currentIndex:[0,this.currentIndex]},maximum:function(){return this.data?this.data.length-1:this.max},multiple:function(){var t=(""+this.interval).split(".")[1];return t?Math.pow(10,t.length):1},spacing:function(){return this.data?1:this.interval},total:function(){return this.data?this.data.length-1:(Math.floor((this.maximum-this.minimum)*this.multiple)%(this.interval*this.multiple)!=0&&this.printError("Prop[interval] is illegal, Please make sure that the interval can be divisible"),(this.maximum-this.minimum)/this.interval)},gap:function(){return this.size/this.total},position:function(){return this.isRange?[(this.currentValue[0]-this.minimum)/this.spacing*this.gap,(this.currentValue[1]-this.minimum)/this.spacing*this.gap]:(this.currentValue-this.minimum)/this.spacing*this.gap},limit:function(){return this.isRange?this.fixed?[[0,(this.total-this.fixedValue)*this.gap],[this.fixedValue*this.gap,this.size]]:[[0,this.position[1]],[this.position[0],this.size]]:[0,this.size]},valueLimit:function(){return this.isRange?this.fixed?[[this.minimum,this.maximum-this.fixedValue*(this.spacing*this.multiple)/this.multiple],[this.minimum+this.fixedValue*(this.spacing*this.multiple)/this.multiple,this.maximum]]:[[this.minimum,this.currentValue[1]],[this.currentValue[0],this.maximum]]:[this.minimum,this.maximum]},idleSlider:function(){return 0===this.currentSlider?1:0},wrapStyles:function(){return"vertical"===this.direction?{height:"number"==typeof this.height?this.height+"px":this.height,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}:{width:"number"==typeof this.width?this.width+"px":this.width,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}},sliderStyles:function(){return Array.isArray(this.sliderStyle)?this.isRange?this.sliderStyle:this.sliderStyle[1]:"function"==typeof this.sliderStyle?this.sliderStyle(this.val,this.currentIndex):this.isRange?[this.sliderStyle,this.sliderStyle]:this.sliderStyle},focusStyles:function(){return Array.isArray(this.focusStyle)?this.isRange?this.focusStyle:this.focusStyle[1]:"function"==typeof this.focusStyle?this.focusStyle(this.val,this.currentIndex):this.isRange?[this.focusStyle,this.focusStyle]:this.focusStyle},disabledDotStyles:function(){var t=this.disabledDotStyle;if(Array.isArray(t))return t;if("function"==typeof t){var e=t(this.val,this.currentIndex);return Array.isArray(e)?e:[e,e]}return t?[t,t]:[{backgroundColor:"#ccc"},{backgroundColor:"#ccc"}]},tooltipStyles:function(){return Array.isArray(this.tooltipStyle)?this.isRange?this.tooltipStyle:this.tooltipStyle[1]:"function"==typeof this.tooltipStyle?this.tooltipStyle(this.val,this.currentIndex):this.isRange?[this.tooltipStyle,this.tooltipStyle]:this.tooltipStyle},elemStyles:function(){return"vertical"===this.direction?{width:this.width+"px",height:"100%"}:{height:this.height+"px"}},dotStyles:function(){return"vertical"===this.direction?{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",left:-(this.dotWidthVal-this.width)/2+"px"}:{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",top:-(this.dotHeightVal-this.height)/2+"px"}},piecewiseDotStyle:function(){return"vertical"===this.direction?{width:this.width+"px",height:this.width+"px"}:{width:this.height+"px",height:this.height+"px"}},piecewiseDotWrap:function(){if(!this.piecewise&&!this.piecewiseLabel)return!1;for(var t=[],e=0;e<=this.total;e++){var i="vertical"===this.direction?{bottom:this.gap*e-this.width/2+"px",left:0}:{left:this.gap*e-this.height/2+"px",top:0},s=this.reverse?this.total-e:e,r=this.data?this.data[s]:this.spacing*s+this.min;t.push({style:i,label:this.formatter?this.formatting(r):r,inRange:s>=this.indexRange[0]&&s<=this.indexRange[1]})}return t}},watch:{value:function(t){this.flag||this.setValue(t,!0)},max:function(t){if(t<this.min)return this.printError("The maximum value can not be less than the minimum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},min:function(t){if(t>this.max)return this.printError("The minimum value can not be greater than the maximum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},show:function(t){var e=this;t&&!this.size&&this.$nextTick(function(){e.refresh()})},fixed:function(){this.computedFixedValue()}},methods:{bindEvents:function(){document.addEventListener("touchmove",this.moving,{passive:!1}),document.addEventListener("touchend",this.moveEnd,{passive:!1}),document.addEventListener("mousedown",this.blurSlider),document.addEventListener("mousemove",this.moving),document.addEventListener("mouseup",this.moveEnd),document.addEventListener("mouseleave",this.moveEnd),document.addEventListener("keydown",this.handleKeydown),document.addEventListener("keyup",this.handleKeyup),window.addEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.addEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.addEventListener("transitionend",this.handleOverlapTooltip))},unbindEvents:function(){document.removeEventListener("touchmove",this.moving),document.removeEventListener("touchend",this.moveEnd),document.removeEventListener("mousedown",this.blurSlider),document.removeEventListener("mousemove",this.moving),document.removeEventListener("mouseup",this.moveEnd),document.removeEventListener("mouseleave",this.moveEnd),document.removeEventListener("keydown",this.handleKeydown),document.removeEventListener("keyup",this.handleKeyup),window.removeEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.removeEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.removeEventListener("transitionend",this.handleOverlapTooltip))},handleKeydown:function(t){if(!this.useKeyboard||!this.focusFlag)return!1;switch(t.keyCode){case 37:case 40:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[0]);break;case 38:case 39:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[1])}},handleKeyup:function(){this.keydownFlag&&(this.keydownFlag=!1,this.flag=!1)},changeFocusSlider:function(t){var e=this;if(this.isRange){var i=this.currentIndex.map(function(i,s){if(s===e.focusSlider||e.fixed){var r=t(i),o=e.fixed?e.valueLimit[s]:[0,e.total];if(r<=o[1]&&r>=o[0])return r}return i});i[0]>i[1]&&(this.focusSlider=0===this.focusSlider?1:0,i=i.reverse()),this.setIndex(i)}else this.setIndex(t(this.currentIndex))},blurSlider:function(t){var e=this.isRange?this.$refs["dot"+this.focusSlider]:this.$refs.dot;if(!e||e===t.target)return!1;this.focusFlag=!1},formatting:function(t){return"string"==typeof this.formatter?this.formatter.replace(/\{value\}/,t):this.formatter(t)},mergeFormatting:function(t,e){return"string"==typeof this.mergeFormatter?this.mergeFormatter.replace(/\{(value1|value2)\}/g,function(i,s){return"value1"===s?t:e}):this.mergeFormatter(t,e)},getPos:function(t){return this.realTime&&this.getStaticData(),"vertical"===this.direction?this.reverse?t.pageY-this.offset:this.size-(t.pageY-this.offset):this.reverse?this.size-(t.clientX-this.offset):t.clientX-this.offset},processClick:function(t){this.fixed&&t.stopPropagation()},wrapClick:function(t){var e=this;if(this.isDisabled||!this.clickable||this.processFlag)return!1;var i=this.getPos(t);if(this.isRange)if(this.disabledArray.every(function(t){return!1===t}))this.currentSlider=i>(this.position[1]-this.position[0])/2+this.position[0]?1:0;else if(this.disabledArray[0]){if(i<this.position[0])return!1;this.currentSlider=1}else if(this.disabledArray[1]){if(i>this.position[1])return!1;this.currentSlider=0}if(this.disabledArray[this.currentSlider])return!1;if(this.setValueOnPos(i),this.isRange&&this.tooltipMerge){var s=setInterval(function(){return e.handleOverlapTooltip()},16.7);setTimeout(function(){return window.clearInterval(s)},1e3*this.speed)}},moveStart:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,i=arguments[2];if(this.disabledArray[e])return!1;if(this.stopPropagation&&t.stopPropagation(),this.isRange&&(this.currentSlider=e,i)){if(!this.processDragable)return!1;this.processFlag=!0,this.processSign={pos:this.position,start:this.getPos(t.targetTouches&&t.targetTouches[0]?t.targetTouches[0]:t)}}!i&&this.useKeyboard&&(this.focusFlag=!0,this.focusSlider=e),this.flag=!0,this.$emit("drag-start",this)},moving:function(t){if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;t.preventDefault(),t.targetTouches&&t.targetTouches[0]&&(t=t.targetTouches[0]),this.processFlag?(this.currentSlider=0,this.setValueOnPos(this.processSign.pos[0]+this.getPos(t)-this.processSign.start,!0),this.currentSlider=1,this.setValueOnPos(this.processSign.pos[1]+this.getPos(t)-this.processSign.start,!0)):this.setValueOnPos(this.getPos(t),!0),this.isRange&&this.tooltipMerge&&this.handleOverlapTooltip()},moveEnd:function(t){var e=this;if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;this.$emit("drag-end",this),this.lazy&&this.isDiff(this.val,this.value)&&this.syncValue(),this.flag=!1,window.setTimeout(function(){e.processFlag=!1},0),this.setPosition()},setValueOnPos:function(t,e){var i=this.isRange?this.limit[this.currentSlider]:this.limit,s=this.isRange?this.valueLimit[this.currentSlider]:this.valueLimit;if(t>=i[0]&&t<=i[1]){this.setTransform(t);var r=this.getValueByIndex(Math.round(t/this.gap));this.setCurrentValue(r,e),this.isRange&&this.fixed&&(this.setTransform(t+this.fixedValue*this.gap*(0===this.currentSlider?1:-1),!0),this.setCurrentValue((r*this.multiple+this.fixedValue*this.spacing*this.multiple*(0===this.currentSlider?1:-1))/this.multiple,e,!0))}else t<i[0]?(this.setTransform(i[0]),this.setCurrentValue(s[0]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][0],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][0],e,!0)):this.fixed||this.disabledArray[0]||1!==this.currentSlider||(this.focusSlider=0,this.currentSlider=0)):(this.setTransform(i[1]),this.setCurrentValue(s[1]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][1],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][1],e,!0)):this.fixed||this.disabledArray[1]||0!==this.currentSlider||(this.focusSlider=1,this.currentSlider=1))},isDiff:function(t,e){return Object.prototype.toString.call(t)!==Object.prototype.toString.call(e)||(Array.isArray(t)&&t.length===e.length?t.some(function(t,i){return t!==e[i]}):t!==e)},setCurrentValue:function(t,e,i){var s=i?this.idleSlider:this.currentSlider;if(t<this.minimum||t>this.maximum)return!1;this.isRange?this.isDiff(this.currentValue[s],t)&&(this.currentValue.splice(s,1,t),this.lazy&&this.flag||this.syncValue()):this.isDiff(this.currentValue,t)&&(this.currentValue=t,this.lazy&&this.flag||this.syncValue()),e||this.setPosition()},getValueByIndex:function(t){return(this.spacing*this.multiple*t+this.minimum*this.multiple)/this.multiple},getIndexByValue:function(t){return Math.round((t-this.minimum)*this.multiple)/(this.spacing*this.multiple)},setIndex:function(t){if(Array.isArray(t)&&this.isRange){var e=void 0;e=this.data?[this.data[t[0]],this.data[t[1]]]:[this.getValueByIndex(t[0]),this.getValueByIndex(t[1])],this.setValue(e)}else t=this.getValueByIndex(t),this.isRange&&(this.currentSlider=t>(this.currentValue[1]-this.currentValue[0])/2+this.currentValue[0]?1:0),this.setCurrentValue(t)},setValue:function(t,e,i){var s=this;if(this.isDiff(this.val,t)){var r=this.limitValue(t);this.val=this.isRange?r.concat():r,this.computedFixedValue(),this.syncValue(e)}this.$nextTick(function(){return s.setPosition(i)})},computedFixedValue:function(){if(!this.fixed)return this.fixedValue=0,!1;this.fixedValue=this.currentIndex[1]-this.currentIndex[0]},setPosition:function(t){this.flag||this.setTransitionTime(void 0===t?this.speed:t),this.isRange?(this.setTransform(this.position[0],1===this.currentSlider),this.setTransform(this.position[1],0===this.currentSlider)):this.setTransform(this.position),this.flag||this.setTransitionTime(0)},setTransform:function(t,e){var i=e?this.idleSlider:this.currentSlider,r=s(("vertical"===this.direction?this.dotHeightVal/2-t:t-this.dotWidthVal/2)*(this.reverse?-1:1)),o="vertical"===this.direction?"translateY("+r+"px)":"translateX("+r+"px)",n=this.fixed?this.fixedValue*this.gap+"px":(0===i?this.position[1]-t:t-this.position[0])+"px",l=this.fixed?(0===i?t:t-this.fixedValue*this.gap)+"px":(0===i?t:this.position[0])+"px";this.isRange?(this.slider[i].style.transform=o,this.slider[i].style.WebkitTransform=o,this.slider[i].style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=n,this.$refs.process.style[this.reverse?"top":"bottom"]=l):(this.$refs.process.style.width=n,this.$refs.process.style[this.reverse?"right":"left"]=l)):(this.slider.style.transform=o,this.slider.style.WebkitTransform=o,this.slider.style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=t+"px",this.$refs.process.style[this.reverse?"top":"bottom"]=0):(this.$refs.process.style.width=t+"px",this.$refs.process.style[this.reverse?"right":"left"]=0))},setTransitionTime:function(t){if(t||this.$refs.process.offsetWidth,this.isRange){for(var e=0;e<this.slider.length;e++)this.slider[e].style.transitionDuration=t+"s",this.slider[e].style.WebkitTransitionDuration=t+"s";this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"}else this.slider.style.transitionDuration=t+"s",this.slider.style.WebkitTransitionDuration=t+"s",this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"},limitValue:function(t){var e=this;if(this.data)return t;var i=function(i){return i<e.min?(e.printError("The value of the slider is "+t+", the minimum value is "+e.min+", the value of this slider can not be less than the minimum value"),e.min):i>e.max?(e.printError("The value of the slider is "+t+", the maximum value is "+e.max+", the value of this slider can not be greater than the maximum value"),e.max):i};return this.isRange?t.map(function(t){return i(t)}):i(t)},syncValue:function(t){var e=this.isRange?this.val.concat():this.val;this.$emit("input",e),this.keydownFlag&&this.$emit("on-keypress",e),t||this.$emit("callback",e)},getValue:function(){return this.val},getIndex:function(){return this.currentIndex},getStaticData:function(){this.$refs.elem&&(this.size="vertical"===this.direction?this.$refs.elem.offsetHeight:this.$refs.elem.offsetWidth,this.offset="vertical"===this.direction?this.$refs.elem.getBoundingClientRect().top+window.pageYOffset||document.documentElement.scrollTop:this.$refs.elem.getBoundingClientRect().left)},refresh:function(){this.$refs.elem&&(this.getStaticData(),this.computedFixedValue(),this.setPosition())},printError:function(t){this.debug&&console.error("[VueSlider error]: "+t)},handleOverlapTooltip:function(){var t=this.tooltipDirection[0]===this.tooltipDirection[1];if(this.isRange&&t){var e=this.reverse?this.$refs.tooltip1:this.$refs.tooltip0,i=this.reverse?this.$refs.tooltip0:this.$refs.tooltip1,s=e.getBoundingClientRect().right,r=i.getBoundingClientRect().left,o=e.getBoundingClientRect().y,n=i.getBoundingClientRect().y+i.getBoundingClientRect().height,l="horizontal"===this.direction&&s>r,a="vertical"===this.direction&&n>o;l||a?this.handleDisplayMergedTooltip(!0):this.handleDisplayMergedTooltip(!1)}},handleDisplayMergedTooltip:function(t){var e=this.$refs.tooltip0,i=this.$refs.tooltip1,s=this.$refs.process.getElementsByClassName("vue-merged-tooltip")[0];t?(e.style.visibility="hidden",i.style.visibility="hidden",s.style.visibility="visible"):(e.style.visibility="visible",i.style.visibility="visible",s.style.visibility="hidden")}},mounted:function(){var t=this;if(this.isComponentExists=!0,"undefined"==typeof window||"undefined"==typeof document)return this.printError("window or document is undefined, can not be initialization.");this.$nextTick(function(){t.isComponentExists&&(t.getStaticData(),t.setValue(t.limitValue(t.value),!0,t.startAnimation?t.speed:0),t.bindEvents())}),this.isMounted=!0},beforeDestroy:function(){this.isComponentExists=!1,this.unbindEvents()}}},function(t,e,i){"use strict";var s=i(0);t.exports=s},function(t,e,i){e=t.exports=i(4)(),e.push([t.i,'.vue-slider-component{position:relative;box-sizing:border-box;-ms-user-select:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none}.vue-slider-component.vue-slider-disabled{opacity:.5;cursor:not-allowed}.vue-slider-component.vue-slider-has-label{margin-bottom:15px}.vue-slider-component.vue-slider-disabled .vue-slider-dot{cursor:not-allowed}.vue-slider-component .vue-slider{position:relative;display:block;border-radius:15px;background-color:#ccc}.vue-slider-component .vue-slider:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.vue-slider-component .vue-slider-process{position:absolute;border-radius:15px;background-color:#3498db;transition:all 0s;z-index:1}.vue-slider-component .vue-slider-process.vue-slider-process-dragable{cursor:pointer;z-index:3}.vue-slider-component.vue-slider-horizontal .vue-slider-process{width:0;height:100%;top:0;left:0;will-change:width}.vue-slider-component.vue-slider-vertical .vue-slider-process{width:100%;height:0;bottom:0;left:0;will-change:height}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-process{width:0;height:100%;top:0;right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-process{width:100%;height:0;top:0;left:0}.vue-slider-component .vue-slider-dot{position:absolute;border-radius:50%;background-color:#fff;box-shadow:.5px .5px 2px 1px rgba(0,0,0,.32);transition:all 0s;will-change:transform;cursor:pointer;z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-focus{box-shadow:0 0 2px 1px #3498db}.vue-slider-component .vue-slider-dot.vue-slider-dot-dragging{z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-disabled{z-index:4}.vue-slider-component.vue-slider-horizontal .vue-slider-dot{left:0}.vue-slider-component.vue-slider-vertical .vue-slider-dot{bottom:0}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-dot{right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-dot{top:0}.vue-slider-component .vue-slider-tooltip-wrap{display:none;position:absolute;z-index:9}.vue-slider-component .vue-slider-tooltip{display:block;font-size:14px;white-space:nowrap;padding:2px 5px;min-width:20px;text-align:center;color:#fff;border-radius:5px;border:1px solid #3498db;background-color:#3498db}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top{top:-9px;left:50%;transform:translate(-50%,-100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom{bottom:-9px;left:50%;transform:translate(-50%,100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left{top:50%;left:-9px;transform:translate(-100%,-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right{top:50%;right:-9px;transform:translate(100%,-50%)}.vue-slider-component .vue-slider-tooltip-top .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top .vue-slider-tooltip:before{content:"";position:absolute;bottom:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-top-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-merged-tooltip{display:block;visibility:hidden}.vue-slider-component .vue-slider-tooltip-bottom .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom .vue-slider-tooltip:before{content:"";position:absolute;top:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-bottom-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-left .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left .vue-slider-tooltip:before{content:"";position:absolute;top:50%;right:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-left-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-tooltip-right .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right .vue-slider-tooltip:before{content:"";position:absolute;top:50%;left:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-right-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-dot.vue-slider-hover:hover .vue-slider-tooltip-wrap{display:block}.vue-slider-component .vue-slider-dot.vue-slider-always .vue-slider-tooltip-wrap{display:block!important}.vue-slider-component .vue-slider-piecewise{position:absolute;width:100%;padding:0;margin:0;left:0;top:0;height:100%;list-style:none}.vue-slider-component .vue-slider-piecewise-item{position:absolute;width:8px;height:8px}.vue-slider-component .vue-slider-piecewise-dot{position:absolute;left:50%;top:50%;width:100%;height:100%;display:inline-block;background-color:rgba(0,0,0,.16);border-radius:50%;transform:translate(-50%,-50%);z-index:2;transition:all .3s}.vue-slider-component .vue-slider-piecewise-item:first-child .vue-slider-piecewise-dot,.vue-slider-component .vue-slider-piecewise-item:last-child .vue-slider-piecewise-dot{visibility:hidden}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-horizontal .vue-slider-piecewise-label{position:absolute;display:inline-block;top:100%;left:50%;white-space:nowrap;font-size:12px;color:#333;transform:translate(-50%,8px);visibility:visible}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-vertical .vue-slider-piecewise-label{position:absolute;display:inline-block;top:50%;left:100%;white-space:nowrap;font-size:12px;color:#333;transform:translate(8px,-50%);visibility:visible}.vue-slider-component .vue-slider-sr-only{clip:rect(1px,1px,1px,1px);height:1px;width:1px;overflow:hidden;position:absolute!important}',""])},function(t,e){t.exports=function(){var t=[];return t.toString=function(){for(var t=[],e=0;e<this.length;e++){var i=this[e];i[2]?t.push("@media "+i[2]+"{"+i[1]+"}"):t.push(i[1])}return t.join("")},t.i=function(e,i){"string"==typeof e&&(e=[[null,e,""]]);for(var s={},r=0;r<this.length;r++){var o=this[r][0];"number"==typeof o&&(s[o]=!0)}for(r=0;r<e.length;r++){var n=e[r];"number"==typeof n[0]&&s[n[0]]||(i&&!n[2]?n[2]=i:i&&(n[2]="("+n[2]+") and ("+i+")"),t.push(n))}},t}},function(t,e){t.exports=function(t,e,i,s){var r,o=t=t||{},n=typeof t.default;"object"!==n&&"function"!==n||(r=t,o=t.default);var l="function"==typeof o?o.options:o;if(e&&(l.render=e.render,l.staticRenderFns=e.staticRenderFns),i&&(l._scopeId=i),s){var a=Object.create(l.computed||null);Object.keys(s).forEach(function(t){var e=s[t];a[t]=function(){return e}}),l.computed=a}return{esModule:r,exports:o,options:l}}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("div",{directives:[{name:"show",rawName:"v-show",value:t.show,expression:"show"}],ref:"wrap",class:["vue-slider-component",t.flowDirection,t.disabledClass,t.stateClass,{"vue-slider-has-label":t.piecewiseLabel}],style:[t.wrapStyles,t.boolDisabled?t.disabledStyle:null],on:{click:t.wrapClick}},[i("div",{ref:"elem",staticClass:"vue-slider",style:[t.elemStyles,t.bgStyle],attrs:{"aria-hidden":"true"}},[t.isRange?[i("div",{key:"dot0",ref:"dot0",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[0]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[0]?t.disabledDotStyles[0]:null,t.sliderStyles[0],t.focusFlag&&0===t.focusSlider?t.focusStyles[0]:null],on:{mousedown:function(e){t.moveStart(e,0)},touchstart:function(e){t.moveStart(e,0)}}},[i("div",{ref:"tooltip0",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[0]},[t._v(t._s(t.formatter?t.formatting(t.val[0]):t.val[0]))])],{value:t.val[0],index:0,disabled:!t.boolDisabled&&t.disabledArray[0]})],2)]),t._v(" "),i("div",{key:"dot1",ref:"dot1",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&1===t.focusSlider,"vue-slider-dot-dragging":t.flag&&1===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[1]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[1]?t.disabledDotStyles[1]:null,t.sliderStyles[1],t.focusFlag&&1===t.focusSlider?t.focusStyles[1]:null],on:{mousedown:function(e){t.moveStart(e,1)},touchstart:function(e){t.moveStart(e,1)}}},[i("div",{ref:"tooltip1",class:["vue-slider-tooltip-"+t.tooltipDirection[1],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[1]},[t._v(t._s(t.formatter?t.formatting(t.val[1]):t.val[1]))])],{value:t.val[1],index:1,disabled:!t.boolDisabled&&t.disabledArray[1]})],2)])]:[i("div",{key:"dot",ref:"dot",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider}],style:[t.dotStyles,t.sliderStyles,t.focusFlag&&0===t.focusSlider?t.focusStyles:null],on:{mousedown:t.moveStart,touchstart:t.moveStart}},[i("div",{class:["vue-slider-tooltip-"+t.tooltipDirection,"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v(t._s(t.formatter?t.formatting(t.val):t.val))])],{value:t.val})],2)])],t._v(" "),i("ul",{staticClass:"vue-slider-piecewise"},t._l(t.piecewiseDotWrap,function(e,s){return i("li",{key:s,staticClass:"vue-slider-piecewise-item",style:[t.piecewiseDotStyle,e.style]},[t._t("piecewise",[t.piecewise?i("span",{staticClass:"vue-slider-piecewise-dot",style:[t.piecewiseStyle,e.inRange?t.piecewiseActiveStyle:null]}):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange}),t._v(" "),t._t("label",[t.piecewiseLabel?i("span",{staticClass:"vue-slider-piecewise-label",style:[t.labelStyle,e.inRange?t.labelActiveStyle:null]},[t._v("\n            "+t._s(e.label)+"\n          ")]):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange})],2)})),t._v(" "),i("div",{ref:"process",class:["vue-slider-process",{"vue-slider-process-dragable":t.isRange&&t.processDragable}],style:t.processStyle,on:{click:t.processClick,mousedown:function(e){t.moveStart(e,0,!0)},touchstart:function(e){t.moveStart(e,0,!0)}}},[i("div",{ref:"mergedTooltip",staticClass:"vue-merged-tooltip",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"],style:t.tooltipMergedPosition},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v("\n            "+t._s(t.mergeFormatter?t.mergeFormatting(t.val[0],t.val[1]):t.formatter?t.val[0]===t.val[1]?t.formatting(t.val[0]):t.formatting(t.val[0])+" - "+t.formatting(t.val[1]):t.val[0]===t.val[1]?t.val[0]:t.val[0]+" - "+t.val[1])+"\n          ")])])],2)]),t._v(" "),t.isRange||t.data?t._e():i("input",{directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],staticClass:"vue-slider-sr-only",attrs:{type:"range",min:t.min,max:t.max},domProps:{value:t.val},on:{__r:function(e){t.val=e.target.value}}})],2)])},staticRenderFns:[]}},function(t,e,i){var s=i(3);"string"==typeof s&&(s=[[t.i,s,""]]),s.locals&&(t.exports=s.locals);i(8)("743d98f5",s,!0)},function(t,e,i){function s(t){for(var e=0;e<t.length;e++){var i=t[e],s=d[i.id];if(s){s.refs++;for(var r=0;r<s.parts.length;r++)s.parts[r](i.parts[r]);for(;r<i.parts.length;r++)s.parts.push(o(i.parts[r]));s.parts.length>i.parts.length&&(s.parts.length=i.parts.length)}else{for(var n=[],r=0;r<i.parts.length;r++)n.push(o(i.parts[r]));d[i.id]={id:i.id,refs:1,parts:n}}}}function r(){var t=document.createElement("style");return t.type="text/css",h.appendChild(t),t}function o(t){var e,i,s=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(s){if(f)return v;s.parentNode.removeChild(s)}if(m){var o=p++;s=c||(c=r()),e=n.bind(null,s,o,!1),i=n.bind(null,s,o,!0)}else s=r(),e=l.bind(null,s),i=function(){s.parentNode.removeChild(s)};return e(t),function(s){if(s){if(s.css===t.css&&s.media===t.media&&s.sourceMap===t.sourceMap)return;e(t=s)}else i()}}function n(t,e,i,s){var r=i?"":s.css;if(t.styleSheet)t.styleSheet.cssText=g(e,r);else{var o=document.createTextNode(r),n=t.childNodes;n[e]&&t.removeChild(n[e]),n.length?t.insertBefore(o,n[e]):t.appendChild(o)}}function l(t,e){var i=e.css,s=e.media,r=e.sourceMap;if(s&&t.setAttribute("media",s),r&&(i+="\n/*# sourceURL="+r.sources[0]+" */",i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=i;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(i))}}var a="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!a)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var u=i(9),d={},h=a&&(document.head||document.getElementsByTagName("head")[0]),c=null,p=0,f=!1,v=function(){},m="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,i){f=i;var r=u(t,e);return s(r),function(e){for(var i=[],o=0;o<r.length;o++){var n=r[o],l=d[n.id];l.refs--,i.push(l)}e?(r=u(t,e),s(r)):r=[];for(var o=0;o<i.length;o++){var l=i[o];if(0===l.refs){for(var a=0;a<l.parts.length;a++)l.parts[a]();delete d[l.id]}}}};var g=function(){var t=[];return function(e,i){return t[e]=i,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t,e){for(var i=[],s={},r=0;r<e.length;r++){var o=e[r],n=o[0],l=o[1],a=o[2],u=o[3],d={id:t+":"+r,css:l,media:a,sourceMap:u};s[n]?s[n].parts.push(d):i.push(s[n]={id:n,parts:[d]})}return i}}])});
+!function(t,e){ true?module.exports=e():"function"==typeof define&&define.amd?define("vue-slider-component",[],e):"object"==typeof exports?exports["vue-slider-component"]=e():t["vue-slider-component"]=e()}(this,function(){return function(t){function e(s){if(i[s])return i[s].exports;var r=i[s]={i:s,l:!1,exports:{}};return t[s].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var i={};return e.m=t,e.c=i,e.i=function(t){return t},e.d=function(t,i,s){e.o(t,i)||Object.defineProperty(t,i,{configurable:!1,enumerable:!0,get:s})},e.n=function(t){var i=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(i,"a",i),i},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=2)}([function(t,e,i){i(7);var s=i(5)(i(1),i(6),null,null);t.exports=s.exports},function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var s=function(){var t="undefined"!=typeof window?window.devicePixelRatio||1:1;return function(e){return Math.round(e*t)/t}}();e.default={name:"VueSliderComponent",props:{width:{type:[Number,String],default:"auto"},height:{type:[Number,String],default:6},data:{type:Array,default:null},dotSize:{type:Number,default:16},dotWidth:{type:Number,required:!1},dotHeight:{type:Number,required:!1},min:{type:Number,default:0},max:{type:Number,default:100},interval:{type:Number,default:1},show:{type:Boolean,default:!0},disabled:{type:[Boolean,Array],default:!1},piecewise:{type:Boolean,default:!1},tooltip:{type:[String,Boolean],default:"always"},eventType:{type:String,default:"auto"},direction:{type:String,default:"horizontal"},reverse:{type:Boolean,default:!1},lazy:{type:Boolean,default:!1},clickable:{type:Boolean,default:!0},speed:{type:Number,default:.5},realTime:{type:Boolean,default:!1},stopPropagation:{type:Boolean,default:!1},value:{type:[String,Number,Array,Object],default:0},piecewiseLabel:{type:Boolean,default:!1},debug:{type:Boolean,default:!0},fixed:{type:Boolean,default:!1},processDragable:{type:Boolean,default:!1},useKeyboard:{type:Boolean,default:!1},actionsKeyboard:{type:Array,default:function(){return[function(t){return t-1},function(t){return t+1}]}},tooltipMerge:{type:Boolean,default:!0},startAnimation:{type:Boolean,default:!1},sliderStyle:[Array,Object,Function],focusStyle:[Array,Object,Function],tooltipDir:[Array,String],formatter:[String,Function],mergeFormatter:[String,Function],piecewiseStyle:Object,disabledStyle:Object,piecewiseActiveStyle:Object,processStyle:Object,bgStyle:Object,tooltipStyle:[Array,Object,Function],disabledDotStyle:[Array,Object,Function],labelStyle:Object,labelActiveStyle:Object},data:function(){return{flag:!1,keydownFlag:null,focusFlag:!1,processFlag:!1,processSign:null,size:0,fixedValue:0,focusSlider:0,currentValue:0,currentSlider:0,isComponentExists:!0,isMounted:!1}},computed:{dotWidthVal:function(){return"number"==typeof this.dotWidth?this.dotWidth:this.dotSize},dotHeightVal:function(){return"number"==typeof this.dotHeight?this.dotHeight:this.dotSize},flowDirection:function(){return"vue-slider-"+this.direction+(this.reverse?"-reverse":"")},tooltipMergedPosition:function(){if(!this.isMounted)return{};var t=this.tooltipDirection[0];if(this.$refs.dot0){if("vertical"===this.direction){var e={};return e[t]="-"+(this.dotHeightVal/2-this.width/2+9)+"px",e}var i={};return i[t]="-"+(this.dotWidthVal/2-this.height/2+9)+"px",i.left="50%",i}},tooltipDirection:function(){var t=this.tooltipDir||("vertical"===this.direction?"left":"top");return Array.isArray(t)?this.isRange?t:t[1]:this.isRange?[t,t]:t},tooltipStatus:function(){return"hover"===this.tooltip&&this.flag?"vue-slider-always":this.tooltip?"vue-slider-"+this.tooltip:""},tooltipClass:function(){return["vue-slider-tooltip-"+this.tooltipDirection,"vue-slider-tooltip"]},disabledArray:function(){return Array.isArray(this.disabled)?this.disabled:[this.disabled,this.disabled]},boolDisabled:function(){return this.disabledArray.every(function(t){return!0===t})},isDisabled:function(){return"none"===this.eventType||this.boolDisabled},disabledClass:function(){return this.boolDisabled?"vue-slider-disabled":""},stateClass:function(){return{"vue-slider-state-process-drag":this.processFlag,"vue-slider-state-drag":this.flag&&!this.processFlag&&!this.keydownFlag,"vue-slider-state-focus":this.focusFlag}},isRange:function(){return Array.isArray(this.value)},slider:function(){return this.isRange?[this.$refs.dot0,this.$refs.dot1]:this.$refs.dot},minimum:function(){return this.data?0:this.min},val:{get:function(){return this.data?this.isRange?[this.data[this.currentValue[0]],this.data[this.currentValue[1]]]:this.data[this.currentValue]:this.currentValue},set:function(t){if(this.data)if(this.isRange){var e=this.data.indexOf(t[0]),i=this.data.indexOf(t[1]);e>-1&&i>-1&&(this.currentValue=[e,i])}else{var s=this.data.indexOf(t);s>-1&&(this.currentValue=s)}else this.currentValue=t}},currentIndex:function(){return this.isRange?this.data?this.currentValue:[this.getIndexByValue(this.currentValue[0]),this.getIndexByValue(this.currentValue[1])]:this.getIndexByValue(this.currentValue)},indexRange:function(){return this.isRange?this.currentIndex:[0,this.currentIndex]},maximum:function(){return this.data?this.data.length-1:this.max},multiple:function(){var t=(""+this.interval).split(".")[1];return t?Math.pow(10,t.length):1},spacing:function(){return this.data?1:this.interval},total:function(){return this.data?this.data.length-1:(Math.floor((this.maximum-this.minimum)*this.multiple)%(this.interval*this.multiple)!=0&&this.printError("Prop[interval] is illegal, Please make sure that the interval can be divisible"),(this.maximum-this.minimum)/this.interval)},gap:function(){return this.size/this.total},position:function(){return this.isRange?[(this.currentValue[0]-this.minimum)/this.spacing*this.gap,(this.currentValue[1]-this.minimum)/this.spacing*this.gap]:(this.currentValue-this.minimum)/this.spacing*this.gap},limit:function(){return this.isRange?this.fixed?[[0,(this.total-this.fixedValue)*this.gap],[this.fixedValue*this.gap,this.size]]:[[0,this.position[1]],[this.position[0],this.size]]:[0,this.size]},valueLimit:function(){return this.isRange?this.fixed?[[this.minimum,this.maximum-this.fixedValue*(this.spacing*this.multiple)/this.multiple],[this.minimum+this.fixedValue*(this.spacing*this.multiple)/this.multiple,this.maximum]]:[[this.minimum,this.currentValue[1]],[this.currentValue[0],this.maximum]]:[this.minimum,this.maximum]},idleSlider:function(){return 0===this.currentSlider?1:0},wrapStyles:function(){return"vertical"===this.direction?{height:"number"==typeof this.height?this.height+"px":this.height,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}:{width:"number"==typeof this.width?this.width+"px":this.width,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}},sliderStyles:function(){return Array.isArray(this.sliderStyle)?this.isRange?this.sliderStyle:this.sliderStyle[1]:"function"==typeof this.sliderStyle?this.sliderStyle(this.val,this.currentIndex):this.isRange?[this.sliderStyle,this.sliderStyle]:this.sliderStyle},focusStyles:function(){return Array.isArray(this.focusStyle)?this.isRange?this.focusStyle:this.focusStyle[1]:"function"==typeof this.focusStyle?this.focusStyle(this.val,this.currentIndex):this.isRange?[this.focusStyle,this.focusStyle]:this.focusStyle},disabledDotStyles:function(){var t=this.disabledDotStyle;if(Array.isArray(t))return t;if("function"==typeof t){var e=t(this.val,this.currentIndex);return Array.isArray(e)?e:[e,e]}return t?[t,t]:[{backgroundColor:"#ccc"},{backgroundColor:"#ccc"}]},tooltipStyles:function(){return Array.isArray(this.tooltipStyle)?this.isRange?this.tooltipStyle:this.tooltipStyle[1]:"function"==typeof this.tooltipStyle?this.tooltipStyle(this.val,this.currentIndex):this.isRange?[this.tooltipStyle,this.tooltipStyle]:this.tooltipStyle},elemStyles:function(){return"vertical"===this.direction?{width:this.width+"px",height:"100%"}:{height:this.height+"px"}},dotStyles:function(){return"vertical"===this.direction?{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",left:-(this.dotWidthVal-this.width)/2+"px"}:{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",top:-(this.dotHeightVal-this.height)/2+"px"}},piecewiseDotStyle:function(){return"vertical"===this.direction?{width:this.width+"px",height:this.width+"px"}:{width:this.height+"px",height:this.height+"px"}},piecewiseDotWrap:function(){if(!this.piecewise&&!this.piecewiseLabel)return!1;for(var t=[],e=0;e<=this.total;e++){var i="vertical"===this.direction?{bottom:this.gap*e-this.width/2+"px",left:0}:{left:this.gap*e-this.height/2+"px",top:0},s=this.reverse?this.total-e:e,r=this.data?this.data[s]:this.spacing*s+this.min;t.push({style:i,label:this.formatter?this.formatting(r):r,inRange:s>=this.indexRange[0]&&s<=this.indexRange[1]})}return t}},watch:{value:function(t){this.flag||this.setValue(t,!0)},max:function(t){if(t<this.min)return this.printError("The maximum value can not be less than the minimum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},min:function(t){if(t>this.max)return this.printError("The minimum value can not be greater than the maximum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},show:function(t){var e=this;t&&!this.size&&this.$nextTick(function(){e.refresh()})},fixed:function(){this.computedFixedValue()}},methods:{bindEvents:function(){document.addEventListener("touchmove",this.moving,{passive:!1}),document.addEventListener("touchend",this.moveEnd,{passive:!1}),document.addEventListener("mousedown",this.blurSlider),document.addEventListener("mousemove",this.moving),document.addEventListener("mouseup",this.moveEnd),document.addEventListener("mouseleave",this.moveEnd),document.addEventListener("keydown",this.handleKeydown),document.addEventListener("keyup",this.handleKeyup),window.addEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.addEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.addEventListener("transitionend",this.handleOverlapTooltip))},unbindEvents:function(){document.removeEventListener("touchmove",this.moving),document.removeEventListener("touchend",this.moveEnd),document.removeEventListener("mousedown",this.blurSlider),document.removeEventListener("mousemove",this.moving),document.removeEventListener("mouseup",this.moveEnd),document.removeEventListener("mouseleave",this.moveEnd),document.removeEventListener("keydown",this.handleKeydown),document.removeEventListener("keyup",this.handleKeyup),window.removeEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.removeEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.removeEventListener("transitionend",this.handleOverlapTooltip))},handleKeydown:function(t){if(!this.useKeyboard||!this.focusFlag)return!1;switch(t.keyCode){case 37:case 40:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[0]);break;case 38:case 39:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[1])}},handleKeyup:function(){this.keydownFlag&&(this.keydownFlag=!1,this.flag=!1)},changeFocusSlider:function(t){var e=this;if(this.isRange){var i=this.currentIndex.map(function(i,s){if(s===e.focusSlider||e.fixed){var r=t(i),o=e.fixed?e.valueLimit[s]:[0,e.total];if(r<=o[1]&&r>=o[0])return r}return i});i[0]>i[1]&&(this.focusSlider=0===this.focusSlider?1:0,i=i.reverse()),this.setIndex(i)}else this.setIndex(t(this.currentIndex))},blurSlider:function(t){var e=this.isRange?this.$refs["dot"+this.focusSlider]:this.$refs.dot;if(!e||e===t.target)return!1;this.focusFlag=!1},formatting:function(t){return"string"==typeof this.formatter?this.formatter.replace(/\{value\}/,t):this.formatter(t)},mergeFormatting:function(t,e){return"string"==typeof this.mergeFormatter?this.mergeFormatter.replace(/\{(value1|value2)\}/g,function(i,s){return"value1"===s?t:e}):this.mergeFormatter(t,e)},getPos:function(t){return this.realTime&&this.getStaticData(),"vertical"===this.direction?this.reverse?t.pageY-this.offset:this.size-(t.pageY-this.offset):this.reverse?this.size-(t.clientX-this.offset):t.clientX-this.offset},processClick:function(t){this.fixed&&t.stopPropagation()},wrapClick:function(t){var e=this;if(this.isDisabled||!this.clickable||this.processFlag)return!1;var i=this.getPos(t);if(this.isRange)if(this.disabledArray.every(function(t){return!1===t}))this.currentSlider=i>(this.position[1]-this.position[0])/2+this.position[0]?1:0;else if(this.disabledArray[0]){if(i<this.position[0])return!1;this.currentSlider=1}else if(this.disabledArray[1]){if(i>this.position[1])return!1;this.currentSlider=0}if(this.disabledArray[this.currentSlider])return!1;if(this.setValueOnPos(i),this.isRange&&this.tooltipMerge){var s=setInterval(function(){return e.handleOverlapTooltip()},16.7);setTimeout(function(){return window.clearInterval(s)},1e3*this.speed)}},moveStart:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,i=arguments[2];if(this.disabledArray[e])return!1;if(this.stopPropagation&&t.stopPropagation(),this.isRange&&(this.currentSlider=e,i)){if(!this.processDragable)return!1;this.processFlag=!0,this.processSign={pos:this.position,start:this.getPos(t.targetTouches&&t.targetTouches[0]?t.targetTouches[0]:t)}}!i&&this.useKeyboard&&(this.focusFlag=!0,this.focusSlider=e),this.flag=!0,this.$emit("drag-start",this)},moving:function(t){if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;t.preventDefault(),t.targetTouches&&t.targetTouches[0]&&(t=t.targetTouches[0]),this.processFlag?(this.currentSlider=0,this.setValueOnPos(this.processSign.pos[0]+this.getPos(t)-this.processSign.start,!0),this.currentSlider=1,this.setValueOnPos(this.processSign.pos[1]+this.getPos(t)-this.processSign.start,!0)):this.setValueOnPos(this.getPos(t),!0),this.isRange&&this.tooltipMerge&&this.handleOverlapTooltip()},moveEnd:function(t){var e=this;if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;this.$emit("drag-end",this),this.lazy&&this.isDiff(this.val,this.value)&&this.syncValue(),this.flag=!1,window.setTimeout(function(){e.processFlag=!1},0),this.setPosition()},setValueOnPos:function(t,e){var i=this.isRange?this.limit[this.currentSlider]:this.limit,s=this.isRange?this.valueLimit[this.currentSlider]:this.valueLimit;if(t>=i[0]&&t<=i[1]){this.setTransform(t);var r=this.getValueByIndex(Math.round(t/this.gap));this.setCurrentValue(r,e),this.isRange&&this.fixed&&(this.setTransform(t+this.fixedValue*this.gap*(0===this.currentSlider?1:-1),!0),this.setCurrentValue((r*this.multiple+this.fixedValue*this.spacing*this.multiple*(0===this.currentSlider?1:-1))/this.multiple,e,!0))}else t<i[0]?(this.setTransform(i[0]),this.setCurrentValue(s[0]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][0],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][0],e,!0)):this.fixed||this.disabledArray[0]||1!==this.currentSlider||(this.focusSlider=0,this.currentSlider=0)):(this.setTransform(i[1]),this.setCurrentValue(s[1]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][1],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][1],e,!0)):this.fixed||this.disabledArray[1]||0!==this.currentSlider||(this.focusSlider=1,this.currentSlider=1))},isDiff:function(t,e){return Object.prototype.toString.call(t)!==Object.prototype.toString.call(e)||(Array.isArray(t)&&t.length===e.length?t.some(function(t,i){return t!==e[i]}):t!==e)},setCurrentValue:function(t,e,i){var s=i?this.idleSlider:this.currentSlider;if(t<this.minimum||t>this.maximum)return!1;this.isRange?this.isDiff(this.currentValue[s],t)&&(this.currentValue.splice(s,1,t),this.lazy&&this.flag||this.syncValue()):this.isDiff(this.currentValue,t)&&(this.currentValue=t,this.lazy&&this.flag||this.syncValue()),e||this.setPosition()},getValueByIndex:function(t){return(this.spacing*this.multiple*t+this.minimum*this.multiple)/this.multiple},getIndexByValue:function(t){return Math.round((t-this.minimum)*this.multiple)/(this.spacing*this.multiple)},setIndex:function(t){if(Array.isArray(t)&&this.isRange){var e=void 0;e=this.data?[this.data[t[0]],this.data[t[1]]]:[this.getValueByIndex(t[0]),this.getValueByIndex(t[1])],this.setValue(e)}else t=this.getValueByIndex(t),this.isRange&&(this.currentSlider=t>(this.currentValue[1]-this.currentValue[0])/2+this.currentValue[0]?1:0),this.setCurrentValue(t)},setValue:function(t,e,i){var s=this;if(this.isDiff(this.val,t)){var r=this.limitValue(t);this.val=this.isRange?r.concat():r,this.computedFixedValue(),this.syncValue(e)}this.$nextTick(function(){return s.setPosition(i)})},computedFixedValue:function(){if(!this.fixed)return this.fixedValue=0,!1;this.fixedValue=this.currentIndex[1]-this.currentIndex[0]},setPosition:function(t){this.flag||this.setTransitionTime(void 0===t?this.speed:t),this.isRange?(this.setTransform(this.position[0],1===this.currentSlider),this.setTransform(this.position[1],0===this.currentSlider)):this.setTransform(this.position),this.flag||this.setTransitionTime(0)},setTransform:function(t,e){var i=e?this.idleSlider:this.currentSlider,r=s(("vertical"===this.direction?this.dotHeightVal/2-t:t-this.dotWidthVal/2)*(this.reverse?-1:1)),o="vertical"===this.direction?"translateY("+r+"px)":"translateX("+r+"px)",n=this.fixed?this.fixedValue*this.gap+"px":(0===i?this.position[1]-t:t-this.position[0])+"px",l=this.fixed?(0===i?t:t-this.fixedValue*this.gap)+"px":(0===i?t:this.position[0])+"px";this.isRange?(this.slider[i].style.transform=o,this.slider[i].style.WebkitTransform=o,this.slider[i].style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=n,this.$refs.process.style[this.reverse?"top":"bottom"]=l):(this.$refs.process.style.width=n,this.$refs.process.style[this.reverse?"right":"left"]=l)):(this.slider.style.transform=o,this.slider.style.WebkitTransform=o,this.slider.style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=t+"px",this.$refs.process.style[this.reverse?"top":"bottom"]=0):(this.$refs.process.style.width=t+"px",this.$refs.process.style[this.reverse?"right":"left"]=0))},setTransitionTime:function(t){if(t||this.$refs.process.offsetWidth,this.isRange){for(var e=0;e<this.slider.length;e++)this.slider[e].style.transitionDuration=t+"s",this.slider[e].style.WebkitTransitionDuration=t+"s";this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"}else this.slider.style.transitionDuration=t+"s",this.slider.style.WebkitTransitionDuration=t+"s",this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"},limitValue:function(t){var e=this;if(this.data)return t;var i=function(i){return i<e.min?(e.printError("The value of the slider is "+t+", the minimum value is "+e.min+", the value of this slider can not be less than the minimum value"),e.min):i>e.max?(e.printError("The value of the slider is "+t+", the maximum value is "+e.max+", the value of this slider can not be greater than the maximum value"),e.max):i};return this.isRange?t.map(function(t){return i(t)}):i(t)},syncValue:function(t){var e=this.isRange?this.val.concat():this.val;this.$emit("input",e),t||this.$emit("callback",e)},getValue:function(){return this.val},getIndex:function(){return this.currentIndex},getStaticData:function(){this.$refs.elem&&(this.size="vertical"===this.direction?this.$refs.elem.offsetHeight:this.$refs.elem.offsetWidth,this.offset="vertical"===this.direction?this.$refs.elem.getBoundingClientRect().top+window.pageYOffset||document.documentElement.scrollTop:this.$refs.elem.getBoundingClientRect().left)},refresh:function(){this.$refs.elem&&(this.getStaticData(),this.computedFixedValue(),this.setPosition())},printError:function(t){this.debug&&console.error("[VueSlider error]: "+t)},handleOverlapTooltip:function(){var t=this.tooltipDirection[0]===this.tooltipDirection[1];if(this.isRange&&t){var e=this.reverse?this.$refs.tooltip1:this.$refs.tooltip0,i=this.reverse?this.$refs.tooltip0:this.$refs.tooltip1,s=e.getBoundingClientRect().right,r=i.getBoundingClientRect().left,o=e.getBoundingClientRect().y,n=i.getBoundingClientRect().y+i.getBoundingClientRect().height,l="horizontal"===this.direction&&s>r,a="vertical"===this.direction&&n>o;l||a?this.handleDisplayMergedTooltip(!0):this.handleDisplayMergedTooltip(!1)}},handleDisplayMergedTooltip:function(t){var e=this.$refs.tooltip0,i=this.$refs.tooltip1,s=this.$refs.process.getElementsByClassName("vue-merged-tooltip")[0];t?(e.style.visibility="hidden",i.style.visibility="hidden",s.style.visibility="visible"):(e.style.visibility="visible",i.style.visibility="visible",s.style.visibility="hidden")}},mounted:function(){var t=this;if(this.isComponentExists=!0,"undefined"==typeof window||"undefined"==typeof document)return this.printError("window or document is undefined, can not be initialization.");this.$nextTick(function(){t.isComponentExists&&(t.getStaticData(),t.setValue(t.limitValue(t.value),!0,t.startAnimation?t.speed:0),t.bindEvents())}),this.isMounted=!0},beforeDestroy:function(){this.isComponentExists=!1,this.unbindEvents()}}},function(t,e,i){"use strict";var s=i(0);t.exports=s},function(t,e,i){e=t.exports=i(4)(),e.push([t.i,'.vue-slider-component{position:relative;box-sizing:border-box;-ms-user-select:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none}.vue-slider-component.vue-slider-disabled{opacity:.5;cursor:not-allowed}.vue-slider-component.vue-slider-has-label{margin-bottom:15px}.vue-slider-component.vue-slider-disabled .vue-slider-dot{cursor:not-allowed}.vue-slider-component .vue-slider{position:relative;display:block;border-radius:15px;background-color:#ccc}.vue-slider-component .vue-slider:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.vue-slider-component .vue-slider-process{position:absolute;border-radius:15px;background-color:#3498db;transition:all 0s;z-index:1}.vue-slider-component .vue-slider-process.vue-slider-process-dragable{cursor:pointer;z-index:3}.vue-slider-component.vue-slider-horizontal .vue-slider-process{width:0;height:100%;top:0;left:0;will-change:width}.vue-slider-component.vue-slider-vertical .vue-slider-process{width:100%;height:0;bottom:0;left:0;will-change:height}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-process{width:0;height:100%;top:0;right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-process{width:100%;height:0;top:0;left:0}.vue-slider-component .vue-slider-dot{position:absolute;border-radius:50%;background-color:#fff;box-shadow:.5px .5px 2px 1px rgba(0,0,0,.32);transition:all 0s;will-change:transform;cursor:pointer;z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-focus{box-shadow:0 0 2px 1px #3498db}.vue-slider-component .vue-slider-dot.vue-slider-dot-dragging{z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-disabled{z-index:4}.vue-slider-component.vue-slider-horizontal .vue-slider-dot{left:0}.vue-slider-component.vue-slider-vertical .vue-slider-dot{bottom:0}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-dot{right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-dot{top:0}.vue-slider-component .vue-slider-tooltip-wrap{display:none;position:absolute;z-index:9}.vue-slider-component .vue-slider-tooltip{display:block;font-size:14px;white-space:nowrap;padding:2px 5px;min-width:20px;text-align:center;color:#fff;border-radius:5px;border:1px solid #3498db;background-color:#3498db}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top{top:-9px;left:50%;transform:translate(-50%,-100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom{bottom:-9px;left:50%;transform:translate(-50%,100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left{top:50%;left:-9px;transform:translate(-100%,-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right{top:50%;right:-9px;transform:translate(100%,-50%)}.vue-slider-component .vue-slider-tooltip-top .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top .vue-slider-tooltip:before{content:"";position:absolute;bottom:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-top-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-merged-tooltip{display:block;visibility:hidden}.vue-slider-component .vue-slider-tooltip-bottom .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom .vue-slider-tooltip:before{content:"";position:absolute;top:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-bottom-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-left .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left .vue-slider-tooltip:before{content:"";position:absolute;top:50%;right:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-left-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-tooltip-right .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right .vue-slider-tooltip:before{content:"";position:absolute;top:50%;left:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-right-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-dot.vue-slider-hover:hover .vue-slider-tooltip-wrap{display:block}.vue-slider-component .vue-slider-dot.vue-slider-always .vue-slider-tooltip-wrap{display:block!important}.vue-slider-component .vue-slider-piecewise{position:absolute;width:100%;padding:0;margin:0;left:0;top:0;height:100%;list-style:none}.vue-slider-component .vue-slider-piecewise-item{position:absolute;width:8px;height:8px}.vue-slider-component .vue-slider-piecewise-dot{position:absolute;left:50%;top:50%;width:100%;height:100%;display:inline-block;background-color:rgba(0,0,0,.16);border-radius:50%;transform:translate(-50%,-50%);z-index:2;transition:all .3s}.vue-slider-component .vue-slider-piecewise-item:first-child .vue-slider-piecewise-dot,.vue-slider-component .vue-slider-piecewise-item:last-child .vue-slider-piecewise-dot{visibility:hidden}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-horizontal .vue-slider-piecewise-label{position:absolute;display:inline-block;top:100%;left:50%;white-space:nowrap;font-size:12px;color:#333;transform:translate(-50%,8px);visibility:visible}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-vertical .vue-slider-piecewise-label{position:absolute;display:inline-block;top:50%;left:100%;white-space:nowrap;font-size:12px;color:#333;transform:translate(8px,-50%);visibility:visible}.vue-slider-component .vue-slider-sr-only{clip:rect(1px,1px,1px,1px);height:1px;width:1px;overflow:hidden;position:absolute!important}',""])},function(t,e){t.exports=function(){var t=[];return t.toString=function(){for(var t=[],e=0;e<this.length;e++){var i=this[e];i[2]?t.push("@media "+i[2]+"{"+i[1]+"}"):t.push(i[1])}return t.join("")},t.i=function(e,i){"string"==typeof e&&(e=[[null,e,""]]);for(var s={},r=0;r<this.length;r++){var o=this[r][0];"number"==typeof o&&(s[o]=!0)}for(r=0;r<e.length;r++){var n=e[r];"number"==typeof n[0]&&s[n[0]]||(i&&!n[2]?n[2]=i:i&&(n[2]="("+n[2]+") and ("+i+")"),t.push(n))}},t}},function(t,e){t.exports=function(t,e,i,s){var r,o=t=t||{},n=typeof t.default;"object"!==n&&"function"!==n||(r=t,o=t.default);var l="function"==typeof o?o.options:o;if(e&&(l.render=e.render,l.staticRenderFns=e.staticRenderFns),i&&(l._scopeId=i),s){var a=Object.create(l.computed||null);Object.keys(s).forEach(function(t){var e=s[t];a[t]=function(){return e}}),l.computed=a}return{esModule:r,exports:o,options:l}}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("div",{directives:[{name:"show",rawName:"v-show",value:t.show,expression:"show"}],ref:"wrap",class:["vue-slider-component",t.flowDirection,t.disabledClass,t.stateClass,{"vue-slider-has-label":t.piecewiseLabel}],style:[t.wrapStyles,t.boolDisabled?t.disabledStyle:null],on:{click:t.wrapClick}},[i("div",{ref:"elem",staticClass:"vue-slider",style:[t.elemStyles,t.bgStyle],attrs:{"aria-hidden":"true"}},[t.isRange?[i("div",{key:"dot0",ref:"dot0",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[0]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[0]?t.disabledDotStyles[0]:null,t.sliderStyles[0],t.focusFlag&&0===t.focusSlider?t.focusStyles[0]:null],on:{mousedown:function(e){t.moveStart(e,0)},touchstart:function(e){t.moveStart(e,0)}}},[i("div",{ref:"tooltip0",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[0]},[t._v(t._s(t.formatter?t.formatting(t.val[0]):t.val[0]))])],{value:t.val[0],index:0,disabled:!t.boolDisabled&&t.disabledArray[0]})],2)]),t._v(" "),i("div",{key:"dot1",ref:"dot1",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&1===t.focusSlider,"vue-slider-dot-dragging":t.flag&&1===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[1]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[1]?t.disabledDotStyles[1]:null,t.sliderStyles[1],t.focusFlag&&1===t.focusSlider?t.focusStyles[1]:null],on:{mousedown:function(e){t.moveStart(e,1)},touchstart:function(e){t.moveStart(e,1)}}},[i("div",{ref:"tooltip1",class:["vue-slider-tooltip-"+t.tooltipDirection[1],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[1]},[t._v(t._s(t.formatter?t.formatting(t.val[1]):t.val[1]))])],{value:t.val[1],index:1,disabled:!t.boolDisabled&&t.disabledArray[1]})],2)])]:[i("div",{key:"dot",ref:"dot",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider}],style:[t.dotStyles,t.sliderStyles,t.focusFlag&&0===t.focusSlider?t.focusStyles:null],on:{mousedown:t.moveStart,touchstart:t.moveStart}},[i("div",{class:["vue-slider-tooltip-"+t.tooltipDirection,"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v(t._s(t.formatter?t.formatting(t.val):t.val))])],{value:t.val})],2)])],t._v(" "),i("ul",{staticClass:"vue-slider-piecewise"},t._l(t.piecewiseDotWrap,function(e,s){return i("li",{key:s,staticClass:"vue-slider-piecewise-item",style:[t.piecewiseDotStyle,e.style]},[t._t("piecewise",[t.piecewise?i("span",{staticClass:"vue-slider-piecewise-dot",style:[t.piecewiseStyle,e.inRange?t.piecewiseActiveStyle:null]}):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange}),t._v(" "),t._t("label",[t.piecewiseLabel?i("span",{staticClass:"vue-slider-piecewise-label",style:[t.labelStyle,e.inRange?t.labelActiveStyle:null]},[t._v("\n            "+t._s(e.label)+"\n          ")]):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange})],2)})),t._v(" "),i("div",{ref:"process",class:["vue-slider-process",{"vue-slider-process-dragable":t.isRange&&t.processDragable}],style:t.processStyle,on:{click:t.processClick,mousedown:function(e){t.moveStart(e,0,!0)},touchstart:function(e){t.moveStart(e,0,!0)}}},[i("div",{ref:"mergedTooltip",staticClass:"vue-merged-tooltip",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"],style:t.tooltipMergedPosition},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v("\n            "+t._s(t.mergeFormatter?t.mergeFormatting(t.val[0],t.val[1]):t.formatter?t.val[0]===t.val[1]?t.formatting(t.val[0]):t.formatting(t.val[0])+" - "+t.formatting(t.val[1]):t.val[0]===t.val[1]?t.val[0]:t.val[0]+" - "+t.val[1])+"\n          ")])])],2)]),t._v(" "),t.isRange||t.data?t._e():i("input",{directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],staticClass:"vue-slider-sr-only",attrs:{type:"range",min:t.min,max:t.max},domProps:{value:t.val},on:{__r:function(e){t.val=e.target.value}}})],2)])},staticRenderFns:[]}},function(t,e,i){var s=i(3);"string"==typeof s&&(s=[[t.i,s,""]]),s.locals&&(t.exports=s.locals);i(8)("743d98f5",s,!0)},function(t,e,i){function s(t){for(var e=0;e<t.length;e++){var i=t[e],s=d[i.id];if(s){s.refs++;for(var r=0;r<s.parts.length;r++)s.parts[r](i.parts[r]);for(;r<i.parts.length;r++)s.parts.push(o(i.parts[r]));s.parts.length>i.parts.length&&(s.parts.length=i.parts.length)}else{for(var n=[],r=0;r<i.parts.length;r++)n.push(o(i.parts[r]));d[i.id]={id:i.id,refs:1,parts:n}}}}function r(){var t=document.createElement("style");return t.type="text/css",h.appendChild(t),t}function o(t){var e,i,s=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(s){if(f)return v;s.parentNode.removeChild(s)}if(m){var o=p++;s=c||(c=r()),e=n.bind(null,s,o,!1),i=n.bind(null,s,o,!0)}else s=r(),e=l.bind(null,s),i=function(){s.parentNode.removeChild(s)};return e(t),function(s){if(s){if(s.css===t.css&&s.media===t.media&&s.sourceMap===t.sourceMap)return;e(t=s)}else i()}}function n(t,e,i,s){var r=i?"":s.css;if(t.styleSheet)t.styleSheet.cssText=g(e,r);else{var o=document.createTextNode(r),n=t.childNodes;n[e]&&t.removeChild(n[e]),n.length?t.insertBefore(o,n[e]):t.appendChild(o)}}function l(t,e){var i=e.css,s=e.media,r=e.sourceMap;if(s&&t.setAttribute("media",s),r&&(i+="\n/*# sourceURL="+r.sources[0]+" */",i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=i;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(i))}}var a="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!a)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var u=i(9),d={},h=a&&(document.head||document.getElementsByTagName("head")[0]),c=null,p=0,f=!1,v=function(){},m="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,i){f=i;var r=u(t,e);return s(r),function(e){for(var i=[],o=0;o<r.length;o++){var n=r[o],l=d[n.id];l.refs--,i.push(l)}e?(r=u(t,e),s(r)):r=[];for(var o=0;o<i.length;o++){var l=i[o];if(0===l.refs){for(var a=0;a<l.parts.length;a++)l.parts[a]();delete d[l.id]}}}};var g=function(){var t=[];return function(e,i){return t[e]=i,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t,e){for(var i=[],s={},r=0;r<e.length;r++){var o=e[r],n=o[0],l=o[1],a=o[2],u=o[3],d={id:t+":"+r,css:l,media:a,sourceMap:u};s[n]?s[n].parts.push(d):i.push(s[n]={id:n,parts:[d]})}return i}}])});
 
 /***/ }),
 /* 51 */
diff --git a/public/themes/default/assets/mix-manifest.json b/public/themes/default/assets/mix-manifest.json
index b7e923adb..2141a2aae 100644
--- a/public/themes/default/assets/mix-manifest.json
+++ b/public/themes/default/assets/mix-manifest.json
@@ -1,4 +1,4 @@
 {
     "/js/shop.js": "/js/shop.js",
     "/css/shop.css": "/css/shop.css"
-}
+}
\ No newline at end of file

From 91a4fabcfb5b6814251499e7786cd1cb6ae73eae Mon Sep 17 00:00:00 2001
From: prashant-webkul <prashant.singh852@webkul.com>
Date: Tue, 16 Oct 2018 17:18:45 +0530
Subject: [PATCH 3/8] Grid Sort Fixes

---
 .../Admin/src/DataGrids/CustomerDataGrid.php  |  20 +-
 packages/Webkul/Shop/src/Http/routes.php      |   3 +-
 .../Shop/src/Resources/views/error.blade.php  |  19 ++
 packages/Webkul/Ui/src/DataGrid/DataGrid.php  |   2 +-
 .../Ui/src/Providers/UiServiceProvider.php    |   2 +
 .../Resources/assets/images/Icon-Sort-Up.svg  |  23 ++
 .../Resources/assets/images/sort-up-icon.png  | Bin 0 -> 106 bytes
 .../Ui/src/Resources/assets/sass/app.scss     | 258 +-----------------
 .../src/Resources/assets/sass/components.scss | 258 ++++++++++++++++++
 .../Ui/src/Resources/assets/sass/icons.scss   |  10 +
 .../Webkul/Ui/src/Resources/lang/en/app.php   |   6 +
 .../default.blade.php => filters.blade.php}   |   1 -
 .../Resources/views/datagrid/index.blade.php  | 173 ++----------
 .../datagrid/{ => notused}/column.blade.php   |   0
 .../views/datagrid/pagination.blade.php       |   3 +
 .../Resources/views/datagrid/table.blade.php  |   7 +
 .../views/datagrid/table/body.blade.php       |  32 +++
 .../views/datagrid/table/default.blade.php    | 162 -----------
 .../views/datagrid/table/head.blade.php       | 105 +++++++
 19 files changed, 501 insertions(+), 583 deletions(-)
 create mode 100644 packages/Webkul/Shop/src/Resources/views/error.blade.php
 create mode 100644 packages/Webkul/Ui/src/Resources/assets/images/Icon-Sort-Up.svg
 create mode 100644 packages/Webkul/Ui/src/Resources/assets/images/sort-up-icon.png
 create mode 100644 packages/Webkul/Ui/src/Resources/assets/sass/components.scss
 create mode 100644 packages/Webkul/Ui/src/Resources/lang/en/app.php
 rename packages/Webkul/Ui/src/Resources/views/datagrid/{filters/default.blade.php => filters.blade.php} (99%)
 rename packages/Webkul/Ui/src/Resources/views/datagrid/{ => notused}/column.blade.php (100%)
 create mode 100644 packages/Webkul/Ui/src/Resources/views/datagrid/pagination.blade.php
 create mode 100644 packages/Webkul/Ui/src/Resources/views/datagrid/table.blade.php
 create mode 100644 packages/Webkul/Ui/src/Resources/views/datagrid/table/body.blade.php
 delete mode 100644 packages/Webkul/Ui/src/Resources/views/datagrid/table/default.blade.php
 create mode 100644 packages/Webkul/Ui/src/Resources/views/datagrid/table/head.blade.php

diff --git a/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php b/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
index 592b0f5b4..6703c3544 100644
--- a/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
@@ -37,7 +37,7 @@ class CustomerDataGrid
                     'route' => route('admin.datagrid.delete'),
                     'method' => 'DELETE',
                     'label' => 'Delete',
-                    'type' => 'button',
+                    'type' => 'button', //select || button only
                 ],
             ],
 
@@ -55,20 +55,10 @@ class CustomerDataGrid
                 ],
             ],
 
-            'join' => [
-                // [
-                //     'join' => 'leftjoin',
-                //     'table' => 'roles as r',
-                //     'primaryKey' => 'u.role_id',
-                //     'condition' => '=',
-                //     'secondaryKey' => 'r.id',
-                // ]
-            ],
+            'join' => [],
 
             //use aliasing on secodary columns if join is performed
-
             'columns' => [
-
                 [
                     'name' => 'id',
                     'alias' => 'customerId',
@@ -81,14 +71,14 @@ class CustomerDataGrid
                     'alias' => 'customerFirstName',
                     'type' => 'string',
                     'label' => 'Name',
-                    'sortable' => true,
+                    'sortable' => false,
                 ],
                 [
                     'name' => 'email',
                     'alias' => 'customerEmail',
                     'type' => 'string',
                     'label' => 'Email',
-                    'sortable' => true,
+                    'sortable' => false,
                 ],
                 [
                     'name' => 'phone',
@@ -102,7 +92,7 @@ class CustomerDataGrid
                     'alias' => 'customerGroupId',
                     'type' => 'number',
                     'label' => 'Customer Group',
-                    'sortable' => true,
+                    'sortable' => false,
                 ],
             ],
 
diff --git a/packages/Webkul/Shop/src/Http/routes.php b/packages/Webkul/Shop/src/Http/routes.php
index ffdd15983..5445c09db 100644
--- a/packages/Webkul/Shop/src/Http/routes.php
+++ b/packages/Webkul/Shop/src/Http/routes.php
@@ -1,6 +1,7 @@
 <?php
 
 Route::group(['middleware' => ['web']], function () {
+
     Route::get('/', 'Webkul\Shop\Http\Controllers\HomeController@index')->defaults('_config', [
         'view' => 'shop::home.index'
     ])->name('shop.home.index');
@@ -167,7 +168,6 @@ Route::group(['middleware' => ['web']], function () {
                 Route::post('address/edit', 'Webkul\Customer\Http\Controllers\AddressController@edit')->defaults('_config', [
                     'redirect' => 'customer.address.index'
                 ])->name('customer.address.edit');
-
                 /*    Routes for Addresses ends here   */
 
                 /* Wishlist route */
@@ -188,5 +188,4 @@ Route::group(['middleware' => ['web']], function () {
         });
     });
     //customer routes end here
-
 });
diff --git a/packages/Webkul/Shop/src/Resources/views/error.blade.php b/packages/Webkul/Shop/src/Resources/views/error.blade.php
new file mode 100644
index 000000000..d78938fdb
--- /dev/null
+++ b/packages/Webkul/Shop/src/Resources/views/error.blade.php
@@ -0,0 +1,19 @@
+@extends('shop::layouts.master')
+@section('content-wrapper')
+    <div class="error-container" style="width: 100%; display: flex; justify-content: center;">
+        <div class="wrapper" style="display: flex; height: 100vh; width: 80vw;
+    justify-content: space-between; align-items: center;">
+            <div class="error-box">
+                <div class="error-title">404</div>
+                <div class="error-messgae">Page Not Found</div>
+                <div class="error-description"></div>
+                <a href="url()->to('/')">GO TO HOME</a>
+                {{-- pass the content dynamically --}}
+                Show the exception here or error message here.
+            </div>
+
+        <div class="error-graphic" style="height: 236px; width: 255px; border: 1px solid red; background-image: url('.{{ asset('images.error') }}.')">
+        </div>
+        </div>
+    </div>
+@endsection
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/DataGrid/DataGrid.php b/packages/Webkul/Ui/src/DataGrid/DataGrid.php
index bd212bdf2..c61c7c5aa 100644
--- a/packages/Webkul/Ui/src/DataGrid/DataGrid.php
+++ b/packages/Webkul/Ui/src/DataGrid/DataGrid.php
@@ -596,7 +596,7 @@ class DataGrid
                             array_values($value)[0]
                         );
                     } else {
-                        throw new \Exception('Multiple Sort keys Found, Please Resolve the URL Manually.');
+                        throw new \Exception('Multiple Sort keys Found, Please Resolve the URL Manually');
                     }
                 } elseif ($key=="search") {
 
diff --git a/packages/Webkul/Ui/src/Providers/UiServiceProvider.php b/packages/Webkul/Ui/src/Providers/UiServiceProvider.php
index 6229e49c5..5f6c0256a 100644
--- a/packages/Webkul/Ui/src/Providers/UiServiceProvider.php
+++ b/packages/Webkul/Ui/src/Providers/UiServiceProvider.php
@@ -20,6 +20,8 @@ class UiServiceProvider extends ServiceProvider
             __DIR__ . '/../../publishable/assets' => public_path('vendor/webkul/ui/assets'),
         ], 'public');
 
+        $this->loadTranslationsFrom(__DIR__ . '/../Resources/lang', 'ui');
+
         $this->loadViewsFrom(__DIR__ . '/../Resources/views', 'ui');
 
         Paginator::defaultView('ui::partials.pagination');
diff --git a/packages/Webkul/Ui/src/Resources/assets/images/Icon-Sort-Up.svg b/packages/Webkul/Ui/src/Resources/assets/images/Icon-Sort-Up.svg
new file mode 100644
index 000000000..1c9462c2b
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/assets/images/Icon-Sort-Up.svg
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="10px" height="14px" viewBox="0 0 10 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 50 (54983) - http://www.bohemiancoding.com/sketch -->
+    <title>Icon-Sort-Down</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+        <g id="Settings-Users-Roles" transform="translate(-451.000000, -218.000000)" stroke="#979797">
+            <g id="Paper" transform="translate(344.000000, 145.000000)">
+                <g id="Table" transform="translate(0.000000, 61.000000)">
+                    <g id="Strip-Head">
+                        <g id="Icon-Sort-Up" transform="translate(103.000000, 10.000000)">
+                            <g id="Icon-Sort-Down" transform="translate(9.000000, 9.000000) scale(1, -1) rotate(90.000000) translate(-9.000000, -9.000000) translate(3.000000, 5.000000)">
+                                <path d="M1.13686838e-12,4 L10.068125,4" id="Path-3" stroke-width="2"></path>
+                                <polyline id="Path-4" stroke-width="2" points="8 0 12 4.08548298 8 8"></polyline>
+                            </g>
+                        </g>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/assets/images/sort-up-icon.png b/packages/Webkul/Ui/src/Resources/assets/images/sort-up-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..2578e18db0abc03e96405daef64f19e5d29f42ad
GIT binary patch
literal 106
zcmeAS@N?(olHy`uVBq!ia0vp^3LwnL3?x0byx0z;*aCb)T!AzYEKT2e9!N2j1o;Is
y1bzPY_W_V6=;`7Z!f`!$flz{7gI@qU1H-3h%)A#rtP%%GGI+ZBxvX<aXaWGkn;TRB

literal 0
HcmV?d00001

diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/app.scss b/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
index 58e16a504..648b2b01a 100644
--- a/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
@@ -1,6 +1,7 @@
 // Icon scss
 @import "icons";
 @import "variables";
+@import "components";
 @import "mixins";
 @import "animations";
 
@@ -671,263 +672,6 @@ h2 {
     }
 }
 
-/*  Data grid css starts here  */
-.grid-container {
-    user-select: none;
-
-    .filter-wrapper {
-        display: block;
-        box-sizing: border-box;
-
-        .filter-row-one,
-        .filter-row-two {
-            display: flex;
-            flex-direction: row;
-        }
-        .filter-row-one {
-            height: 40px;
-            align-items: center;
-            justify-content: space-between;
-
-            .search-filter {
-                .control {
-                    font-family: "montserrat", sans-serif;
-                    padding-left: 5px;
-                    width: 380px;
-                    height: 36px;
-                    border: 2px solid $control-border-color;
-                    border-radius: 3px;
-                    border-right: 0px;
-                    border-top-right-radius: 0px;
-                    border-bottom-right-radius: 0px;
-                    font-size: 14px;
-                }
-                .ic-wrapper {
-                    display: block;
-                    height: 36px;
-                    width: 36px;
-                    border: 2px solid $control-border-color;
-                    border-left: none;
-                    border-radius: 2px;
-
-                    .search-icon {
-                        margin-left: 4px;
-                        margin-top: 4px;
-                        height: 24px;
-                        width: 24px;
-                    }
-                }
-            }
-
-            .dropdown-filters {
-                display: inline-flex;
-
-                .more-filters {
-                    margin-right: 5px;
-
-                    .dropdown-toggle {
-                        display: flex;
-                        flex-direction: row;
-                        align-items: center;
-                        justify-content: center;
-                        font-family: "montserrat", sans-serif;
-                        padding-left: 5px;
-                        height: 36px;
-                        width: 150px;
-                        border: 2px solid $control-border-color;
-                        border-radius: 2px;
-                        background-color: $color-white;
-                        color: $filter-toggle-color;
-                        font-size: 14px;
-
-                        .dropdown-header {
-                            width: 100%;
-                            display: flex;
-                            flex-direction: row;
-                            align-items: center;
-                            justify-content: space-between;
-
-                            .arrow-down-icon {
-                                margin-right: 5px;
-                            }
-                        }
-                    }
-                    .dropdown-list {
-                        .dropdown-container {
-                            ul {
-                                li.filter-column-dropdown {
-                                    .filter-column-select {
-                                        width: 100%;
-                                        background: $color-white;
-                                        border: 2px solid $control-border-color;
-                                        border-radius: 3px;
-                                        height: 36px;
-                                        display: inline-block;
-                                        vertical-align: middle;
-                                        -webkit-transition: 0.2s
-                                            cubic-bezier(0.4, 0, 0.2, 1);
-                                        transition: 0.2s
-                                            cubic-bezier(0.4, 0, 0.2, 1);
-                                        padding: 0px 5px;
-                                        font-family: "montserrat", sans-serif;
-                                        margin-top: 10px;
-                                        margin-bottom: 5px;
-                                    }
-                                }
-                                li {
-                                    select {
-                                        background: $color-white;
-                                        border: 2px solid $control-border-color;
-                                        border-radius: 3px;
-                                        height: 36px;
-                                        max-width: 100%;
-                                        display: inline-block;
-                                        vertical-align: middle;
-                                        -webkit-transition: 0.2s
-                                            cubic-bezier(0.4, 0, 0.2, 1);
-                                        transition: 0.2s
-                                            cubic-bezier(0.4, 0, 0.2, 1);
-                                        padding: 0px 5px;
-                                        font-family: "montserrat", sans-serif;
-                                        margin-top: 10px;
-                                        margin-bottom: 5px;
-                                    }
-                                    input {
-                                        background: #fff;
-                                        border: 2px solid #c7c7c7;
-                                        border-radius: 3px;
-                                        height: 36px;
-                                        max-width: 100%;
-                                        display: inline-block;
-                                        vertical-align: middle;
-                                        -webkit-transition: 0.2s
-                                            cubic-bezier(0.4, 0, 0.2, 1);
-                                        transition: 0.2s
-                                            cubic-bezier(0.4, 0, 0.2, 1);
-                                        padding: 0px 5px;
-                                        font-family: "montserrat", sans-serif;
-                                        margin-top: 10px;
-                                        margin-bottom: 5px;
-                                    }
-                                }
-                                .filter-condition-dropdown-string {
-                                    display: none;
-                                }
-                                .filter-condition-dropdown-number {
-                                    display: none;
-                                }
-                                .filter-condition-dropdown-datetime {
-                                    display: none;
-                                }
-
-                                .filter-response-string {
-                                    display: none;
-                                }
-                                .filter-response-boolean {
-                                    display: none;
-                                }
-                                .filter-response-datetime {
-                                    display: none;
-                                }
-                                .filter-response-number {
-                                    display: none;
-                                }
-                            }
-                        }
-                    }
-                }
-            }
-        }
-        .filter-row-two {
-            display: flex;
-            flex-direction: row;
-            flex-wrap: wrap;
-            margin-top: 6px;
-            margin-bottom: 6px;
-
-            .filter-one {
-                margin-right: 10px;
-
-                .filter-name {
-                    margin-right: 5px;
-                }
-
-                .filter-value {
-                    display: inline-flex;
-                    background: #e7e7e7;
-                    padding-left: 5px;
-                    color: $color-black-shade;
-                    vertical-align: middle;
-
-                    .f-value {
-                        margin: auto;
-                    }
-
-                    .cross-icon {
-                        margin: 5px;
-                        height: 18px !important;
-                        width: 18px !important;
-                        cursor: pointer;
-                    }
-                }
-            }
-        }
-    }
-    .table {
-        thead {
-            .mass-action-wrapper {
-                display: flex;
-                flex-direction: row;
-                justify-content: flex-start;
-                align-items: center;
-
-                .massaction-remove {
-                    margin-top: 10px;
-                    margin-right: 10px;
-                }
-
-                form {
-                    margin-top: 8px;
-                }
-
-                .selected-items {
-                    margin-right: 15px;
-                }
-            }
-            tr {
-                th.grid_head {
-                    cursor:pointer;
-
-                    .sort-down-icon {
-                        margin-left: 5px;
-                        margin-top: -3px;
-                        vertical-align: middle;
-                        cursor: pointer;
-                    }
-                }
-
-                th {
-                    text-transform: capitalize;
-                }
-            }
-        }
-
-        tbody {
-            td.action {
-                a:first-child {
-                    margin-right: 10px;
-                }
-            }
-        }
-
-        .pagination {
-            margin-top:20px;
-        }
-    }
-}
-
-/*   DataGrid css ends in here   */
-
 .modal-open {
     overflow: hidden;
 }
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/components.scss b/packages/Webkul/Ui/src/Resources/assets/sass/components.scss
new file mode 100644
index 000000000..caf0c47aa
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/components.scss
@@ -0,0 +1,258 @@
+/*  Data grid css starts here  */
+.grid-container {
+    user-select: none;
+
+    .filter-wrapper {
+        display: block;
+        box-sizing: border-box;
+
+        .filter-row-one,
+        .filter-row-two {
+            display: flex;
+            flex-direction: row;
+        }
+        .filter-row-one {
+            height: 40px;
+            align-items: center;
+            justify-content: space-between;
+
+            .search-filter {
+                .control {
+                    font-family: "montserrat", sans-serif;
+                    padding-left: 5px;
+                    width: 380px;
+                    height: 36px;
+                    border: 2px solid $control-border-color;
+                    border-radius: 3px;
+                    border-right: 0px;
+                    border-top-right-radius: 0px;
+                    border-bottom-right-radius: 0px;
+                    font-size: 14px;
+                }
+                .ic-wrapper {
+                    display: block;
+                    height: 36px;
+                    width: 36px;
+                    border: 2px solid $control-border-color;
+                    border-left: none;
+                    border-radius: 2px;
+
+                    .search-icon {
+                        margin-left: 4px;
+                        margin-top: 4px;
+                        height: 24px;
+                        width: 24px;
+                    }
+                }
+            }
+
+            .dropdown-filters {
+                display: inline-flex;
+
+                .more-filters {
+                    margin-right: 5px;
+
+                    .dropdown-toggle {
+                        display: flex;
+                        flex-direction: row;
+                        align-items: center;
+                        justify-content: center;
+                        font-family: "montserrat", sans-serif;
+                        padding-left: 5px;
+                        height: 36px;
+                        width: 150px;
+                        border: 2px solid $control-border-color;
+                        border-radius: 2px;
+                        background-color: $color-white;
+                        color: $filter-toggle-color;
+                        font-size: 14px;
+
+                        .dropdown-header {
+                            width: 100%;
+                            display: flex;
+                            flex-direction: row;
+                            align-items: center;
+                            justify-content: space-between;
+
+                            .arrow-down-icon {
+                                margin-right: 5px;
+                            }
+                        }
+                    }
+                    .dropdown-list {
+                        .dropdown-container {
+                            ul {
+                                li.filter-column-dropdown {
+                                    .filter-column-select {
+                                        width: 100%;
+                                        background: $color-white;
+                                        border: 2px solid $control-border-color;
+                                        border-radius: 3px;
+                                        height: 36px;
+                                        display: inline-block;
+                                        vertical-align: middle;
+                                        -webkit-transition: 0.2s
+                                            cubic-bezier(0.4, 0, 0.2, 1);
+                                        transition: 0.2s
+                                            cubic-bezier(0.4, 0, 0.2, 1);
+                                        padding: 0px 5px;
+                                        font-family: "montserrat", sans-serif;
+                                        margin-top: 10px;
+                                        margin-bottom: 5px;
+                                    }
+                                }
+                                li {
+                                    select {
+                                        background: $color-white;
+                                        border: 2px solid $control-border-color;
+                                        border-radius: 3px;
+                                        height: 36px;
+                                        max-width: 100%;
+                                        display: inline-block;
+                                        vertical-align: middle;
+                                        -webkit-transition: 0.2s
+                                            cubic-bezier(0.4, 0, 0.2, 1);
+                                        transition: 0.2s
+                                            cubic-bezier(0.4, 0, 0.2, 1);
+                                        padding: 0px 5px;
+                                        font-family: "montserrat", sans-serif;
+                                        margin-top: 10px;
+                                        margin-bottom: 5px;
+                                    }
+                                    input {
+                                        background: #fff;
+                                        border: 2px solid #c7c7c7;
+                                        border-radius: 3px;
+                                        height: 36px;
+                                        max-width: 100%;
+                                        display: inline-block;
+                                        vertical-align: middle;
+                                        -webkit-transition: 0.2s
+                                            cubic-bezier(0.4, 0, 0.2, 1);
+                                        transition: 0.2s
+                                            cubic-bezier(0.4, 0, 0.2, 1);
+                                        padding: 0px 5px;
+                                        font-family: "montserrat", sans-serif;
+                                        margin-top: 10px;
+                                        margin-bottom: 5px;
+                                    }
+                                }
+                                .filter-condition-dropdown-string {
+                                    display: none;
+                                }
+                                .filter-condition-dropdown-number {
+                                    display: none;
+                                }
+                                .filter-condition-dropdown-datetime {
+                                    display: none;
+                                }
+
+                                .filter-response-string {
+                                    display: none;
+                                }
+                                .filter-response-boolean {
+                                    display: none;
+                                }
+                                .filter-response-datetime {
+                                    display: none;
+                                }
+                                .filter-response-number {
+                                    display: none;
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        .filter-row-two {
+            display: flex;
+            flex-direction: row;
+            flex-wrap: wrap;
+            margin-top: 6px;
+            margin-bottom: 6px;
+
+            .filter-one {
+                margin-right: 10px;
+
+                .filter-name {
+                    margin-right: 5px;
+                }
+
+                .filter-value {
+                    display: inline-flex;
+                    background: #e7e7e7;
+                    padding-left: 5px;
+                    color: $color-black-shade;
+                    vertical-align: middle;
+
+                    .f-value {
+                        margin: auto;
+                    }
+
+                    .cross-icon {
+                        margin: 5px;
+                        height: 18px !important;
+                        width: 18px !important;
+                        cursor: pointer;
+                    }
+                }
+            }
+        }
+    }
+    .table {
+        thead {
+            .mass-action-wrapper {
+                display: flex;
+                flex-direction: row;
+                justify-content: flex-start;
+                align-items: center;
+
+                .massaction-remove {
+                    margin-top: 10px;
+                    margin-right: 10px;
+                }
+
+                form {
+                    margin-top: 8px;
+                }
+
+                .selected-items {
+                    margin-right: 15px;
+                }
+            }
+            tr {
+                th.grid_head {
+
+                    .sort-down-icon, .sort-up-icon {
+                        margin-left: 5px;
+                        margin-top: -3px;
+                        vertical-align: middle;
+                    }
+                }
+
+                th.grid_head.sortable {
+                    cursor: pointer;
+                }
+
+                th {
+                    text-transform: capitalize;
+                }
+            }
+        }
+
+        tbody {
+            td.action {
+                a:first-child {
+                    margin-right: 10px;
+                }
+            }
+        }
+
+        .pagination {
+            margin-top:20px;
+        }
+    }
+}
+
+/*   DataGrid css ends in here   */
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/icons.scss b/packages/Webkul/Ui/src/Resources/assets/sass/icons.scss
index 4b9536212..33d589816 100644
--- a/packages/Webkul/Ui/src/Resources/assets/sass/icons.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/icons.scss
@@ -117,6 +117,16 @@
     height: 18px;
 }
 
+.sort-up-icon {
+    // background-image: url("../images/Icon-Sort-Up.svg");
+    // width: 18px;
+    // height: 18px;
+    background-image: url("../images/Icon-Sort-Down.svg");
+    width: 18px;
+    height: 18px;
+    transform: rotate(180deg);
+}
+
 .primary-back-icon {
     background-image: url("../images/Icon-Back-Primary.svg");
     width: 24px;
diff --git a/packages/Webkul/Ui/src/Resources/lang/en/app.php b/packages/Webkul/Ui/src/Resources/lang/en/app.php
new file mode 100644
index 000000000..ab0c53687
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/lang/en/app.php
@@ -0,0 +1,6 @@
+<?php
+return [
+    'datagrid' => [
+        'actions' => 'Actions'
+    ]
+];
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/views/datagrid/filters/default.blade.php b/packages/Webkul/Ui/src/Resources/views/datagrid/filters.blade.php
similarity index 99%
rename from packages/Webkul/Ui/src/Resources/views/datagrid/filters/default.blade.php
rename to packages/Webkul/Ui/src/Resources/views/datagrid/filters.blade.php
index 868c5906e..f555a009c 100644
--- a/packages/Webkul/Ui/src/Resources/views/datagrid/filters/default.blade.php
+++ b/packages/Webkul/Ui/src/Resources/views/datagrid/filters.blade.php
@@ -1,5 +1,4 @@
 <div class="{{ $css->filter }}filter-wrapper">
-    {{-- for loading the filters from another file --}}
     <div class="filter-row-one">
         <div class="search-filter" style="display: inline-flex; align-items: center;">
             <input type="search" class="control search-field" placeholder="Search Users" value="" />
diff --git a/packages/Webkul/Ui/src/Resources/views/datagrid/index.blade.php b/packages/Webkul/Ui/src/Resources/views/datagrid/index.blade.php
index 3675dbc66..34cf664f3 100644
--- a/packages/Webkul/Ui/src/Resources/views/datagrid/index.blade.php
+++ b/packages/Webkul/Ui/src/Resources/views/datagrid/index.blade.php
@@ -1,73 +1,53 @@
-<div class="grid-container {{-- $css->datagrid --}}">
-
+<div class="grid-container">
     {{-- For loading the filters from includes directory file --}}
-    @include('ui::datagrid.filters.default')
+    @include('ui::datagrid.filters')
 
     {{-- for generating the table and its content --}}
-    @include('ui::datagrid.table.default')
+    @include('ui::datagrid.table')
 
     {{-- Section for datagrid javascript --}}
     @push('scripts')
         <script type="text/javascript">
-
             var columns = @json($columns); //referential
-
             var allFilters = [];
-
             var search_value;
-
             var filter_column;
-
             var filter_condition;
-
             var filter_range;
-
             var count_filters = parseInt(0);
-
             var url;
-
             var array_start = '[';
-
             var array_end = ']';
-
             var typeValue;
-
             var selectedColumn = '';
-
             var myURL = document.location;
-
             let params;
 
             $(document).ready(function() {
-
                 params = (new URL(document.location)).search;
-
-                if(params.length>0) {
-
+                if(params.length > 0) {
                     if(allFilters.length == 0) {
                         //call reverse url function
-                        arrayFromUrl(params.slice(1,params.length));
+                        arrayFromUrl(params.slice(1, params.length));
                     }
                 }
 
                 $('.search-btn').click(function() {
-
                     search_value = $(".search-field").val();
-                    formURL('search','all', search_value, params);  //format for search
+                    formURL('search', 'all', search_value, params);  //format for search
                 });
 
                 //controls for header when sorting is done
                 $('.grid_head').on('click', function() {
-
                     var column = $(this).data('column-name');
-
                     var currentSort = $(this).data('column-sort');
 
-                    if(currentSort == "asc")
-                        formURL("sort",column,"desc",params);
-
-                    else if(currentSort == "desc")
-                        formURL("sort",column,"asc",params);
+                    if(currentSort == "asc") {
+                        formURL("sort", column, "desc", params);
+                    }
+                    else if(currentSort == "desc") {
+                        formURL("sort", column, "asc", params);
+                    }
                 });
 
                 $('select.filter-column-select').change(function() {
@@ -80,32 +60,22 @@
                     if(typeValue == 'string') {
                         //default behaviour for strings
                         $('.filter-condition-dropdown-number').css('display','none');
-
                         $('.filter-condition-dropdown-datetime').css('display','none');
-
                         $('.filter-response-number').css('display','none');
-
                         $('.filter-response-datetime').css('display','none');
-
                         $('.filter-response-boolean').css('display','none');
 
                         //show the two wanted
                         $('.filter-condition-dropdown-string').css('display','inherit');
-
                         $('.filter-response-string').css('display','inherit');
                     }
                     else if(typeValue == 'boolean') {
                         //hide unwanted
                         $('.filter-condition-dropdown-string').css('display','none');
-
                         $('.filter-condition-dropdown-number').css('display','none');
-
                         $('.filter-condition-dropdown-datetime').css('display','none');
-
                         $('.filter-response-string').css('display','none');
-
                         $('.filter-response-number').css('display','none');
-
                         $('.filter-response-datetime').css('display','none');
 
                         //only true or false for that column is needed as input
@@ -114,37 +84,26 @@
                     else if(typeValue == 'datetime') {
                         //hide unwanted
                         $('.filter-condition-dropdown-string').css('display','none');
-
                         $('.filter-condition-dropdown-number').css('display','none');
-
                         $('.filter-response-string').css('display','none');
-
                         $('.filter-response-number').css('display','none');
-
                         $('.filter-response-boolean').css('display','none');
 
                         //show what is wanted
                         $('.filter-condition-dropdown-datetime').css('display','inherit');
-
                         $('.filter-response-datetime').css('display','inherit');
                     }
                     else if(typeValue == 'number') {
                         //hide unwanted
                         $('.filter-condition-dropdown-string').css('display','none');
-
                         $('.filter-condition-dropdown-datetime').css('display','none');
-
                         $('.filter-response-string').css('display','none');
-
                         $('.filter-response-datetime').css('display','none');
-
                         $('.filter-response-boolean').css('display','none');
 
                         //show what is wanted
                         $('.filter-condition-dropdown-number').css('display','inherit');
-
                         $('.filter-response-number').css('display','inherit');
-
                     }
 
                     $('.apply-filter').on('click',function() {
@@ -152,26 +111,19 @@
                         params = (new URL(document.location)).search;
 
                         if(typeValue == 'number') {
-
                             var conditionUsed = $('.filter-condition-dropdown-number').find(':selected').val();
-
                             var response = $('.response-number').val();
 
                             formURL(selectedColumn,conditionUsed,response,params,col_label);
                         }
                         if(typeValue == 'string') {
-
                             var conditionUsed = $('.filter-condition-dropdown-string').find(':selected').val();
-
                             var response = $('.response-string').val();
 
                             formURL(selectedColumn,conditionUsed,response,params,col_label);
-
                         }
                         if(typeValue == 'datetime') {
-
                             var conditionUsed = $('.filter-condition-dropdown-datetime').find(':selected').val();
-
                             var response = $('.response-datetime').val();
 
                             formURL(selectedColumn,conditionUsed,response,params,col_label);
@@ -217,22 +169,17 @@
                         });
 
                         $('.mass-action').css('display','');
-
                         $('.table-grid-header').css('display','none');
                         // $('.selected-items').html(id.toString());
-
                         $('#indexes').val(id);
                     }
                     else if($("input[id=mastercheckbox]").prop('checked') == false) {
-
                         $('.indexers').each(function(){ this.checked = false; });
 
                         id = [];
 
                         $('.mass-action').css('display','none');
-
                         $('.table-grid-header').css('display','');
-
                         $('#indexes').val('');
                     }
                 });
@@ -269,25 +216,18 @@
                     }
 
                     if(id.length>0) {
-
                         $('.mass-action').css('display','');
-
                         $('.table-grid-header').css('display','none');
-
                         $('#indexes').val(id);
 
                     }else if(id.length == 0) {
 
                         $('.mass-action').css('display','none');
-
                         $('.table-grid-header').css('display','');
-
                         $('#indexes').val('');
 
                         if($('#mastercheckbox').prop('checked')) {
-
                             $('#mastercheckbox').prop('checked',false);
-
                         }
                     }
                 });
@@ -296,10 +236,8 @@
 
             //make the url from the array and redirect
             function makeURL(repetition = false) {
-
                 if(allFilters.length>0 && repetition == false)
                 {
-
                     for(i=0;i<allFilters.length;i++) {
                         if(i==0){
                             url = '?' + allFilters[i].column + '[' + allFilters[i].cond + ']' + '=' + allFilters[i].val;
@@ -310,27 +248,22 @@
                     document.location = url;
 
                 } else if(allFilters.length>0 && repetition == true) {
-
                     //this is the case when the filter is being repeated on a single column with different condition and value
                     for(i=0;i<allFilters.length;i++) {
 
-                        if(i==0){
+                        if(i==0) {
                             url = '?' + allFilters[i].column + '[' + allFilters[i].cond + ']' + '=' + allFilters[i].val;
                         }
-                        else
+                        else {
                             url = url + '&' + allFilters[i].column + '[' + allFilters[i].cond + ']' + '=' + allFilters[i].val;
+                        }
                     }
-
                     document.location = url;
-
                 } else {
-
                     var uri = window.location.href.toString();
-
                     var clean_uri = uri.substring(0, uri.indexOf("?"));
 
                     document.location = clean_uri;
-
                 }
             }
 
@@ -338,72 +271,63 @@
             function arrayFromUrl(urlstring) {
 
                 var obj={};
-
                 t = urlstring.slice(0,urlstring.length);
-
                 splitted = [];
-
                 moreSplitted = [];
-
                 splitted = t.split('&');
-
                 for(i=0;i<splitted.length;i++) {
-
                     moreSplitted.push(splitted[i].split('='));
-
                 }
                 for(i=0;i<moreSplitted.length;i++) {
-
                     col = moreSplitted[i][0].replace(']','').split('[')[0];
-
                     cond = moreSplitted[i][0].replace(']','').split('[')[1]
-
                     val = moreSplitted[i][1];
-
                     obj.column = col;
-
                     obj.cond = cond;
-
                     obj.val = val;
 
                     if(col!=undefined && cond!=undefined && val!=undefined)
                         allFilters.push(obj);
-
                     obj = {};
-
                 }
                 makeTags();
             }
 
-            //use the label to prevent the display of column name on the body
+            //Use the label to prevent the display of column name on the body
             function makeTags() {
-
                 var filterRepeat = 0;
 
                 if(allFilters.length!=0)
                 for(var i = 0;i<allFilters.length;i++) {
 
                     if(allFilters[i].column == "sort") {
-
                         col_label_tag = $('li[data-name="'+allFilters[i].cond+'"]').text();
 
                         var filter_card = '<span class="filter-one" id="'+ i +'"><span class="filter-name">'+ col_label_tag +'</span><span class="filter-value"><span class="f-value">'+ allFilters[i].val +'</span><span class="icon cross-icon remove-filter"></span></span></span>';
+
+                        sorted_col = allFilters[i].cond;
+
+                        var apply_on_column = $('th[data-column-name="'+sorted_col+'"]').children('.icon');
+
+                        if(allFilters[i].val == "asc") {
+                            apply_on_column.addClass('sort-down-icon');
+                        } else {
+                            apply_on_column.addClass('sort-up-icon');
+                        }
+
                         $('.filter-row-two').append(filter_card);
 
                     } else if(allFilters[i].column == "search") {
-
                         col_label_tag = "Search";
 
                         var filter_card = '<span class="filter-one" id="'+ i +'"><span class="filter-name">'+ col_label_tag +'</span><span class="filter-value"><span class="f-value">'+ allFilters[i].val +'</span><span class="icon cross-icon remove-filter"></span></span></span>';
                         $('.filter-row-two').append(filter_card);
 
                     } else {
-
                         col_label_tag = $('li[data-name="'+allFilters[i].column+'"]').text().trim();
 
                         var filter_card = '<span class="filter-one" id="'+ i +'"><span class="filter-name">'+ col_label_tag +'</span><span class="filter-value"><span class="f-value">'+ allFilters[i].val +'</span><span class="icon cross-icon remove-filter"></span></span></span>';
                         $('.filter-row-two').append(filter_card);
-
                     }
 
                 }
@@ -414,13 +338,11 @@
 
                 /* validate the conditions here and do the replacements and
                 push here in the all filters array */
-
                 var obj1 = {};
 
                 console.log(allFilters.length);
 
                 if(column == "" || condition == "" || response == "") {
-
                     alert("Some of the required field is null, please check column, condition and value properly.");
 
                     return false;
@@ -441,11 +363,9 @@
 
                                     return false;
                                 } else if(allFilters[j].column == column) {
-
                                     filter_repeated = 1;
 
                                     allFilters[j].cond = condition;
-
                                     allFilters[j].val = response;
 
                                     makeURL(true);
@@ -454,84 +374,55 @@
                             if(filter_repeated == 0) {
 
                                 obj1.column = column;
-
                                 obj1.cond = condition;
-
                                 obj1.val = response;
-
                                 obj1.label = clabel;
 
                                 allFilters.push(obj1);
-
                                 obj1 = {};
 
                                 makeURL();
                             }
                         }
                         if(column == "sort") {
-
                             sort_exists = 0;
-
                             for(j=0;j<allFilters.length;j++) {
-
                                 if(allFilters[j].column == "sort") {
-
                                     if(allFilters[j].column==column && allFilters[j].cond==condition && allFilters[j].val==response) {
 
                                         if(response=="asc") {
-
                                             allFilters[j].column = column;
-
                                             allFilters[j].cond = condition;
-
                                             allFilters[j].val = "desc";
-
                                             allFilters[j].label = clabel;
 
                                             makeURL();
 
                                         }
                                         else {
-
                                             allFilters[j].column = column;
-
                                             allFilters[j].cond = condition;
-
                                             allFilters[j].val = "asc";
-
                                             allFilters[j].label = clabel;
 
                                             makeURL();
-
                                         }
-
                                     }
                                     else {
-
                                         allFilters[j].column = column;
-
                                         allFilters[j].cond = condition;
-
                                         allFilters[j].val = response;
-
                                         allFilters[j].label = clabel;
 
                                         makeURL();
-
                                     }
-
-
                                 }
                             }
                         }
                         if(column == "search") {
-
                             search_found = 0;
-
                             for(j=0;j<allFilters.length;j++) {
-
                                 if(allFilters[j].column == "search") {
-
                                     allFilters[j].column = column;
                                     allFilters[j].cond = condition;
                                     allFilters[j].val = response;
@@ -539,13 +430,11 @@
                                     makeURL();
                                 }
                             }
-
                             for(j=0;j<allFilters.length;j++) {
                                 if(allFilters[j].column == "search") {
                                     search_found = 1;
                                 }
                             }
-
                             if(search_found == 0) {
                                 obj1.column = column;
                                 obj1.cond = condition;
@@ -557,27 +446,21 @@
                             }
                         }
                     } else {
-
                         obj1.column = column;
-
                         obj1.cond = condition;
-
                         obj1.val = response;
-
                         obj1.label = clabel;
 
                         allFilters.push(obj1);
-
                         obj1 = {};
 
                         makeURL();
-
                     }
                 }
             }
             function confirm_click(message){
                 if (confirm(message)) {
-
+                    //do the action required
                 } else {
                     return false;
                 }
diff --git a/packages/Webkul/Ui/src/Resources/views/datagrid/column.blade.php b/packages/Webkul/Ui/src/Resources/views/datagrid/notused/column.blade.php
similarity index 100%
rename from packages/Webkul/Ui/src/Resources/views/datagrid/column.blade.php
rename to packages/Webkul/Ui/src/Resources/views/datagrid/notused/column.blade.php
diff --git a/packages/Webkul/Ui/src/Resources/views/datagrid/pagination.blade.php b/packages/Webkul/Ui/src/Resources/views/datagrid/pagination.blade.php
new file mode 100644
index 000000000..90116cf07
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/views/datagrid/pagination.blade.php
@@ -0,0 +1,3 @@
+<div class="pagination">
+    {{ $results->links() }}
+</div>
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/views/datagrid/table.blade.php b/packages/Webkul/Ui/src/Resources/views/datagrid/table.blade.php
new file mode 100644
index 000000000..919898d73
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/views/datagrid/table.blade.php
@@ -0,0 +1,7 @@
+<div class="table">
+    <table class="{{ $css->table }}">
+        @include('ui::datagrid.table.head')
+        @include('ui::datagrid.table.body')
+    </table>
+    @include('ui::datagrid.pagination')
+</div>
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/views/datagrid/table/body.blade.php b/packages/Webkul/Ui/src/Resources/views/datagrid/table/body.blade.php
new file mode 100644
index 000000000..b86a89991
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/views/datagrid/table/body.blade.php
@@ -0,0 +1,32 @@
+<tbody class="{{ $css->tbody }}">
+    @if(count($results) == 0)
+    <tr>
+        <td colspan="{{ count($columns)+1 }}" style="text-align: center;">
+            No Records Found.
+        </td>
+    </tr>
+    @endif
+    @foreach ($results as $result)
+    <tr>
+
+        <td class="">
+            <span class="checkbox">
+                <input type="checkbox" class="indexers" id="{{ $result->id }}" name="checkbox[]">
+                <label class="checkbox-view" for="checkbox1"></label>
+            </span>
+        </td>
+        @foreach ($columns as $column)
+            <td class="">{!! $column->render($result) !!}</td>
+        @endforeach
+
+        <td class="action">
+            @foreach($actions as $action)
+                <a @if($action['type'] == "Edit") href="{{ url()->current().'/edit/'.$result->id }}" @elseif($action['type']=="Delete") href="{{ url()->current().'/delete/'.$result->id }}" @endif  class="Action-{{ $action['type'] }}" id="{{ $result->id }}" onclick="return confirm_click('{{ $action['confirm_text'] }}');">
+                    <i class="{{ $action['icon'] }}"></i>
+                </a>
+            @endforeach
+        </td>
+
+    </tr>
+    @endforeach
+</tbody>
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/views/datagrid/table/default.blade.php b/packages/Webkul/Ui/src/Resources/views/datagrid/table/default.blade.php
deleted file mode 100644
index 200d4da56..000000000
--- a/packages/Webkul/Ui/src/Resources/views/datagrid/table/default.blade.php
+++ /dev/null
@@ -1,162 +0,0 @@
-<div class="table">
-
-    <table class="{{ $css->table }}">
-
-        <thead>
-
-            <tr class="mass-action" style="display: none; height:63px;">
-
-                <th colspan="{{ count($columns)+1 }}">
-
-                    <div class="mass-action-wrapper">
-
-                        <span class="massaction-remove">
-                            <span class="icon checkbox-dash-icon"></span>
-                        </span>
-
-                        @foreach($massoperations as $massoperation)
-
-                            @if($massoperation['type'] == "button")
-
-                            <form onsubmit="return confirm('Are You Sure?');"
-                                @if(strtoupper($massoperation[ 'method'])=="GET" || strtoupper($massoperation['method'])=="POST" )
-                                    method="{{ strtoupper($massoperation['method']) }}"
-                                @else
-                                    method="POST"
-                                @endif
-
-                                action="{{ $massoperation['route'] }}">
-
-                                {{ csrf_field() }}
-
-                                @if(strtoupper($massoperation['method'])!= "GET" && strtoupper($massoperation['method'])!= "POST")
-
-                                @method($massoperation['method'])
-
-                                @endif
-
-                                <input type="hidden" id="indexes" name="indexes" value="">
-
-                                <input class="btn btn-primary btn-sm" type="submit" value="Delete">
-
-                            </form>
-
-                            @elseif($massoperation['type'] == "select")
-
-                                <form
-                                    @if(strtoupper($massoperation[ 'method'])=="GET" || strtoupper($massoperation[ 'method'])=="POST" )
-
-                                        method="{{ strtoupper($massoperation['method']) }}"
-
-                                    @else
-                                        method="POST"
-
-                                        @endif
-
-                                    action="{{ $massoperation['route'] }}">
-                                        {{ csrf_field() }}
-                                    @if(strtoupper($massoperation['method'])!= "GET" && strtoupper($massoperation['method'])!= "POST")
-
-                                        @method($massoperation['method'])
-
-                                    @endif
-
-                                    <input type="hidden" id="indexes" name="indexes" value="">
-
-                                    <select name="choices">
-
-                                        @foreach($massoperation['options'] as $option)
-
-                                            <option>{{ $option }}</option>
-
-                                        @endforeach
-
-                                    </select>
-
-                                        <input class="btn btn-primary btn-sm" type="submit" value="Submit">
-
-                                </form>
-                            @endif
-                        @endforeach
-                    </div>
-                </th>
-            </tr>
-            <tr class="table-grid-header">
-                <th>
-                    <span class="checkbox">
-                        <input type="checkbox" id="mastercheckbox">
-                        <label class="checkbox-view" for="checkbox"></label>
-                    </span>
-                </th>
-                @foreach ($columns as $column)
-                    @if($column->sortable == "true")
-                        <th class="grid_head"
-                            @if(strpos($column->alias, ' as '))
-                                <?php $exploded_name = explode(' as ',$column->name); ?>
-                                data-column-name="{{ $exploded_name[0] }}"
-                            @else
-                                data-column-name="{{ $column->alias }}"
-                            @endif
-
-                            data-column-label="{{ $column->label }}"
-                                data-column-sort="asc">{!! $column->sorting() !!}<span class="icon sort-down-icon"></span>
-                        </th>
-                        @else
-                            <th class="grid_head" data-column-name="{{ $column->alias }}" data-column-label="{{ $column->label }}">{!! $column->sorting() !!}</th>
-                    @endif
-                @endforeach
-                {{-- @if(isset($attribute_columns))
-                    @foreach($attribute_columns as $key => $value)
-                        <th>
-                            {{ $value }}
-                        </th>
-                    @endforeach
-                @endif --}}
-                <th>
-                    Actions
-                </th>
-            </tr>
-        </thead>
-        <tbody class="{{ $css->tbody }}">
-            @if(count($results) == 0)
-            <tr>
-                <td colspan="{{ count($columns)+1 }}" style="text-align: center;">
-                    No Records Found.
-                </td>
-            </tr>
-            @endif
-            @foreach ($results as $result)
-            <tr>
-
-                <td class="">
-                    <span class="checkbox">
-                        <input type="checkbox" class="indexers" id="{{ $result->id }}" name="checkbox[]">
-                        <label class="checkbox-view" for="checkbox1"></label>
-                    </span>
-                </td>
-                @foreach ($columns as $column)
-                    <td class="">{!! $column->render($result) !!}</td>
-                @endforeach
-
-                {{-- @if(isset($attribute_columns))
-                @foreach ($attribute_columns as $atc)
-                    <td>{{ $result->{$atc} }}</td>
-                @endforeach
-                @endif --}}
-
-                <td class="action">
-                    @foreach($actions as $action)
-                        <a @if($action['type'] == "Edit") href="{{ url()->current().'/edit/'.$result->id }}" @elseif($action['type']=="Delete") href="{{ url()->current().'/delete/'.$result->id }}" @endif  class="Action-{{ $action['type'] }}" id="{{ $result->id }}" onclick="return confirm_click('{{ $action['confirm_text'] }}');">
-                            <i class="{{ $action['icon'] }}"></i>
-                        </a>
-                    @endforeach
-                </td>
-
-            </tr>
-            @endforeach
-        </tbody>
-    </table>
-    <div class="pagination">
-        {{ $results->links() }}
-    </div>
-</div>
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/views/datagrid/table/head.blade.php b/packages/Webkul/Ui/src/Resources/views/datagrid/table/head.blade.php
new file mode 100644
index 000000000..b22d3e54e
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/views/datagrid/table/head.blade.php
@@ -0,0 +1,105 @@
+<thead>
+    <tr class="mass-action" style="display: none; height:63px;">
+        <th colspan="{{ count($columns)+1 }}">
+            <div class="mass-action-wrapper">
+
+                <span class="massaction-remove">
+                    <span class="icon checkbox-dash-icon"></span>
+                </span>
+
+                {{-- Mass operation implementation --}}
+                @foreach($massoperations as $massoperation)
+                    @if($massoperation['type'] == "button")
+
+                    <form onsubmit="return confirm('Are You Sure?');"
+                        @if(strtoupper($massoperation[ 'method'])=="GET" || strtoupper($massoperation['method'])=="POST" )
+                            method="{{ strtoupper($massoperation['method']) }}"
+                        @else
+                            method="POST"
+                        @endif
+
+                        action="{{ $massoperation['route'] }}">
+
+                        {{ csrf_field() }}
+
+                        @if(strtoupper($massoperation['method'])!= "GET" && strtoupper($massoperation['method'])!= "POST")
+
+                        @method($massoperation['method'])
+
+                        @endif
+
+                        <input type="hidden" id="indexes" name="indexes" value="">
+
+                        <input class="btn btn-primary btn-sm" type="submit" value="Delete">
+
+                    </form>
+
+                    @elseif($massoperation['type'] == "select")
+
+                        <form
+                            @if(strtoupper($massoperation[ 'method'])=="GET" || strtoupper($massoperation[ 'method'])=="POST" )
+
+                                method="{{ strtoupper($massoperation['method']) }}"
+
+                            @else
+                                method="POST"
+
+                                @endif
+
+                            action="{{ $massoperation['route'] }}">
+                                {{ csrf_field() }}
+                            @if(strtoupper($massoperation['method'])!= "GET" && strtoupper($massoperation['method'])!= "POST")
+
+                                @method($massoperation['method'])
+
+                            @endif
+
+                            <input type="hidden" id="indexes" name="indexes" value="">
+
+                            <select name="choices">
+                                @foreach($massoperation['options'] as $option)
+                                    <option>{{ $option }}</option>
+                                @endforeach
+                            </select>
+
+                            <input class="btn btn-primary btn-sm" type="submit" value="Submit">
+                        </form>
+                    @endif
+                @endforeach
+            </div>
+        </th>
+    </tr>
+    <tr class="table-grid-header">
+        <th>
+            <span class="checkbox">
+                <input type="checkbox" id="mastercheckbox">
+                <label class="checkbox-view" for="checkbox"></label>
+            </span>
+        </th>
+        @foreach ($columns as $column)
+            @if($column->sortable == "true")
+                <th class="grid_head sortable"
+                    @if(strpos($column->alias, ' as '))
+                        <?php $exploded_name = explode(' as ',$column->name); ?>
+                        data-column-name="{{ $exploded_name[0] }}"
+                    @else
+                        data-column-name="{{ $column->alias }}"
+                    @endif
+
+                    data-column-label="{{ $column->label }}"
+                    data-column-sort="asc">
+                    {!! $column->sorting() !!}<span class="icon"></span>
+                </th>
+                @else
+                    <th class="grid_head"
+                        data-column-name="{{ $column->alias }}"
+                        data-column-label="{{ $column->label }}">
+                        {!! $column->sorting() !!}
+                    </th>
+            @endif
+        @endforeach
+        <th>
+            {{ __('ui::app.datagrid.actions') }}
+        </th>
+    </tr>
+</thead>
\ No newline at end of file

From f195b335b62838b35a54dd17a0b0f9db03089cfc Mon Sep 17 00:00:00 2001
From: prashant-webkul <prashant.singh852@webkul.com>
Date: Tue, 16 Oct 2018 18:56:30 +0530
Subject: [PATCH 4/8] Data Grid Configuration Fixes

---
 .../Admin/src/DataGrids/AttributeDataGrid.php | 87 ++++++++++---------
 .../Admin/src/DataGrids/CategoryDataGrid.php  | 66 +++++++-------
 .../Admin/src/DataGrids/CustomerDataGrid.php  | 58 +++++--------
 .../src/Resources/assets/sass/components.scss |  2 +-
 4 files changed, 100 insertions(+), 113 deletions(-)

diff --git a/packages/Webkul/Admin/src/DataGrids/AttributeDataGrid.php b/packages/Webkul/Admin/src/DataGrids/AttributeDataGrid.php
index 640e10ebd..1b17bef70 100644
--- a/packages/Webkul/Admin/src/DataGrids/AttributeDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/AttributeDataGrid.php
@@ -29,10 +29,10 @@ class AttributeDataGrid
             'name' => 'Attributes',
             'table' => 'attributes',
             'select' => 'id',
-            'perpage' => 10,
-            'aliased' => false, //use this with false as default and true in case of joins
+            'perpage' => 5,
+            'aliased' => true,
 
-            'massoperations' =>[
+            'massoperations' => [
                 [
                     'route' => route('admin.datagrid.delete'),
                     'method' => 'DELETE',
@@ -55,15 +55,7 @@ class AttributeDataGrid
                 ],
             ],
 
-            'join' => [
-                // [
-                //     'join' => 'leftjoin',
-                //     'table' => 'roles as r',
-                //     'primaryKey' => 'u.role_id',
-                //     'condition' => '=',
-                //     'secondaryKey' => 'r.id',
-                // ]
-            ],
+            'join' => [],
 
             //use aliasing on secodary columns if join is performed
 
@@ -129,39 +121,50 @@ class AttributeDataGrid
             ],
 
             'filterable' => [
-                // [
-                //     'column' => 'id',
-                //     'alias' => 'attribute_family_id',
-                //     'type' => 'number',
-                //     'label' => 'ID',
-                // ],
-                // [
-                //     'column' => 'code',
-                //     'alias' => 'attribute_family_code',
-                //     'type' => 'string',
-                //     'label' => 'Code',
-                // ],
-                // [
-                //     'column' => 'name',
-                //     'alias' => 'attribute_family_name',
-                //     'type' => 'string',
-                //     'label' => 'Name',
-                // ],
+                [
+                    'column' => 'id',
+                    'alias' => 'attributeId',
+                    'type' => 'number',
+                    'label' => 'ID',
+                ],
+                [
+                    'column' => 'code',
+                    'alias' => 'attributeCode',
+                    'type' => 'string',
+                    'label' => 'Code',
+                ],
+                [
+                    'column' => 'admin_name',
+                    'alias' => 'attributeAdminName',
+                    'type' => 'string',
+                    'label' => 'AdminName',
+                ],
+                [
+                    'column' => 'type',
+                    'alias' => 'attributeType',
+                    'type' => 'string',
+                    'label' => 'Type',
+                ],
             ],
 
             //don't use aliasing in case of searchables
 
             'searchable' => [
-                // [
-                //     'column' => 'name',
-                //     'type' => 'string',
-                //     'label' => 'Name',
-                // ],
-                // [
-                //     'column' => 'code',
-                //     'type' => 'string',
-                //     'label' => 'Code',
-                // ],
+                [
+                    'column' => 'code',
+                    'alias' => 'attributeCode',
+                    'type' => 'string',
+                ],
+                [
+                    'column' => 'admin_name',
+                    'alias' => 'attributeAdminName',
+                    'type' => 'string',
+                ],
+                [
+                    'column' => 'type',
+                    'alias' => 'attributeType',
+                    'type' => 'string',
+                ],
             ],
 
             //list of viable operators that will be used
@@ -176,16 +179,14 @@ class AttributeDataGrid
                 'like' => "like",
                 'nlike' => "not like",
             ],
-            // 'css' => []
 
+            // 'css' => []
         ]);
 
     }
 
     public function render()
     {
-
         return $this->createAttributeDataGrid()->render();
-
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/DataGrids/CategoryDataGrid.php b/packages/Webkul/Admin/src/DataGrids/CategoryDataGrid.php
index 5f85e2f2d..4e3e70508 100644
--- a/packages/Webkul/Admin/src/DataGrids/CategoryDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/CategoryDataGrid.php
@@ -69,7 +69,6 @@ class CategoryDataGrid
                     'condition' => '=',
                     'secondaryKey' => 'cta.category_id',
                 ],
-
             ],
 
             //use aliasing on secodary columns if join is performed
@@ -110,39 +109,45 @@ class CategoryDataGrid
             ],
 
             'filterable' => [
-                // [
-                //     'column' => 'id',
-                //     'alias' => 'attribute_family_id',
-                //     'type' => 'number',
-                //     'label' => 'ID',
-                // ],
-                // [
-                //     'column' => 'code',
-                //     'alias' => 'attribute_family_code',
-                //     'type' => 'string',
-                //     'label' => 'Code',
-                // ],
-                // [
-                //     'column' => 'name',
-                //     'alias' => 'attribute_family_name',
-                //     'type' => 'string',
-                //     'label' => 'Name',
-                // ],
+                [
+                    'column' => 'cat.id',
+                    'alias' => 'catID',
+                    'type' => 'number',
+                    'label' => 'Category ID',
+                ], [
+                    'column' => 'ct.name',
+                    'alias' => 'catName',
+                    'type' => 'string',
+                    'label' => 'Category Name',
+                ], [
+                    'column' => 'cta.name',
+                    'alias' => 'parentName',
+                    'type' => 'string',
+                    'label' => 'Parent Name',
+                ], [
+                    'column' => 'cat.status',
+                    'alias' => 'catStatus',
+                    'type' => 'string',
+                    'label' => 'Visible in Menu',
+                ],
             ],
 
             //don't use aliasing in case of searchables
 
             'searchable' => [
-                // [
-                //     'column' => 'name',
-                //     'type' => 'string',
-                //     'label' => 'Name',
-                // ],
-                // [
-                //     'column' => 'code',
-                //     'type' => 'string',
-                //     'label' => 'Code',
-                // ],
+                [
+                    'column' => 'cat.id',
+                    'type' => 'number',
+                    'label' => 'Category ID',
+                ], [
+                    'column' => 'ct.name',
+                    'type' => 'string',
+                    'label' => 'Category Name',
+                ], [
+                    'column' => 'cat.status',
+                    'type' => 'string',
+                    'label' => 'Visible in Menu',
+                ]
             ],
 
             //list of viable operators that will be used
@@ -158,14 +163,11 @@ class CategoryDataGrid
                 'nlike' => "not like",
             ],
             // 'css' => []
-
         ]);
-
     }
 
     public function render()
     {
-
         return $this->createCategoryDataGrid()->render();
 
     }
diff --git a/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php b/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
index 6703c3544..6bee79ed3 100644
--- a/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
@@ -30,7 +30,7 @@ class CustomerDataGrid
             'table' => 'customers',
             'select' => 'id',
             'perpage' => 10,
-            'aliased' => false, //use this with false as default and true in case of joins
+            'aliased' => true, //use this with false as default and true in case of joins
 
             'massoperations' =>[
                 [
@@ -55,41 +55,43 @@ class CustomerDataGrid
                 ],
             ],
 
-            'join' => [],
+            'join' => [
+
+            ],
 
             //use aliasing on secodary columns if join is performed
             'columns' => [
                 [
                     'name' => 'id',
-                    'alias' => 'customerId',
+                    'alias' => 'ID',
                     'type' => 'number',
-                    'label' => 'ID',
+                    'label' => 'Customer ID',
                     'sortable' => true,
                 ],
                 [
                     'name' => 'first_name',
-                    'alias' => 'customerFirstName',
+                    'alias' => 'FirstName',
                     'type' => 'string',
-                    'label' => 'Name',
+                    'label' => 'Customer First Name',
                     'sortable' => false,
                 ],
                 [
                     'name' => 'email',
-                    'alias' => 'customerEmail',
+                    'alias' => 'Email',
                     'type' => 'string',
-                    'label' => 'Email',
+                    'label' => 'Customer E-Mail',
                     'sortable' => false,
                 ],
                 [
                     'name' => 'phone',
-                    'alias' => 'customerPhone',
+                    'alias' => 'Phone',
                     'type' => 'number',
-                    'label' => 'Phone',
+                    'label' => 'Customer Phone',
                     'sortable' => true,
                 ],
                 [
                     'name' => 'customer_group_id',
-                    'alias' => 'customerGroupId',
+                    'alias' => 'CustomerGroupId',
                     'type' => 'number',
                     'label' => 'Customer Group',
                     'sortable' => false,
@@ -102,48 +104,30 @@ class CustomerDataGrid
 
                 [
                     'name' => 'id',
-                    'alias' => 'customerId',
+                    'alias' => 'ID',
                     'type' => 'number',
-                    'label' => 'ID',
+                    'label' => 'Customer ID',
                 ],
                 [
                     'name' => 'first_name',
-                    'alias' => 'customerFirstName',
+                    'alias' => 'FirstName',
                     'type' => 'string',
-                    'label' => 'Name',
-                ],
-                [
-                    'name' => 'email',
-                    'alias' => 'customerEmail',
-                    'type' => 'string',
-                    'label' => 'Email',
-                ],
-                [
-                    'name' => 'phone',
-                    'alias' => 'customerPhone',
-                    'type' => 'number',
-                    'label' => 'Phone',
-                ],
-                [
-                    'name' => 'customer_group_id',
-                    'alias' => 'customerGroupId',
-                    'type' => 'string',
-                    'label' => 'Customer Group',
-                ],
+                    'label' => 'Customer First Name',
+                ]
             ],
 
             //don't use aliasing in case of searchables
 
             'searchable' => [
                 [
-                    'column' => 'first_name',
+                    'column' => 'FirstName',
                     'type' => 'string',
-                    'label' => 'Title',
+                    'label' => 'Customer First Name',
                 ],
                 [
                     'column' => 'email',
                     'type' => 'string',
-                    'label' => 'Rating',
+                    'label' => 'Customer E-Mail',
                 ],
             ],
 
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/components.scss b/packages/Webkul/Ui/src/Resources/assets/sass/components.scss
index caf0c47aa..213dfc3b0 100644
--- a/packages/Webkul/Ui/src/Resources/assets/sass/components.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/components.scss
@@ -19,7 +19,7 @@
             .search-filter {
                 .control {
                     font-family: "montserrat", sans-serif;
-                    padding-left: 5px;
+                    padding-left: 10px;
                     width: 380px;
                     height: 36px;
                     border: 2px solid $control-border-color;

From ddc57abdfa6646487a4d1292cc90a7db2e1cac40 Mon Sep 17 00:00:00 2001
From: prashant-webkul <prashant.singh852@webkul.com>
Date: Wed, 17 Oct 2018 11:27:40 +0530
Subject: [PATCH 5/8] Datagrid UI and Configuration fixes

---
 .../Admin/src/DataGrids/AttributeDataGrid.php | 37 +++++++++---
 .../Admin/src/DataGrids/CategoryDataGrid.php  |  6 ++
 .../Admin/src/DataGrids/CustomerDataGrid.php  |  4 +-
 .../src/DataGrids/CustomerReviewDataGrid.php  | 53 +++++------------
 .../DataGrids/InventorySourcesDataGrid.php    | 23 ++++----
 .../Admin/src/DataGrids/ProductDataGrid.php   |  8 +--
 .../Admin/src/DataGrids/SliderDataGrid.php    | 57 +++++++------------
 .../Admin/src/DataGrids/TaxRateDataGrid.php   | 54 ++++--------------
 .../Resources/views/layouts/master.blade.php  |  9 ++-
 .../src/Resources/assets/sass/components.scss |  1 -
 .../src/Resources/assets/sass/override.scss   | 11 ++++
 .../views/datagrid/filters.blade.php          |  3 +-
 12 files changed, 121 insertions(+), 145 deletions(-)
 create mode 100644 packages/Webkul/Ui/src/Resources/assets/sass/override.scss

diff --git a/packages/Webkul/Admin/src/DataGrids/AttributeDataGrid.php b/packages/Webkul/Admin/src/DataGrids/AttributeDataGrid.php
index 1b17bef70..982033ebc 100644
--- a/packages/Webkul/Admin/src/DataGrids/AttributeDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/AttributeDataGrid.php
@@ -60,7 +60,6 @@ class AttributeDataGrid
             //use aliasing on secodary columns if join is performed
 
             'columns' => [
-
                 [
                     'name' => 'id',
                     'alias' => 'attributeId',
@@ -87,37 +86,60 @@ class AttributeDataGrid
                     'alias' => 'attributeType',
                     'type' => 'string',
                     'label' => 'Type',
-                    'sortable' => true,
+                    'sortable' => false,
                 ],
                 [
                     'name' => 'is_required',
                     'alias' => 'attributeIsRequired',
                     'type' => 'string',
                     'label' => 'Required',
-                    'sortable' => true,
+                    'sortable' => false,
+                    'wrapper' => function ($value) {
+                        if($value == 0)
+                            return "False";
+                        else
+                            return "True";
+                    },
                 ],
                 [
                     'name' => 'is_unique',
                     'alias' => 'attributeIsUnique',
                     'type' => 'string',
                     'label' => 'Unique',
-                    'sortable' => true,
+                    'sortable' => false,
+                    'wrapper' => function ($value) {
+                        if($value == 0)
+                            return "False";
+                        else
+                            return "True";
+                    },
                 ],
                 [
                     'name' => 'value_per_locale',
                     'alias' => 'attributeValuePerLocale',
                     'type' => 'string',
                     'label' => 'ValuePerLocale',
-                    'sortable' => true,
+                    'sortable' => false,
+                    'wrapper' => function ($value) {
+                        if($value == 0)
+                            return "False";
+                        else
+                            return "True";
+                    },
                 ],
                 [
                     'name' => 'value_per_channel',
                     'alias' => 'attributeValuePerChannel',
                     'type' => 'string',
                     'label' => 'ValuePerChannel',
-                    'sortable' => true,
+                    'sortable' => false,
+                    'wrapper' => function ($value) {
+                        if($value == 0)
+                            return "False";
+                        else
+                            return "True";
+                    },
                 ],
-
             ],
 
             'filterable' => [
@@ -148,7 +170,6 @@ class AttributeDataGrid
             ],
 
             //don't use aliasing in case of searchables
-
             'searchable' => [
                 [
                     'column' => 'code',
diff --git a/packages/Webkul/Admin/src/DataGrids/CategoryDataGrid.php b/packages/Webkul/Admin/src/DataGrids/CategoryDataGrid.php
index 4e3e70508..08012cfb2 100644
--- a/packages/Webkul/Admin/src/DataGrids/CategoryDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/CategoryDataGrid.php
@@ -104,6 +104,12 @@ class CategoryDataGrid
                     'type' => 'string',
                     'label' => 'Visible in Menu',
                     'sortable' => true,
+                    'wrapper' => function ($value) {
+                        if($value == 0)
+                            return "False";
+                        else
+                            return "True";
+                    },
                 ],
 
             ],
diff --git a/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php b/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
index 6bee79ed3..070694ca2 100644
--- a/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/CustomerDataGrid.php
@@ -103,13 +103,13 @@ class CustomerDataGrid
             'filterable' => [
 
                 [
-                    'name' => 'id',
+                    'column' => 'id',
                     'alias' => 'ID',
                     'type' => 'number',
                     'label' => 'Customer ID',
                 ],
                 [
-                    'name' => 'first_name',
+                    'column' => 'first_name',
                     'alias' => 'FirstName',
                     'type' => 'string',
                     'label' => 'Customer First Name',
diff --git a/packages/Webkul/Admin/src/DataGrids/CustomerReviewDataGrid.php b/packages/Webkul/Admin/src/DataGrids/CustomerReviewDataGrid.php
index fff921c47..2360e9e89 100644
--- a/packages/Webkul/Admin/src/DataGrids/CustomerReviewDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/CustomerReviewDataGrid.php
@@ -19,7 +19,7 @@ class CustomerReviewDataGrid
      * The CustomerReviewDataGrid
      * implementation.
      *
-     * @var ReviewsDataGrid
+     * @var CustomerReviewsDataGrid
      * for Reviews
      */
 
@@ -57,13 +57,6 @@ class CustomerReviewDataGrid
             ],
 
             'join' => [
-                // [
-                //     'join' => 'leftjoin',
-                //     'table' => 'roles as r',
-                //     'primaryKey' => 'u.role_id',
-                //     'condition' => '=',
-                //     'secondaryKey' => 'r.id',
-                // ]
             ],
 
             //use aliasing on secodary columns if join is performed
@@ -76,67 +69,51 @@ class CustomerReviewDataGrid
                     'type' => 'number',
                     'label' => 'ID',
                     'sortable' => true,
-                ],
-                [
+                ], [
                     'name' => 'title',
                     'alias' => 'titleName',
                     'type' => 'string',
                     'label' => 'Title',
                     'sortable' => true,
-                ],
-                [
-                    'name' => 'rating',
-                    'alias' => 'productRating',
-                    'type' => 'number',
-                    'label' => 'Rating',
-                    'sortable' => true,
-                ],
-                [
+                ], [
                     'name' => 'comment',
                     'alias' => 'productComment',
                     'type' => 'string',
                     'label' => 'Comment',
                     'sortable' => true,
-                ],
-                [
+                ], [
                     'name' => 'status',
                     'alias' => 'reviewStatus',
                     'type' => 'number',
                     'label' => 'Status',
                     'sortable' => true,
                 ],
-
             ],
 
             //don't use aliasing in case of filters
-
             'filterable' => [
                 [
-                    'name' => 'id',
+                    'column' => 'id',
                     'alias' => 'reviewId',
                     'type' => 'number',
                     'label' => 'ID',
-                ],
-                [
-                    'name' => 'title',
+                ], [
+                    'column' => 'title',
                     'alias' => 'titleName',
                     'type' => 'string',
                     'label' => 'Title',
-                ],
-                [
-                    'name' => 'rating',
+                ], [
+                    'column' => 'rating',
                     'alias' => 'productRating',
                     'type' => 'number',
                     'label' => 'Rating',
-                ],
-                [
-                    'name' => 'comment',
+                ], [
+                    'column' => 'comment',
                     'alias' => 'productComment',
                     'type' => 'string',
                     'label' => 'Comment',
-                ],
-                [
-                    'name' => 'status',
+                ], [
+                    'column' => 'status',
                     'alias' => 'reviewStatus',
                     'type' => 'string',
                     'label' => 'Status',
@@ -144,14 +121,12 @@ class CustomerReviewDataGrid
             ],
 
             //don't use aliasing in case of searchables
-
             'searchable' => [
                 [
                     'column' => 'title',
                     'type' => 'string',
                     'label' => 'Title',
-                ],
-                [
+                ], [
                     'column' => 'rating',
                     'type' => 'number',
                     'label' => 'Rating',
diff --git a/packages/Webkul/Admin/src/DataGrids/InventorySourcesDataGrid.php b/packages/Webkul/Admin/src/DataGrids/InventorySourcesDataGrid.php
index 876587c00..85d091a3b 100644
--- a/packages/Webkul/Admin/src/DataGrids/InventorySourcesDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/InventorySourcesDataGrid.php
@@ -64,7 +64,6 @@ class InventorySourcesDataGrid
             ],
 
             //use aliasing on secodary columns if join is performed
-
             'columns' => [
 
                 [
@@ -73,34 +72,36 @@ class InventorySourcesDataGrid
                     'type' => 'number',
                     'label' => 'ID',
                     'sortable' => true,
-                ],
-                [
+                ], [
                     'name' => 'code',
                     'alias' => 'inventoryCode',
                     'type' => 'string',
                     'label' => 'Code',
-                    'sortable' => true,
-                ],
-                [
+                    'sortable' => false,
+                ], [
                     'name' => 'name',
                     'alias' => 'inventoryName',
                     'type' => 'string',
                     'label' => 'Name',
-                    'sortable' => true,
-                ],
-                [
+                    'sortable' => false,
+                ], [
                     'name' => 'priority',
                     'alias' => 'inventoryPriority',
                     'type' => 'string',
                     'label' => 'Priority',
                     'sortable' => true,
-                ],
-                [
+                ], [
                     'name' => 'status',
                     'alias' => 'inventoryStatus',
                     'type' => 'string',
                     'label' => 'Status',
                     'sortable' => true,
+                    'wrapper' => function ($value) {
+                        if($value == 0)
+                            return "In Active";
+                        else
+                            return "Active";
+                    },
                 ],
 
             ],
diff --git a/packages/Webkul/Admin/src/DataGrids/ProductDataGrid.php b/packages/Webkul/Admin/src/DataGrids/ProductDataGrid.php
index 25cf5249d..74e236511 100644
--- a/packages/Webkul/Admin/src/DataGrids/ProductDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/ProductDataGrid.php
@@ -129,25 +129,25 @@ class ProductDataGrid
             'filterable' => [
                 //column, type, and label
                 [
-                    'name' => 'prods.id',
+                    'column' => 'prods.id',
                     'alias' => 'productID',
                     'type' => 'number',
                     'label' => 'ID',
                 ],
                 [
-                    'name' => 'prods.sku',
+                    'column' => 'prods.sku',
                     'alias' => 'productCode',
                     'type' => 'string',
                     'label' => 'SKU',
                 ],
                 [
-                    'name' => 'attfam.name',
+                    'column' => 'attfam.name',
                     'alias' => 'FamilyName',
                     'type' => 'string',
                     'label' => 'Family Name',
                 ],
                 [
-                    'name' => 'pi.qty',
+                    'column' => 'pi.qty',
                     'alias' => 'ProductQuantity',
                     'type' => 'number',
                     'label' => 'Product Quatity',
diff --git a/packages/Webkul/Admin/src/DataGrids/SliderDataGrid.php b/packages/Webkul/Admin/src/DataGrids/SliderDataGrid.php
index 361c6cb43..759fb0f45 100644
--- a/packages/Webkul/Admin/src/DataGrids/SliderDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/SliderDataGrid.php
@@ -67,28 +67,25 @@ class SliderDataGrid
             //use aliasing on secodary columns if join is performed
 
             'columns' => [
-
                 [
                     'name' => 's.id',
                     'alias' => 'sliderId',
                     'type' => 'number',
                     'label' => 'ID',
                     'sortable' => true,
-                ],
-                [
+                ], [
                     'name' => 's.title',
                     'alias' => 'sliderTitle',
                     'type' => 'string',
                     'label' => 'title',
-                ],
-                [
+                    'sortable' => false
+                ], [
                     'name' => 's.channel_id',
                     'alias' => 'channelId',
                     'type' => 'string',
                     'label' => 'Channel ID',
-                    'sortable' => true,
-                ],
-                [
+                    'sortable' => false,
+                ], [
                     'name' => 'c.name',
                     'alias' => 'channelName',
                     'type' => 'string',
@@ -98,41 +95,31 @@ class SliderDataGrid
             ],
 
             //don't use aliasing in case of filters
-
             'filterable' => [
                 [
-                    'column' => 'id',
-                    'alias' => 'locale_id',
+                    'column' => 's.id',
+                    'alias' => 'sliderId',
                     'type' => 'number',
-                    'label' => 'ID',
-                ],
-                [
-                    'column' => 'code',
-                    'alias' => 'locale_code',
+                    'label' => 'ID'
+                ], [
+                    'column' => 's.title',
+                    'alias' => 'SliderTitle',
                     'type' => 'string',
-                    'label' => 'Code',
-                ],
-                [
-                    'column' => 'name',
-                    'alias' => 'locale_name',
-                    'type' => 'string',
-                    'label' => 'Name',
+                    'label' => 'Slider Title'
                 ],
             ],
 
             //don't use aliasing in case of searchables
-
             'searchable' => [
-                // [
-                //     'column' => 'name',
-                //     'type' => 'string',
-                //     'label' => 'Name',
-                // ],
-                // [
-                //     'column' => 'code',
-                //     'type' => 'string',
-                //     'label' => 'Code',
-                // ],
+                [
+                    'column' => 's.id',
+                    'type' => 'number',
+                    'label' => 'ID'
+                ], [
+                    'column' => 's.title',
+                    'type' => 'string',
+                    'label' => 'Slider Title'
+                ]
             ],
 
             //list of viable operators that will be used
@@ -148,9 +135,7 @@ class SliderDataGrid
                 'nlike' => "not like",
             ],
             // 'css' => []
-
         ]);
-
     }
 
     public function render()
diff --git a/packages/Webkul/Admin/src/DataGrids/TaxRateDataGrid.php b/packages/Webkul/Admin/src/DataGrids/TaxRateDataGrid.php
index be5b5c12e..535745430 100644
--- a/packages/Webkul/Admin/src/DataGrids/TaxRateDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/TaxRateDataGrid.php
@@ -24,7 +24,6 @@ class TaxRateDataGrid
     {
 
         return DataGrid::make([
-
             'name' => 'Tax Rates',
             'table' => 'tax_rates as tr',
             'select' => 'tr.id',
@@ -64,21 +63,13 @@ class TaxRateDataGrid
                     'icon' => 'icon trash-icon',
                 ],
             ],
-            'join' => [
-                // [
-                //     'join' => 'leftjoin',
-                //     'table' => 'roles as r',
-                //     'primaryKey' => 'u.role_id',
-                //     'condition' => '=',
-                //     'secondaryKey' => 'r.id',
-                // ]
-            ],
+            'join' => [],
 
             //use aliasing on secodary columns if join is performed
             'columns' => [
                 [
                     'name' => 'tr.id',
-                    'alias' => 'ID',
+                    'alias' => 'id',
                     'type' => 'number',
                     'label' => 'ID',
                     'sortable' => true,
@@ -90,7 +81,7 @@ class TaxRateDataGrid
                     'label' => 'Identifier',
                     'sortable' => true,
                     // 'wrapper' => function ($value, $object) {
-                    //     return '<a class="color-red">' . $object->Name . '</a>';
+                    //     return '<a class="color-red">' . $object->identifier . '</a>';
                     // },
                 ],
                 [
@@ -119,32 +110,27 @@ class TaxRateDataGrid
             //don't use aliasing in case of filters
             'filterable' => [
                 [
-                    'name' => 'tr.id',
+                    'column' => 'tr.id',
                     'alias' => 'ID',
                     'type' => 'number',
                     'label' => 'ID',
-                ],
-                [
-                    'name' => 'tr.identifier',
+                ], [
+                    'column' => 'tr.identifier',
                     'alias' => 'identifier',
                     'type' => 'string',
                     'label' => 'Identifier',
-                ],
-                [
-                    'name' => 'tr.state',
+                ], [
+                    'column' => 'tr.state',
                     'alias' => 'state',
                     'type' => 'string',
                     'label' => 'State',
-                ],
-                [
-                    'name' => 'tr.country',
+                ], [
+                    'column' => 'tr.country',
                     'alias' => 'country',
                     'type' => 'string',
                     'label' => 'Country',
-                ],
-
-                [
-                    'name' => 'tr.tax_rate',
+                ], [
+                    'column' => 'tr.tax_rate',
                     'alias' => 'tax_rate',
                     'type' => 'number',
                     'label' => 'Tax Rate',
@@ -157,22 +143,6 @@ class TaxRateDataGrid
                     'type' => 'string',
                     'label' => 'Identifier',
                 ],
-                [
-                    'column' => 'tr.state',
-                    'type' => 'string',
-                    'label' => 'State',
-                ],
-                [
-                    'column' => 'tr.country',
-                    'type' => 'string',
-                    'label' => 'Country',
-                ],
-
-                [
-                    'column' => 'tr.tax_rate',
-                    'type' => 'number',
-                    'label' => 'Tax Rate',
-                ],
             ],
             'operators' => [
                 'eq' => "=",
diff --git a/packages/Webkul/Shop/src/Resources/views/layouts/master.blade.php b/packages/Webkul/Shop/src/Resources/views/layouts/master.blade.php
index 618856942..9b405f9e9 100644
--- a/packages/Webkul/Shop/src/Resources/views/layouts/master.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/layouts/master.blade.php
@@ -42,14 +42,21 @@
 
     <script type="text/javascript">
         window.flashMessages = [];
+
         @if($success = session('success'))
             window.flashMessages = [{'type': 'alert-success', 'message': "{{ $success }}" }];
         @elseif($warning = session('warning'))
             window.flashMessages = [{'type': 'alert-warning', 'message': "{{ $warning }}" }];
+        @elseif($warning = session('info'))
+            window.flashMessages = [{'type': 'alert-info', 'message': "{{ $info }}" }
+            ];
         @elseif($error = session('error'))
-            window.flashMessages = [{'type': 'alert-error', 'message': "{{ $error }}" }];
+            window.flashMessages = [{'type': 'alert-error', 'message': "{{ $error }}" }
+            ];
         @endif
+
         window.serverErrors = [];
+
         @if (count($errors))
             window.serverErrors = @json($errors->getMessages());
         @endif
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/components.scss b/packages/Webkul/Ui/src/Resources/assets/sass/components.scss
index 213dfc3b0..c06dfab97 100644
--- a/packages/Webkul/Ui/src/Resources/assets/sass/components.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/components.scss
@@ -254,5 +254,4 @@
         }
     }
 }
-
 /*   DataGrid css ends in here   */
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/override.scss b/packages/Webkul/Ui/src/Resources/assets/sass/override.scss
new file mode 100644
index 000000000..5799558a6
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/override.scss
@@ -0,0 +1,11 @@
+.color-red {
+    color: red;
+}
+
+.color-default {
+    color: $font-color;
+}
+
+.color-brand {
+    color: $brand-color;
+}
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/views/datagrid/filters.blade.php b/packages/Webkul/Ui/src/Resources/views/datagrid/filters.blade.php
index f555a009c..dad134cb1 100644
--- a/packages/Webkul/Ui/src/Resources/views/datagrid/filters.blade.php
+++ b/packages/Webkul/Ui/src/Resources/views/datagrid/filters.blade.php
@@ -23,7 +23,8 @@
             <div class="more-filters">
                 <div class="dropdown-toggle">
                     <div class="dropdown-header">
-                        <span class="name">Filter</span> {{-- <span class="role">Filter</span> --}}
+                        <span class="name">Filter</span>
+                        {{-- <span class="role">Filter</span> --}}
                         <i class="icon arrow-down-icon active"></i>
                     </div>
                 </div>

From c05ea636039531aa9cfae34b381a074ffdea9544 Mon Sep 17 00:00:00 2001
From: prashant-webkul <prashant.singh852@webkul.com>
Date: Wed, 17 Oct 2018 12:30:48 +0530
Subject: [PATCH 6/8] Before Merge

---
 .../Admin/src/DataGrids/OrderDataGrid.php     | 180 ++++++++++++++++++
 .../Shop/src/Resources/assets/sass/icons.scss |   2 -
 packages/Webkul/Ui/src/DataGrid/DataGrid.php  |   3 +-
 public/themes/default/assets/css/shop.css     |   2 -
 4 files changed, 181 insertions(+), 6 deletions(-)
 create mode 100644 packages/Webkul/Admin/src/DataGrids/OrderDataGrid.php

diff --git a/packages/Webkul/Admin/src/DataGrids/OrderDataGrid.php b/packages/Webkul/Admin/src/DataGrids/OrderDataGrid.php
new file mode 100644
index 000000000..18868b4ea
--- /dev/null
+++ b/packages/Webkul/Admin/src/DataGrids/OrderDataGrid.php
@@ -0,0 +1,180 @@
+<?php
+
+namespace Webkul\Admin\DataGrids;
+
+use Illuminate\View\View;
+use Webkul\Ui\DataGrid\Facades\DataGrid;
+
+
+/**
+ * Order DataGrid
+ *
+ * @author    Prashant Singh <prashant.singh852@webkul.com> @prashant-webkul
+ * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
+ */
+
+class OrderDataGrid
+{
+    /**
+     * The Data Grid implementation.
+     *
+     * @var AttributeDataGrid
+     * for countries
+     */
+
+    public function createCategoryDataGrid()
+    {
+
+            return DataGrid::make([
+            'name' => 'Categories',
+            'table' => 'categories as cat',
+            'select' => 'cat.id',
+            'perpage' => 10,
+            'aliased' => true, //use this with false as default and true in case of joins
+
+            'massoperations' =>[
+                [
+                    'route' => route('admin.datagrid.delete'),
+                    'method' => 'DELETE',
+                    'label' => 'Delete',
+                    'type' => 'button',
+                ],
+            ],
+
+            'actions' => [
+                [
+                    'type' => 'Edit',
+                    'route' => route('admin.datagrid.delete'),
+                    'confirm_text' => 'Do you really want to do this?',
+                    'icon' => 'icon pencil-lg-icon',
+                ], [
+                    'type' => 'Delete',
+                    'route' => route('admin.datagrid.delete'),
+                    'confirm_text' => 'Do you really want to do this?',
+                    'icon' => 'icon trash-icon',
+                ],
+            ],
+
+            'join' => [
+                [
+                    'join' => 'leftjoin',
+                    'table' => 'category_translations as ct',
+                    'primaryKey' => 'cat.id',
+                    'condition' => '=',
+                    'secondaryKey' => 'ct.category_id',
+                ], [
+                    'join' => 'leftjoin',
+                    'table' => 'category_translations as cta',
+                    'primaryKey' => 'cat.parent_id',
+                    'condition' => '=',
+                    'secondaryKey' => 'cta.category_id',
+                ],
+            ],
+
+            //use aliasing on secodary columns if join is performed
+
+            'columns' => [
+                [
+                    'name' => 'cat.id',
+                    'alias' => 'catID',
+                    'type' => 'number',
+                    'label' => 'Category ID',
+                    'sortable' => true,
+                ], [
+                    'name' => 'ct.name',
+                    'alias' => 'catName',
+                    'type' => 'string',
+                    'label' => 'Category Name',
+                    'sortable' => false,
+                ], [
+                    'name' => 'cat.position',
+                    'alias' => 'catPosition',
+                    'type' => 'string',
+                    'label' => 'Category Position',
+                    'sortable' => false,
+                ], [
+                    'name' => 'cta.name',
+                    'alias' => 'parentName',
+                    'type' => 'string',
+                    'label' => 'Parent Name',
+                    'sortable' => true,
+                ], [
+                    'name' => 'cat.status',
+                    'alias' => 'catStatus',
+                    'type' => 'string',
+                    'label' => 'Visible in Menu',
+                    'sortable' => true,
+                    'wrapper' => function ($value) {
+                        if($value == 0)
+                            return "False";
+                        else
+                            return "True";
+                    },
+                ],
+
+            ],
+
+            'filterable' => [
+                [
+                    'column' => 'cat.id',
+                    'alias' => 'catID',
+                    'type' => 'number',
+                    'label' => 'Category ID',
+                ], [
+                    'column' => 'ct.name',
+                    'alias' => 'catName',
+                    'type' => 'string',
+                    'label' => 'Category Name',
+                ], [
+                    'column' => 'cta.name',
+                    'alias' => 'parentName',
+                    'type' => 'string',
+                    'label' => 'Parent Name',
+                ], [
+                    'column' => 'cat.status',
+                    'alias' => 'catStatus',
+                    'type' => 'string',
+                    'label' => 'Visible in Menu',
+                ],
+            ],
+
+            //don't use aliasing in case of searchables
+
+            'searchable' => [
+                [
+                    'column' => 'cat.id',
+                    'type' => 'number',
+                    'label' => 'Category ID',
+                ], [
+                    'column' => 'ct.name',
+                    'type' => 'string',
+                    'label' => 'Category Name',
+                ], [
+                    'column' => 'cat.status',
+                    'type' => 'string',
+                    'label' => 'Visible in Menu',
+                ]
+            ],
+
+            //list of viable operators that will be used
+            'operators' => [
+                'eq' => "=",
+                'lt' => "<",
+                'gt' => ">",
+                'lte' => "<=",
+                'gte' => ">=",
+                'neqs' => "<>",
+                'neqn' => "!=",
+                'like' => "like",
+                'nlike' => "not like",
+            ],
+            // 'css' => []
+        ]);
+    }
+
+    public function render()
+    {
+        return $this->createCategoryDataGrid()->render();
+
+    }
+}
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss b/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss
index b0eacb07b..fdac4be74 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss
@@ -15,8 +15,6 @@
     background-image:URL('../images/icon-menu-close.svg');
     width: 24px;
     height: 24px;
-    margin-left:auto;
-    margin-bottom: 2px;
 }
 
 .grid-view-icon {
diff --git a/packages/Webkul/Ui/src/DataGrid/DataGrid.php b/packages/Webkul/Ui/src/DataGrid/DataGrid.php
index c61c7c5aa..9cc49cabd 100644
--- a/packages/Webkul/Ui/src/DataGrid/DataGrid.php
+++ b/packages/Webkul/Ui/src/DataGrid/DataGrid.php
@@ -689,7 +689,6 @@ class DataGrid
         $parsed = $this->parse();
 
         if ($this->aliased==true) {
-
             //flags
             $table_alias = false;
             $join_table_alias = false;
@@ -710,7 +709,7 @@ class DataGrid
             //check whether exploded string still has same table name
             if ($exploded[0]==$this->table) {
                 $table_alias = false;
-            } else { // (isset($exploded))
+            } else {
                 $table_alias = true;
                 $table_name = trim($exploded[0]);
                 $table_alias = trim($exploded[1]);
diff --git a/public/themes/default/assets/css/shop.css b/public/themes/default/assets/css/shop.css
index e0ddf3162..ffa85e69f 100644
--- a/public/themes/default/assets/css/shop.css
+++ b/public/themes/default/assets/css/shop.css
@@ -15,8 +15,6 @@
   background-image: URL("../images/icon-menu-close.svg");
   width: 24px;
   height: 24px;
-  margin-left: auto;
-  margin-bottom: 2px;
 }
 
 .grid-view-icon {

From d3b73f517cb07a3ee3b6f4361f67d5ab6d5276c9 Mon Sep 17 00:00:00 2001
From: jitendra <jitendra@webkul.com>
Date: Wed, 17 Oct 2018 12:51:47 +0530
Subject: [PATCH 7/8] Sales email templates added

---
 config/app.php                                |  22 +
 .../src/DataGrids/ExchangeRatesDataGrid.php   |  25 +-
 ...leDataGrid.php => TaxCategoryDataGrid.php} |  14 +-
 .../Admin/src/DataGrids/TaxRateDataGrid.php   |   2 +-
 packages/Webkul/Admin/src/Http/routes.php     |  22 +-
 packages/Webkul/Admin/src/Listeners/Order.php |  47 ++
 .../Admin/src/Mail/NewInvoiceNotification.php |  51 +++
 .../Admin/src/Mail/NewOrderNotification.php   |  48 ++
 .../src/Mail/NewShipmentNotification.php      |  51 +++
 .../src/Providers/EventServiceProvider.php    | 218 ++++++---
 .../Admin/src/Resources/lang/en/app.php       |  66 ++-
 .../Resources/views/account/edit.blade.php    |   6 +-
 .../views/catalog/attributes/index.blade.php  |   6 +-
 .../views/catalog/categories/index.blade.php  |   6 +-
 .../views/catalog/families/index.blade.php    |   6 +-
 .../views/catalog/products/edit.blade.php     |   6 +-
 .../views/catalog/products/index.blade.php    |   6 +-
 .../Resources/views/customers/index.blade.php |   2 +-
 .../views/customers/review/edit.blade.php     |   6 +-
 .../views/customers/review/index.blade.php    |   4 +-
 .../Resources/views/dashboard/index.blade.php |   4 +
 .../views/emails/layouts/master.blade.php     |  22 +
 .../views/emails/sales/new-invoice.blade.php  | 175 +++++++
 .../views/emails/sales/new-order.blade.php    | 177 ++++++++
 .../views/emails/sales/new-shipment.blade.php | 155 +++++++
 .../views/sales/invoices/view.blade.php       |   1 +
 .../views/settings/channels/index.blade.php   |   4 +
 .../settings/currencies/create.blade.php      |   4 +
 .../views/settings/currencies/edit.blade.php  |  50 --
 .../views/settings/currencies/index.blade.php |   4 +
 .../settings/exchange_rates/create.blade.php  |  69 +--
 .../settings/exchange_rates/edit.blade.php    |  74 +--
 .../views/settings/locales/index.blade.php    |   4 +
 .../views/tax/tax-categories/create.blade.php |   4 +-
 .../views/tax/tax-categories/edit.blade.php   |  17 +-
 .../views/tax/tax-categories/index.blade.php  |  10 +-
 .../views/tax/tax-rates/create.blade.php      |   4 +-
 .../views/tax/tax-rates/edit.blade.php        |   2 +-
 .../views/tax/tax-rates/index.blade.php       |   2 +-
 .../views/users/roles/index.blade.php         |   4 +
 .../Database/Seeders/AttributeTableSeeder.php |   4 +-
 .../Http/Controllers/AttributeController.php  |  12 +-
 .../Controllers/AttributeFamilyController.php |  10 +-
 .../Providers/AttributeServiceProvider.php    |   3 -
 .../Http/Controllers/CategoryController.php   |   2 +-
 .../src/Providers/CategoryServiceProvider.php |   3 -
 packages/Webkul/Checkout/src/Cart.php         |   4 +-
 .../src/Http/ViewComposers/CartComposer.php   |   2 +-
 .../src/Providers/CheckoutServiceProvider.php |   5 -
 packages/Webkul/Core/src/Core.php             | 152 ++++---
 ...2_create_currency_exchange_rates_table.php |   5 +-
 .../Webkul/Core/src/Eloquent/Repository.php   |   8 +
 .../Http/Controllers/ChannelController.php    |  10 +-
 .../Http/Controllers/CurrencyController.php   |  10 +-
 .../Controllers/ExchangeRateController.php    |  13 +-
 .../src/Http/Controllers/LocaleController.php |  10 +-
 .../Core/src/Models/CurrencyExchangeRate.php  |   2 +-
 .../src/Providers/CoreServiceProvider.php     |  12 +-
 .../src/Http/Controllers/OrdersController.php |  61 ---
 packages/Webkul/Customer/src/Menu.php         |  51 ---
 .../src/Providers/CustomerServiceProvider.php |  26 --
 .../src/Providers/EventServiceProvider.php    |  52 ---
 .../Controllers/InventorySourceController.php |  10 +-
 .../Providers/InventoryServiceProvider.php    |   3 -
 .../Criteria/AttributeToSelectCriteria.php    |   2 +-
 .../Criteria/FeaturedProductsCriteria.php     |   2 +-
 .../Criteria/FilterByAttributesCriteria.php   |   2 +-
 .../Criteria/NewProductsCriteria.php          |   2 +-
 .../src/Contracts/Criteria/SortCriteria.php   |   2 +-
 ...018_07_27_065727_create_products_table.php |   4 +-
 .../{Product => Helpers}/AbstractProduct.php  |   2 +-
 .../ConfigurableOption.php                    |  10 +-
 .../src/{Product => Helpers}/Price.php        |   2 +-
 .../src/{Product => Helpers}/ProductImage.php |   2 +-
 .../src/{Product => Helpers}/Review.php       |   2 +-
 .../src/{Product => Helpers}/Toolbar.php      |   2 +-
 .../Product/src/{Product => Helpers}/View.php |   4 +-
 .../Http/Controllers/ProductController.php    |   2 +-
 packages/Webkul/Sales/src/Models/Order.php    |   2 +-
 .../src/Repositories/OrderRepository.php      |   9 -
 .../src/Http/Controllers/CartController.php   |   4 +-
 .../src/Http/Controllers/HomeController.php   |   1 -
 .../src/Http/Controllers/OrderController.php  |  73 +++
 packages/Webkul/Shop/src/Http/routes.php      |   8 +-
 .../src/Providers/ComposerServiceProvider.php |   2 +-
 .../src/Providers/ShopServiceProvider.php     |  40 +-
 .../Shop/src/Resources/assets/sass/app.scss   | 124 ++++-
 .../Webkul/Shop/src/Resources/lang/en/app.php |  40 +-
 .../views/checkout/cart/index.blade.php       |   2 +-
 .../views/checkout/onepage/review.blade.php   |   2 +-
 .../customers/account/orders/index.blade.php  | 429 +++---------------
 .../customers/account/orders/orders.blade.php |  53 ---
 .../customers/account/orders/view.blade.php   | 328 +++++++++++++
 .../account/partials/sidemenu.blade.php       |  15 +-
 .../customers/account/reviews/index.blade.php |   2 +-
 .../account/reviews/reviews.blade.php         |   2 +-
 .../account/wishlist/wishlist.blade.php       |   2 +-
 .../views/layouts/header/index.blade.php      |   2 +-
 .../Resources/views/products/index.blade.php  |   2 +-
 .../views/products/list/card.blade.php        |   2 +-
 .../views/products/list/toolbar.blade.php     |   2 +-
 .../Resources/views/products/price.blade.php  |   2 +-
 .../Resources/views/products/review.blade.php |   2 +-
 .../views/products/reviews/create.blade.php   |   2 +-
 .../views/products/reviews/index.blade.php    |   4 +-
 .../Resources/views/products/view.blade.php   |   1 +
 .../views/products/view/attributes.blade.php  |  36 +-
 .../view/configurable-options.blade.php       |   2 +-
 .../views/products/view/gallery.blade.php     |   2 +-
 .../views/products/view/reviews.blade.php     |   2 +-
 ..._30_064755_create_tax_categories_table.php |   2 +-
 .../Controllers/TaxCategoryController.php     |  79 ++--
 .../src/Http/Controllers/TaxController.php    |  18 +-
 .../Repositories/TaxCategoryRepository.php    |  10 +-
 .../assets/images/Icon-Customers-Active.svg   |  12 +
 .../Ui/src/Resources/assets/sass/app.scss     |   8 +
 .../Ui/src/Resources/assets/sass/icons.scss   |  15 +
 packages/Webkul/User/src/ACLCreator.php       |   4 +
 packages/Webkul/User/src/Bouncer.php          |  15 +-
 .../src/Http/Controllers/RoleController.php   |  10 +-
 .../src/Http/Controllers/UserController.php   |  10 +-
 .../{RedirectIfNotAdmin.php => Bouncer.php}   |  20 +-
 packages/Webkul/User/src/Http/helpers.php     |   8 +
 .../src/Providers/UserServiceProvider.php     |   6 +-
 public/themes/default/assets/css/shop.css     | 112 ++++-
 public/themes/default/assets/js/shop.js       |   2 +-
 .../themes/default/assets/mix-manifest.json   |   2 +-
 127 files changed, 2328 insertions(+), 1114 deletions(-)
 rename packages/Webkul/Admin/src/DataGrids/{TaxRuleDataGrid.php => TaxCategoryDataGrid.php} (94%)
 create mode 100644 packages/Webkul/Admin/src/Listeners/Order.php
 create mode 100644 packages/Webkul/Admin/src/Mail/NewInvoiceNotification.php
 create mode 100644 packages/Webkul/Admin/src/Mail/NewOrderNotification.php
 create mode 100644 packages/Webkul/Admin/src/Mail/NewShipmentNotification.php
 create mode 100644 packages/Webkul/Admin/src/Resources/views/emails/layouts/master.blade.php
 create mode 100644 packages/Webkul/Admin/src/Resources/views/emails/sales/new-invoice.blade.php
 create mode 100644 packages/Webkul/Admin/src/Resources/views/emails/sales/new-order.blade.php
 create mode 100644 packages/Webkul/Admin/src/Resources/views/emails/sales/new-shipment.blade.php
 delete mode 100644 packages/Webkul/Admin/src/Resources/views/settings/currencies/edit.blade.php
 delete mode 100644 packages/Webkul/Customer/src/Http/Controllers/OrdersController.php
 delete mode 100644 packages/Webkul/Customer/src/Menu.php
 delete mode 100644 packages/Webkul/Customer/src/Providers/EventServiceProvider.php
 rename packages/Webkul/Product/src/{Product => Helpers}/AbstractProduct.php (96%)
 rename packages/Webkul/Product/src/{Product => Helpers}/ConfigurableOption.php (96%)
 rename packages/Webkul/Product/src/{Product => Helpers}/Price.php (98%)
 rename packages/Webkul/Product/src/{Product => Helpers}/ProductImage.php (98%)
 rename packages/Webkul/Product/src/{Product => Helpers}/Review.php (98%)
 rename packages/Webkul/Product/src/{Product => Helpers}/Toolbar.php (98%)
 rename packages/Webkul/Product/src/{Product => Helpers}/View.php (83%)
 create mode 100644 packages/Webkul/Shop/src/Http/Controllers/OrderController.php
 delete mode 100644 packages/Webkul/Shop/src/Resources/views/customers/account/orders/orders.blade.php
 create mode 100644 packages/Webkul/Shop/src/Resources/views/customers/account/orders/view.blade.php
 create mode 100644 packages/Webkul/Ui/src/Resources/assets/images/Icon-Customers-Active.svg
 rename packages/Webkul/User/src/Http/Middleware/{RedirectIfNotAdmin.php => Bouncer.php} (50%)
 create mode 100644 packages/Webkul/User/src/Http/helpers.php

diff --git a/config/app.php b/config/app.php
index 641348c19..32959e3f4 100644
--- a/config/app.php
+++ b/config/app.php
@@ -93,6 +93,28 @@ return [
 
     'fallback_locale' => 'en',
 
+    /*
+    |--------------------------------------------------------------------------
+    | Base Currency Code
+    |--------------------------------------------------------------------------
+    |
+    | Here you may specify the base currency code for your application.
+    |
+    */
+
+    'currency' => 'USD',
+
+    /*
+    |--------------------------------------------------------------------------
+    | Default channel Code
+    |--------------------------------------------------------------------------
+    |
+    | Here you may specify the default channel code for your application.
+    |
+    */
+
+    'channel' => 'default',
+
     /*
     |--------------------------------------------------------------------------
     | Encryption Key
diff --git a/packages/Webkul/Admin/src/DataGrids/ExchangeRatesDataGrid.php b/packages/Webkul/Admin/src/DataGrids/ExchangeRatesDataGrid.php
index af954a73a..9d4f085e0 100644
--- a/packages/Webkul/Admin/src/DataGrids/ExchangeRatesDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/ExchangeRatesDataGrid.php
@@ -76,13 +76,6 @@ class ExchangeRatesDataGrid
                     'label' => 'Rate ID',
                     'sortable' => true,
                 ],
-                [
-                    'name' => 'source_currency',
-                    'alias' => 'exchSourceCurrency',
-                    'type' => 'string',
-                    'label' => 'Source Currency',
-                    'sortable' => true,
-                ],
                 [
                     'name' => 'target_currency',
                     'alias' => 'exchTargetCurrency',
@@ -91,10 +84,10 @@ class ExchangeRatesDataGrid
                     'sortable' => true,
                 ],
                 [
-                    'name' => 'ratio',
-                    'alias' => 'exchRatio',
+                    'name' => 'rate',
+                    'alias' => 'exchRate',
                     'type' => 'string',
-                    'label' => 'Exchange Ratio',
+                    'label' => 'Exchange Rate',
                 ],
 
             ],
@@ -108,13 +101,6 @@ class ExchangeRatesDataGrid
                     'type' => 'number',
                     'label' => 'Rate ID',
                 ],
-                [
-                    'column' => 'source_currency',
-                    'alias' => 'exchSourceCurrency',
-                    'type' => 'string',
-                    'label' => 'Source Currency',
-                    'sortable' => true,
-                ],
                 [
                     'column' => 'target_currency',
                     'alias' => 'exchTargetCurrency',
@@ -127,11 +113,6 @@ class ExchangeRatesDataGrid
             //don't use aliasing in case of searchables
 
             'searchable' => [
-                [
-                    'column' => 'source_currency',
-                    'type' => 'string',
-                    'label' => 'Source Currency',
-                ],
                 [
                     'column' => 'target_currency',
                     'type' => 'string',
diff --git a/packages/Webkul/Admin/src/DataGrids/TaxRuleDataGrid.php b/packages/Webkul/Admin/src/DataGrids/TaxCategoryDataGrid.php
similarity index 94%
rename from packages/Webkul/Admin/src/DataGrids/TaxRuleDataGrid.php
rename to packages/Webkul/Admin/src/DataGrids/TaxCategoryDataGrid.php
index 753cbc779..d4e589a54 100644
--- a/packages/Webkul/Admin/src/DataGrids/TaxRuleDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/TaxCategoryDataGrid.php
@@ -6,26 +6,26 @@ use Illuminate\View\View;
 use Webkul\Ui\DataGrid\Facades\DataGrid;
 
 /**
- * Tax Rules DataGrid
+ * Tax Category DataGrid
  *
  * @author    Prashant Singh <prashant.singh852@webkul.com> @prashant-webkul
  * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
  */
 
-class TaxRuleDataGrid
+class TaxCategoryDataGrid
 {
     /**
-     * The Tax Rule Data
+     * The Tax Category Data
      * Grid implementation.
      *
-     * @var TaxRuleDataGrid
+     * @var TaxCategoryDataGrid
      */
-    public function createTaxRuleDataGrid()
+    public function createTaxCategoryDataGrid()
     {
 
         return DataGrid::make([
 
-            'name' => 'Tax Rule',
+            'name' => 'Tax Category',
             'table' => 'tax_categories as tr',
             'select' => 'tr.id',
             'perpage' => 10,
@@ -154,7 +154,7 @@ class TaxRuleDataGrid
 
     public function render() {
 
-        return $this->createTaxRuleDataGrid()->render();
+        return $this->createTaxCategoryDataGrid()->render();
 
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/DataGrids/TaxRateDataGrid.php b/packages/Webkul/Admin/src/DataGrids/TaxRateDataGrid.php
index be5b5c12e..e51d10f11 100644
--- a/packages/Webkul/Admin/src/DataGrids/TaxRateDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/TaxRateDataGrid.php
@@ -15,7 +15,7 @@ use Webkul\Ui\DataGrid\Facades\DataGrid;
 class TaxRateDataGrid
 {
     /**
-     * The Tax Rule Data
+     * The Tax Category Data
      * Grid implementation.
      *
      * @var TaxRateDataGrid
diff --git a/packages/Webkul/Admin/src/Http/routes.php b/packages/Webkul/Admin/src/Http/routes.php
index fe3d873a9..fc4fc2d19 100644
--- a/packages/Webkul/Admin/src/Http/routes.php
+++ b/packages/Webkul/Admin/src/Http/routes.php
@@ -41,27 +41,27 @@ Route::group(['middleware' => ['web']], function () {
 
             //Customers Management Routes
 
-            Route::get('customer', 'Webkul\Core\Http\Controllers\CustomerController@index')->defaults('_config', [
+            Route::get('customers', 'Webkul\Core\Http\Controllers\CustomerController@index')->defaults('_config', [
                 'view' => 'admin::customers.index'
             ])->name('admin.customer.index');
 
-            Route::get('customer/orders', 'Webkul\Core\Http\Controllers\CustomerController@index')->defaults('_config',[
+            Route::get('customers/orders', 'Webkul\Core\Http\Controllers\CustomerController@index')->defaults('_config',[
                 'view' => 'admin::customers.orders.index'
             ])->name('admin.customer.orders.index');
 
-            Route::get('customer/create', 'Webkul\Core\Http\Controllers\CustomerController@create')->defaults('_config',[
+            Route::get('customers/create', 'Webkul\Core\Http\Controllers\CustomerController@create')->defaults('_config',[
                 'view' => 'admin::customers.create'
             ])->name('admin.customer.create');
 
-            Route::post('customer/create', 'Webkul\Core\Http\Controllers\CustomerController@store')->defaults('_config',[
+            Route::post('customers/create', 'Webkul\Core\Http\Controllers\CustomerController@store')->defaults('_config',[
                 'redirect' => 'admin.customer.index'
             ])->name('admin.customer.store');
 
-            Route::get('customer/edit/{id}', 'Webkul\Core\Http\Controllers\CustomerController@edit')->defaults('_config',[
+            Route::get('customers/edit/{id}', 'Webkul\Core\Http\Controllers\CustomerController@edit')->defaults('_config',[
                 'view' => 'admin::customers.edit'
             ])->name('admin.customer.edit');
 
-            Route::put('customer/edit/{id}', 'Webkul\Core\Http\Controllers\CustomerController@update')->defaults('_config', [
+            Route::put('customers/edit/{id}', 'Webkul\Core\Http\Controllers\CustomerController@update')->defaults('_config', [
                 'redirect' => 'admin.customer.index'
             ])->name('admin.customer.update');
 
@@ -88,7 +88,7 @@ Route::group(['middleware' => ['web']], function () {
                     'view' => 'admin::sales.orders.view'
                 ])->name('admin.sales.orders.view');
 
-                Route::get('/orders/cancel/{order_id}', 'Webkul\Admin\Http\Controllers\Sales\OrderController@cancel')->defaults('_config', [
+                Route::get('/orders/cancel/{id}', 'Webkul\Admin\Http\Controllers\Sales\OrderController@cancel')->defaults('_config', [
                     'view' => 'admin::sales.orders.cancel'
                 ])->name('admin.sales.orders.cancel');
 
@@ -197,6 +197,10 @@ Route::group(['middleware' => ['web']], function () {
                     'redirect' => 'admin.catalog.attributes.index'
                 ])->name('admin.catalog.attributes.update');
 
+                Route::get('/attributes/delete/{id}', 'Webkul\Attribute\Http\Controllers\AttributeController@destroy')->defaults('_config', [
+                    'view' => 'admin::catalog.attributes.delete'
+                ])->name('admin.catalog.attributes.delete');
+
 
                 // Catalog Family Routes
                 Route::get('/families', 'Webkul\Attribute\Http\Controllers\AttributeFamilyController@index')->defaults('_config', [
@@ -396,7 +400,7 @@ Route::group(['middleware' => ['web']], function () {
                 'view' => 'admin::tax.tax-categories.index'
             ])->name('admin.tax-categories.index');
 
-            // tax rule routes
+            // tax category routes
             Route::get('/tax-categories/create', 'Webkul\Tax\Http\Controllers\TaxCategoryController@show')->defaults('_config', [
                 'view' => 'admin::tax.tax-categories.create'
             ])->name('admin.tax-categories.show');
@@ -413,7 +417,7 @@ Route::group(['middleware' => ['web']], function () {
                 'redirect' => 'admin.tax-categories.index'
             ])->name('admin.tax-categories.update');
 
-            //tax rule ends
+            //tax category ends
 
 
             //tax rate
diff --git a/packages/Webkul/Admin/src/Listeners/Order.php b/packages/Webkul/Admin/src/Listeners/Order.php
new file mode 100644
index 000000000..03a4dc033
--- /dev/null
+++ b/packages/Webkul/Admin/src/Listeners/Order.php
@@ -0,0 +1,47 @@
+<?php
+
+namespace Webkul\Admin\Listeners;
+
+use Illuminate\Support\Facades\Mail;
+use Webkul\Admin\Mail\NewOrderNotification;
+use Webkul\Admin\Mail\NewInvoiceNotification;
+use Webkul\Admin\Mail\NewShipmentNotification;
+
+/**
+ * Order event handler
+ *
+ * @author    Jitendra Singh <jitendra@webkul.com>
+ * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
+ */
+class Order {
+
+    /**
+     * @param mixed $order
+     *
+     * Send new order confirmation mail to the customer
+     */
+    public function sendNewOrderMail($order)
+    {
+        Mail::send(new NewOrderNotification($order));
+    }
+
+    /**
+     * @param mixed $invoice
+     *
+     * Send new invoice mail to the customer
+     */
+    public function sendNewInvoiceMail($invoice)
+    {
+        Mail::send(new NewInvoiceNotification($invoice));
+    }
+
+    /**
+     * @param mixed $shipment
+     *
+     * Send new shipment mail to the customer
+     */
+    public function sendNewShipmentMail($shipment)
+    {
+        Mail::send(new NewShipmentNotification($shipment));
+    }
+}
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Mail/NewInvoiceNotification.php b/packages/Webkul/Admin/src/Mail/NewInvoiceNotification.php
new file mode 100644
index 000000000..9f760be4e
--- /dev/null
+++ b/packages/Webkul/Admin/src/Mail/NewInvoiceNotification.php
@@ -0,0 +1,51 @@
+<?php
+
+namespace Webkul\Admin\Mail;
+
+use Illuminate\Bus\Queueable;
+use Illuminate\Mail\Mailable;
+use Illuminate\Queue\SerializesModels;
+use Illuminate\Contracts\Queue\ShouldQueue;
+
+/**
+ * New Invoice Mail class
+ *
+ * @author    Jitendra Singh <jitendra@webkul.com>
+ * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
+ */
+class NewInvoiceNotification extends Mailable
+{
+    use Queueable, SerializesModels;
+    
+    /**
+     * The invoice instance.
+     *
+     * @var Invoice
+     */
+    public $invoice;
+
+    /**
+     * Create a new message instance.
+     *
+     * @param mixed $invoice
+     * @return void
+     */
+    public function __construct($invoice)
+    {
+        $this->invoice = $invoice;
+    }
+
+    /**
+     * Build the message.
+     *
+     * @return $this
+     */
+    public function build()
+    {
+        $order = $this->invoice->order;
+
+        return $this->to($order->customer_email, $order->customer_full_name)
+                    ->subject(trans('admin::app.mail.invoice.subject', ['order_id' => $order->id]))
+                    ->view('admin::emails.sales.new-invoice');
+    }
+}
diff --git a/packages/Webkul/Admin/src/Mail/NewOrderNotification.php b/packages/Webkul/Admin/src/Mail/NewOrderNotification.php
new file mode 100644
index 000000000..51940d1a8
--- /dev/null
+++ b/packages/Webkul/Admin/src/Mail/NewOrderNotification.php
@@ -0,0 +1,48 @@
+<?php
+
+namespace Webkul\Admin\Mail;
+
+use Illuminate\Bus\Queueable;
+use Illuminate\Mail\Mailable;
+use Illuminate\Queue\SerializesModels;
+use Illuminate\Contracts\Queue\ShouldQueue;
+
+/**
+ * New Order Mail class
+ *
+ * @author    Jitendra Singh <jitendra@webkul.com>
+ * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
+ */
+class NewOrderNotification extends Mailable
+{
+    use Queueable, SerializesModels;
+    
+    /**
+     * The order instance.
+     *
+     * @var Order
+     */
+    public $order;
+
+    /**
+     * Create a new message instance.
+     *
+     * @return void
+     */
+    public function __construct($order)
+    {
+        $this->order = $order;
+    }
+
+    /**
+     * Build the message.
+     *
+     * @return $this
+     */
+    public function build()
+    {
+        return $this->to($this->order->customer_email, $this->order->customer_full_name)
+                    ->subject(trans('admin::app.mail.order.subject'))
+                    ->view('admin::emails.sales.new-order');
+    }
+}
diff --git a/packages/Webkul/Admin/src/Mail/NewShipmentNotification.php b/packages/Webkul/Admin/src/Mail/NewShipmentNotification.php
new file mode 100644
index 000000000..5c8717581
--- /dev/null
+++ b/packages/Webkul/Admin/src/Mail/NewShipmentNotification.php
@@ -0,0 +1,51 @@
+<?php
+
+namespace Webkul\Admin\Mail;
+
+use Illuminate\Bus\Queueable;
+use Illuminate\Mail\Mailable;
+use Illuminate\Queue\SerializesModels;
+use Illuminate\Contracts\Queue\ShouldQueue;
+
+/**
+ * New Shipment Mail class
+ *
+ * @author    Jitendra Singh <jitendra@webkul.com>
+ * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
+ */
+class NewShipmentNotification extends Mailable
+{
+    use Queueable, SerializesModels;
+    
+    /**
+     * The shipment instance.
+     *
+     * @var Shipment
+     */
+    public $shipment;
+
+    /**
+     * Create a new message instance.
+     *
+     * @param mixed $shipment
+     * @return void
+     */
+    public function __construct($shipment)
+    {
+        $this->shipment = $shipment;
+    }
+
+    /**
+     * Build the message.
+     *
+     * @return $this
+     */
+    public function build()
+    {
+        $order = $this->shipment->order;
+
+        return $this->to($order->customer_email, $order->customer_full_name)
+                    ->subject(trans('admin::app.mail.shipment.subject', ['order_id' => $order->id]))
+                    ->view('admin::emails.sales.new-shipment');
+    }
+}
diff --git a/packages/Webkul/Admin/src/Providers/EventServiceProvider.php b/packages/Webkul/Admin/src/Providers/EventServiceProvider.php
index 6e857bbbe..0ed37ee12 100644
--- a/packages/Webkul/Admin/src/Providers/EventServiceProvider.php
+++ b/packages/Webkul/Admin/src/Providers/EventServiceProvider.php
@@ -10,6 +10,160 @@ use Webkul\Admin\ProductFormAccordian;
 
 class EventServiceProvider extends ServiceProvider
 {
+    protected $menuItems = [
+        [
+            'key' => 'dashboard',
+            'name' => 'Dashboard',
+            'route' => 'admin.dashboard.index',
+            'sort' => 1,
+            'icon-class' => 'dashboard-icon',
+        ], [
+            'key' => 'sales',
+            'name' => 'Sales',
+            'route' => 'admin.sales.orders.index',
+            'sort' => 2,
+            'icon-class' => 'sales-icon',
+        ], [
+            'key' => 'catalog',
+            'name' => 'Catalog',
+            'route' => 'admin.catalog.products.index',
+            'sort' => 3,
+            'icon-class' => 'catalog-icon',
+        ], [
+            'key' => 'catalog.products',
+            'name' => 'Products',
+            'route' => 'admin.catalog.products.index',
+            'sort' => 1,
+            'icon-class' => '',
+        ], [
+            'key' => 'catalog.categories',
+            'name' => 'Categories',
+            'route' => 'admin.catalog.categories.index',
+            'sort' => 2,
+            'icon-class' => '',
+        ], [
+            'key' => 'catalog.attributes',
+            'name' => 'Attributes',
+            'route' => 'admin.catalog.attributes.index',
+            'sort' => 3,
+            'icon-class' => '',
+        ], [
+            'key' => 'catalog.families',
+            'name' => 'Families',
+            'route' => 'admin.catalog.families.index',
+            'sort' => 4,
+            'icon-class' => '',
+        ], [
+            'key' => 'customers',
+            'name' => 'Customers',
+            'route' => 'admin.customer.index',
+            'sort' => 4,
+            'icon-class' => 'customer-icon',
+        ], [
+            'key' => 'customers.customers',
+            'name' => 'Customers',
+            'route' => 'admin.customer.index',
+            'sort' => 1,
+            'icon-class' => '',
+        ], [
+            'key' => 'customers.reviews',
+            'name' => 'Reviews',
+            'route' => 'admin.customer.review.index',
+            'sort' => 2,
+            'icon-class' => '',
+        ], [
+            'key' => 'configuration',
+            'name' => 'Configure',
+            'route' => 'admin.account.edit',
+            'sort' => 5,
+            'icon-class' => 'configuration-icon',
+        ], [
+            'key' => 'configuration.account',
+            'name' => 'My Account',
+            'route' => 'admin.account.edit',
+            'sort' => 1,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings',
+            'name' => 'Settings',
+            'route' => 'admin.locales.index',
+            'sort' => 6,
+            'icon-class' => 'settings-icon',
+        ], [
+            'key' => 'settings.locales',
+            'name' => 'Locales',
+            'route' => 'admin.locales.index',
+            'sort' => 1,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.currencies',
+            'name' => 'Currencies',
+            'route' => 'admin.currencies.index',
+            'sort' => 2,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.exchange_rates',
+            'name' => 'Exchange Rates',
+            'route' => 'admin.exchange_rates.index',
+            'sort' => 3,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.inventory_sources',
+            'name' => 'Inventory Sources',
+            'route' => 'admin.inventory_sources.index',
+            'sort' => 4,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.channels',
+            'name' => 'Channels',
+            'route' => 'admin.channels.index',
+            'sort' => 5,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.users',
+            'name' => 'Users',
+            'route' => 'admin.users.index',
+            'sort' => 6,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.users.users',
+            'name' => 'Users',
+            'route' => 'admin.users.index',
+            'sort' => 1,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.users.roles',
+            'name' => 'Roles',
+            'route' => 'admin.roles.index',
+            'sort' => 2,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.sliders',
+            'name' => 'Create Sliders',
+            'route' => 'admin.sliders.index',
+            'sort' => 7,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.taxes',
+            'name' => 'Taxes',
+            'route' => 'admin.tax-categories.index',
+            'sort' => 8,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.taxes.tax-categories',
+            'name' => 'Tax Categories',
+            'route' => 'admin.tax-categories.index',
+            'sort' => 1,
+            'icon-class' => '',
+        ], [
+            'key' => 'settings.taxes.tax-rates',
+            'name' => 'Tax Rates',
+            'route' => 'admin.tax-rates.index',
+            'sort' => 2,
+            'icon-class' => '',
+        ],
+    ];
+
     /**
      * Bootstrap services.
      *
@@ -24,6 +178,12 @@ class EventServiceProvider extends ServiceProvider
         $this->registerACL();
 
         $this->createProductFormAccordian();
+
+        Event::listen('checkout.order.save.after', 'Webkul\Admin\Listeners\Order@sendNewOrderMail');
+
+        Event::listen('checkout.invoice.save.after', 'Webkul\Admin\Listeners\Order@sendNewInvoiceMail');
+
+        Event::listen('checkout.invoice.save.after', 'Webkul\Admin\Listeners\Order@sendNewShipmentMail');
     }
 
     /**
@@ -40,59 +200,11 @@ class EventServiceProvider extends ServiceProvider
         });
 
         Event::listen('admin.menu.build', function ($menu) {
-            $menu->add('dashboard', 'Dashboard', 'admin.dashboard.index', 1, 'dashboard-icon');
-
-            $menu->add('sales', 'Sales', 'admin.sales.orders.index', 1, 'sales-icon');
-
-            $menu->add('catalog', 'Catalog', 'admin.catalog.products.index', 3, 'catalog-icon');
-
-            $menu->add('catalog.products', 'Products', 'admin.catalog.products.index', 1);
-
-            $menu->add('catalog.categories', 'Categories', 'admin.catalog.categories.index', 2);
-
-            $menu->add('catalog.attributes', 'Attributes', 'admin.catalog.attributes.index', 3);
-
-            $menu->add('catalog.families', 'Families', 'admin.catalog.families.index', 4);
-
-            $menu->add('customers', 'Customers', 'admin.customer.index', 5, 'customer-icon');
-
-            $menu->add('customers.customers', 'Customers', 'admin.customer.index', 1, '');
-
-            $menu->add('customers.reviews', 'Review', 'admin.customer.review.index', 2, '');
-
-            // $menu->add('customers.blocked_customer', 'Blocked Customers', 'admin.account.edit', 2, '');
-
-            // $menu->add('customers.allowed_customer', 'Allowed Customers', 'admin.account.edit', 4, '');
-
-            $menu->add('configuration', 'Configure', 'admin.account.edit', 6, 'configuration-icon');
-
-            $menu->add('configuration.account', 'My Account', 'admin.account.edit', 1);
-
-            $menu->add('settings', 'Settings', 'admin.locales.index', 6, 'settings-icon');
-
-            $menu->add('settings.locales', 'Locales', 'admin.locales.index', 1, '');
-
-            $menu->add('settings.currencies', 'Currencies', 'admin.currencies.index', 2, '');
-
-            $menu->add('settings.exchange_rates', 'Exchange Rates', 'admin.exchange_rates.index', 3, '');
-
-            $menu->add('settings.inventory_sources', 'Inventory Sources', 'admin.inventory_sources.index', 4, '');
-
-            $menu->add('settings.channels', 'Channels', 'admin.channels.index', 5, '');
-
-            $menu->add('settings.users', 'Users', 'admin.users.index', 6, '');
-
-            $menu->add('settings.users.users', 'Users', 'admin.users.index', 1, '');
-
-            $menu->add('settings.users.roles', 'Roles', 'admin.roles.index', 2, '');
-
-            $menu->add('settings.sliders', 'Create Sliders', 'admin.sliders.index', 8, '');
-
-            $menu->add('settings.tax', 'Taxes', 'admin.tax-categories.index', 9, '');
-
-            $menu->add('settings.tax.tax-categories', 'Add Tax Category', 'admin.tax-categories.index', 1, '');
-
-            $menu->add('settings.tax.tax-rates', 'Add Tax Rates', 'admin.tax-rates.index', 2, '');
+            foreach($this->menuItems as $item){
+                if (bouncer()->hasPermission($item['key'])) {
+                    $menu->add($item['key'], $item['name'], $item['route'], $item['sort'], $item['icon-class']);
+                }
+            }
         });
     }
 
diff --git a/packages/Webkul/Admin/src/Resources/lang/en/app.php b/packages/Webkul/Admin/src/Resources/lang/en/app.php
index 721bf7771..1aee893ad 100644
--- a/packages/Webkul/Admin/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Admin/src/Resources/lang/en/app.php
@@ -6,8 +6,11 @@ return [
         'country' => 'Country',
         'state' => 'State'
     ],
+    'dashboard' => [
+        'title' => 'Dashboard'
+    ],
     'account' => [
-        'header-title' => 'My Account',
+        'title' => 'My Account',
         'save-btn-title' => 'Save',
         'general' => 'General',
         'name' => 'Name',
@@ -154,7 +157,7 @@ return [
     ],
     'catalog' => [
         'products' => [
-            'products' => 'Products',
+            'title' => 'Products',
             'add-product-btn-title' => 'Add Product',
             'add-title' => 'Add Product',
             'edit-title' => 'Edit Product',
@@ -185,6 +188,7 @@ return [
             'add-image-btn-title' => 'Add Image'
         ],
         'attributes' => [
+            'title' => 'Attributes',
             'add-title' => 'Add Attribute',
             'edit-title' => 'Edit Attribute',
             'save-btn-title' => 'Save Attribute',
@@ -225,7 +229,7 @@ return [
             'is_visible_on_front' => 'Visible on Product View Page on Front-end'
         ],
         'families' => [
-            'families' => 'Families',
+            'title' => 'Families',
             'add-family-btn-title' => 'Add Family',
             'add-title' => 'Add Family',
             'edit-title' => 'Edit Family',
@@ -243,7 +247,7 @@ return [
             'group-exist-error' => 'Group with same name already exists.'
         ],
         'categories' => [
-            'categories' => 'Categories',
+            'title' => 'Categories',
             'add-title' => 'Add Category',
             'edit-title' => 'Edit Category',
             'save-btn-title' => 'Save Category',
@@ -265,13 +269,10 @@ return [
     ],
 
     'configuration' => [
-        'tax' => [
-            'title' => 'Taxes',
-            'add-title' => 'Add Tax Category'
-        ],
-
         'tax-categories' => [
-            'title' => 'Add Tax Category',
+            'title' => 'Tax Categories',
+            'add-title' => 'Add Tax Category',
+            'edit-title' => 'Edit Tax Category',
             'save-btn-title' => 'Save Tax Category',
             'general' => 'Tax Category',
             'select-channel' => 'Select Channel',
@@ -286,7 +287,9 @@ return [
         ],
 
         'tax-rates' => [
-            'title' => 'Add Tax Rate',
+            'title' => 'Tax Rates',
+            'add-title' => 'Add Tax Rate',
+            'edit-title' => 'Edit Tax Rate',
             'save-btn-title' => 'Save Tax Rate',
             'general' => 'Tax Rate',
             'identifier' => 'Identifier',
@@ -342,7 +345,7 @@ return [
             'general' => 'General',
             'source_currency' => 'Source Currency',
             'target_currency' => 'Target Currency',
-            'ratio' => 'Ratio'
+            'rate' => 'Rate'
         ],
         'inventory_sources' => [
             'title' => 'Inventory Sources',
@@ -409,11 +412,46 @@ return [
             'save-btn-title' => 'Save Customer'
         ],
         'reviews' => [
-            'title' => 'Title',
-            'name' => 'Reviews',
+            'title' => 'Reviews',
+            'edit-title' => 'Edit Review',
             'rating' => 'Rating',
             'status' => 'Status',
             'comment' => 'Comment'
         ]
+    ],
+    'mail' => [
+        'order' => [
+            'subject' => 'New Order Confirmation',
+            'heading' => 'Order Confirmation!',
+            'dear' => 'Dear :customer_name',
+            'greeting' => 'Thanks for your Order :order_id placed on :created_at',
+            'summary' => 'Summary of Order',
+            'shipping-address' => 'Shipping Address',
+            'billing-address' => 'Billing Address',
+            'contact' => 'Contact',
+            'shipping' => 'Shipping',
+            'payment' => 'Payment',
+            'price' => 'Price',
+            'quantity' => 'Quantity',
+            'subtotal' => 'Subtotal',
+            'shipping-handling' => 'Shipping & Handling',
+            'tax' => 'Tax',
+            'grand-total' => 'Grand Total',
+            'final-summary' => 'Thanks for showing your intrest in our store. we will send you track number once it shiped.',
+            'help' => 'If you need any kind of help please contact us at :support_email',
+            'thanks' => 'Thanks!'
+        ],
+        'invoice' => [
+            'heading' => 'Your Invoice #:invoice_id for Order #:order_id',
+            'subject' => 'Invoice for your order #:order_id',
+            'summary' => 'Summary of Invoice',
+        ],
+        'shipment' => [
+            'heading' => 'Your Shipment #:shipment_id for Order #:order_id',
+            'subject' => 'Shipment for your order #:order_id',
+            'summary' => 'Summary of Shipment',
+            'carrier' => 'Carrier',
+            'tracking-number' => 'Tracking Number'
+        ]
     ]
 ];
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Resources/views/account/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/account/edit.blade.php
index 5eed7df25..68aadd005 100644
--- a/packages/Webkul/Admin/src/Resources/views/account/edit.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/account/edit.blade.php
@@ -1,12 +1,16 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.account.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <form method="POST" action="" @submit.prevent="onSubmit">
             <div class="page-header">
                 <div class="page-title">
                     <h1>
-                        {{ __('admin::app.account.header-title') }}
+                        {{ __('admin::app.account.title') }}
                     </h1>
                 </div>
 
diff --git a/packages/Webkul/Admin/src/Resources/views/catalog/attributes/index.blade.php b/packages/Webkul/Admin/src/Resources/views/catalog/attributes/index.blade.php
index f8befdc33..48461ef0a 100644
--- a/packages/Webkul/Admin/src/Resources/views/catalog/attributes/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/catalog/attributes/index.blade.php
@@ -1,10 +1,14 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.catalog.attributes.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <div class="page-header">
             <div class="page-title">
-                Attributes
+                <h1>{{ __('admin::app.catalog.attributes.title') }}</h1>
             </div>
 
             <div class="page-action">
diff --git a/packages/Webkul/Admin/src/Resources/views/catalog/categories/index.blade.php b/packages/Webkul/Admin/src/Resources/views/catalog/categories/index.blade.php
index c55e51270..10c2ee615 100644
--- a/packages/Webkul/Admin/src/Resources/views/catalog/categories/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/catalog/categories/index.blade.php
@@ -1,10 +1,14 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.catalog.categories.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <div class="page-header">
             <div class="page-title">
-                Categories
+                <h1>{{ __('admin::app.catalog.categories.title') }}</h1>
             </div>
 
             <div class="page-action">
diff --git a/packages/Webkul/Admin/src/Resources/views/catalog/families/index.blade.php b/packages/Webkul/Admin/src/Resources/views/catalog/families/index.blade.php
index 504bf291b..0e8772400 100644
--- a/packages/Webkul/Admin/src/Resources/views/catalog/families/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/catalog/families/index.blade.php
@@ -1,10 +1,14 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.catalog.families.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <div class="page-header">
             <div class="page-title">
-                {{ __('admin::app.catalog.families.families') }}
+                <h1>{{ __('admin::app.catalog.families.title') }}</h1>
             </div>
 
             <div class="page-action">
diff --git a/packages/Webkul/Admin/src/Resources/views/catalog/products/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/catalog/products/edit.blade.php
index 4f666f839..22b0820df 100644
--- a/packages/Webkul/Admin/src/Resources/views/catalog/products/edit.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/catalog/products/edit.blade.php
@@ -83,10 +83,14 @@
 
                                         @if(view()->exists($typeView = 'admin::catalog.products.field-types.' . $attribute->type))
 
-                                            <div class="control-group" :class="[errors.has('{{ $attribute->code }}') ? 'has-error' : '']">
+                                            <div class="control-group {{ $attribute->type }}" :class="[errors.has('{{ $attribute->code }}') ? 'has-error' : '']">
                                                 <label for="{{ $attribute->code }}" {{ $attribute->is_required ? 'class=required' : '' }}>
                                                     {{ $attribute->admin_name }}
 
+                                                    @if ($attribute->type == 'price')
+                                                        <span class="currency-code">({{ core()->getBaseCurrencySymbol() }})</span>
+                                                    @endif
+
                                                     <?php
                                                         $channel_locale = [];
                                                         if($attribute->value_per_channel) {
diff --git a/packages/Webkul/Admin/src/Resources/views/catalog/products/index.blade.php b/packages/Webkul/Admin/src/Resources/views/catalog/products/index.blade.php
index b08552252..b51469de3 100644
--- a/packages/Webkul/Admin/src/Resources/views/catalog/products/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/catalog/products/index.blade.php
@@ -1,10 +1,14 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.catalog.products.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <div class="page-header">
             <div class="page-title">
-                <h1>{{ __('admin::app.catalog.products.products') }}</h1>
+                <h1>{{ __('admin::app.catalog.products.title') }}</h1>
             </div>
 
             <div class="page-action">
diff --git a/packages/Webkul/Admin/src/Resources/views/customers/index.blade.php b/packages/Webkul/Admin/src/Resources/views/customers/index.blade.php
index 475d8afcc..d40180509 100644
--- a/packages/Webkul/Admin/src/Resources/views/customers/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/customers/index.blade.php
@@ -1,7 +1,7 @@
 @extends('admin::layouts.content')
 
 @section('page_title')
-
+    {{ __('admin::app.customers.customers.title') }}
 @stop
 
 @section('content')
diff --git a/packages/Webkul/Admin/src/Resources/views/customers/review/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/customers/review/edit.blade.php
index 98e1bc6f2..8183b378e 100644
--- a/packages/Webkul/Admin/src/Resources/views/customers/review/edit.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/customers/review/edit.blade.php
@@ -1,5 +1,9 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.customers.reviews.edit-title') }}
+@stop
+
 @section('content')
     <div class="content">
         <form method="POST" action="{{ route('admin.customer.review.update', $review->id) }}">
@@ -7,7 +11,7 @@
             <div class="page-header">
                 <div class="page-title">
                     <h1>
-                        {{ __('admin::app.customers.reviews.name') }}
+                        {{ __('admin::app.customers.reviews.edit-title') }}
                     </h1>
                 </div>
 
diff --git a/packages/Webkul/Admin/src/Resources/views/customers/review/index.blade.php b/packages/Webkul/Admin/src/Resources/views/customers/review/index.blade.php
index 1afc63c69..b05f5f819 100644
--- a/packages/Webkul/Admin/src/Resources/views/customers/review/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/customers/review/index.blade.php
@@ -1,7 +1,7 @@
 @extends('admin::layouts.content')
 
 @section('page_title')
-
+    {{ __('admin::app.customers.reviews.title') }}
 @stop
 
 @section('content')
@@ -9,7 +9,7 @@
     <div class="content">
         <div class="page-header">
             <div class="page-title">
-                <h1>{{ __('admin::app.customers.reviews.name') }}</h1>
+                <h1>{{ __('admin::app.customers.reviews.title') }}</h1>
             </div>
             <div class="page-action">
                 {{--  <a href="{{ route('admin.users.create') }}" class="btn btn-lg btn-primary">
diff --git a/packages/Webkul/Admin/src/Resources/views/dashboard/index.blade.php b/packages/Webkul/Admin/src/Resources/views/dashboard/index.blade.php
index b0778f797..59ae4e5ba 100644
--- a/packages/Webkul/Admin/src/Resources/views/dashboard/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/dashboard/index.blade.php
@@ -1,5 +1,9 @@
 @extends('admin::layouts.master')
 
+@section('page_title')
+    {{ __('admin::app.dashboard.title') }}
+@stop
+
 @section('content-wrapper')
     <div class="content full-page">
         <h1>Dashboard</h1>
diff --git a/packages/Webkul/Admin/src/Resources/views/emails/layouts/master.blade.php b/packages/Webkul/Admin/src/Resources/views/emails/layouts/master.blade.php
new file mode 100644
index 000000000..9451f8cf1
--- /dev/null
+++ b/packages/Webkul/Admin/src/Resources/views/emails/layouts/master.blade.php
@@ -0,0 +1,22 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+        <link href="https://fonts.googleapis.com/css?family=Montserrat:400,500" rel="stylesheet" type="text/css">
+    </head>
+
+    <body style="font-family: montserrat, sans-serif;">
+        <div style="max-width: 1000px; margin-left: auto; margin-right: auto;">
+            <div style="text-align: center;">
+                {{ $header ?? '' }}
+            </div>
+
+            <div>
+                {{ $slot }}
+
+                {{ $subcopy ?? '' }}
+            </div>
+        </div>
+    </body>
+</html>
diff --git a/packages/Webkul/Admin/src/Resources/views/emails/sales/new-invoice.blade.php b/packages/Webkul/Admin/src/Resources/views/emails/sales/new-invoice.blade.php
new file mode 100644
index 000000000..36065036d
--- /dev/null
+++ b/packages/Webkul/Admin/src/Resources/views/emails/sales/new-invoice.blade.php
@@ -0,0 +1,175 @@
+@component('admin::emails.layouts.master')
+    <div style="text-align: center;">
+        <a href="{{ config('app.url') }}">
+            <img src="{{ bagisto_asset('vendor/webkul/shop/assets/images/logo.svg') }}">
+        </a>
+    </div>
+
+    <?php $order = $invoice->order; ?>
+
+    <div style="padding: 30px;">
+        <div style="font-size: 20px;color: #242424;line-height: 30px;margin-bottom: 34px;">
+            <span style="font-weight: bold;">
+                {{ __('admin::app.mail.invoice.heading', ['order_id' => $order->id, 'invoice_id' => $invoice->id]) }}
+            </span> <br>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {{ __('admin::app.mail.order.dear', ['customer_name' => $order->customer_full_name]) }},
+            </p>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {!! __('admin::app.mail.order.greeting', [
+                    'order_id' => '<a href="' . route('customer.orders.view', $order->id) . '" style="color: #0041FF; font-weight: bold;">#' . $order->id . '</a>',
+                    'created_at' => $order->created_at
+                    ]) 
+                !!}
+            </p>
+        </div>
+
+        <div style="font-weight: bold;font-size: 20px;color: #242424;line-height: 30px;margin-bottom: 20px !important;">
+            {{ __('admin::app.mail.invoice.summary') }}
+        </div>
+
+        <div style="display: flex;flex-direction: row;margin-top: 20px;justify-content: space-between;margin-bottom: 40px;">
+            <div style="line-height: 25px;">
+                <div style="font-weight: bold;font-size: 16px;color: #242424;">
+                    {{ __('admin::app.mail.order.shipping-address') }}
+                </div>
+
+                <div>
+                    {{ $order->shipping_address->name }}
+                </div>
+
+                <div>
+                    {{ $order->shipping_address->address1 }}, {{ $order->shipping_address->address2 ? $order->shipping_address->address2 . ',' : '' }} {{ $order->shipping_address->state }}
+                </div>
+
+                <div>
+                    {{ country()->name($order->shipping_address->country) }} {{ $order->shipping_address->postcode }}
+                </div>
+
+                <div>---</div>
+
+                <div style="margin-bottom: 40px;">
+                    {{ __('admin::app.mail.order.contact') }} : {{ $order->shipping_address->phone }} 
+                </div>
+
+                <div style="font-size: 16px;color: #242424;">
+                    {{ __('admin::app.mail.order.shipping') }}
+                </div>
+
+                <div style="font-weight: bold;font-size: 16px;color: #242424;">
+                    {{ $order->shipping_title }}
+                </div>
+            </div>
+
+            <div style="line-height: 25px;">
+                <div style="font-weight: bold;font-size: 16px;color: #242424;">
+                    {{ __('admin::app.mail.order.billing-address') }}
+                </div>
+
+                <div>
+                    {{ $order->billing_address->name }}
+                </div>
+
+                <div>
+                    {{ $order->billing_address->address1 }}, {{ $order->billing_address->address2 ? $order->billing_address->address2 . ',' : '' }} {{ $order->billing_address->state }}
+                </div>
+
+                <div>
+                    {{ country()->name($order->billing_address->country) }} {{ $order->billing_address->postcode }}
+                </div>
+
+                <div>---</div>
+
+                <div style="margin-bottom: 40px;">
+                    {{ __('admin::app.mail.order.contact') }} : {{ $order->billing_address->phone }} 
+                </div>
+
+                <div style="font-size: 16px; color: #242424;">
+                    {{ __('admin::app.mail.order.payment') }}
+                </div>
+
+                <div style="font-weight: bold;font-size: 16px; color: #242424;">
+                    {{ core()->getConfigData('paymentmethods.' . $order->payment->method . '.title') }}
+                </div>
+            </div>
+        </div>
+
+        @foreach ($invoice->items as $item)
+            <div style="background: #FFFFFF;border: 1px solid #E8E8E8;border-radius: 3px;padding: 20px">
+                <p style="font-size: 18px;color: #242424;line-height: 24px;margin-top: 0;margin-bottom: 10px;font-weight: bold;">
+                    {{ $item->name }}
+                </p>
+
+                <div style="margin-bottom: 10px;">
+                    <label style="font-size: 16px;color: #5E5E5E;">
+                        {{ __('admin::app.mail.order.price') }}
+                    </label>
+                    <span style="font-size: 18px;color: #242424;margin-left: 40px;font-weight: bold;">
+                        {{ core()->formatPrice($item->price, $invoice->order_currency_code) }}
+                    </span>
+                </div>
+
+                <div style="margin-bottom: 10px;">
+                    <label style="font-size: 16px;color: #5E5E5E;">
+                        {{ __('admin::app.mail.order.quantity') }}
+                    </label>
+                    <span style="font-size: 18px;color: #242424;margin-left: 40px;font-weight: bold;">
+                        {{ $item->qty }}
+                    </span>
+                </div>
+                
+                <div style="">
+                    <label style="margin-top: 10px; font-size: 16px;color: #5E5E5E; display: block;">
+                        Color : Gray, Size  : S
+                    </label>
+                </div>
+            </div>
+        @endforeach
+
+        <div style="font-size: 16px;color: #242424;line-height: 30px;float: right;width: 40%;margin-top: 20px;">
+            <div>
+                <span>{{ __('admin::app.mail.order.subtotal') }}</span>
+                <span style="float: right;">
+                    {{ core()->formatPrice($invoice->sub_total, $invoice->order_currency_code) }}
+                </span>
+            </div>
+
+            <div>
+                <span>{{ __('admin::app.mail.order.shipping-handling') }}</span>
+                <span style="float: right;">
+                    {{ core()->formatPrice($invoice->shipping_amount, $invoice->order_currency_code) }}
+                </span>
+            </div>
+
+            <div>
+                <span>{{ __('admin::app.mail.order.tax') }}</span>
+                <span style="float: right;">
+                    {{ core()->formatPrice($invoice->tax_amount, $invoice->order_currency_code) }}
+                </span>
+            </div>
+
+            <div style="font-weight: bold">
+                <span>{{ __('admin::app.mail.order.grand-total') }}</span>
+                <span style="float: right;">
+                    {{ core()->formatPrice($invoice->grand_total, $invoice->order_currency_code) }}
+                </span>
+            </div>
+        </div>
+
+        <div style="margin-top: 65px;font-size: 16px;color: #5E5E5E;line-height: 24px;display: inline-block;width: 100%">
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {!! 
+                    __('admin::app.mail.order.help', [
+                        'support_email' => '<a style="color:#0041FF" href="mailto:' . config('mail.from.address') . '">' . config('mail.from.address'). '</a>'
+                        ]) 
+                !!}
+            </p>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {{ __('admin::app.mail.order.thanks') }}
+            </p>
+        </div>
+    </div>
+@endcomponent
diff --git a/packages/Webkul/Admin/src/Resources/views/emails/sales/new-order.blade.php b/packages/Webkul/Admin/src/Resources/views/emails/sales/new-order.blade.php
new file mode 100644
index 000000000..b308e930f
--- /dev/null
+++ b/packages/Webkul/Admin/src/Resources/views/emails/sales/new-order.blade.php
@@ -0,0 +1,177 @@
+@component('admin::emails.layouts.master')
+    <div style="text-align: center;">
+        <a href="{{ config('app.url') }}">
+            <img src="{{ bagisto_asset('vendor/webkul/shop/assets/images/logo.svg') }}">
+        </a>
+    </div>
+
+    <div style="padding: 30px;">
+        <div style="font-size: 20px;color: #242424;line-height: 30px;margin-bottom: 34px;">
+            <span style="font-weight: bold;">
+                {{ __('admin::app.mail.order.heading') }}
+            </span> <br>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {{ __('admin::app.mail.order.dear', ['customer_name' => $order->customer_full_name]) }},
+            </p>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {!! __('admin::app.mail.order.greeting', [
+                    'order_id' => '<a href="' . route('customer.orders.view', $order->id) . '" style="color: #0041FF; font-weight: bold;">#' . $order->id . '</a>',
+                    'created_at' => $order->created_at
+                    ]) 
+                !!}
+            </p>
+        </div>
+
+        <div style="font-weight: bold;font-size: 20px;color: #242424;line-height: 30px;margin-bottom: 20px !important;">
+            {{ __('admin::app.mail.order.summary') }}
+        </div>
+
+        <div style="display: flex;flex-direction: row;margin-top: 20px;justify-content: space-between;margin-bottom: 40px;">
+            <div style="line-height: 25px;">
+                <div style="font-weight: bold;font-size: 16px;color: #242424;">
+                    {{ __('admin::app.mail.order.shipping-address') }}
+                </div>
+
+                <div>
+                    {{ $order->shipping_address->name }}
+                </div>
+
+                <div>
+                    {{ $order->shipping_address->address1 }}, {{ $order->shipping_address->address2 ? $order->shipping_address->address2 . ',' : '' }} {{ $order->shipping_address->state }}
+                </div>
+
+                <div>
+                    {{ country()->name($order->shipping_address->country) }} {{ $order->shipping_address->postcode }}
+                </div>
+
+                <div>---</div>
+
+                <div style="margin-bottom: 40px;">
+                    {{ __('admin::app.mail.order.contact') }} : {{ $order->shipping_address->phone }} 
+                </div>
+
+                <div style="font-size: 16px;color: #242424;">
+                    {{ __('admin::app.mail.order.shipping') }}
+                </div>
+
+                <div style="font-weight: bold;font-size: 16px;color: #242424;">
+                    {{ $order->shipping_title }}
+                </div>
+            </div>
+
+            <div style="line-height: 25px;">
+                <div style="font-weight: bold;font-size: 16px;color: #242424;">
+                    {{ __('admin::app.mail.order.billing-address') }}
+                </div>
+
+                <div>
+                    {{ $order->billing_address->name }}
+                </div>
+
+                <div>
+                    {{ $order->billing_address->address1 }}, {{ $order->billing_address->address2 ? $order->billing_address->address2 . ',' : '' }} {{ $order->billing_address->state }}
+                </div>
+
+                <div>
+                    {{ country()->name($order->billing_address->country) }} {{ $order->billing_address->postcode }}
+                </div>
+
+                <div>---</div>
+
+                <div style="margin-bottom: 40px;">
+                    {{ __('admin::app.mail.order.contact') }} : {{ $order->billing_address->phone }} 
+                </div>
+
+                <div style="font-size: 16px; color: #242424;">
+                    {{ __('admin::app.mail.order.payment') }}
+                </div>
+
+                <div style="font-weight: bold;font-size: 16px; color: #242424;">
+                    {{ core()->getConfigData('paymentmethods.' . $order->payment->method . '.title') }}
+                </div>
+            </div>
+        </div>
+
+        @foreach ($order->items as $item)
+            <div style="background: #FFFFFF;border: 1px solid #E8E8E8;border-radius: 3px;padding: 20px">
+                <p style="font-size: 18px;color: #242424;line-height: 24px;margin-top: 0;margin-bottom: 10px;font-weight: bold;">
+                    {{ $item->name }}
+                </p>
+
+                <div style="margin-bottom: 10px;">
+                    <label style="font-size: 16px;color: #5E5E5E;">
+                        {{ __('admin::app.mail.order.price') }}
+                    </label>
+                    <span style="font-size: 18px;color: #242424;margin-left: 40px;font-weight: bold;">
+                        {{ core()->formatPrice($item->price, $order->order_currency_code) }}
+                    </span>
+                </div>
+
+                <div style="margin-bottom: 10px;">
+                    <label style="font-size: 16px;color: #5E5E5E;">
+                        {{ __('admin::app.mail.order.quantity') }}
+                    </label>
+                    <span style="font-size: 18px;color: #242424;margin-left: 40px;font-weight: bold;">
+                        {{ $item->qty_ordered }}
+                    </span>
+                </div>
+                
+                <div style="">
+                    <label style="margin-top: 10px; font-size: 16px;color: #5E5E5E; display: block;">
+                        Color : Gray, Size  : S
+                    </label>
+                </div>
+            </div>
+        @endforeach
+
+        <div style="font-size: 16px;color: #242424;line-height: 30px;float: right;width: 40%;margin-top: 20px;">
+            <div>
+                <span>{{ __('admin::app.mail.order.subtotal') }}</span>
+                <span style="float: right;">
+                    {{ core()->formatPrice($order->sub_total, $order->order_currency_code) }}
+                </span>
+            </div>
+
+            <div>
+                <span>{{ __('admin::app.mail.order.shipping-handling') }}</span>
+                <span style="float: right;">
+                    {{ core()->formatPrice($order->shipping_amount, $order->order_currency_code) }}
+                </span>
+            </div>
+
+            <div>
+                <span>{{ __('admin::app.mail.order.tax') }}</span>
+                <span style="float: right;">
+                    {{ core()->formatPrice($order->tax_amount, $order->order_currency_code) }}
+                </span>
+            </div>
+
+            <div style="font-weight: bold">
+                <span>{{ __('admin::app.mail.order.grand-total') }}</span>
+                <span style="float: right;">
+                    {{ core()->formatPrice($order->grand_total, $order->order_currency_code) }}
+                </span>
+            </div>
+        </div>
+
+        <div style="margin-top: 65px;font-size: 16px;color: #5E5E5E;line-height: 24px;display: inline-block">
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {{ __('admin::app.mail.order.final-summary') }}
+            </p>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {!! 
+                    __('admin::app.mail.order.help', [
+                        'support_email' => '<a style="color:#0041FF" href="mailto:' . config('mail.from.address') . '">' . config('mail.from.address'). '</a>'
+                        ]) 
+                !!}
+            </p>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {{ __('admin::app.mail.order.thanks') }}
+            </p>
+        </div>
+    </div>
+@endcomponent
diff --git a/packages/Webkul/Admin/src/Resources/views/emails/sales/new-shipment.blade.php b/packages/Webkul/Admin/src/Resources/views/emails/sales/new-shipment.blade.php
new file mode 100644
index 000000000..e0c8a77a6
--- /dev/null
+++ b/packages/Webkul/Admin/src/Resources/views/emails/sales/new-shipment.blade.php
@@ -0,0 +1,155 @@
+@component('admin::emails.layouts.master')
+    <div style="text-align: center;">
+        <a href="{{ config('app.url') }}">
+            <img src="{{ bagisto_asset('vendor/webkul/shop/assets/images/logo.svg') }}">
+        </a>
+    </div>
+
+    <?php $order = $shipment->order; ?>
+
+    <div style="padding: 30px;">
+        <div style="font-size: 20px;color: #242424;line-height: 30px;margin-bottom: 34px;">
+            <span style="font-weight: bold;">
+                {{ __('admin::app.mail.shipment.heading', ['order_id' => $order->id, 'shipment_id' => $shipment->id]) }}
+            </span> <br>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {{ __('admin::app.mail.order.dear', ['customer_name' => $order->customer_full_name]) }},
+            </p>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {!! __('admin::app.mail.order.greeting', [
+                    'order_id' => '<a href="' . route('customer.orders.view', $order->id) . '" style="color: #0041FF; font-weight: bold;">#' . $order->id . '</a>',
+                    'created_at' => $order->created_at
+                    ]) 
+                !!}
+            </p>
+        </div>
+
+        <div style="font-weight: bold;font-size: 20px;color: #242424;line-height: 30px;margin-bottom: 20px !important;">
+            {{ __('admin::app.mail.shipment.summary') }}
+        </div>
+
+        <div style="display: flex;flex-direction: row;margin-top: 20px;justify-content: space-between;margin-bottom: 40px;">
+            <div style="line-height: 25px;">
+                <div style="font-weight: bold;font-size: 16px;color: #242424;">
+                    {{ __('admin::app.mail.order.shipping-address') }}
+                </div>
+
+                <div>
+                    {{ $order->shipping_address->name }}
+                </div>
+
+                <div>
+                    {{ $order->shipping_address->address1 }}, {{ $order->shipping_address->address2 ? $order->shipping_address->address2 . ',' : '' }} {{ $order->shipping_address->state }}
+                </div>
+
+                <div>
+                    {{ country()->name($order->shipping_address->country) }} {{ $order->shipping_address->postcode }}
+                </div>
+
+                <div>---</div>
+
+                <div style="margin-bottom: 40px;">
+                    {{ __('admin::app.mail.order.contact') }} : {{ $order->shipping_address->phone }} 
+                </div>
+
+                <div style="font-size: 16px;color: #242424;">
+                    {{ __('admin::app.mail.order.shipping') }}
+                </div>
+
+                <div style="font-size: 16px;color: #242424;">
+                    <div style="font-weight: bold;">
+                        {{ $order->shipping_title }}
+                    </div>
+
+                    <div style="margin-top: 5px;">
+                        <span style="font-weight: bold;">{{ __('admin::app.mail.shipment.carrier') }} : </span>{{ $shipment->carrier_title }}
+                    </div>
+
+                    <div style="margin-top: 5px;">
+                        <span style="font-weight: bold;">{{ __('admin::app.mail.shipment.tracking-number') }} : </span>{{ $shipment->track_number }}
+                    </div>
+                </div>
+            </div>
+
+            <div style="line-height: 25px;">
+                <div style="font-weight: bold;font-size: 16px;color: #242424;">
+                    {{ __('admin::app.mail.order.billing-address') }}
+                </div>
+
+                <div>
+                    {{ $order->billing_address->name }}
+                </div>
+
+                <div>
+                    {{ $order->billing_address->address1 }}, {{ $order->billing_address->address2 ? $order->billing_address->address2 . ',' : '' }} {{ $order->billing_address->state }}
+                </div>
+
+                <div>
+                    {{ country()->name($order->billing_address->country) }} {{ $order->billing_address->postcode }}
+                </div>
+
+                <div>---</div>
+
+                <div style="margin-bottom: 40px;">
+                    {{ __('admin::app.mail.order.contact') }} : {{ $order->billing_address->phone }} 
+                </div>
+
+                <div style="font-size: 16px; color: #242424;">
+                    {{ __('admin::app.mail.order.payment') }}
+                </div>
+
+                <div style="font-weight: bold;font-size: 16px; color: #242424;">
+                    {{ core()->getConfigData('paymentmethods.' . $order->payment->method . '.title') }}
+                </div>
+            </div>
+        </div>
+
+        @foreach ($shipment->items as $item)
+            <div style="background: #FFFFFF;border: 1px solid #E8E8E8;border-radius: 3px;padding: 20px">
+                <p style="font-size: 18px;color: #242424;line-height: 24px;margin-top: 0;margin-bottom: 10px;font-weight: bold;">
+                    {{ $item->name }}
+                </p>
+
+                <div style="margin-bottom: 10px;">
+                    <label style="font-size: 16px;color: #5E5E5E;">
+                        {{ __('admin::app.mail.order.price') }}
+                    </label>
+                    <span style="font-size: 18px;color: #242424;margin-left: 40px;font-weight: bold;">
+                        {{ core()->formatPrice($item->price, $order->order_currency_code) }}
+                    </span>
+                </div>
+
+                <div style="margin-bottom: 10px;">
+                    <label style="font-size: 16px;color: #5E5E5E;">
+                        {{ __('admin::app.mail.order.quantity') }}
+                    </label>
+                    <span style="font-size: 18px;color: #242424;margin-left: 40px;font-weight: bold;">
+                        {{ $item->qty }}
+                    </span>
+                </div>
+                
+                <div style="">
+                    <label style="margin-top: 10px; font-size: 16px;color: #5E5E5E; display: block;">
+                        Color : Gray, Size  : S
+                    </label>
+                </div>
+            </div>
+        @endforeach
+
+        <div style="margin-top: 20px;font-size: 16px;color: #5E5E5E;line-height: 24px;display: inline-block;width: 100%">
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {!! 
+                    __('admin::app.mail.order.help', [
+                        'support_email' => '<a style="color:#0041FF" href="mailto:' . config('mail.from.address') . '">' . config('mail.from.address'). '</a>'
+                        ]) 
+                !!}
+            </p>
+
+            <p style="font-size: 16px;color: #5E5E5E;line-height: 24px;">
+                {{ __('admin::app.mail.order.thanks') }}
+            </p>
+        </div>
+    </div>
+@endcomponent
diff --git a/packages/Webkul/Admin/src/Resources/views/sales/invoices/view.blade.php b/packages/Webkul/Admin/src/Resources/views/sales/invoices/view.blade.php
index c1e9d5abe..9c90f8c52 100644
--- a/packages/Webkul/Admin/src/Resources/views/sales/invoices/view.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/sales/invoices/view.blade.php
@@ -5,6 +5,7 @@
 @stop
 
 @section('content-wrapper')
+
     <?php $order = $invoice->order; ?>
 
     <div class="content full-page">
diff --git a/packages/Webkul/Admin/src/Resources/views/settings/channels/index.blade.php b/packages/Webkul/Admin/src/Resources/views/settings/channels/index.blade.php
index 1efc98711..7c3d86efa 100644
--- a/packages/Webkul/Admin/src/Resources/views/settings/channels/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/settings/channels/index.blade.php
@@ -1,5 +1,9 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.settings.channels.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <div class="page-header">
diff --git a/packages/Webkul/Admin/src/Resources/views/settings/currencies/create.blade.php b/packages/Webkul/Admin/src/Resources/views/settings/currencies/create.blade.php
index cfd485e05..92285260b 100644
--- a/packages/Webkul/Admin/src/Resources/views/settings/currencies/create.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/settings/currencies/create.blade.php
@@ -1,5 +1,9 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.settings.currencies.add-title') }}
+@stop
+
 @section('content')
     <div class="content">
 
diff --git a/packages/Webkul/Admin/src/Resources/views/settings/currencies/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/settings/currencies/edit.blade.php
deleted file mode 100644
index f48910dfd..000000000
--- a/packages/Webkul/Admin/src/Resources/views/settings/currencies/edit.blade.php
+++ /dev/null
@@ -1,50 +0,0 @@
-@extends('admin::layouts.content')
-
-@section('content')
-    <div class="content">
-
-        <form method="POST" action="{{ route('admin.currencies.update', $currency->id) }}" @submit.prevent="onSubmit">
-            <div class="page-header">
-                <div class="page-title">
-                    <h1>{{ __('admin::app.settings.currencies.edit-title') }}</h1>
-                </div>
-
-                <div class="page-action">
-                    <button type="submit" class="btn btn-lg btn-primary">
-                        {{ __('admin::app.settings.currencies.save-btn-title') }}
-                    </button>
-                </div>
-            </div>
-
-            <div class="page-content">
-                <div class="form-container">
-                    @csrf()
-                    <input name="_method" type="hidden" value="PUT">
-
-                    <accordian :title="'{{ __('admin::app.settings.currencies.general') }}'" :active="true">
-                        <div slot="body">
-                            <div class="control-group" :class="[errors.has('code') ? 'has-error' : '']">
-                                <label for="code" class="required">{{ __('admin::app.settings.currencies.code') }}</label>
-                                <input v-validate="'required'" class="control" id="code" name="code" value="{{ old('code') ?: $currency->code }}" v-code/>
-                                <span class="control-error" v-if="errors.has('code')">@{{ errors.first('code') }}</span>
-                            </div>
-
-                            <div class="control-group" :class="[errors.has('name') ? 'has-error' : '']">
-                                <label for="name" class="required">{{ __('admin::app.settings.currencies.name') }}</label>
-                                <input v-validate="'required'" class="control" id="name" name="name" value="{{ old('name') ?: $currency->name }}"/>
-                                <span class="control-error" v-if="errors.has('name')">@{{ errors.first('name') }}</span>
-                            </div>
-
-                            <div class="control-group" :class="[errors.has('symbol') ? 'has-error' : '']">
-                                <label for="symbol" class="required">{{ __('admin::app.settings.currencies.symbol') }}</label>
-                                <input v-validate="'required'" class="control" id="symbol" name="symbol" value="{{ old('symbol') ?: $currency->symbol }}"/>
-                                <span class="control-error" v-if="errors.has('symbol')">@{{ errors.first('symbol') }}</span>
-                            </div>
-                        </div>
-                    </accordian>
-
-                </div>
-            </div>
-        </form>
-    </div>
-@stop
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Resources/views/settings/currencies/index.blade.php b/packages/Webkul/Admin/src/Resources/views/settings/currencies/index.blade.php
index f3f1c44f9..d526a473f 100644
--- a/packages/Webkul/Admin/src/Resources/views/settings/currencies/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/settings/currencies/index.blade.php
@@ -1,5 +1,9 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.settings.currencies.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <div class="page-header">
diff --git a/packages/Webkul/Admin/src/Resources/views/settings/exchange_rates/create.blade.php b/packages/Webkul/Admin/src/Resources/views/settings/exchange_rates/create.blade.php
index 06b3e7185..6672cdcf4 100644
--- a/packages/Webkul/Admin/src/Resources/views/settings/exchange_rates/create.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/settings/exchange_rates/create.blade.php
@@ -24,36 +24,49 @@
                 <div class="form-container">
                     @csrf()
 
-                    <accordian :title="'{{ __('admin::app.settings.exchange_rates.general') }}'" :active="true">
-                        <div slot="body">
-                            <div class="control-group" :class="[errors.has('source_currency') ? 'has-error' : '']">
-                                <label for="source_currency" class="required">{{ __('admin::app.settings.exchange_rates.source_currency') }}</label>
-                                <select v-validate="'required'" class="control" name="source_currency">
-                                    @foreach($currencies as $currency)
-                                        <option value="{{ $currency->id }}">{{ $currency->name }}</option>
-                                    @endforeach
-                                </select>
-                                <span class="control-error" v-if="errors.has('source_currency')">@{{ errors.first('source_currency') }}</span>
-                            </div>
+                    <div class="table">
+                        <table>
+                            <thead>
+                                <tr>
+                                    <th>
+                                        {{ __('admin::app.settings.exchange_rates.source_currency') }}
+                                    </th>
+                                    <th>
+                                        {{ __('admin::app.settings.exchange_rates.target_currency') }}
+                                    </th>
+                                    <th>
+                                        {{ __('admin::app.settings.exchange_rates.rate') }}
+                                    </th>
+                                </tr>
+                            </thead>
 
-                            <div class="control-group" :class="[errors.has('target_currency') ? 'has-error' : '']">
-                                <label for="target_currency" class="required">{{ __('admin::app.settings.exchange_rates.target_currency') }}</label>
-                                <select v-validate="'required'" class="control" name="target_currency">
-                                    @foreach($currencies as $currency)
-                                        <option value="{{ $currency->id }}">{{ $currency->name }}</option>
-                                    @endforeach
-                                </select> 
-                                <span class="control-error" v-if="errors.has('target_currency')">@{{ errors.first('target_currency') }}</span>
-                            </div>
-
-                            <div class="control-group" :class="[errors.has('ratio') ? 'has-error' : '']">
-                                <label for="ratio" class="required">{{ __('admin::app.settings.exchange_rates.ratio') }}</label>
-                                <input v-validate="'required'" class="control" id="ratio" name="ratio" value="{{ old('ratio') }}"/>
-                                <span class="control-error" v-if="errors.has('ratio')">@{{ errors.first('ratio') }}</span>
-                            </div>
-                        </div>
-                    </accordian>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        {{ core()->getBaseCurrencyCode() }}
+                                    </td>
 
+                                    <td>
+                                        <div class="control-group" :class="[errors.has('target_currency') ? 'has-error' : '']">
+                                            <select v-validate="'required'" class="control" name="target_currency">
+                                                @foreach($currencies as $currency)
+                                                    <option value="{{ $currency->id }}">{{ $currency->name }}</option>
+                                                @endforeach
+                                            </select> 
+                                            <span class="control-error" v-if="errors.has('target_currency')">@{{ errors.first('target_currency') }}</span>
+                                        </div>
+                                    </td>
+                                    
+                                    <td>
+                                        <div class="control-group" :class="[errors.has('rate') ? 'has-error' : '']">
+                                            <input v-validate="'required'" class="control" id="rate" name="rate" value="{{ old('rate') }}"/>
+                                            <span class="control-error" v-if="errors.has('rate')">@{{ errors.first('rate') }}</span>
+                                        </div>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
                 </div>
             </div>
         </form>
diff --git a/packages/Webkul/Admin/src/Resources/views/settings/exchange_rates/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/settings/exchange_rates/edit.blade.php
index b59f4aef2..ca1f3620b 100644
--- a/packages/Webkul/Admin/src/Resources/views/settings/exchange_rates/edit.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/settings/exchange_rates/edit.blade.php
@@ -25,39 +25,51 @@
                     @csrf()
                     <input name="_method" type="hidden" value="PUT">
 
-                    <accordian :title="'{{ __('admin::app.settings.exchange_rates.general') }}'" :active="true">
-                        <div slot="body">
-                            <div class="control-group" :class="[errors.has('source_currency') ? 'has-error' : '']">
-                                <label for="source_currency" class="required">{{ __('admin::app.settings.exchange_rates.source_currency') }}</label>
-                                <select v-validate="'required'" class="control" name="source_currency">
-                                    @foreach($currencies as $currency)
-                                        <option value="{{ $currency->id }}" {{ $exchangeRate->source_currency == $currency->id ? 'selected' : '' }}>
-                                            {{ $currency->name }}
-                                        </option>
-                                    @endforeach
-                                </select>
-                                <span class="control-error" v-if="errors.has('source_currency')">@{{ errors.first('source_currency') }}</span>
-                            </div>
+                    <div class="table">
+                        <table>
+                            <thead>
+                                <tr>
+                                    <th>
+                                        {{ __('admin::app.settings.exchange_rates.source_currency') }}
+                                    </th>
+                                    <th>
+                                        {{ __('admin::app.settings.exchange_rates.target_currency') }}
+                                    </th>
+                                    <th>
+                                        {{ __('admin::app.settings.exchange_rates.rate') }}
+                                    </th>
+                                </tr>
+                            </thead>
 
-                            <div class="control-group" :class="[errors.has('target_currency') ? 'has-error' : '']">
-                                <label for="target_currency" class="required">{{ __('admin::app.settings.exchange_rates.target_currency') }}</label>
-                                <select v-validate="'required'" class="control" name="target_currency">
-                                    @foreach($currencies as $currency)
-                                        <option value="{{ $currency->id }}" {{ $exchangeRate->target_currency == $currency->id ? 'selected' : '' }}>
-                                            {{ $currency->name }}
-                                        </option>
-                                    @endforeach
-                                </select>
-                                <span class="control-error" v-if="errors.has('target_currency')">@{{ errors.first('target_currency') }}</span>
-                            </div>
+                            <tbody>
+                                <tr>
+                                    <td>
+                                        {{ core()->getBaseCurrencyCode() }}
+                                    </td>
 
-                            <div class="control-group" :class="[errors.has('ratio') ? 'has-error' : '']">
-                                <label for="ratio" class="required">{{ __('admin::app.settings.exchange_rates.ratio') }}</label>
-                                <input v-validate="'required'" class="control" id="ratio" name="ratio" value="{{ old('ratio') ?: $exchangeRate->ratio }}"/>
-                                <span class="control-error" v-if="errors.has('ratio')">@{{ errors.first('ratio') }}</span>
-                            </div>
-                        </div>
-                    </accordian>
+                                    <td>
+                                        <div class="control-group" :class="[errors.has('target_currency') ? 'has-error' : '']">
+                                            <select v-validate="'required'" class="control" name="target_currency">
+                                                @foreach($currencies as $currency)
+                                                    <option value="{{ $currency->id }}" {{ $exchangeRate->target_currency == $currency->id ? 'selected' : '' }}>
+                                                        {{ $currency->name }}
+                                                    </option>
+                                                @endforeach
+                                            </select>
+                                            <span class="control-error" v-if="errors.has('target_currency')">@{{ errors.first('target_currency') }}</span>
+                                        </div>
+                                    </td>
+
+                                    <td>
+                                        <div class="control-group" :class="[errors.has('ratio') ? 'has-error' : '']">
+                                            <input v-validate="'required'" class="control" id="ratio" name="ratio" value="{{ old('ratio') ?: $exchangeRate->ratio }}"/>
+                                            <span class="control-error" v-if="errors.has('ratio')">@{{ errors.first('ratio') }}</span>
+                                        </div>
+                                    </td>
+                                <tr>
+                            </tbody>
+                        </table>
+                    </div>
 
                 </div>
             </div>
diff --git a/packages/Webkul/Admin/src/Resources/views/settings/locales/index.blade.php b/packages/Webkul/Admin/src/Resources/views/settings/locales/index.blade.php
index 198a3ebd5..0e1a5030d 100644
--- a/packages/Webkul/Admin/src/Resources/views/settings/locales/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/settings/locales/index.blade.php
@@ -1,5 +1,9 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.settings.locales.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <div class="page-header">
diff --git a/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/create.blade.php b/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/create.blade.php
index e2b76362a..57d9f33de 100644
--- a/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/create.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/create.blade.php
@@ -1,7 +1,7 @@
 @extends('admin::layouts.content')
 
 @section('page_title')
-    {{ __('admin::app.configuration.tax-categories.title') }}
+    {{ __('admin::app.configuration.tax-categories.add-title') }}
 @stop
 
 @section('content')
@@ -9,7 +9,7 @@
         <form method="POST" action="{{ route('admin.tax-categories.create') }}" @submit.prevent="onSubmit">
             <div class="page-header">
                 <div class="page-title">
-                    <h1>{{ __('admin::app.configuration.tax-categories.title') }}</h1>
+                    <h1>{{ __('admin::app.configuration.tax-categories.add-title') }}</h1>
                 </div>
 
                 <div class="page-action">
diff --git a/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/edit.blade.php
index 0ea878799..c24d9aab5 100644
--- a/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/edit.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/edit.blade.php
@@ -6,7 +6,7 @@
 
 @section('content')
     <div class="content">
-        <form method="POST" action="{{ route('admin.tax-categories.update', $data[0][0]['id']) }}" @submit.prevent="onSubmit">
+        <form method="POST" action="{{ route('admin.tax-categories.update', $taxCategory->id) }}" @submit.prevent="onSubmit">
             <div class="page-header">
                 <div class="page-title">
                     <h1>{{ __('admin::app.configuration.tax-categories.edit.title') }}</h1>
@@ -32,7 +32,7 @@
                                 <select class="control" name="channel">
                                     @foreach(core()->getAllChannels() as $channelModel)
 
-                                        <option @if($data[0][0]['channel_id'] == $channelModel->id) selected @endif value="{{ $channelModel->id }}">
+                                        <option @if($taxCategory->channel_id == $channelModel->id) selected @endif value="{{ $channelModel->id }}">
                                             {{ $channelModel->name }}
                                         </option>
 
@@ -45,7 +45,7 @@
                             <div class="control-group" :class="[errors.has('code') ? 'has-error' : '']">
                                 <label for="code" class="required">{{ __('admin::app.configuration.tax-categories.code') }}</label>
 
-                                <input v-validate="'required'" class="control" id="code" name="code" value="{{ $data[0][0]['code'] }}"/>
+                                <input v-validate="'required'" class="control" id="code" name="code" value="{{ $taxCategory->code }}"/>
 
                                 <span class="control-error" v-if="errors.has('code')">@{{ errors.first('code') }}</span>
                             </div>
@@ -53,7 +53,7 @@
                             <div class="control-group" :class="[errors.has('name') ? 'has-error' : '']">
                                 <label for="name" class="required">{{ __('admin::app.configuration.tax-categories.name') }}</label>
 
-                                <input v-validate="'required'" class="control" id="name" name="name" value="{{ $data[0][0]['name'] }}"/>
+                                <input v-validate="'required'" class="control" id="name" name="name" value="{{ $taxCategory->name }}"/>
 
                                 <span class="control-error" v-if="errors.has('name')">@{{ errors.first('name') }}</span>
                             </div>
@@ -61,7 +61,7 @@
                             <div class="control-group" :class="[errors.has('description') ? 'has-error' : '']">
                                 <label for="description" class="required">{{ __('admin::app.configuration.tax-categories.description') }}</label>
 
-                                <textarea v-validate="'required'" class="control" id="description" name="description">{{ $data[0][0]['description'] }}</textarea>
+                                <textarea v-validate="'required'" class="control" id="description" name="description">{{ $taxCategory->description }}</textarea>
 
                                 <span class="control-error" v-if="errors.has('description')">@{{ errors.first('description') }}</span>
                             </div>
@@ -74,12 +74,7 @@
                                 <select multiple="multiple" class="control" id="taxrates" name="taxrates[]" v-validate="'required'">
                                     @foreach($taxRates->all() as $taxRate)
 
-                                        <option value="{{ $taxRate->id }}"
-                                        @foreach($data[1] as $selectedRate)
-                                            @if($taxRate->id == $selectedRate['id'])
-                                                selected
-                                            @endif
-                                        @endforeach>
+                                        <option value="{{ $taxRate->id }}" {{ is_numeric($taxCategory->pluck('id')->search($taxRate->id)) ? 'selected' : '' }}>
                                             {{ $taxRate->identifier }}
                                         </option>
 
diff --git a/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/index.blade.php b/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/index.blade.php
index 6e0abe990..d482a2238 100644
--- a/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/tax/tax-categories/index.blade.php
@@ -1,21 +1,25 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.configuration.tax-categories.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <div class="page-header">
             <div class="page-title">
-                <h1>{{ __('admin::app.configuration.tax.title') }}</h1>
+                <h1>{{ __('admin::app.configuration.tax-categories.title') }}</h1>
             </div>
 
             <div class="page-action">
                 <a href="{{ route('admin.tax-categories.show') }}" class="btn btn-lg btn-primary">
-                    {{ __('admin::app.configuration.tax.add-title') }}
+                    {{ __('admin::app.configuration.tax-categories.add-title') }}
                 </a>
             </div>
         </div>
 
         <div class="page-content">
-            @inject('taxCategories','Webkul\Admin\DataGrids\TaxRuleDataGrid')
+            @inject('taxCategories','Webkul\Admin\DataGrids\TaxCategoryDataGrid')
             {!! $taxCategories->render() !!}
         </div>
     </div>
diff --git a/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/create.blade.php b/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/create.blade.php
index 75830cfc2..522495117 100644
--- a/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/create.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/create.blade.php
@@ -1,7 +1,7 @@
 @extends('admin::layouts.content')
 
 @section('page_title')
-    {{ __('admin::app.configuration.tax-rates.title') }}
+    {{ __('admin::app.configuration.tax-rates.add-title') }}
 @stop
 
 @section('content')
@@ -9,7 +9,7 @@
         <form method="POST" action="{{ route('admin.tax-rates.create') }}" @submit.prevent="onSubmit">
             <div class="page-header">
                 <div class="page-title">
-                    <h1>{{ __('admin::app.configuration.tax-rates.title') }}</h1>
+                    <h1>{{ __('admin::app.configuration.tax-rates.add-title') }}</h1>
                 </div>
 
                 <div class="page-action">
diff --git a/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/edit.blade.php b/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/edit.blade.php
index 8bd7ffd6c..8ea19a745 100644
--- a/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/edit.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/edit.blade.php
@@ -1,7 +1,7 @@
 @extends('admin::layouts.content')
 
 @section('page_title')
-    {{ __('admin::app.configuration.tax-rates.title') }}
+    {{ __('admin::app.configuration.tax-rates.edit-title') }}
 @stop
 
 @section('content')
diff --git a/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/index.blade.php b/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/index.blade.php
index aa9d6fd38..413037f46 100644
--- a/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/tax/tax-rates/index.blade.php
@@ -13,7 +13,7 @@
 
             <div class="page-action">
                 <a href="{{ route('admin.tax-rates.show') }}" class="btn btn-lg btn-primary">
-                    {{ __('admin::app.configuration.tax-rates.title') }}
+                    {{ __('admin::app.configuration.tax-rates.add-title') }}
                 </a>
             </div>
         </div>
diff --git a/packages/Webkul/Admin/src/Resources/views/users/roles/index.blade.php b/packages/Webkul/Admin/src/Resources/views/users/roles/index.blade.php
index 5dd7de322..5c4c50331 100644
--- a/packages/Webkul/Admin/src/Resources/views/users/roles/index.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/users/roles/index.blade.php
@@ -1,5 +1,9 @@
 @extends('admin::layouts.content')
 
+@section('page_title')
+    {{ __('admin::app.users.roles.title') }}
+@stop
+
 @section('content')
     <div class="content">
         <div class="page-header">
diff --git a/packages/Webkul/Attribute/src/Database/Seeders/AttributeTableSeeder.php b/packages/Webkul/Attribute/src/Database/Seeders/AttributeTableSeeder.php
index 368e15cd1..2968c37c4 100644
--- a/packages/Webkul/Attribute/src/Database/Seeders/AttributeTableSeeder.php
+++ b/packages/Webkul/Attribute/src/Database/Seeders/AttributeTableSeeder.php
@@ -164,7 +164,7 @@ class AttributeTableSeeder extends Seeder
             'position' => 11,
             'is_required' => 1,
             'value_per_locale' => 0,
-            'value_per_channel' => 1,
+            'value_per_channel' => 0,
             'is_filterable' => 1,
             'is_configurable' => 0,
             'is_user_defined' => 0
@@ -192,7 +192,7 @@ class AttributeTableSeeder extends Seeder
             'position' => 13,
             'is_required' => 0,
             'value_per_locale' => 0,
-            'value_per_channel' => 1,
+            'value_per_channel' => 0,
             'is_filterable' => 0,
             'is_configurable' => 0,
             'is_user_defined' => 0
diff --git a/packages/Webkul/Attribute/src/Http/Controllers/AttributeController.php b/packages/Webkul/Attribute/src/Http/Controllers/AttributeController.php
index 6082d60d4..12f6cc6d2 100644
--- a/packages/Webkul/Attribute/src/Http/Controllers/AttributeController.php
+++ b/packages/Webkul/Attribute/src/Http/Controllers/AttributeController.php
@@ -127,6 +127,16 @@ class AttributeController extends Controller
      */
     public function destroy($id)
     {
-        //
+        $attribute = $this->attribute->findOrFail($id);
+         
+        if(!$attribute->is_user_defined) {
+            session()->flash('error', 'Can not delete system attribute.');
+        } else {
+            $this->attribute->delete($id);
+
+            session()->flash('success', 'Attribute deleted successfully.');
+        }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Attribute/src/Http/Controllers/AttributeFamilyController.php b/packages/Webkul/Attribute/src/Http/Controllers/AttributeFamilyController.php
index 6fdd0eb9c..9063660d8 100644
--- a/packages/Webkul/Attribute/src/Http/Controllers/AttributeFamilyController.php
+++ b/packages/Webkul/Attribute/src/Http/Controllers/AttributeFamilyController.php
@@ -135,6 +135,14 @@ class AttributeFamilyController extends Controller
      */
     public function destroy($id)
     {
-        //
+        if($this->attributeFamily->count() == 1) {
+            session()->flash('error', 'At least one family is required.');
+        } else {
+            $this->attributeFamily->delete($id);
+
+            session()->flash('success', 'Family deleted successfully.');
+        }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Attribute/src/Providers/AttributeServiceProvider.php b/packages/Webkul/Attribute/src/Providers/AttributeServiceProvider.php
index f23d9b830..db34691de 100644
--- a/packages/Webkul/Attribute/src/Providers/AttributeServiceProvider.php
+++ b/packages/Webkul/Attribute/src/Providers/AttributeServiceProvider.php
@@ -4,7 +4,6 @@ namespace Webkul\Attribute\Providers;
 
 use Illuminate\Support\ServiceProvider;
 use Illuminate\Routing\Router;
-use Webkul\User\Http\Middleware\RedirectIfNotAdmin;
 
 class AttributeServiceProvider extends ServiceProvider
 {
@@ -15,8 +14,6 @@ class AttributeServiceProvider extends ServiceProvider
      */
     public function boot(Router $router)
     {
-        $router->aliasMiddleware('admin', RedirectIfNotAdmin::class);
-
         $this->loadMigrationsFrom(__DIR__ . '/../Database/Migrations');
     }
 
diff --git a/packages/Webkul/Category/src/Http/Controllers/CategoryController.php b/packages/Webkul/Category/src/Http/Controllers/CategoryController.php
index da1d28cf5..86b1bca1e 100644
--- a/packages/Webkul/Category/src/Http/Controllers/CategoryController.php
+++ b/packages/Webkul/Category/src/Http/Controllers/CategoryController.php
@@ -133,6 +133,6 @@ class CategoryController extends Controller
      */
     public function destroy($id)
     {
-        //
+        $this->category->delete($id);
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Category/src/Providers/CategoryServiceProvider.php b/packages/Webkul/Category/src/Providers/CategoryServiceProvider.php
index fe9c0d086..73637d61a 100644
--- a/packages/Webkul/Category/src/Providers/CategoryServiceProvider.php
+++ b/packages/Webkul/Category/src/Providers/CategoryServiceProvider.php
@@ -5,7 +5,6 @@ namespace Webkul\Category\Providers;
 use Illuminate\Support\ServiceProvider;
 use Illuminate\Foundation\AliasLoader;
 use Illuminate\Routing\Router;
-use Webkul\User\Http\Middleware\RedirectIfNotAdmin;
 
 class CategoryServiceProvider extends ServiceProvider
 {
@@ -16,8 +15,6 @@ class CategoryServiceProvider extends ServiceProvider
      */
     public function boot(Router $router)
     {
-        $router->aliasMiddleware('admin', RedirectIfNotAdmin::class);
-
         $this->loadMigrationsFrom(__DIR__ . '/../Database/Migrations');
     }
 
diff --git a/packages/Webkul/Checkout/src/Cart.php b/packages/Webkul/Checkout/src/Cart.php
index 287b5cecc..eebafe9b8 100644
--- a/packages/Webkul/Checkout/src/Cart.php
+++ b/packages/Webkul/Checkout/src/Cart.php
@@ -300,8 +300,8 @@ class Cart {
         //set the currency column with the respective currency
         $cartData['global_currency_code'] = core()->getBaseCurrencyCode();
         $cartData['base_currency_code'] = core()->getBaseCurrencyCode();
-        $cartData['channel_currency_code'] = core()->getBaseCurrencyCode();
-        $cartData['cart_currency_code'] = core()->getBaseCurrencyCode();
+        $cartData['channel_currency_code'] = core()->getChannelBaseCurrencyCode();
+        $cartData['cart_currency_code'] = core()->getCurrentCurrencyCode();
         //set the cart items and quantity
         $cartData['items_count'] = 1;
         $cartData['items_qty'] = $data['quantity'];
diff --git a/packages/Webkul/Checkout/src/Http/ViewComposers/CartComposer.php b/packages/Webkul/Checkout/src/Http/ViewComposers/CartComposer.php
index c301b0a8d..ffd56c398 100644
--- a/packages/Webkul/Checkout/src/Http/ViewComposers/CartComposer.php
+++ b/packages/Webkul/Checkout/src/Http/ViewComposers/CartComposer.php
@@ -9,7 +9,7 @@ use Webkul\Checkout\Repositories\CartRepository;
 use Webkul\Checkout\Repositories\CartItemRepository;
 
 //Product Image Helper Class
-use Webkul\Product\Product\ProductImage;
+use Webkul\Product\Helpers\ProductImage;
 
 use Cart;
 
diff --git a/packages/Webkul/Checkout/src/Providers/CheckoutServiceProvider.php b/packages/Webkul/Checkout/src/Providers/CheckoutServiceProvider.php
index 76568ab9c..0a56d3cbe 100644
--- a/packages/Webkul/Checkout/src/Providers/CheckoutServiceProvider.php
+++ b/packages/Webkul/Checkout/src/Providers/CheckoutServiceProvider.php
@@ -6,7 +6,6 @@ use Illuminate\Support\ServiceProvider;
 use Illuminate\Support\Facades\Validator;
 use Illuminate\Routing\Router;
 use Illuminate\Foundation\AliasLoader;
-use Webkul\User\Http\Middleware\RedirectIfNotAdmin;
 use Webkul\Customer\Http\Middleware\RedirectIfNotCustomer;
 use Webkul\Checkout\Facades\Cart;
 use Webkul\Checkout\Providers\ComposerServiceProvider;
@@ -19,10 +18,6 @@ class CheckoutServiceProvider extends ServiceProvider
         include __DIR__ . '/../Http/helpers.php';
 
         $this->loadMigrationsFrom(__DIR__ . '/../Database/Migrations');
-
-        $router->aliasMiddleware('admin', RedirectIfNotAdmin::class);
-
-        $router->aliasMiddleware('customer', RedirectIfNotCustomer::class);
     }
 
     /**
diff --git a/packages/Webkul/Core/src/Core.php b/packages/Webkul/Core/src/Core.php
index b42c35fb6..b158e4602 100644
--- a/packages/Webkul/Core/src/Core.php
+++ b/packages/Webkul/Core/src/Core.php
@@ -3,63 +3,80 @@
 namespace Webkul\Core;
 
 use Carbon\Carbon;
-use Webkul\Core\Models\Channel as ChannelModel;
-use Webkul\Core\Models\Locale as LocaleModel;
-use Webkul\Core\Models\Currency as CurrencyModel;
-use Webkul\Core\Models\TaxCategory as TaxCategory;
-use Webkul\Core\Models\TaxRate as TaxRate;
 use Webkul\Core\Repositories\CurrencyRepository;
 use Webkul\Core\Repositories\ExchangeRateRepository;
 use Webkul\Core\Repositories\CountryRepository;
 use Webkul\Core\Repositories\CountryStateRepository;
+use Webkul\Core\Repositories\ChannelRepository;
+use Webkul\Core\Repositories\LocaleRepository;
 use Illuminate\Support\Facades\Config;
 
 class Core
 {
     /**
-     * CurrencyRepository model
+     * ChannelRepository class
+     *
+     * @var mixed
+     */
+    protected $channelRepository;
+
+    /**
+     * CurrencyRepository class
      *
      * @var mixed
      */
     protected $currencyRepository;
 
     /**
-     * ExchangeRateRepository model
+     * ExchangeRateRepository class
      *
      * @var mixed
      */
     protected $exchangeRateRepository;
 
     /**
-     * CountryRepository model
+     * CountryRepository class
      *
      * @var mixed
      */
     protected $countryRepository;
 
     /**
-     * CountryStateRepository model
+     * CountryStateRepository class
      *
      * @var mixed
      */
     protected $countryStateRepository;
 
+    /**
+     * LocaleRepository class
+     *
+     * @var mixed
+     */
+    protected $localeRepository;
+
     /**
      * Create a new instance.
      *
+     * @param  Webkul\Core\Repositories\ChannelRepository      $channelRepository
      * @param  Webkul\Core\Repositories\CurrencyRepository     $currencyRepository
      * @param  Webkul\Core\Repositories\ExchangeRateRepository $exchangeRateRepository
      * @param  Webkul\Core\Repositories\CountryRepository      $countryRepository
      * @param  Webkul\Core\Repositories\CountryStateRepository $countryStateRepository
+     * @param  Webkul\Core\Repositories\LocaleRepository       $localeRepository
      * @return void
      */
     public function __construct(
+        ChannelRepository $channelRepository,
         CurrencyRepository $currencyRepository,
         ExchangeRateRepository $exchangeRateRepository,
         CountryRepository $countryRepository,
-        CountryStateRepository $countryStateRepository
+        CountryStateRepository $countryStateRepository,
+        LocaleRepository $localeRepository
     )
     {
+        $this->channelRepository = $channelRepository;
+
         $this->currencyRepository = $currencyRepository;
 
         $this->exchangeRateRepository = $exchangeRateRepository;
@@ -67,6 +84,8 @@ class Core
         $this->countryRepository = $countryRepository;
 
         $this->countryStateRepository = $countryStateRepository;
+
+        $this->localeRepository = $localeRepository;
     }
 
     /**
@@ -80,7 +99,7 @@ class Core
         if($channels)
             return $channels;
 
-        return $channels = ChannelModel::all();
+        return $channels = $this->channelRepository->all();
     }
 
     /**
@@ -94,7 +113,7 @@ class Core
         if($channel)
             return $channel;
 
-        return $channel = ChannelModel::first();
+        return $channel = $this->channelRepository->first();
     }
 
     /**
@@ -122,7 +141,7 @@ class Core
         if($channel)
             return $channel;
 
-        return $channel = ChannelModel::first();
+        return $channel = $this->channelRepository->first();
     }
 
     /**
@@ -150,7 +169,7 @@ class Core
         if($locales)
             return $locales;
 
-        return $locales = LocaleModel::all();
+        return $locales = $this->localeRepository->all();
     }
 
     /**
@@ -165,7 +184,7 @@ class Core
         if($currencies)
             return $currencies;
 
-        return $currencies = CurrencyModel::all();
+        return $currencies = $this->currencyRepository->all();
     }
 
     /**
@@ -180,9 +199,12 @@ class Core
         if($currency)
             return $currency;
 
-        $currenctChannel = $this->getCurrentChannel();
+        $baseCurrency = $this->currencyRepository->findOneByField('code', config('app.currency'));
 
-        return $currency = $currenctChannel->base_currency;
+        if(!$baseCurrency)
+            $baseCurrency = $this->currencyRepository->first();
+
+        return $currency = $baseCurrency;
     }
 
     /**
@@ -212,7 +234,54 @@ class Core
         if($currencySymbol)
             return $currencySymbol;
 
-        return $currencySymbol = $this->getCurrentCurrency()->symbol;
+        return $currencySymbol = $this->getBaseCurrency()->symbol ?? $this->getBaseCurrencyCode();
+    }
+
+    /**
+    * Returns base channel's currency model
+    *
+    *  @return mixed
+    */
+    public function getChannelBaseCurrency()
+    {
+        static $currency;
+
+        if($currency)
+            return $currency;
+
+        $currenctChannel = $this->getCurrentChannel();
+
+        return $currency = $currenctChannel->base_currency;
+    }
+
+    /**
+    * Returns base channel's currency code
+    *
+    *  @return string
+    */
+    public function getChannelBaseCurrencyCode()
+    {
+        static $currencyCode;
+
+        if($currencyCode)
+            return $currencyCode;
+
+        return ($currency = $this->getChannelBaseCurrency()) ? $currencyCode = $currency->code : '';
+    }
+
+    /**
+    * Returns base channel's currency symbol
+    *
+    *  @return string
+    */
+    public function getChannelBaseCurrencySymbol()
+    {
+        static $currencySymbol;
+
+        if($currencySymbol)
+            return $currencySymbol;
+
+        return $currencySymbol = $this->getChannelBaseCurrency()->symbol;
     }
 
     /**
@@ -227,7 +296,7 @@ class Core
         if($currency)
             return $currency;
 
-        return $currency = CurrencyModel::first();
+        return $currency = $this->currencyRepository->first();
     }
 
     /**
@@ -261,39 +330,29 @@ class Core
     }
 
     /**
-    * Convert price with currency symbol
+    * Converts price
     *
-    * @param float $price
-    *  @return string
+    * @param float  $price
+    * @param string $targetCurrencyCode
+    * @return string
     */
-    public function convertPrice($amount, $sourceCurrencyCode = null, $targetCurrencyCode = null)
+    public function convertPrice($amount, $targetCurrencyCode = null)
     {
-        $sourceCurrency = !$sourceCurrencyCode
-                        ? $this->getBaseCurrency()
-                        : $this->currencyRepository->findByField('code', $sourceCurrencyCode);
-
         $targetCurrency = !$targetCurrencyCode
                         ? $this->getCurrentCurrency()
                         : $this->currencyRepository->findByField('code', $targetCurrencyCode);
 
-        if(!$sourceCurrency || !$sourceCurrency)
-            return $amount;
-
-        if ($sourceCurrency->code === $targetCurrency->code)
+        if(!$targetCurrency)
             return $amount;
 
         $exchangeRate = $this->exchangeRateRepository->findOneWhere([
-            'source_currency' => $sourceCurrency->id,
             'target_currency' => $targetCurrency->id,
         ]);
 
         if (null === $exchangeRate)
             return $amount;
 
-        if ($exchangeRate->source_currency->code === $sourceCurrencyCode)
-            return (float) round($amount * $exchangeRate->ratio);
-
-        return (float) round($amount / $exchangeRate->ratio);
+        return (float) round($amount * $exchangeRate->rate);
     }
 
     /**
@@ -406,27 +465,6 @@ class Core
         return preg_replace('#[ 0:-]#', '', $date) === '';
     }
 
-    // $timezonelist = \DateTimeZone::listIdentifiers(\DateTimeZone::ALL);
-
-    /**
-     * Find all the tax rates associated with a tax category.
-     *
-     * @return Array
-     */
-
-    public function withRates($id) {
-        return TaxCategory::findOrFail($id)->tax_rates;
-    }
-
-    /**
-     * To fetch all tax rates.
-     *
-     * @return Collection
-     */
-    public function getAllTaxRates() {
-        return TaxRate::all();
-    }
-
     /**
      * Format date using current channel.
      *
diff --git a/packages/Webkul/Core/src/Database/Migrations/2018_07_20_054542_create_currency_exchange_rates_table.php b/packages/Webkul/Core/src/Database/Migrations/2018_07_20_054542_create_currency_exchange_rates_table.php
index 4dc944fc3..420fb7a93 100644
--- a/packages/Webkul/Core/src/Database/Migrations/2018_07_20_054542_create_currency_exchange_rates_table.php
+++ b/packages/Webkul/Core/src/Database/Migrations/2018_07_20_054542_create_currency_exchange_rates_table.php
@@ -15,10 +15,9 @@ class CreateCurrencyExchangeRatesTable extends Migration
     {
         Schema::create('currency_exchange_rates', function (Blueprint $table) {
             $table->increments('id');
-            $table->integer('source_currency')->unsigned();
+            $table->decimal('rate', 10, 5);
+            
             $table->integer('target_currency')->unsigned();
-            $table->decimal('ratio', 10, 5);
-            $table->foreign('source_currency')->references('id')->on('currencies')->onDelete('cascade');
             $table->foreign('target_currency')->references('id')->on('currencies')->onDelete('cascade');
             $table->timestamps();
         });
diff --git a/packages/Webkul/Core/src/Eloquent/Repository.php b/packages/Webkul/Core/src/Eloquent/Repository.php
index 9d92bbabe..07d2d7401 100644
--- a/packages/Webkul/Core/src/Eloquent/Repository.php
+++ b/packages/Webkul/Core/src/Eloquent/Repository.php
@@ -82,6 +82,14 @@ abstract class Repository extends BaseRepository {
         return $this->parserResult($model);
     }
 
+    /**
+     * @return mixed
+     */
+    public function count()
+    {
+        return $this->model->count();
+    }
+
     /**
      * @return mixed
      */
diff --git a/packages/Webkul/Core/src/Http/Controllers/ChannelController.php b/packages/Webkul/Core/src/Http/Controllers/ChannelController.php
index 41a9590af..cdbb7d48b 100644
--- a/packages/Webkul/Core/src/Http/Controllers/ChannelController.php
+++ b/packages/Webkul/Core/src/Http/Controllers/ChannelController.php
@@ -133,6 +133,14 @@ class ChannelController extends Controller
      */
     public function destroy($id)
     {
-        //
+        if($this->channel->count() == 1) {
+            session()->flash('error', 'At least one channel is required.');
+        } else {
+            $this->channel->delete($id);
+
+            session()->flash('success', 'Channel deleted successfully.');
+        }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Core/src/Http/Controllers/CurrencyController.php b/packages/Webkul/Core/src/Http/Controllers/CurrencyController.php
index b8b106cf9..3c41908a2 100644
--- a/packages/Webkul/Core/src/Http/Controllers/CurrencyController.php
+++ b/packages/Webkul/Core/src/Http/Controllers/CurrencyController.php
@@ -92,6 +92,14 @@ class CurrencyController extends Controller
      */
     public function destroy($id)
     {
-        //
+        if($this->currency->count() == 1) {
+            session()->flash('error', 'At least one currency is required.');
+        } else {
+            $this->currency->delete($id);
+
+            session()->flash('success', 'Currency deleted successfully.');
+        }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Core/src/Http/Controllers/ExchangeRateController.php b/packages/Webkul/Core/src/Http/Controllers/ExchangeRateController.php
index 57c47d4e5..11e8ab49b 100644
--- a/packages/Webkul/Core/src/Http/Controllers/ExchangeRateController.php
+++ b/packages/Webkul/Core/src/Http/Controllers/ExchangeRateController.php
@@ -84,15 +84,9 @@ class ExchangeRateController extends Controller
      */
     public function store(Request $request)
     {
-        $sourceCurrency = request()->get('source_currency');
         $this->validate(request(), [
-            'source_currency' => 'required',
-            'target_currency' => ['required', function ($attribute, $value, $fail) use ($sourceCurrency) {
-                if ($value == $sourceCurrency) {
-                    $fail('The :attribute value should be different from source currency.');
-                }
-            }],
-            'ratio' => 'required|numeric'
+            'target_currency' => 'required',
+            'rate' => 'required|numeric'
         ]);
 
         $this->exchangeRate->create(request()->all());
@@ -127,7 +121,6 @@ class ExchangeRateController extends Controller
     public function update(Request $request, $id)
     {
         $this->validate(request(), [
-            'source_currency' => 'required',
             'target_currency' => 'required',
             'ratio' => 'required|numeric'
         ]);
@@ -147,6 +140,6 @@ class ExchangeRateController extends Controller
      */
     public function destroy($id)
     {
-        //
+        $this->exchangeRate->delete($id);
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Core/src/Http/Controllers/LocaleController.php b/packages/Webkul/Core/src/Http/Controllers/LocaleController.php
index 015b3334f..2cbf71847 100644
--- a/packages/Webkul/Core/src/Http/Controllers/LocaleController.php
+++ b/packages/Webkul/Core/src/Http/Controllers/LocaleController.php
@@ -91,6 +91,14 @@ class LocaleController extends Controller
      */
     public function destroy($id)
     {
-        //
+        if($this->locale->count() == 1) {
+            session()->flash('error', 'At least one locale is required.');
+        } else {
+            $this->locale->delete($id);
+
+            session()->flash('success', 'Locale deleted successfully.');
+        }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Core/src/Models/CurrencyExchangeRate.php b/packages/Webkul/Core/src/Models/CurrencyExchangeRate.php
index 2ad83b9a1..0bf84d707 100644
--- a/packages/Webkul/Core/src/Models/CurrencyExchangeRate.php
+++ b/packages/Webkul/Core/src/Models/CurrencyExchangeRate.php
@@ -12,6 +12,6 @@ class CurrencyExchangeRate extends Model
      * @var array
      */
     protected $fillable = [
-        'source_currency', 'target_currency', 'ratio'
+        'target_currency', 'rate'
     ];
 }
\ No newline at end of file
diff --git a/packages/Webkul/Core/src/Providers/CoreServiceProvider.php b/packages/Webkul/Core/src/Providers/CoreServiceProvider.php
index d69b9c60f..82b05cff1 100644
--- a/packages/Webkul/Core/src/Providers/CoreServiceProvider.php
+++ b/packages/Webkul/Core/src/Providers/CoreServiceProvider.php
@@ -18,19 +18,15 @@ class CoreServiceProvider extends ServiceProvider
     public function boot(Router $router)
     {
         include __DIR__ . '/../Http/helpers.php';
+
         $this->loadMigrationsFrom(__DIR__ . '/../Database/Migrations');
+
         $this->loadTranslationsFrom(__DIR__ . '/../Resources/lang', 'core');
+
         $router->aliasMiddleware('locale', Locale::class);
 
-        $router->aliasMiddleware('admin', RedirectIfNotAdmin::class);
-
-        $router->aliasMiddleware('customer', RedirectIfNotCustomer::class);
-
-        // $this->publishes([
-        //     __DIR__ . '/../../publishable/lang' => public_path('vendor/webkul/core/lang'),
-        // ], 'public');
-
         Validator::extend('slug', 'Webkul\Core\Contracts\Validations\Slug@passes');
+        
         Validator::extend('code', 'Webkul\Core\Contracts\Validations\Code@passes');
     }
     
diff --git a/packages/Webkul/Customer/src/Http/Controllers/OrdersController.php b/packages/Webkul/Customer/src/Http/Controllers/OrdersController.php
deleted file mode 100644
index 11fe6054f..000000000
--- a/packages/Webkul/Customer/src/Http/Controllers/OrdersController.php
+++ /dev/null
@@ -1,61 +0,0 @@
-<?php
-
-namespace Webkul\Customer\Http\Controllers;
-
-use Illuminate\Http\Request;
-use Illuminate\Http\Response;
-use Webkul\Customer\Repositories\CustomerRepository;
-use Webkul\Sales\Repositories\OrderRepository;
-use Auth;
-
-/**
- * Customer controlller for the customer
- * basically for the tasks of customers
- * which will be done after customer
- * authenticastion.
- *
- * @author    Prashant Singh <prashant.singh852@webkul.com>
- * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
- */
-class OrdersController extends Controller
-{
-    /**
-     * Display a listing of the resource.
-     *
-     * @return \Illuminate\Http\Response
-     */
-    protected $_config;
-    protected $customer;
-    protected $order;
-
-
-    public function __construct(CustomerRepository $customer ,OrderRepository $order)
-    {
-        $this->middleware('customer');
-
-        $this->_config = request('_config');
-
-        $this->customer = $customer;
-
-        $this->order = $order;
-    }
-
-    public function index() {
-        $id = auth()->guard('customer')->user()->id;
-
-        $customer = $this->getCustomer($id);
-
-        return view($this->_config['view'])->with('customer', $customer);
-    }
-
-    public function orders() {
-
-        $id = auth()->guard('customer')->user()->id;
-
-        $orders = $this->order->customerOrder($id);
-
-        return view($this->_config['view'],compact('orders'));
-    }
-}
-
-
diff --git a/packages/Webkul/Customer/src/Menu.php b/packages/Webkul/Customer/src/Menu.php
deleted file mode 100644
index c4438b884..000000000
--- a/packages/Webkul/Customer/src/Menu.php
+++ /dev/null
@@ -1,51 +0,0 @@
-<?php
-
-namespace Webkul\Customer;
-
-use Illuminate\Support\Facades\HTML;
-use Illuminate\Support\Facades\Request;
-use Illuminate\Support\Facades\URL;
-
-class Menu
-{
-    public $items = array();
-    public $current;
-	public $currentKey;
-
-	public function __construct() {
-		$this->current = Request::url();
-	}
-
-
-    public static function create($callback)
-    {
-        $menu = new Menu();
-        $callback($menu);
-        return $menu;
-    }
-
-    public function add($route, $name)
-    {
-        $url = route($route);
-        $item = [
-            'name' => $name,
-            'url' => $url,
-        ];
-        array_push($this->items, $item);
-    }
-
-    /**
-	 * Method to find the active links
-	 *
-	 * @param  array $item Item that
-     * needs to be checked if active
-	 * @return string
-	 */
-	public function getActive($item)
-	{
-		$url = trim($item['url'], '/');
-		if ((strpos($this->current, $url) !== false) || (strpos($this->currentKey, $item['key']) === 0)) {
-			return 'active';
-		}
-	}
-}
diff --git a/packages/Webkul/Customer/src/Providers/CustomerServiceProvider.php b/packages/Webkul/Customer/src/Providers/CustomerServiceProvider.php
index 0cd3b1e83..5df9ad7ec 100644
--- a/packages/Webkul/Customer/src/Providers/CustomerServiceProvider.php
+++ b/packages/Webkul/Customer/src/Providers/CustomerServiceProvider.php
@@ -3,11 +3,8 @@
 namespace Webkul\Customer\Providers;
 
 use Illuminate\Support\ServiceProvider;
-use Illuminate\Support\Facades\Event;
 use Illuminate\Routing\Router;
-use Illuminate\Support\Facades\Blade;
 use Webkul\Customer\Http\Middleware\RedirectIfNotCustomer;
-use Webkul\Customer\Providers\EventServiceProvider;
 
 class CustomerServiceProvider extends ServiceProvider
 {
@@ -20,28 +17,5 @@ class CustomerServiceProvider extends ServiceProvider
         $this->loadMigrationsFrom(__DIR__ . '/../Database/migrations');
 
         $this->loadViewsFrom(__DIR__ . '/../Resources/views', 'customer');
-
-        $this->composeView();
-
-        $this->app->register(EventServiceProvider::class);
-    }
-
-    /**
-     * Register services.
-     *
-     * @return void
-     */
-    public function register()
-    {
-        // $this->app->bind('datagrid', 'Webkul\Ui\DataGrid\DataGrid');
-    }
-
-    protected function composeView()
-    {
-        view()->composer(['shop::customers.account.partials.sidemenu'], function ($view) {
-            $menu = current(Event::fire('customer.menu.create'));
-
-            $view->with('menu', $menu);
-        });
     }
 }
diff --git a/packages/Webkul/Customer/src/Providers/EventServiceProvider.php b/packages/Webkul/Customer/src/Providers/EventServiceProvider.php
deleted file mode 100644
index ebf899ea7..000000000
--- a/packages/Webkul/Customer/src/Providers/EventServiceProvider.php
+++ /dev/null
@@ -1,52 +0,0 @@
-<?php
-
-namespace Webkul\Customer\Providers;
-
-use Illuminate\Foundation\Support\Providers\EventServiceProvider as ServiceProvider;
-use Illuminate\Support\Facades\Event;
-use Illuminate\Support\Facades\View;
-use Webkul\Customer\Menu;
-
-class EventServiceProvider extends ServiceProvider
-{
-
-    /**
-     * Bootstrap services.
-     *
-     * @return void
-     */
-    public function boot()
-    {
-        $this->createCustomerAccountSideMenu();
-    }
-
-    /**
-     * This method fires an event for menu creation, any package can add their menu item by listening to the customer.menu.build event
-     *
-     * @return void
-     */
-
-    public function createCustomerAccountSideMenu()
-    {
-
-        Event::listen('customer.menu.create', function () {
-            return Menu::create(function ($menu) {
-                Event::fire('customer.menu.build', $menu);
-            });
-        });
-
-        Event::listen('customer.menu.build', function ($menu) {
-
-            $menu->add('customer.profile.index', 'Profile');
-
-            $menu->add('customer.orders.index', 'Orders');
-
-            $menu->add('customer.address.index', 'Address');
-
-            $menu->add('customer.reviews.index', 'Reviews');
-
-            $menu->add('customer.wishlist.index', 'Wishlist');
-
-        });
-    }
-}
diff --git a/packages/Webkul/Inventory/src/Http/Controllers/InventorySourceController.php b/packages/Webkul/Inventory/src/Http/Controllers/InventorySourceController.php
index eedb428dc..60c1bdd7e 100644
--- a/packages/Webkul/Inventory/src/Http/Controllers/InventorySourceController.php
+++ b/packages/Webkul/Inventory/src/Http/Controllers/InventorySourceController.php
@@ -120,6 +120,14 @@ class InventorySourceController extends Controller
      */
     public function destroy($id)
     {
-        //
+        if($this->inventorySource->count() == 1) {
+            session()->flash('error', 'At least one inventory source is required.');
+        } else {
+            $this->inventorySource->delete($id);
+
+            session()->flash('success', 'Inventory source deleted successfully.');
+        }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Inventory/src/Providers/InventoryServiceProvider.php b/packages/Webkul/Inventory/src/Providers/InventoryServiceProvider.php
index 208e63fee..7e9ba3899 100644
--- a/packages/Webkul/Inventory/src/Providers/InventoryServiceProvider.php
+++ b/packages/Webkul/Inventory/src/Providers/InventoryServiceProvider.php
@@ -5,7 +5,6 @@ namespace Webkul\Inventory\Providers;
 use Illuminate\Support\ServiceProvider;
 use Illuminate\Foundation\AliasLoader;
 use Illuminate\Routing\Router;
-use Webkul\User\Http\Middleware\RedirectIfNotAdmin;
 
 class InventoryServiceProvider extends ServiceProvider
 {
@@ -16,8 +15,6 @@ class InventoryServiceProvider extends ServiceProvider
      */
     public function boot(Router $router)
     {
-        $router->aliasMiddleware('admin', RedirectIfNotAdmin::class);
-
         $this->loadMigrationsFrom(__DIR__ . '/../Database/Migrations');
     }
 
diff --git a/packages/Webkul/Product/src/Contracts/Criteria/AttributeToSelectCriteria.php b/packages/Webkul/Product/src/Contracts/Criteria/AttributeToSelectCriteria.php
index b93f42e0b..1551e8f8f 100644
--- a/packages/Webkul/Product/src/Contracts/Criteria/AttributeToSelectCriteria.php
+++ b/packages/Webkul/Product/src/Contracts/Criteria/AttributeToSelectCriteria.php
@@ -6,7 +6,7 @@ use Prettus\Repository\Contracts\CriteriaInterface;
 use Prettus\Repository\Contracts\RepositoryInterface;
 use Webkul\Product\Models\ProductAttributeValue;
 use Webkul\Attribute\Repositories\AttributeRepository;
-use Webkul\Product\Product\AbstractProduct;
+use Webkul\Product\Helpers\AbstractProduct;
 
 /**
  * Class MyCriteria.
diff --git a/packages/Webkul/Product/src/Contracts/Criteria/FeaturedProductsCriteria.php b/packages/Webkul/Product/src/Contracts/Criteria/FeaturedProductsCriteria.php
index 1915b071a..5e021a548 100644
--- a/packages/Webkul/Product/src/Contracts/Criteria/FeaturedProductsCriteria.php
+++ b/packages/Webkul/Product/src/Contracts/Criteria/FeaturedProductsCriteria.php
@@ -5,7 +5,7 @@ namespace Webkul\Product\Contracts\Criteria;
 use Prettus\Repository\Contracts\CriteriaInterface;
 use Prettus\Repository\Contracts\RepositoryInterface;
 use Webkul\Attribute\Repositories\AttributeRepository;
-use Webkul\Product\Product\AbstractProduct;
+use Webkul\Product\Helpers\AbstractProduct;
 
 /**
  * Class MyCriteria.
diff --git a/packages/Webkul/Product/src/Contracts/Criteria/FilterByAttributesCriteria.php b/packages/Webkul/Product/src/Contracts/Criteria/FilterByAttributesCriteria.php
index 8bd31cdcf..2c52225b5 100644
--- a/packages/Webkul/Product/src/Contracts/Criteria/FilterByAttributesCriteria.php
+++ b/packages/Webkul/Product/src/Contracts/Criteria/FilterByAttributesCriteria.php
@@ -6,7 +6,7 @@ use Prettus\Repository\Contracts\CriteriaInterface;
 use Prettus\Repository\Contracts\RepositoryInterface;
 use Webkul\Product\Models\ProductAttributeValue;
 use Webkul\Attribute\Repositories\AttributeRepository;
-use Webkul\Product\Product\AbstractProduct;
+use Webkul\Product\Helpers\AbstractProduct;
 
 /**
  * Class MyCriteria.
diff --git a/packages/Webkul/Product/src/Contracts/Criteria/NewProductsCriteria.php b/packages/Webkul/Product/src/Contracts/Criteria/NewProductsCriteria.php
index 1375fe6c5..cc6ca2f2c 100644
--- a/packages/Webkul/Product/src/Contracts/Criteria/NewProductsCriteria.php
+++ b/packages/Webkul/Product/src/Contracts/Criteria/NewProductsCriteria.php
@@ -5,7 +5,7 @@ namespace Webkul\Product\Contracts\Criteria;
 use Prettus\Repository\Contracts\CriteriaInterface;
 use Prettus\Repository\Contracts\RepositoryInterface;
 use Webkul\Attribute\Repositories\AttributeRepository;
-use Webkul\Product\Product\AbstractProduct;
+use Webkul\Product\Helpers\AbstractProduct;
 
 /**
  * Class MyCriteria.
diff --git a/packages/Webkul/Product/src/Contracts/Criteria/SortCriteria.php b/packages/Webkul/Product/src/Contracts/Criteria/SortCriteria.php
index 5a2eddb00..4fcab26b8 100644
--- a/packages/Webkul/Product/src/Contracts/Criteria/SortCriteria.php
+++ b/packages/Webkul/Product/src/Contracts/Criteria/SortCriteria.php
@@ -6,7 +6,7 @@ use Prettus\Repository\Contracts\CriteriaInterface;
 use Prettus\Repository\Contracts\RepositoryInterface;
 use Webkul\Product\Models\ProductAttributeValue;
 use Webkul\Attribute\Repositories\AttributeRepository;
-use Webkul\Product\Product\AbstractProduct;
+use Webkul\Product\Helpers\AbstractProduct;
 
 /**
  * Class MyCriteria.
diff --git a/packages/Webkul/Product/src/Database/Migrations/2018_07_27_065727_create_products_table.php b/packages/Webkul/Product/src/Database/Migrations/2018_07_27_065727_create_products_table.php
index a622e97d5..2f1611efd 100644
--- a/packages/Webkul/Product/src/Database/Migrations/2018_07_27_065727_create_products_table.php
+++ b/packages/Webkul/Product/src/Database/Migrations/2018_07_27_065727_create_products_table.php
@@ -20,7 +20,7 @@ class CreateProductsTable extends Migration
             $table->timestamps();
             $table->integer('parent_id')->unsigned()->nullable();
             $table->integer('attribute_family_id')->unsigned()->nullable();
-            $table->foreign('attribute_family_id')->references('id')->on('attribute_families')->onDelete('cascade');
+            $table->foreign('attribute_family_id')->references('id')->on('attribute_families')->onDelete('restrict');
         });
 
         Schema::table('products', function (Blueprint $table) {
@@ -45,7 +45,7 @@ class CreateProductsTable extends Migration
             $table->integer('product_id')->unsigned();
             $table->integer('attribute_id')->unsigned();
             $table->foreign('product_id')->references('id')->on('products')->onDelete('cascade');
-            $table->foreign('attribute_id')->references('id')->on('attributes')->onDelete('cascade');
+            $table->foreign('attribute_id')->references('id')->on('attributes')->onDelete('restrict');
         });
 
         Schema::create('product_up_sells', function (Blueprint $table) {
diff --git a/packages/Webkul/Product/src/Product/AbstractProduct.php b/packages/Webkul/Product/src/Helpers/AbstractProduct.php
similarity index 96%
rename from packages/Webkul/Product/src/Product/AbstractProduct.php
rename to packages/Webkul/Product/src/Helpers/AbstractProduct.php
index 1982cd23e..d1bf4db4b 100644
--- a/packages/Webkul/Product/src/Product/AbstractProduct.php
+++ b/packages/Webkul/Product/src/Helpers/AbstractProduct.php
@@ -1,6 +1,6 @@
 <?php
 
-namespace Webkul\Product\Product;
+namespace Webkul\Product\Helpers;
 
 use Webkul\Product\Models\ProductAttributeValue;
 
diff --git a/packages/Webkul/Product/src/Product/ConfigurableOption.php b/packages/Webkul/Product/src/Helpers/ConfigurableOption.php
similarity index 96%
rename from packages/Webkul/Product/src/Product/ConfigurableOption.php
rename to packages/Webkul/Product/src/Helpers/ConfigurableOption.php
index b8f6cfd22..9ab06e9ac 100644
--- a/packages/Webkul/Product/src/Product/ConfigurableOption.php
+++ b/packages/Webkul/Product/src/Helpers/ConfigurableOption.php
@@ -1,10 +1,10 @@
 <?php
 
-namespace Webkul\Product\Product;
+namespace Webkul\Product\Helpers;
 
 use Webkul\Attribute\Repositories\AttributeOptionRepository as AttributeOption;
-use Webkul\Product\Product\ProductImage;
-use Webkul\Product\Product\Price;
+use Webkul\Product\Helpers\ProductImage;
+use Webkul\Product\Helpers\Price;
 use Webkul\Product\Models\Product;
 use Webkul\Product\Models\ProductAttributeValue;
 
@@ -35,8 +35,8 @@ class ConfigurableOption extends AbstractProduct
      * Create a new controller instance.
      *
      * @param  Webkul\Attribute\Repositories\AttributeOptionRepository $attributeOption
-     * @param  Webkul\Product\Product\ProductImage                     $productImage
-     * @param  Webkul\Product\Product\Price                            $price
+     * @param  Webkul\Product\Helpers\ProductImage                     $productImage
+     * @param  Webkul\Product\Helpers\Price                            $price
      * @return void
      */
     public function __construct(
diff --git a/packages/Webkul/Product/src/Product/Price.php b/packages/Webkul/Product/src/Helpers/Price.php
similarity index 98%
rename from packages/Webkul/Product/src/Product/Price.php
rename to packages/Webkul/Product/src/Helpers/Price.php
index 98e10e4f4..3ea33efef 100644
--- a/packages/Webkul/Product/src/Product/Price.php
+++ b/packages/Webkul/Product/src/Helpers/Price.php
@@ -1,6 +1,6 @@
 <?php
 
-namespace Webkul\Product\Product;
+namespace Webkul\Product\Helpers;
 
 use Webkul\Attribute\Repositories\AttributeRepository as Attribute;
 use Webkul\Product\Models\ProductAttributeValue;
diff --git a/packages/Webkul/Product/src/Product/ProductImage.php b/packages/Webkul/Product/src/Helpers/ProductImage.php
similarity index 98%
rename from packages/Webkul/Product/src/Product/ProductImage.php
rename to packages/Webkul/Product/src/Helpers/ProductImage.php
index 1477144e9..769b9b9e4 100644
--- a/packages/Webkul/Product/src/Product/ProductImage.php
+++ b/packages/Webkul/Product/src/Helpers/ProductImage.php
@@ -1,6 +1,6 @@
 <?php
 
-namespace Webkul\Product\Product;
+namespace Webkul\Product\Helpers;
 
 use Webkul\Attribute\Repositories\AttributeOptionRepository as AttributeOption;
 use Illuminate\Support\Facades\Storage;
diff --git a/packages/Webkul/Product/src/Product/Review.php b/packages/Webkul/Product/src/Helpers/Review.php
similarity index 98%
rename from packages/Webkul/Product/src/Product/Review.php
rename to packages/Webkul/Product/src/Helpers/Review.php
index dd14117fd..992e53971 100644
--- a/packages/Webkul/Product/src/Product/Review.php
+++ b/packages/Webkul/Product/src/Helpers/Review.php
@@ -1,6 +1,6 @@
 <?php
 
-namespace Webkul\Product\Product;
+namespace Webkul\Product\Helpers;
 
 class Review extends AbstractProduct
 {
diff --git a/packages/Webkul/Product/src/Product/Toolbar.php b/packages/Webkul/Product/src/Helpers/Toolbar.php
similarity index 98%
rename from packages/Webkul/Product/src/Product/Toolbar.php
rename to packages/Webkul/Product/src/Helpers/Toolbar.php
index f048562e2..6854c7ef8 100644
--- a/packages/Webkul/Product/src/Product/Toolbar.php
+++ b/packages/Webkul/Product/src/Helpers/Toolbar.php
@@ -1,6 +1,6 @@
 <?php
 
-namespace Webkul\Product\Product;
+namespace Webkul\Product\Helpers;
 
 class Toolbar extends AbstractProduct
 {
diff --git a/packages/Webkul/Product/src/Product/View.php b/packages/Webkul/Product/src/Helpers/View.php
similarity index 83%
rename from packages/Webkul/Product/src/Product/View.php
rename to packages/Webkul/Product/src/Helpers/View.php
index 412e07719..6699fb306 100644
--- a/packages/Webkul/Product/src/Product/View.php
+++ b/packages/Webkul/Product/src/Helpers/View.php
@@ -1,6 +1,6 @@
 <?php
 
-namespace Webkul\Product\Product;
+namespace Webkul\Product\Helpers;
 
 class View extends AbstractProduct
 {
@@ -17,7 +17,7 @@ class View extends AbstractProduct
         $attributes = $product->attribute_family->custom_attributes;
 
         foreach($attributes as $attribute) {
-            if($attribute->is_visible_on_front) {
+            if($attribute->is_visible_on_front && $product->{$attribute->code}) {
                 $data[] = [
                     'code' => $attribute->code,
                     'label' => $attribute->name,
diff --git a/packages/Webkul/Product/src/Http/Controllers/ProductController.php b/packages/Webkul/Product/src/Http/Controllers/ProductController.php
index c97535b2c..fd94b6d56 100644
--- a/packages/Webkul/Product/src/Http/Controllers/ProductController.php
+++ b/packages/Webkul/Product/src/Http/Controllers/ProductController.php
@@ -176,6 +176,6 @@ class ProductController extends Controller
      */
     public function destroy($id)
     {
-        //
+        $this->product->delete($id);
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Sales/src/Models/Order.php b/packages/Webkul/Sales/src/Models/Order.php
index 5254f7d8c..a4083f7b5 100644
--- a/packages/Webkul/Sales/src/Models/Order.php
+++ b/packages/Webkul/Sales/src/Models/Order.php
@@ -45,7 +45,7 @@ class Order extends Model implements OrderContract
      */
     public function getTotalDueAttribute()
     {
-        return $this->grand_total - $this->base_total_invoiced;
+        return $this->grand_total - $this->grand_total_invoiced;
     }
 
     /**
diff --git a/packages/Webkul/Sales/src/Repositories/OrderRepository.php b/packages/Webkul/Sales/src/Repositories/OrderRepository.php
index 445199220..d8bb52768 100644
--- a/packages/Webkul/Sales/src/Repositories/OrderRepository.php
+++ b/packages/Webkul/Sales/src/Repositories/OrderRepository.php
@@ -286,13 +286,4 @@ class OrderRepository extends Repository
 
         return $order;
     }
-
-     /**
-     * @param int $customerId
-     * @return void
-     */
-    public function customerOrder($customerId)
-    {
-       return $this->model->where('customer_id',$customerId)->get();
-    }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Http/Controllers/CartController.php b/packages/Webkul/Shop/src/Http/Controllers/CartController.php
index de626d840..542b35e02 100644
--- a/packages/Webkul/Shop/src/Http/Controllers/CartController.php
+++ b/packages/Webkul/Shop/src/Http/Controllers/CartController.php
@@ -8,8 +8,8 @@ use Webkul\Checkout\Repositories\CartRepository;
 use Webkul\Checkout\Repositories\CartItemRepository;
 use Webkul\Product\Repositories\ProductRepository;
 use Webkul\Customer\Repositories\CustomerRepository;
-use Webkul\Product\Product\ProductImage;
-use Webkul\Product\Product\View as ProductView;
+use Webkul\Product\Helpers\ProductImage;
+use Webkul\Product\Helpers\View as ProductView;
 use Cart;
 
 /**
diff --git a/packages/Webkul/Shop/src/Http/Controllers/HomeController.php b/packages/Webkul/Shop/src/Http/Controllers/HomeController.php
index 58cb8283c..c9f4a54bd 100644
--- a/packages/Webkul/Shop/src/Http/Controllers/HomeController.php
+++ b/packages/Webkul/Shop/src/Http/Controllers/HomeController.php
@@ -13,7 +13,6 @@ use Webkul\Core\Repositories\SliderRepository as Sliders;
  * @author    Prashant Singh <prashant.singh852@webkul.com>
  * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
  */
-
  class HomeController extends controller
 {
     protected $_config;
diff --git a/packages/Webkul/Shop/src/Http/Controllers/OrderController.php b/packages/Webkul/Shop/src/Http/Controllers/OrderController.php
new file mode 100644
index 000000000..65d448ecc
--- /dev/null
+++ b/packages/Webkul/Shop/src/Http/Controllers/OrderController.php
@@ -0,0 +1,73 @@
+<?php
+
+namespace Webkul\Shop\Http\Controllers;
+
+use Illuminate\Http\Request;
+use Illuminate\Http\Response;
+use Webkul\Sales\Repositories\OrderRepository;
+use Auth;
+
+/**
+ * Customer controlller for the customer basically for the tasks of customers
+ * which will be done after customer authenticastion.
+ *
+ * @author    Prashant Singh <prashant.singh852@webkul.com>
+ * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
+ */
+class OrderController extends Controller
+{
+    /**
+     * Contains route related configuration
+     *
+     * @var array
+     */
+    protected $_config;
+
+    /**
+     * OrderrRepository object
+     *
+     * @var array
+     */
+    protected $order;
+
+    /**
+     * Create a new controller instance.
+     *
+     * @param  Webkul\Order\Repositories\OrderRepository $order
+     * @return void
+     */
+    public function __construct(OrderRepository $order)
+    {
+        $this->middleware('customer');
+
+        $this->_config = request('_config');
+
+        $this->order = $order;
+    }
+
+    /**
+     * Display a listing of the resource.
+     *
+     * @return \Illuminate\Http\Response
+    */
+    public function index() {
+        $orders = $this->order->findWhere([
+            'customer_id' => auth()->guard('customer')->user()->id
+        ]);
+
+        return view($this->_config['view'], compact('orders'));
+    }
+
+    /**
+     * Show the view for the specified resource.
+     *
+     * @param  int  $id
+     * @return \Illuminate\Http\Response
+     */
+    public function view($id)
+    {
+        $order = $this->order->find($id);
+
+        return view($this->_config['view'], compact('order'));
+    }
+}
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Http/routes.php b/packages/Webkul/Shop/src/Http/routes.php
index 597295d7c..8a89f7159 100644
--- a/packages/Webkul/Shop/src/Http/routes.php
+++ b/packages/Webkul/Shop/src/Http/routes.php
@@ -172,10 +172,14 @@ Route::group(['middleware' => ['web']], function () {
                 ])->name('customer.wishlist.index');
 
                 /* Orders route */
-                Route::get('orders', 'Webkul\Customer\Http\Controllers\OrdersController@orders')->defaults('_config', [
-                    'view' => 'shop::customers.account.orders.orders'
+                Route::get('orders', 'Webkul\Shop\Http\Controllers\OrderController@index')->defaults('_config', [
+                    'view' => 'shop::customers.account.orders.index'
                 ])->name('customer.orders.index');
 
+                Route::get('orders/view/{id}', 'Webkul\Shop\Http\Controllers\OrderController@view')->defaults('_config', [
+                    'view' => 'shop::customers.account.orders.view'
+                ])->name('customer.orders.view');
+
                 /* Reviews route */
                 Route::get('reviews', 'Webkul\Customer\Http\Controllers\CustomerController@reviews')->defaults('_config', [
                     'view' => 'shop::customers.account.reviews.index'
diff --git a/packages/Webkul/Shop/src/Providers/ComposerServiceProvider.php b/packages/Webkul/Shop/src/Providers/ComposerServiceProvider.php
index 0accfe8c1..5fd5cd859 100644
--- a/packages/Webkul/Shop/src/Providers/ComposerServiceProvider.php
+++ b/packages/Webkul/Shop/src/Providers/ComposerServiceProvider.php
@@ -5,7 +5,7 @@ namespace Webkul\Shop\Providers;
 use Illuminate\Support\Facades\Event;
 use Illuminate\Support\Facades\Blade;
 use Illuminate\Support\ServiceProvider;
-use Webkul\Product\Product\ProductImage;
+use Webkul\Product\Helpers\ProductImage;
 use View;
 
 class ComposerServiceProvider extends ServiceProvider
diff --git a/packages/Webkul/Shop/src/Providers/ShopServiceProvider.php b/packages/Webkul/Shop/src/Providers/ShopServiceProvider.php
index 5788874e2..b687cc046 100644
--- a/packages/Webkul/Shop/src/Providers/ShopServiceProvider.php
+++ b/packages/Webkul/Shop/src/Providers/ShopServiceProvider.php
@@ -7,6 +7,7 @@ use Illuminate\Support\Facades\Event;
 use Illuminate\Routing\Router;
 use Illuminate\Support\Facades\Blade;
 use Webkul\Shop\Providers\ComposerServiceProvider;
+use Webkul\Ui\Menu;
 
 class ShopServiceProvider extends ServiceProvider
 {
@@ -28,14 +29,49 @@ class ShopServiceProvider extends ServiceProvider
         $this->loadViewsFrom(__DIR__ . '/../Resources/views', 'shop');
 
         $this->app->register(ComposerServiceProvider::class);
+
+        $this->composeView();
+
+        $this->createCustomerMenu();
     }
 
     /**
-     * Register services.
+     * Bind the the data to the views
      *
      * @return void
      */
-    public function register()
+    protected function composeView()
     {
+        view()->composer('shop::customers.account.partials.sidemenu', function ($view) {
+            $menu = current(Event::fire('customer.menu.create'));
+
+            $view->with('menu', $menu);
+        });
+    }
+
+    /**
+     * This method fires an event for menu creation, any package can add their menu item by listening to the customer.menu.build event
+     *
+     * @return void
+     */
+    public function createCustomerMenu()
+    {
+        Event::listen('customer.menu.create', function () {
+            return Menu::create(function ($menu) {
+                Event::fire('customer.menu.build', $menu);
+            });
+        });
+
+        Event::listen('customer.menu.build', function ($menu) {
+            $menu->add('profile', 'Profile', 'customer.profile.index', 1);
+            
+            $menu->add('orders', 'Orders', 'customer.orders.index', 2);
+
+            $menu->add('address', 'Address', 'customer.address.index', 3);
+
+            $menu->add('reviews', 'Reviews', 'customer.reviews.index', 4);
+
+            $menu->add('wishlist', 'Wishlist', 'customer.wishlist.index', 5);
+        });
     }
 }
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
index f353ec975..43e4137d8 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
@@ -1065,7 +1065,7 @@ section.product-detail {
                 .full-specifications {
                     td {
                         padding: 10px 0;
-                        color: $font-color-light;
+                        color: $other-font-color;
 
                         &:first-child {
                             padding-right: 40px;
@@ -1897,8 +1897,8 @@ section.review {
         border: 1px solid $border-color;
         width: 25%;
         height: 100%;
-        text-transform: capitalize;
         color: $font-color-light;
+        position: relative;
 
         li {
             width: 95%;
@@ -1910,6 +1910,16 @@ section.review {
             align-items: center;
             border-bottom: 1px solid $border-color;
             text-align: center;
+
+            a {
+                color: #5E5E5E;
+            }
+
+            .icon {
+                display: none;
+                position: absolute;
+                right: 12px;
+            }
         }
 
         li:first-child {
@@ -1921,14 +1931,24 @@ section.review {
         }
 
         li.active {
-            color: $brand-color;
+            a {
+                color: $brand-color;
+            }
+
+            .icon {
+                display: inline-block;
+            }
         }
     }
+
     //customer account pages content
     .account-layout {
-        margin-left: 5.5%;
-        margin-top: 1%;
+        margin-left: 40px;
         width: 100%;
+
+        .account-head {
+            margin-bottom: 20px;
+        }
     }
 }
 
@@ -1957,4 +1977,98 @@ section.review {
     flex-direction: column;
     min-height: 345px;
     padding: 25px;
+}
+
+.sale-container {
+    color: #5E5E5E;
+
+    .sale-section {
+
+        .secton-title {
+            font-size: 18px;
+            color: #8E8E8E;
+            padding: 15px 0;
+            border-bottom: 1px solid $border-color;
+        }
+
+        .section-content {
+            display: block;
+            padding: 20px 0;
+            border-bottom: 1px solid #E8E8E8;
+
+            .row {
+                display: block;
+                padding: 7px 0;
+
+                .title {
+                    width: 200px;
+                    letter-spacing: -0.26px;
+                    display: inline-block;
+                }
+
+                .value {
+                    letter-spacing: -0.26px;
+                    display: inline-block;
+                }
+            }
+
+            .order-box-container {
+                display: inline-block;
+                width: 100%;
+
+                .box {
+                    float: left;
+                    width: 25%;
+
+                    .box-title {
+                        padding: 10px 0;
+                        font-size: 18px;
+                        color: #8E8E8E;
+                    }
+
+
+                    .box-content {
+                        color: #3A3A3A;
+                    }
+                }
+            }
+
+            .qty-row {
+                display: block;
+            }
+        }
+    }
+
+    .totals {
+        padding-top: 20px;
+        display: inline-block;
+        width: 100%;
+        border-top: solid 1px #E8E8E8;
+
+        .sale-summary {
+            height: 130px;
+            float: right;
+            border-collapse: collapse;
+
+            tr {
+
+                td {
+                    padding: 5px 8px;
+                    width: auto;
+                    color: #3A3A3A;
+                }
+
+                &.bold {
+                    font-weight: 600;
+                    font-size: 15px;
+                }
+
+                &.border {
+                    td {
+                        border-bottom: 1px solid $border-color;
+                    }
+                }
+            }
+        }
+    }
 }
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/lang/en/app.php b/packages/Webkul/Shop/src/Resources/lang/en/app.php
index a38ba0f27..1943ef3d8 100644
--- a/packages/Webkul/Shop/src/Resources/lang/en/app.php
+++ b/packages/Webkul/Shop/src/Resources/lang/en/app.php
@@ -113,13 +113,47 @@ return [
 
             'order' => [
                 'index' => [
-                    'page-title' => 'Customer-Order',
+                    'page-title' => 'Customer - Orders',
                     'title' => 'Orders',
                     'order_id' => 'Order ID',
                     'date' => 'Date',
                     'status' => 'Status',
-                    'item' => 'Item',
-                    'total' => 'total'
+                    'total' => 'Total'
+                ],
+
+                'view' => [
+                    'page-tile' => 'Order #:order_id',
+                    'info' => 'Information',
+                    'placed-on' => 'Placed On',
+                    'products-ordered' => 'Products Ordered',
+                    'invoices' => 'Invoices',
+                    'shipments' => 'Shipments',
+                    'SKU' => 'SKU',
+                    'product-name' => 'Name',
+                    'qty' => 'Qty',
+                    'item-status' => 'Item Status',
+                    'item-ordered' => 'Ordered (:qty_ordered)',
+                    'item-invoice' => 'Invoiced (:qty_invoiced)',
+                    'item-shipped' => 'shipped (:qty_shipped)',
+                    'item-canceled' => 'Canceled (:qty_canceled)',
+                    'price' => 'Price',
+                    'total' => 'Total',
+                    'subtotal' => 'Subtotal',
+                    'shipping-handling' => 'Shipping & Handling',
+                    'tax' => 'Tax',
+                    'tax-percent' => 'Tax Percent',
+                    'tax-amount' => 'Tax Amount',
+                    'discount-amount' => 'Discount Amount',
+                    'grand-total' => 'Grand Total',
+                    'total-paid' => 'Total Paid',
+                    'total-refunded' => 'Total Refunded',
+                    'total-due' => 'Total Due',
+                    'shipping-address' => 'Shipping Address',
+                    'billing-address' => 'Billing Address',
+                    'shipping-method' => 'Shipping Method',
+                    'payment-method' => 'Payment Method',
+                    'individual-invoice' => 'Invoice #:invoice_id',
+                    'individual-shipment' => 'Shipment #:shipment_id',
                 ]
             ],
 
diff --git a/packages/Webkul/Shop/src/Resources/views/checkout/cart/index.blade.php b/packages/Webkul/Shop/src/Resources/views/checkout/cart/index.blade.php
index 1f5727c40..53ac65869 100644
--- a/packages/Webkul/Shop/src/Resources/views/checkout/cart/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/checkout/cart/index.blade.php
@@ -6,7 +6,7 @@
 
 @section('content-wrapper')
 
-    @inject ('productImageHelper', 'Webkul\Product\Product\ProductImage')
+    @inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 
     <section class="cart">
 
diff --git a/packages/Webkul/Shop/src/Resources/views/checkout/onepage/review.blade.php b/packages/Webkul/Shop/src/Resources/views/checkout/onepage/review.blade.php
index 96149a9cf..24e1cf60e 100644
--- a/packages/Webkul/Shop/src/Resources/views/checkout/onepage/review.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/checkout/onepage/review.blade.php
@@ -43,7 +43,7 @@
 
     </div>
 
-    @inject ('productImageHelper', 'Webkul\Product\Product\ProductImage')
+    @inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 
     <div class="cart-item-list">
         @foreach($cart->items as $item)
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/orders/index.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/orders/index.blade.php
index 34a116699..b23bf79c3 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/orders/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/orders/index.blade.php
@@ -1,372 +1,65 @@
-
 @extends('shop::layouts.master')
 
-@section('content-wrapper')
-<div class="account-content">
-    <!-- @include('shop::customers.account.partials.sidemenu') -->
-    <div class="order">
-        <div class="order-section-head">
-            <span class="order-number">Order #456103</span>
-            <span class="order-status">PROCESSING</span>
-            <span class="order-cancel"><a href="#">Cancel Order</a></span>
-            <div class="horizontal-rule"></div>
-        </div>
-
-        <div class="order-section-head-small">
-            
-            <div class="horizon-rule">
-            </div>
-            <span class="icon">
-                <img src="{{asset('themes/default/assets/images/icon-menu-back.svg')}}" />
-            </span>
-
-            <span class="order-number">
-                ORDER #456103
-            </span>
-
-            <span class="cancel">
-                Cancel
-            </span>
-
-            <div class="horizon-rule">
-            </div>
-        </div>
-
-        <div class="payment-place">
-            
-            <div class="placed-on">
-                <div class="place-text">
-                    <span>Placed On</span>
-
-                    <span class="processing">PROCESSING </span>
-                </div>
-
-                <div class="place-date">
-                    <span>July 11, 2018 3:57AM</span>
-                </div>
-            </div>
-
-            <div class="payment-status">
-                <div class="payment-text">
-                    <span>Payment Status</span>
-                </div>
-
-                <div class="status">
-                    <span>Recieved</span>
-                </div>
-            </div>
-
-            <div class="horizontal-rule"></div>
-        </div>
-
-        <div class="order-details">
-            <span class="detail">Order Details</span>
-        </div>
-
-        <div class="table">
-            <table>
-                <thead>
-                    <tr>
-                        <th>SKU</th>
-                        <th>Product Name</th>
-                        <th>Item Status</th>
-                        <th>Price</th>
-                        <th>Qty</th>
-                        <th>Row total</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr>
-                        <td>PROD124</td>
-                        <td>Apple iPhone 7- White-32GB</td>
-                        <td>Packed (2)</td>
-                        <td>$350.00</td>
-                        <td>2</td>
-                        <td>$700.00</td>
-                    </tr>
-                    <tr>
-                        <td>PROD128</td>
-                        <td>Blue Linen T-Shirt for Men- Small- Red</td>
-                        <td>Shipped (2)</td>
-                        <td>$45.00</td>
-                        <td>2</td>
-                        <td>$35.00</td>
-                    </tr>
-                </tbody>
-            </table>
-        </div>
-        
-        <div class="product-config">
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                        SKU
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        PROD128
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                        Product Name
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        Apple iPhone 7 - White - 32GB
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                       Item Status
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        Packed (2)
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                       Price
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        $ 350.00
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                      Qty
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        2
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                       Row Total
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        $770.00
-                    </span>
-                </div>
-            </div>
-        </div>
-
-         <div class="product-config">
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                        SKU
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        PROD128
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                        Product Name
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        Apple iPhone 7 - White - 32GB
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                       Item Status
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        Packed (2)
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                       Price
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        $ 350.00
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                      Qty
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        2
-                    </span>
-                </div>
-            </div>
-
-            <div class="product-attribute">
-                <div class="product-property">
-                    <span>
-                       Row Total
-                    </span>
-                </div>
-
-                <div class="property-name">
-                    <span>
-                        $770.00
-                    </span>
-                </div>
-            </div>
-        </div>
-
-
-        <div class="total">
-
-            <div class="calculate">
-
-                <div class="sub-total">
-                    <span class="left">
-                        Subtotal
-                    </span>
-                    <span class="middle">
-                        -
-                    </span>
-                    <span class="right">
-                        $805.00
-                    </span>
-                </div>
-
-                <div class="ship-handle">
-                    <span class="left">
-                        Shipping & handling
-                    </span>
-                    <span class="middle">
-                        -
-                    </span>
-                    <span class="right">
-                        $5.00
-                    </span>
-                </div>
-
-                <div class="discount">
-                    <span class="left">
-                        Discounts
-                    </span>
-                    <span class="middle">
-                        -
-                    </span>
-                    <span class="right">
-                        $15.00
-                    </span>
-                </div>
-
-                <div class="grand-total">
-                    <span class="left">
-                        Grand Total
-                    </span>
-                    <span class="middle">
-                        -
-                    </span>
-                    <span class="right">
-                        $15.00
-                    </span>
-                </div>
-
-                <div class="due">
-                    <span class="left">
-                        Total Due
-                    </span>
-                    <span class="middle">
-                        -
-                    </span>
-                    <span class="right">
-                        $15.00
-                    </span>
-                </div>
-
-            </div>
-
-        </div>
-
-        <div class="horizontal-rule"></div> 
-        
-        
-        <div class="order-information">
-            <div class="order-address-method">
-                <span class="address-method">
-                    Shipping Address
-                </span>
-                <p>0933 crossing suite 128 Dallas,Texas United States 75001</p>
-            </div>
-            <div class="order-address-method">
-                <span class="address-method">
-                    Billing Address
-                </span>
-                <p>0933 crossing suite 128 Dallas,Texas United States 75001</p>
-            </div>
-            <div class="order-address-method">
-                <span class="address-method">
-                    Shipping Method
-                </span>
-                <p>Flat Rate- Fixed</p>
-            </div>
-            <div class="order-address-method">
-                <span class="address-method">
-                   Payment Method
-                </span>
-                <p>Bank Wire Transfer</p>
-            </div>
-        </div>
-    </div>
-</div>
+@section('page_title')
+    {{ __('shop::app.customer.account.order.index.page-title') }}
 @endsection
 
+@section('content-wrapper')
+
+    <div class="account-content">
+        @include('shop::customers.account.partials.sidemenu')
+
+        <div class="account-layout">
+
+            <div class="account-head">
+                <span class="account-heading">
+                    {{ __('shop::app.customer.account.order.index.title') }}
+                </span>
+            </div>
+
+            <div class="account-items-list">
+
+                <div class="table">
+                    <table>
+                        <thead>
+                            <tr>
+                                <th> {{ __('shop::app.customer.account.order.index.order_id') }}</th>
+                                <th> {{ __('shop::app.customer.account.order.index.date')  }} </th>
+                                <th> {{ __('shop::app.customer.account.order.index.total') }} </th>
+                                <th> {{ __('shop::app.customer.account.order.index.status')}} </th>
+                            </tr>
+                        </thead>
+
+                        <tbody>
+                            @foreach($orders as $order)
+
+                                <tr>
+                                    <td>
+                                        <a href="{{ route('customer.orders.view', $order->id) }}">
+                                            #{{ $order->id }}
+                                        </a>
+                                    </td>
+
+                                    <td>{{ core()->formatDate($order->created_at, 'd M Y') }}</td>
+
+                                    <td>
+                                        {{ core()->formatPrice($order->grand_total, $order->order_currency_code) }}
+                                    </td>
+
+                                    <td>
+                                        <span class="order-status {{ $order->status }}">{{ $order->status_label }}</span>
+                                    </td>
+                                </tr>
+
+                            @endforeach
+                        </tbody>
+                    </table>
+                </div>
+
+            </div>
+
+        </div>
+
+    </div>
+
+@endsection
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/orders/orders.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/orders/orders.blade.php
deleted file mode 100644
index 05f1c496f..000000000
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/orders/orders.blade.php
+++ /dev/null
@@ -1,53 +0,0 @@
-
-@extends('shop::layouts.master')
-@section('page_title')
-    {{ __('shop::app.customer.account.order.index.page-title') }}
-@endsection
-
-@section('content-wrapper')
-
-<div class="account-content">
-    @include('shop::customers.account.partials.sidemenu')
-
-    <div class="account-layout">
-
-        <div class="account-head">
-            <span class="account-heading">{{ __('shop::app.customer.account.order.index.title') }}</span>
-            <div class="horizontal-rule"></div>
-        </div>
-
-        <div class="account-items-list">
-
-            <div class="table">
-                <table>
-                    <thead>
-                        <tr>
-                            <th> {{ __('shop::app.customer.account.order.index.order_id') }}</th>
-                            <th> {{ __('shop::app.customer.account.order.index.date')  }} </th>
-                            <th> {{ __('shop::app.customer.account.order.index.status')}} </th>
-                            <th> {{ __('shop::app.customer.account.order.index.item') }} </th>
-                            <th> {{ __('shop::app.customer.account.order.index.total') }} </th>
-                        </tr>
-                    </thead>
-
-                    <tbody>
-                        @foreach($orders as $order)
-                        <tr>
-                            <td>{{ $order->id }}</td>
-                            <td></td>
-                            <td>Shipped (2)</td>
-                            <td>2</td>
-                            <td>$35.00</td>
-                        </tr>
-                        @endforeach
-                    </tbody>
-                </table>
-            </div>
-
-        </div>
-
-    </div>
-
-
-</div>
-@endsection
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/orders/view.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/orders/view.blade.php
new file mode 100644
index 000000000..eefa59316
--- /dev/null
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/orders/view.blade.php
@@ -0,0 +1,328 @@
+@extends('shop::layouts.master')
+
+@section('page_title')
+    {{ __('shop::app.customer.account.order.view.page-tile', ['order_id' => $order->id]) }}
+@endsection
+
+@section('content-wrapper')
+
+    <div class="account-content">
+        @include('shop::customers.account.partials.sidemenu')
+
+        <div class="account-layout">
+
+            <div class="account-head">
+                <span class="account-heading">
+                    {{ __('shop::app.customer.account.order.view.page-tile', ['order_id' => $order->id]) }}
+                </span>
+            </div>
+
+            <div class="sale-container">
+
+                <tabs>
+                    <tab name="{{ __('shop::app.customer.account.order.view.info') }}" :selected="true">
+
+                        <div class="sale-section">
+                            <div class="section-content">
+                                <div class="row">
+                                    <span class="title"> 
+                                        {{ __('shop::app.customer.account.order.view.placed-on') }}
+                                    </span>
+
+                                    <span class="value"> 
+                                        {{ core()->formatDate($order->created_at, 'd M Y') }}
+                                    </span>
+                                </div>
+                            </div>
+                        </div>
+
+                        <div class="sale-section">
+                            <div class="secton-title">
+                                <span>{{ __('shop::app.customer.account.order.view.products-ordered') }}</span>
+                            </div>
+
+                            <div class="section-content">
+                                <div class="table">
+                                    <table>
+                                        <thead>
+                                            <tr>
+                                                <th>{{ __('shop::app.customer.account.order.view.SKU') }}</th>
+                                                <th>{{ __('shop::app.customer.account.order.view.product-name') }}</th>
+                                                <th>{{ __('shop::app.customer.account.order.view.price') }}</th>
+                                                <th>{{ __('shop::app.customer.account.order.view.item-status') }}</th>
+                                                <th>{{ __('shop::app.customer.account.order.view.subtotal') }}</th>
+                                                <th>{{ __('shop::app.customer.account.order.view.tax-percent') }}</th>
+                                                <th>{{ __('shop::app.customer.account.order.view.tax-amount') }}</th>
+                                                <th>{{ __('shop::app.customer.account.order.view.grand-total') }}</th>
+                                            </tr>
+                                        </thead>
+
+                                        <tbody>
+
+                                            @foreach ($order->items as $item)
+                                                <tr>
+                                                    <td>
+                                                        {{ $item->type == 'configurable' ? $item->child->sku : $item->sku }}
+                                                    </td>
+                                                    <td>{{ $item->name }}</td>
+                                                    <td>{{ core()->formatPrice($item->price, $order->order_currency_code) }}</td>
+                                                    <td>
+                                                        <span class="qty-row">
+                                                            {{ __('shop::app.customer.account.order.view.item-ordered', ['qty_ordered' => $item->qty_ordered]) }}
+                                                        </span>
+
+                                                        <span class="qty-row">
+                                                            {{ $item->qty_invoiced ? __('shop::app.customer.account.order.view.item-invoice', ['qty_invoiced' => $item->qty_invoiced]) : '' }}
+                                                        </span>
+
+                                                        <span class="qty-row">
+                                                            {{ $item->qty_shipped ? __('shop::app.customer.account.order.view.item-shipped', ['qty_shipped' => $item->qty_shipped]) : '' }}
+                                                        </span>
+
+                                                        <span class="qty-row">
+                                                            {{ $item->qty_canceled ? __('shop::app.customer.account.order.view.item-canceled', ['qty_canceled' => $item->qty_canceled]) : '' }}
+                                                        </span>
+                                                    </td>
+                                                    <td>{{ core()->formatPrice($item->total, $order->order_currency_code) }}</td>
+                                                    <td>{{ number_format($item->tax_percent, 2) }}%</td>
+                                                    <td>{{ core()->formatPrice($item->tax_amount, $order->order_currency_code) }}</td>
+                                                    <td>{{ core()->formatPrice($item->total + $item->tax_amount, $order->order_currency_code) }}</td>
+                                                </tr>
+                                            @endforeach
+                                    </table>
+                                </div>
+
+                                <div class="totals">
+                                    <table class="sale-summary">
+                                        <tbody>
+                                            <tr>
+                                                <td>{{ __('shop::app.customer.account.order.view.subtotal') }}</td>
+                                                <td>-</td>
+                                                <td>{{ core()->formatPrice($order->sub_total, $order->order_currency_code) }}</td>
+                                            </tr>
+
+                                            <tr>
+                                                <td>{{ __('shop::app.customer.account.order.view.shipping-handling') }}</td>
+                                                <td>-</td>
+                                                <td>{{ core()->formatPrice($order->shipping_amount, $order->order_currency_code) }}</td>
+                                            </tr>
+
+                                            <tr class="border">
+                                                <td>{{ __('shop::app.customer.account.order.view.tax') }}</td>
+                                                <td>-</td>
+                                                <td>{{ core()->formatPrice($order->tax_amount, $order->order_currency_code) }}</td>
+                                            </tr>
+
+                                            <tr class="bold">
+                                                <td>{{ __('shop::app.customer.account.order.view.grand-total') }}</td>
+                                                <td>-</td>
+                                                <td>{{ core()->formatPrice($order->grand_total, $order->order_currency_code) }}</td>
+                                            </tr>
+
+                                            <tr class="bold">
+                                                <td>{{ __('shop::app.customer.account.order.view.total-paid') }}</td>
+                                                <td>-</td>
+                                                <td>{{ core()->formatPrice($order->grand_total_invoiced, $order->order_currency_code) }}</td>
+                                            </tr>
+
+                                            <tr class="bold">
+                                                <td>{{ __('shop::app.customer.account.order.view.total-refunded') }}</td>
+                                                <td>-</td>
+                                                <td>{{ core()->formatPrice($order->grand_total_refunded, $order->order_currency_code) }}</td>
+                                            </tr>
+
+                                            <tr class="bold">
+                                                <td>{{ __('shop::app.customer.account.order.view.total-due') }}</td>
+                                                <td>-</td>
+                                                <td>{{ core()->formatPrice($order->total_due, $order->order_currency_code) }}</td>
+                                            </tr>
+                                        <tbody>
+                                    </table>
+                                </div>
+                            </div>
+                        </div>
+                    </tab>
+
+                    @if ($order->invoices->count())
+                        <tab name="{{ __('shop::app.customer.account.order.view.invoices') }}">
+
+                            @foreach ($order->invoices as $invoice)
+
+                                <div class="sale-section">
+                                    <div class="secton-title">
+                                        <span>{{ __('shop::app.customer.account.order.view.individual-invoice', ['invoice_id' => $invoice->id]) }}</span>
+                                    </div>
+
+                                    <div class="section-content">
+                                        <div class="table">
+                                            <table>
+                                                <thead>
+                                                    <tr>
+                                                        <th>{{ __('shop::app.customer.account.order.view.SKU') }}</th>
+                                                        <th>{{ __('shop::app.customer.account.order.view.product-name') }}</th>
+                                                        <th>{{ __('shop::app.customer.account.order.view.price') }}</th>
+                                                        <th>{{ __('shop::app.customer.account.order.view.qty') }}</th>
+                                                        <th>{{ __('shop::app.customer.account.order.view.subtotal') }}</th>
+                                                        <th>{{ __('shop::app.customer.account.order.view.tax-amount') }}</th>
+                                                        <th>{{ __('shop::app.customer.account.order.view.grand-total') }}</th>
+                                                    </tr>
+                                                </thead>
+
+                                                <tbody>
+
+                                                    @foreach ($invoice->items as $item)
+                                                        <tr>
+                                                            <td>{{ $item->child ? $item->child->sku : $item->sku }}</td>
+                                                            <td>{{ $item->name }}</td>
+                                                            <td>{{ core()->formatPrice($item->price, $order->order_currency_code) }}</td>
+                                                            <td>{{ $item->qty }}</td>
+                                                            <td>{{ core()->formatPrice($item->total, $order->order_currency_code) }}</td>
+                                                            <td>{{ core()->formatPrice($item->tax_amount, $order->order_currency_code) }}</td>
+                                                            <td>{{ core()->formatPrice($item->total + $item->tax_amount, $order->order_currency_code) }}</td>
+                                                        </tr>
+                                                    @endforeach
+                                                </tbody>
+                                            </table>
+                                        </div>
+
+                                        <div class="totals">
+                                            <table class="sale-summary">
+                                                <tr>
+                                                    <td>{{ __('shop::app.customer.account.order.view.subtotal') }}</td>
+                                                    <td>-</td>
+                                                    <td>{{ core()->formatPrice($invoice->sub_total, $order->order_currency_code) }}</td>
+                                                </tr>
+
+                                                <tr>
+                                                    <td>{{ __('shop::app.customer.account.order.view.shipping-handling') }}</td>
+                                                    <td>-</td>
+                                                    <td>{{ core()->formatPrice($invoice->shipping_amount, $order->order_currency_code) }}</td>
+                                                </tr>
+
+                                                <tr>
+                                                    <td>{{ __('shop::app.customer.account.order.view.tax') }}</td>
+                                                    <td>-</td>
+                                                    <td>{{ core()->formatPrice($invoice->tax_amount, $order->order_currency_code) }}</td>
+                                                </tr>
+
+                                                <tr class="bold">
+                                                    <td>{{ __('shop::app.customer.account.order.view.grand-total') }}</td>
+                                                    <td>-</td>
+                                                    <td>{{ core()->formatPrice($invoice->grand_total, $order->order_currency_code) }}</td>
+                                                </tr>
+                                            </table>
+                                        </div>
+                                    </div>
+                                </div>
+                            
+                            @endforeach
+
+                        </tab>
+                    @endif
+
+                    @if ($order->shipments->count())
+                        <tab name="{{ __('shop::app.customer.account.order.view.shipments') }}">
+
+                            @foreach ($order->shipments as $shipment)
+
+                                <div class="sale-section">
+                                    <div class="secton-title">
+                                        <span>{{ __('shop::app.customer.account.order.view.individual-shipment', ['shipment_id' => $shipment->id]) }}</span>
+                                    </div>
+
+                                    <div class="section-content">
+
+                                        <div class="table">
+                                            <table>
+                                                <thead>
+                                                    <tr>
+                                                        <th>{{ __('shop::app.customer.account.order.view.SKU') }}</th>
+                                                        <th>{{ __('shop::app.customer.account.order.view.product-name') }}</th>
+                                                        <th>{{ __('shop::app.customer.account.order.view.qty') }}</th>
+                                                    </tr>
+                                                </thead>
+
+                                                <tbody>
+
+                                                    @foreach ($shipment->items as $item)
+                                                    
+                                                        <tr>
+                                                            <td>{{ $item->sku }}</td>
+                                                            <td>{{ $item->name }}</td>
+                                                            <td>{{ $item->qty }}</td>
+                                                        </tr>
+
+                                                    @endforeach
+
+                                                </tbody>
+                                            </table>
+                                        </div>
+
+                                    </div>
+                                </div>
+
+                            @endforeach
+
+                        </tab>
+                    @endif
+                </tabs>
+
+                <div class="sale-section">
+                    <div class="section-content" style="border-bottom: 0">
+                        <div class="order-box-container">
+                            <div class="box">
+                                <div class="box-title">
+                                    {{ __('shop::app.customer.account.order.view.shipping-address') }}
+                                </div>
+
+                                <div class="box-content">
+
+                                    @include ('admin::sales.address', ['address' => $order->billing_address])
+
+                                </div>
+                            </div>
+
+                            <div class="box">
+                                <div class="box-title">
+                                    {{ __('shop::app.customer.account.order.view.billing-address') }}
+                                </div>
+
+                                <div class="box-content">
+
+                                    @include ('admin::sales.address', ['address' => $order->shipping_address])
+
+                                </div>
+                            </div>
+
+                            <div class="box">
+                                <div class="box-title">
+                                    {{ __('shop::app.customer.account.order.view.shipping-method') }}
+                                </div>
+
+                                <div class="box-content">
+
+                                    {{ $order->shipping_title }}
+
+                                </div>
+                            </div>
+
+                            <div class="box">
+                                <div class="box-title">
+                                    {{ __('shop::app.customer.account.order.view.payment-method') }}
+                                </div>
+
+                                <div class="box-content">
+                                    {{ core()->getConfigData('paymentmethods.' . $order->payment->method . '.title') }}
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+            </div>
+        
+        </div>
+
+    </div>
+
+@endsection
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/partials/sidemenu.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/partials/sidemenu.blade.php
index 7e3fb4f0d..3e4998dc7 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/partials/sidemenu.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/partials/sidemenu.blade.php
@@ -1,12 +1,13 @@
-{{--  <div class="side-menu-title mb-20" id="side-menu-title">
-    <strong>Menu</strong>
-    <i class="icon icon-arrow-down right" id="down-icon"></i>
-</div>  --}}
-
 <ul class="account-side-menu">
-    @foreach($menu->items as $key=>$value)
+    @foreach($menu->items as $menuItem)
 
-        <li><a href="{{ $value['url'] }}">{{ $value['name'] }}</a></li>
+        <li class="menu-item {{ $menu->getActive($menuItem) }}">
+            <a href="{{ $menuItem['url'] }}">
+                {{ $menuItem['name'] }}
+            </a>
+
+            <i class="icon angle-right-icon"></i>
+        </li>
 
     @endforeach
 </ul>
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/index.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/index.blade.php
index 8153763fd..f6fca6cc3 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/index.blade.php
@@ -1,4 +1,4 @@
-@inject ('productImageHelper', 'Webkul\Product\Product\ProductImage')
+@inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 
 @extends('shop::layouts.master')
 @section('content-wrapper')
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php
index 0c90c8cd5..5e8f30ac0 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/reviews/reviews.blade.php
@@ -1,4 +1,4 @@
-@inject ('productImageHelper', 'Webkul\Product\Product\ProductImage')
+@inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 
 @extends('shop::layouts.master')
 @section('content-wrapper')
diff --git a/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php b/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php
index 022577654..ff790f96f 100644
--- a/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/customers/account/wishlist/wishlist.blade.php
@@ -3,7 +3,7 @@
 @section('content-wrapper')
 
 <div class="account-content">
-    @inject ('productImageHelper', 'Webkul\Product\Product\ProductImage')
+    @inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 
     @include('shop::customers.account.partials.sidemenu')
 
diff --git a/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php b/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
index 3a7564f23..2f297f69c 100644
--- a/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
@@ -74,7 +74,7 @@
 
                 <?php $cart = cart()->getCart(); ?>
 
-                @inject ('productImageHelper', 'Webkul\Product\Product\ProductImage')
+                @inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 
                 <li class="cart-dropdown">
                     <span class="icon cart-icon"></span>
diff --git a/packages/Webkul/Shop/src/Resources/views/products/index.blade.php b/packages/Webkul/Shop/src/Resources/views/products/index.blade.php
index aeede3b00..cbf86e2ea 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/index.blade.php
@@ -19,7 +19,7 @@
 
                 @include ('shop::products.list.toolbar')
 
-                @inject ('toolbarHelper', 'Webkul\Product\Product\Toolbar')
+                @inject ('toolbarHelper', 'Webkul\Product\Helpers\Toolbar')
 
                 @if ($toolbarHelper->getCurrentMode() == 'grid')
                     <div class="product-grid-3">
diff --git a/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php b/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
index ef8f10c1f..2b0b55206 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/list/card.blade.php
@@ -1,6 +1,6 @@
 <div class="product-card">
 
-    @inject ('productImageHelper', 'Webkul\Product\Product\ProductImage')
+    @inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 
     <?php $productBaseImage = $productImageHelper->getProductBaseImage($product); ?>
 
diff --git a/packages/Webkul/Shop/src/Resources/views/products/list/toolbar.blade.php b/packages/Webkul/Shop/src/Resources/views/products/list/toolbar.blade.php
index 7ac644c27..b93e40f6c 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/list/toolbar.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/list/toolbar.blade.php
@@ -1,4 +1,4 @@
-@inject ('toolbarHelper', 'Webkul\Product\Product\Toolbar')
+@inject ('toolbarHelper', 'Webkul\Product\Helpers\Toolbar')
 
 <div class="top-toolbar mb-35">
 
diff --git a/packages/Webkul/Shop/src/Resources/views/products/price.blade.php b/packages/Webkul/Shop/src/Resources/views/products/price.blade.php
index acfa79ca2..9a17ee063 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/price.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/price.blade.php
@@ -1,6 +1,6 @@
 <div class="product-price">
 
-    @inject ('priceHelper', 'Webkul\Product\Product\Price')
+    @inject ('priceHelper', 'Webkul\Product\Helpers\Price')
 
     @if ($product->type == 'configurable')
 
diff --git a/packages/Webkul/Shop/src/Resources/views/products/review.blade.php b/packages/Webkul/Shop/src/Resources/views/products/review.blade.php
index 1b655b16f..1565f71bd 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/review.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/review.blade.php
@@ -1,4 +1,4 @@
-@inject ('reviewHelper', 'Webkul\Product\Product\Review')
+@inject ('reviewHelper', 'Webkul\Product\Helpers\Review')
 @if ($total = $reviewHelper->getTotalReviews($product))
 
     <div class="product-ratings mb-10">
diff --git a/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php b/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php
index ff30bddea..40f1f4999 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/reviews/create.blade.php
@@ -22,7 +22,7 @@
 
                 <div class="price">
 
-                    @inject ('priceHelper', 'Webkul\Product\Product\Price')
+                    @inject ('priceHelper', 'Webkul\Product\Helpers\Price')
 
                     @if ($product->type == 'configurable')
                         <span class="pro-price">{{ core()->currency($priceHelper->getMinimalPrice($product)) }}</span>
diff --git a/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php b/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php
index 988736451..e2e09c040 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/reviews/index.blade.php
@@ -1,5 +1,5 @@
-@inject ('reviewHelper', 'Webkul\Product\Product\Review')
-@inject ('priceHelper', 'Webkul\Product\Product\Price')
+@inject ('reviewHelper', 'Webkul\Product\Helpers\Review')
+@inject ('priceHelper', 'Webkul\Product\Helpers\Price')
 
 
 @extends('shop::layouts.master')
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
index 3f7f25fab..892bf28b7 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view.blade.php
@@ -65,6 +65,7 @@
                     </accordian>
 
                     @include ('shop::products.view.attributes')
+                    
                     @include ('shop::products.view.reviews')
                 </div>
             </form>
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/attributes.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/attributes.blade.php
index db5689179..5014a3a6f 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view/attributes.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view/attributes.blade.php
@@ -1,23 +1,25 @@
-@inject ('productViewHelper', 'Webkul\Product\Product\View')
+@inject ('productViewHelper', 'Webkul\Product\Helpers\View')
 
-<accordian :title="'{{ __('shop::app.products.specification') }}'" :active="false">
-    <div slot="header">
-        {{ __('shop::app.products.specification') }}
-        <i class="icon expand-icon right"></i>
-    </div>
+@if ($customAttributeValues = $productViewHelper->getAdditionalData($product))
+    <accordian :title="'{{ __('shop::app.products.specification') }}'" :active="false">
+        <div slot="header">
+            {{ __('shop::app.products.specification') }}
+            <i class="icon expand-icon right"></i>
+        </div>
 
-    <div slot="body">
-        <table class="full-specifications">
+        <div slot="body">
+            <table class="full-specifications">
 
-            @foreach ($productViewHelper->getAdditionalData($product) as $attribute)
+                @foreach ($customAttributeValues as $attribute)
 
-                <tr>
-                    <td>{{ $attribute['label'] }}</td>
-                    <td> - {{ $attribute['value'] }}</td>
-                </tr>
+                    <tr>
+                        <td>{{ $attribute['label'] }}</td>
+                        <td> - {{ $attribute['value'] }}</td>
+                    </tr>
 
-            @endforeach
+                @endforeach
 
-        </table>
-    </div>
-</accordian>
\ No newline at end of file
+            </table>
+        </div>
+    </accordian>
+@endif
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php
index 13736e778..d3c06fe6e 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view/configurable-options.blade.php
@@ -1,6 +1,6 @@
 @if ($product->type == 'configurable')
 
-    @inject ('configurableOptionHelper', 'Webkul\Product\Product\ConfigurableOption')
+    @inject ('configurableOptionHelper', 'Webkul\Product\Helpers\ConfigurableOption')
 
     <product-options>
         <!--<div class="attribute control-group has-error">
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/gallery.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/gallery.blade.php
index 63ea3288d..18671a86e 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view/gallery.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view/gallery.blade.php
@@ -1,4 +1,4 @@
-@inject ('productImageHelper', 'Webkul\Product\Product\ProductImage')
+@inject ('productImageHelper', 'Webkul\Product\Helpers\ProductImage')
 <?php $images = $productImageHelper->getGalleryImages($product); ?>
 
 <div class="product-image-group">
diff --git a/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php b/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php
index 8fc334b12..0a25d6656 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/view/reviews.blade.php
@@ -1,4 +1,4 @@
-@inject ('reviewHelper', 'Webkul\Product\Product\Review')
+@inject ('reviewHelper', 'Webkul\Product\Helpers\Review')
 @if ($total = $reviewHelper->getTotalReviews($product))
 <div class="rating-reviews">
     <div class="rating-header">
diff --git a/packages/Webkul/Tax/src/Database/Migrations/2018_08_30_064755_create_tax_categories_table.php b/packages/Webkul/Tax/src/Database/Migrations/2018_08_30_064755_create_tax_categories_table.php
index d80fa049f..df1ea393a 100644
--- a/packages/Webkul/Tax/src/Database/Migrations/2018_08_30_064755_create_tax_categories_table.php
+++ b/packages/Webkul/Tax/src/Database/Migrations/2018_08_30_064755_create_tax_categories_table.php
@@ -37,6 +37,6 @@ class CreateTaxCategoriesTable extends Migration
      */
     public function down()
     {
-        Schema::dropIfExists('tax_rules');
+        Schema::dropIfExists('tax_categories');
     }
 }
diff --git a/packages/Webkul/Tax/src/Http/Controllers/TaxCategoryController.php b/packages/Webkul/Tax/src/Http/Controllers/TaxCategoryController.php
index 7fd4562a6..e000e6733 100644
--- a/packages/Webkul/Tax/src/Http/Controllers/TaxCategoryController.php
+++ b/packages/Webkul/Tax/src/Http/Controllers/TaxCategoryController.php
@@ -5,7 +5,7 @@ namespace Webkul\Tax\Http\Controllers;
 use Illuminate\Http\Request;
 use Illuminate\Http\Response;
 use Webkul\Channel as Channel;
-use Webkul\Tax\Repositories\TaxCategoryRepository as TaxRule;
+use Webkul\Tax\Repositories\TaxCategoryRepository as TaxCategory;
 use Webkul\Tax\Repositories\TaxRateRepository as TaxRate;
 use Webkul\Tax\Repositories\TaxMapRepository as TaxMap;
 
@@ -25,23 +25,43 @@ class TaxCategoryController extends Controller
     protected $_config;
 
     /**
-     * Tax Rule Repository object
+     * TaxCategoryRepository
      *
-     * @var array
+     * @var mixed
      */
-    protected $taxRule;
+    protected $taxCategory;
+
+    /**
+     * TaxRateRepository
+     *
+     * @var mixed
+     */
+    protected $taxRate;
+
+    /**
+     * TaxMapRepository
+     *
+     * @var mixed
+     */
+    protected $taxMap;
 
     /**
      * Create a new controller instance.
      *
-     * @param  Webkul\Tax\Repositories\TaxCategoryRepository  $taxRule
+     * @param  Webkul\Tax\Repositories\TaxCategoryRepository $taxCategory
+     * @param  Webkul\Tax\Repositories\TaxRateRepository     $taxRate
+     * @param  Webkul\Tax\Repositories\TaxMapRepository      $taxMap
      * @return void
      */
-    public function __construct(TaxRule $taxRule, TaxRate $taxRate, TaxMap $taxMap)
+    public function __construct(
+        TaxCategory $taxCategory, 
+        TaxRate $taxRate,
+        TaxMap $taxMap
+    )
     {
         $this->middleware('admin');
 
-        $this->taxRule = $taxRule;
+        $this->taxCategory = $taxCategory;
 
         $this->taxRate = $taxRate;
 
@@ -52,7 +72,7 @@ class TaxCategoryController extends Controller
 
     /**
      * Function to show
-     * the tax rule form
+     * the tax category form
      *
      * @return view
      */
@@ -63,7 +83,7 @@ class TaxCategoryController extends Controller
 
     /**
      * Function to create
-     * the tax rule.
+     * the tax category.
      *
      * @return view
      */
@@ -77,50 +97,44 @@ class TaxCategoryController extends Controller
             'description' => 'required|string'
         ]);
 
-        if($currentTaxRule = $this->taxRule->create(request()->input())) {
-            $allTaxRules = $data['taxrates'];
+        if($currentTaxCategory = $this->taxCategory->create(request()->input())) {
+            $allTaxCategorys = $data['taxrates'];
 
-            $this->taxRule->onlyAttach($currentTaxRule->id, $allTaxRules);
+            $this->taxCategory->onlyAttach($currentTaxCategory->id, $allTaxCategorys);
 
-            session()->flash('success', 'New Tax Rule Created');
+            session()->flash('success', 'New Tax Category Created');
 
             return redirect()->route($this->_config['redirect']);
         } else {
-            session()->flash('error', 'Cannot create the tax rule');
+            session()->flash('error', 'Cannot create the tax category');
         }
 
         return view($this->_config['view']);
     }
 
     /**
-     * To show the edit
-     * form form the tax
-     * rule
+     * To show the edit form form the tax category
      *
      * @return view
      */
 
-    public function edit($id) {
-
-        $taxRates = core()->withRates($id)->toArray();
-
-        $taxRule = $this->taxRule->findByField('id', $id)->toArray();
-
-        return view($this->_config['view'])->with('data', [$taxRule, $taxRates]);
+    public function edit($id)
+    {
+        $taxCategory = $this->taxCategory->findOrFail($id);
 
+        return view($this->_config['view'], compact('taxCategory'));
     }
 
     /**
-     * To update the
-     * tax rule
+     * To update the tax category
      *
      * @return view
      */
 
     public function update($id) {
-        //return the tax rule data with the mapping table data also,
+        //return the tax category data with the mapping table data also,
         //allow the user to change the tax rates associated with the
-        // rule also.
+        // category also.
         $this->validate(request(), [
             'channel' => 'required|numeric',
             'code' => 'required|string|unique:tax_categories,id,'.$id,
@@ -138,7 +152,7 @@ class TaxCategoryController extends Controller
         $data['description'] = request()->input('description');
 
         if($this->taxRate->update($data, $id)) {
-            $this->taxRule->syncAndDetach($id, request()->input('taxrates'));
+            $this->taxCategory->syncAndDetach($id, request()->input('taxrates'));
 
             session()->flash('success', 'Tax Category is successfully edited.');
 
@@ -151,17 +165,16 @@ class TaxCategoryController extends Controller
     }
 
     /**
-     * Destroy a tax rule
+     * Destroy a tax category
      *
      * @return mixed
      */
 
     public function destroy($id) {
-        if($this->taxRule()->delete($id)) {
-            session()->flash('success', 'The tax rule is successfully deleted');
+        if($this->taxCategory()->delete($id)) {
+            session()->flash('success', 'The tax category is successfully deleted');
 
             return redirect()->back();
         }
     }
-
 }
\ No newline at end of file
diff --git a/packages/Webkul/Tax/src/Http/Controllers/TaxController.php b/packages/Webkul/Tax/src/Http/Controllers/TaxController.php
index 616a3b234..95c4c0acb 100644
--- a/packages/Webkul/Tax/src/Http/Controllers/TaxController.php
+++ b/packages/Webkul/Tax/src/Http/Controllers/TaxController.php
@@ -5,7 +5,7 @@ namespace Webkul\Tax\Http\Controllers;
 use Illuminate\Http\Request;
 use Illuminate\Http\Response;
 use Webkul\Core\Repositories\ChannelRepository as Channel;
-use Webkul\Tax\Repositories\TaxCategoryRepository as TaxRule;
+use Webkul\Tax\Repositories\TaxCategoryRepository as TaxCategory;
 use Webkul\Tax\Repositories\TaxRateRepository as TaxRate;
 use Webkul\Tax\Repositories\TaxMapRepository as TaxMap;
 
@@ -33,11 +33,11 @@ class TaxController extends Controller
     protected $channel;
 
     /**
-     * Tax Rule Repository object
+     * Tax Category Repository object
      *
      * @var array
      */
-    protected $taxRule;
+    protected $taxCategory;
 
     /**
      * Tax Rate Repository object
@@ -56,19 +56,19 @@ class TaxController extends Controller
     /**
      * Create a new controller instance.
      *
-     * @param  Webkul\Core\Repositories\ChannelRepository  $channel
-     * @param  Webkul\Tax\Repositories\TaxCategoryRepository  $taxRule
-     * @param  Webkul\Tax\Repositories\TaxRateRepository  $taxRate
-     * @param  Webkul\Tax\Repositories\TaxMapRepository  $taxMap
+     * @param  Webkul\Core\Repositories\ChannelRepository    $channel
+     * @param  Webkul\Tax\Repositories\TaxCategoryRepository $taxCategory
+     * @param  Webkul\Tax\Repositories\TaxRateRepository     $taxRate
+     * @param  Webkul\Tax\Repositories\TaxMapRepository      $taxMap
      * @return void
      */
-    public function __construct(Channel $channel, TaxRule $taxRule, TaxRate $taxRate, TaxMap $taxMap)
+    public function __construct(Channel $channel, TaxCategory $taxCategory, TaxRate $taxRate, TaxMap $taxMap)
     {
         $this->middleware('admin');
 
         $this->channel = $channel;
 
-        $this->taxRule = $taxRule;
+        $this->taxCategory = $taxCategory;
 
         $this->taxRate = $taxRate;
 
diff --git a/packages/Webkul/Tax/src/Repositories/TaxCategoryRepository.php b/packages/Webkul/Tax/src/Repositories/TaxCategoryRepository.php
index 617b925d3..9f65b366d 100644
--- a/packages/Webkul/Tax/src/Repositories/TaxCategoryRepository.php
+++ b/packages/Webkul/Tax/src/Repositories/TaxCategoryRepository.php
@@ -5,7 +5,7 @@ namespace Webkul\Tax\Repositories;
 use Webkul\Core\Eloquent\Repository;
 
 /**
- * Tax Rule Reposotory
+ * Tax Category Reposotory
  *
  * @author    Prashant Singh <prashant.singh852@webkul.com>
  * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com)
@@ -28,9 +28,9 @@ class TaxCategoryRepository extends Repository
      */
     public function create(array $data)
     {
-        $taxRule = $this->model->create($data);
+        $taxCategory = $this->model->create($data);
 
-        return $taxRule;
+        return $taxCategory;
     }
 
     /**
@@ -42,9 +42,9 @@ class TaxCategoryRepository extends Repository
      */
     public function update(array $data, $id, $attribute = "id")
     {
-        $taxRule = $this->find($id);
+        $taxCategory = $this->find($id);
 
-        $taxRule->update($data);
+        $taxCategory->update($data);
 
         return $taxmap;
     }
diff --git a/packages/Webkul/Ui/src/Resources/assets/images/Icon-Customers-Active.svg b/packages/Webkul/Ui/src/Resources/assets/images/Icon-Customers-Active.svg
new file mode 100644
index 000000000..1ace763d9
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/assets/images/Icon-Customers-Active.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="48px" height="48px" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 50 (54983) - http://www.bohemiancoding.com/sketch -->
+    <title>Icon-Customers-Active</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Icon-Customers-Active" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+        <g transform="translate(9.000000, 8.000000)" id="Combined-Shape" stroke="#0041FF" stroke-width="2">
+            <path d="M0.0694092808,30.8793785 C0.789639214,23.4815617 7.02613841,17.6997284 14.6130571,17.6997284 C22.1999758,17.6997284 28.436475,23.4815617 29.156705,30.8793785 L0.0694092808,30.8793785 Z M14.5,13.6997284 C10.9101491,13.6997284 8,10.7895793 8,7.19972838 C8,3.60987751 10.9101491,0.699728384 14.5,0.699728384 C18.0898509,0.699728384 21,3.60987751 21,7.19972838 C21,10.7895793 18.0898509,13.6997284 14.5,13.6997284 Z"></path>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/app.scss b/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
index 0325a8463..96bf34e93 100644
--- a/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/app.scss
@@ -413,6 +413,7 @@ h2 {
     color: #333333;
     width: 750px;
     max-width: 100%;
+    position: relative;
 
     label {
         display: block;
@@ -479,6 +480,13 @@ h2 {
     &.has-error .control-error {
         display: block;
     }
+
+    &.price {
+        .currency-code {
+            vertical-align: middle;
+            display: inline-block;
+        }
+    }
 }
 
 .button-group {
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/icons.scss b/packages/Webkul/Ui/src/Resources/assets/sass/icons.scss
index 4b9536212..9a701a511 100644
--- a/packages/Webkul/Ui/src/Resources/assets/sass/icons.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/icons.scss
@@ -117,6 +117,13 @@
     height: 18px;
 }
 
+.sort-up-icon {
+    background-image: url("../images/Icon-Sort-Down.svg");
+    width: 18px;
+    height: 18px;
+    transform: rotate(180deg);
+}
+
 .primary-back-icon {
     background-image: url("../images/Icon-Back-Primary.svg");
     width: 24px;
@@ -196,6 +203,10 @@
         background-image: url("../images/Icon-Catalog-Active.svg");
     }
 
+    .customer-icon {
+        background-image: url("../images/Icon-Customers-Active.svg");
+    }
+
     .settings-icon {
         background-image: url("../images/Icon-Settings-Active.svg");
     }
@@ -218,6 +229,10 @@
         background-image: url("../images/Icon-Dashboard-Active.svg");
     }
 
+    &.customer-icon {
+        background-image: url("../images/Icon-Customers-Active.svg");
+    }
+
     &.sales-icon {
         background-image: url("../images/Icon-Sales-Active.svg");
     }
diff --git a/packages/Webkul/User/src/ACLCreator.php b/packages/Webkul/User/src/ACLCreator.php
index fa634f820..b5ef695e7 100644
--- a/packages/Webkul/User/src/ACLCreator.php
+++ b/packages/Webkul/User/src/ACLCreator.php
@@ -6,6 +6,8 @@ class ACLCreator {
 
 	public $items = [];
 
+	public $roles = [];
+
 	/**
 	 * Shortcut method for create a acl with a callback.
 	 * This will allow you to do things like fire an event on creation.
@@ -41,6 +43,8 @@ class ACLCreator {
 
 		$children = str_replace('.', '.children.', $key);
 		$this->array_set($this->items, $children, $item);
+
+		$this->roles[$route] = $key;
 	}
 
 	/**
diff --git a/packages/Webkul/User/src/Bouncer.php b/packages/Webkul/User/src/Bouncer.php
index 4d3196e31..7704437f0 100644
--- a/packages/Webkul/User/src/Bouncer.php
+++ b/packages/Webkul/User/src/Bouncer.php
@@ -5,16 +5,19 @@ namespace Webkul\User;
 class Bouncer
 {
     /**
-     * Checks if user has permission for certain action
+     * Checks if user allowed or not for certain action
      *
      * @param  String $permission
      * @return Void
      */
-    public static function hasPermission($permission)
+    public function hasPermission($permission)
     {
-        if(!auth()->check() || !auth()->user()->hasPermission($permission))
-            return false;
-
+        if(auth()->guard('admin')->check() && auth()->guard('admin')->user()->role->permission_type == 'all') {
+            return true;
+        } else {
+            if(!auth()->guard('admin')->check() || !auth()->guard('admin')->user()->hasPermission($permission))
+                return false;
+        }
         return true;
     }
 
@@ -26,7 +29,7 @@ class Bouncer
      */
     public static function allow($permission)
     {
-        if(!auth()->check() || !auth()->user()->hasPermission($permission))
+        if(!auth()->guard('admin')->check() || !auth()->guard('admin')->user()->hasPermission($permission))
             abort(401, 'This action is unauthorized.');
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/User/src/Http/Controllers/RoleController.php b/packages/Webkul/User/src/Http/Controllers/RoleController.php
index 06c66317d..fb312cf30 100644
--- a/packages/Webkul/User/src/Http/Controllers/RoleController.php
+++ b/packages/Webkul/User/src/Http/Controllers/RoleController.php
@@ -125,6 +125,14 @@ class RoleController extends Controller
      */
     public function destroy($id)
     {
-        //
+        if($this->role->count() == 1) {
+            session()->flash('error', 'At least one role is required.');
+        } else {
+            $this->role->delete($id);
+
+            session()->flash('success', 'Role source deleted successfully.');
+        }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/User/src/Http/Controllers/UserController.php b/packages/Webkul/User/src/Http/Controllers/UserController.php
index e89e3c8a8..f562b793b 100644
--- a/packages/Webkul/User/src/Http/Controllers/UserController.php
+++ b/packages/Webkul/User/src/Http/Controllers/UserController.php
@@ -138,6 +138,14 @@ class UserController extends Controller
      */
     public function destroy($id)
     {
-        //
+        if($this->admin->count() == 1) {
+            session()->flash('error', 'At least one admin is required.');
+        } else {
+            $this->admin->delete($id);
+
+            session()->flash('success', 'Admin source deleted successfully.');
+        }
+
+        return redirect()->back();
     }
 }
\ No newline at end of file
diff --git a/packages/Webkul/User/src/Http/Middleware/RedirectIfNotAdmin.php b/packages/Webkul/User/src/Http/Middleware/Bouncer.php
similarity index 50%
rename from packages/Webkul/User/src/Http/Middleware/RedirectIfNotAdmin.php
rename to packages/Webkul/User/src/Http/Middleware/Bouncer.php
index 25fd8a154..3c4efd1bd 100644
--- a/packages/Webkul/User/src/Http/Middleware/RedirectIfNotAdmin.php
+++ b/packages/Webkul/User/src/Http/Middleware/Bouncer.php
@@ -5,7 +5,7 @@ namespace Webkul\User\Http\Middleware;
 use Closure;
 use Illuminate\Support\Facades\Auth;
 
-class RedirectIfNotAdmin
+class Bouncer
 {
     /**
     * Handle an incoming request.
@@ -21,6 +21,24 @@ class RedirectIfNotAdmin
             return redirect()->route('admin.session.create');
         }
 
+        $this->checkIfAuthorized($request);
+
         return $next($request);
     }
+
+    public function checkIfAuthorized($request)
+    {
+        if(!$role = auth()->guard('admin')->user()->role)
+            abort(401, 'This action is unauthorized.');
+
+        if($role->permission_type == 'all'){
+            return;
+        } else {
+            $acl = app('acl');
+
+            if($acl && isset($acl->roles[Route::currentRouteName()])) {
+                bouncer()->allow($acl->roles[Route::currentRouteName()]);
+            }
+        }
+    }
 }
\ No newline at end of file
diff --git a/packages/Webkul/User/src/Http/helpers.php b/packages/Webkul/User/src/Http/helpers.php
new file mode 100644
index 000000000..f6ad1d7d2
--- /dev/null
+++ b/packages/Webkul/User/src/Http/helpers.php
@@ -0,0 +1,8 @@
+<?php
+    if (! function_exists('bouncer')) {
+        function bouncer()
+        {
+            return app()->make(\Webkul\User\Bouncer::class);
+        }
+    }
+?>
\ No newline at end of file
diff --git a/packages/Webkul/User/src/Providers/UserServiceProvider.php b/packages/Webkul/User/src/Providers/UserServiceProvider.php
index b7f832766..4bd31e551 100644
--- a/packages/Webkul/User/src/Providers/UserServiceProvider.php
+++ b/packages/Webkul/User/src/Providers/UserServiceProvider.php
@@ -8,7 +8,7 @@ use Illuminate\Routing\Router;
 use Illuminate\Support\Facades\Event;
 use Webkul\User\Bouncer;
 use Webkul\User\Facades\Bouncer as BouncerFacade;
-use Webkul\User\Http\Middleware\RedirectIfNotAdmin;
+use Webkul\User\Http\Middleware\Bouncer as BouncerMiddleware;
 use Webkul\User\ACLCreator;
 
 class UserServiceProvider extends ServiceProvider
@@ -20,7 +20,9 @@ class UserServiceProvider extends ServiceProvider
      */
     public function boot(Router $router)
     {
-        $router->aliasMiddleware('admin', RedirectIfNotAdmin::class);
+        include __DIR__ . '/../Http/helpers.php';
+
+        $router->aliasMiddleware('admin', BouncerMiddleware::class);
 
         $this->loadMigrationsFrom(__DIR__ . '/../Database/Migrations');
 
diff --git a/public/themes/default/assets/css/shop.css b/public/themes/default/assets/css/shop.css
index a523c4722..d2b3e8cf9 100644
--- a/public/themes/default/assets/css/shop.css
+++ b/public/themes/default/assets/css/shop.css
@@ -1769,7 +1769,7 @@ section.product-detail div.layouter form .details .description {
 
 section.product-detail div.layouter form .details .full-specifications td {
   padding: 10px 0;
-  color: #A5A5A5;
+  color: #5E5E5E;
 }
 
 section.product-detail div.layouter form .details .full-specifications td:first-child {
@@ -2592,8 +2592,8 @@ section.review .review-layouter .review-info .review-detail .rating-calculate .p
   border: 1px solid #E8E8E8;
   width: 25%;
   height: 100%;
-  text-transform: capitalize;
   color: #A5A5A5;
+  position: relative;
 }
 
 .account-content .account-side-menu li {
@@ -2617,6 +2617,16 @@ section.review .review-layouter .review-info .review-detail .rating-calculate .p
   text-align: center;
 }
 
+.account-content .account-side-menu li a {
+  color: #5E5E5E;
+}
+
+.account-content .account-side-menu li .icon {
+  display: none;
+  position: absolute;
+  right: 12px;
+}
+
 .account-content .account-side-menu li:first-child {
   border-top: none;
 }
@@ -2625,16 +2635,23 @@ section.review .review-layouter .review-info .review-detail .rating-calculate .p
   border-bottom: none;
 }
 
-.account-content .account-side-menu li.active {
+.account-content .account-side-menu li.active a {
   color: #0031F0;
 }
 
+.account-content .account-side-menu li.active .icon {
+  display: inline-block;
+}
+
 .account-content .account-layout {
-  margin-left: 5.5%;
-  margin-top: 1%;
+  margin-left: 40px;
   width: 100%;
 }
 
+.account-content .account-layout .account-head {
+  margin-bottom: 20px;
+}
+
 .account-table-content {
   color: #242424;
   margin-top: 1.4%;
@@ -2661,3 +2678,88 @@ section.review .review-layouter .review-info .review-detail .rating-calculate .p
   min-height: 345px;
   padding: 25px;
 }
+
+.sale-container {
+  color: #5E5E5E;
+}
+
+.sale-container .sale-section .secton-title {
+  font-size: 18px;
+  color: #8E8E8E;
+  padding: 15px 0;
+  border-bottom: 1px solid #E8E8E8;
+}
+
+.sale-container .sale-section .section-content {
+  display: block;
+  padding: 20px 0;
+  border-bottom: 1px solid #E8E8E8;
+}
+
+.sale-container .sale-section .section-content .row {
+  display: block;
+  padding: 7px 0;
+}
+
+.sale-container .sale-section .section-content .row .title {
+  width: 200px;
+  letter-spacing: -0.26px;
+  display: inline-block;
+}
+
+.sale-container .sale-section .section-content .row .value {
+  letter-spacing: -0.26px;
+  display: inline-block;
+}
+
+.sale-container .sale-section .section-content .order-box-container {
+  display: inline-block;
+  width: 100%;
+}
+
+.sale-container .sale-section .section-content .order-box-container .box {
+  float: left;
+  width: 25%;
+}
+
+.sale-container .sale-section .section-content .order-box-container .box .box-title {
+  padding: 10px 0;
+  font-size: 18px;
+  color: #8E8E8E;
+}
+
+.sale-container .sale-section .section-content .order-box-container .box .box-content {
+  color: #3A3A3A;
+}
+
+.sale-container .sale-section .section-content .qty-row {
+  display: block;
+}
+
+.sale-container .totals {
+  padding-top: 20px;
+  display: inline-block;
+  width: 100%;
+  border-top: solid 1px #E8E8E8;
+}
+
+.sale-container .totals .sale-summary {
+  height: 130px;
+  float: right;
+  border-collapse: collapse;
+}
+
+.sale-container .totals .sale-summary tr td {
+  padding: 5px 8px;
+  width: auto;
+  color: #3A3A3A;
+}
+
+.sale-container .totals .sale-summary tr.bold {
+  font-weight: 600;
+  font-size: 15px;
+}
+
+.sale-container .totals .sale-summary tr.border td {
+  border-bottom: 1px solid #E8E8E8;
+}
diff --git a/public/themes/default/assets/js/shop.js b/public/themes/default/assets/js/shop.js
index 198b1ae5f..e21cad741 100644
--- a/public/themes/default/assets/js/shop.js
+++ b/public/themes/default/assets/js/shop.js
@@ -31526,7 +31526,7 @@ if (false) {
 /* 50 */
 /***/ (function(module, exports, __webpack_require__) {
 
-!function(t,e){ true?module.exports=e():"function"==typeof define&&define.amd?define("vue-slider-component",[],e):"object"==typeof exports?exports["vue-slider-component"]=e():t["vue-slider-component"]=e()}(this,function(){return function(t){function e(s){if(i[s])return i[s].exports;var r=i[s]={i:s,l:!1,exports:{}};return t[s].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var i={};return e.m=t,e.c=i,e.i=function(t){return t},e.d=function(t,i,s){e.o(t,i)||Object.defineProperty(t,i,{configurable:!1,enumerable:!0,get:s})},e.n=function(t){var i=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(i,"a",i),i},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=2)}([function(t,e,i){i(7);var s=i(5)(i(1),i(6),null,null);t.exports=s.exports},function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var s=function(){var t="undefined"!=typeof window?window.devicePixelRatio||1:1;return function(e){return Math.round(e*t)/t}}();e.default={name:"VueSliderComponent",props:{width:{type:[Number,String],default:"auto"},height:{type:[Number,String],default:6},data:{type:Array,default:null},dotSize:{type:Number,default:16},dotWidth:{type:Number,required:!1},dotHeight:{type:Number,required:!1},min:{type:Number,default:0},max:{type:Number,default:100},interval:{type:Number,default:1},show:{type:Boolean,default:!0},disabled:{type:[Boolean,Array],default:!1},piecewise:{type:Boolean,default:!1},tooltip:{type:[String,Boolean],default:"always"},eventType:{type:String,default:"auto"},direction:{type:String,default:"horizontal"},reverse:{type:Boolean,default:!1},lazy:{type:Boolean,default:!1},clickable:{type:Boolean,default:!0},speed:{type:Number,default:.5},realTime:{type:Boolean,default:!1},stopPropagation:{type:Boolean,default:!1},value:{type:[String,Number,Array,Object],default:0},piecewiseLabel:{type:Boolean,default:!1},debug:{type:Boolean,default:!0},fixed:{type:Boolean,default:!1},processDragable:{type:Boolean,default:!1},useKeyboard:{type:Boolean,default:!1},actionsKeyboard:{type:Array,default:function(){return[function(t){return t-1},function(t){return t+1}]}},tooltipMerge:{type:Boolean,default:!0},startAnimation:{type:Boolean,default:!1},sliderStyle:[Array,Object,Function],focusStyle:[Array,Object,Function],tooltipDir:[Array,String],formatter:[String,Function],mergeFormatter:[String,Function],piecewiseStyle:Object,disabledStyle:Object,piecewiseActiveStyle:Object,processStyle:Object,bgStyle:Object,tooltipStyle:[Array,Object,Function],disabledDotStyle:[Array,Object,Function],labelStyle:Object,labelActiveStyle:Object},data:function(){return{flag:!1,keydownFlag:null,focusFlag:!1,processFlag:!1,processSign:null,size:0,fixedValue:0,focusSlider:0,currentValue:0,currentSlider:0,isComponentExists:!0,isMounted:!1}},computed:{dotWidthVal:function(){return"number"==typeof this.dotWidth?this.dotWidth:this.dotSize},dotHeightVal:function(){return"number"==typeof this.dotHeight?this.dotHeight:this.dotSize},flowDirection:function(){return"vue-slider-"+this.direction+(this.reverse?"-reverse":"")},tooltipMergedPosition:function(){if(!this.isMounted)return{};var t=this.tooltipDirection[0];if(this.$refs.dot0){if("vertical"===this.direction){var e={};return e[t]="-"+(this.dotHeightVal/2-this.width/2+9)+"px",e}var i={};return i[t]="-"+(this.dotWidthVal/2-this.height/2+9)+"px",i.left="50%",i}},tooltipDirection:function(){var t=this.tooltipDir||("vertical"===this.direction?"left":"top");return Array.isArray(t)?this.isRange?t:t[1]:this.isRange?[t,t]:t},tooltipStatus:function(){return"hover"===this.tooltip&&this.flag?"vue-slider-always":this.tooltip?"vue-slider-"+this.tooltip:""},tooltipClass:function(){return["vue-slider-tooltip-"+this.tooltipDirection,"vue-slider-tooltip"]},disabledArray:function(){return Array.isArray(this.disabled)?this.disabled:[this.disabled,this.disabled]},boolDisabled:function(){return this.disabledArray.every(function(t){return!0===t})},isDisabled:function(){return"none"===this.eventType||this.boolDisabled},disabledClass:function(){return this.boolDisabled?"vue-slider-disabled":""},stateClass:function(){return{"vue-slider-state-process-drag":this.processFlag,"vue-slider-state-drag":this.flag&&!this.processFlag&&!this.keydownFlag,"vue-slider-state-focus":this.focusFlag}},isRange:function(){return Array.isArray(this.value)},slider:function(){return this.isRange?[this.$refs.dot0,this.$refs.dot1]:this.$refs.dot},minimum:function(){return this.data?0:this.min},val:{get:function(){return this.data?this.isRange?[this.data[this.currentValue[0]],this.data[this.currentValue[1]]]:this.data[this.currentValue]:this.currentValue},set:function(t){if(this.data)if(this.isRange){var e=this.data.indexOf(t[0]),i=this.data.indexOf(t[1]);e>-1&&i>-1&&(this.currentValue=[e,i])}else{var s=this.data.indexOf(t);s>-1&&(this.currentValue=s)}else this.currentValue=t}},currentIndex:function(){return this.isRange?this.data?this.currentValue:[this.getIndexByValue(this.currentValue[0]),this.getIndexByValue(this.currentValue[1])]:this.getIndexByValue(this.currentValue)},indexRange:function(){return this.isRange?this.currentIndex:[0,this.currentIndex]},maximum:function(){return this.data?this.data.length-1:this.max},multiple:function(){var t=(""+this.interval).split(".")[1];return t?Math.pow(10,t.length):1},spacing:function(){return this.data?1:this.interval},total:function(){return this.data?this.data.length-1:(Math.floor((this.maximum-this.minimum)*this.multiple)%(this.interval*this.multiple)!=0&&this.printError("Prop[interval] is illegal, Please make sure that the interval can be divisible"),(this.maximum-this.minimum)/this.interval)},gap:function(){return this.size/this.total},position:function(){return this.isRange?[(this.currentValue[0]-this.minimum)/this.spacing*this.gap,(this.currentValue[1]-this.minimum)/this.spacing*this.gap]:(this.currentValue-this.minimum)/this.spacing*this.gap},limit:function(){return this.isRange?this.fixed?[[0,(this.total-this.fixedValue)*this.gap],[this.fixedValue*this.gap,this.size]]:[[0,this.position[1]],[this.position[0],this.size]]:[0,this.size]},valueLimit:function(){return this.isRange?this.fixed?[[this.minimum,this.maximum-this.fixedValue*(this.spacing*this.multiple)/this.multiple],[this.minimum+this.fixedValue*(this.spacing*this.multiple)/this.multiple,this.maximum]]:[[this.minimum,this.currentValue[1]],[this.currentValue[0],this.maximum]]:[this.minimum,this.maximum]},idleSlider:function(){return 0===this.currentSlider?1:0},wrapStyles:function(){return"vertical"===this.direction?{height:"number"==typeof this.height?this.height+"px":this.height,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}:{width:"number"==typeof this.width?this.width+"px":this.width,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}},sliderStyles:function(){return Array.isArray(this.sliderStyle)?this.isRange?this.sliderStyle:this.sliderStyle[1]:"function"==typeof this.sliderStyle?this.sliderStyle(this.val,this.currentIndex):this.isRange?[this.sliderStyle,this.sliderStyle]:this.sliderStyle},focusStyles:function(){return Array.isArray(this.focusStyle)?this.isRange?this.focusStyle:this.focusStyle[1]:"function"==typeof this.focusStyle?this.focusStyle(this.val,this.currentIndex):this.isRange?[this.focusStyle,this.focusStyle]:this.focusStyle},disabledDotStyles:function(){var t=this.disabledDotStyle;if(Array.isArray(t))return t;if("function"==typeof t){var e=t(this.val,this.currentIndex);return Array.isArray(e)?e:[e,e]}return t?[t,t]:[{backgroundColor:"#ccc"},{backgroundColor:"#ccc"}]},tooltipStyles:function(){return Array.isArray(this.tooltipStyle)?this.isRange?this.tooltipStyle:this.tooltipStyle[1]:"function"==typeof this.tooltipStyle?this.tooltipStyle(this.val,this.currentIndex):this.isRange?[this.tooltipStyle,this.tooltipStyle]:this.tooltipStyle},elemStyles:function(){return"vertical"===this.direction?{width:this.width+"px",height:"100%"}:{height:this.height+"px"}},dotStyles:function(){return"vertical"===this.direction?{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",left:-(this.dotWidthVal-this.width)/2+"px"}:{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",top:-(this.dotHeightVal-this.height)/2+"px"}},piecewiseDotStyle:function(){return"vertical"===this.direction?{width:this.width+"px",height:this.width+"px"}:{width:this.height+"px",height:this.height+"px"}},piecewiseDotWrap:function(){if(!this.piecewise&&!this.piecewiseLabel)return!1;for(var t=[],e=0;e<=this.total;e++){var i="vertical"===this.direction?{bottom:this.gap*e-this.width/2+"px",left:0}:{left:this.gap*e-this.height/2+"px",top:0},s=this.reverse?this.total-e:e,r=this.data?this.data[s]:this.spacing*s+this.min;t.push({style:i,label:this.formatter?this.formatting(r):r,inRange:s>=this.indexRange[0]&&s<=this.indexRange[1]})}return t}},watch:{value:function(t){this.flag||this.setValue(t,!0)},max:function(t){if(t<this.min)return this.printError("The maximum value can not be less than the minimum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},min:function(t){if(t>this.max)return this.printError("The minimum value can not be greater than the maximum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},show:function(t){var e=this;t&&!this.size&&this.$nextTick(function(){e.refresh()})},fixed:function(){this.computedFixedValue()}},methods:{bindEvents:function(){document.addEventListener("touchmove",this.moving,{passive:!1}),document.addEventListener("touchend",this.moveEnd,{passive:!1}),document.addEventListener("mousedown",this.blurSlider),document.addEventListener("mousemove",this.moving),document.addEventListener("mouseup",this.moveEnd),document.addEventListener("mouseleave",this.moveEnd),document.addEventListener("keydown",this.handleKeydown),document.addEventListener("keyup",this.handleKeyup),window.addEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.addEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.addEventListener("transitionend",this.handleOverlapTooltip))},unbindEvents:function(){document.removeEventListener("touchmove",this.moving),document.removeEventListener("touchend",this.moveEnd),document.removeEventListener("mousedown",this.blurSlider),document.removeEventListener("mousemove",this.moving),document.removeEventListener("mouseup",this.moveEnd),document.removeEventListener("mouseleave",this.moveEnd),document.removeEventListener("keydown",this.handleKeydown),document.removeEventListener("keyup",this.handleKeyup),window.removeEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.removeEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.removeEventListener("transitionend",this.handleOverlapTooltip))},handleKeydown:function(t){if(!this.useKeyboard||!this.focusFlag)return!1;switch(t.keyCode){case 37:case 40:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[0]);break;case 38:case 39:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[1])}},handleKeyup:function(){this.keydownFlag&&(this.keydownFlag=!1,this.flag=!1)},changeFocusSlider:function(t){var e=this;if(this.isRange){var i=this.currentIndex.map(function(i,s){if(s===e.focusSlider||e.fixed){var r=t(i),o=e.fixed?e.valueLimit[s]:[0,e.total];if(r<=o[1]&&r>=o[0])return r}return i});i[0]>i[1]&&(this.focusSlider=0===this.focusSlider?1:0,i=i.reverse()),this.setIndex(i)}else this.setIndex(t(this.currentIndex))},blurSlider:function(t){var e=this.isRange?this.$refs["dot"+this.focusSlider]:this.$refs.dot;if(!e||e===t.target)return!1;this.focusFlag=!1},formatting:function(t){return"string"==typeof this.formatter?this.formatter.replace(/\{value\}/,t):this.formatter(t)},mergeFormatting:function(t,e){return"string"==typeof this.mergeFormatter?this.mergeFormatter.replace(/\{(value1|value2)\}/g,function(i,s){return"value1"===s?t:e}):this.mergeFormatter(t,e)},getPos:function(t){return this.realTime&&this.getStaticData(),"vertical"===this.direction?this.reverse?t.pageY-this.offset:this.size-(t.pageY-this.offset):this.reverse?this.size-(t.clientX-this.offset):t.clientX-this.offset},processClick:function(t){this.fixed&&t.stopPropagation()},wrapClick:function(t){var e=this;if(this.isDisabled||!this.clickable||this.processFlag)return!1;var i=this.getPos(t);if(this.isRange)if(this.disabledArray.every(function(t){return!1===t}))this.currentSlider=i>(this.position[1]-this.position[0])/2+this.position[0]?1:0;else if(this.disabledArray[0]){if(i<this.position[0])return!1;this.currentSlider=1}else if(this.disabledArray[1]){if(i>this.position[1])return!1;this.currentSlider=0}if(this.disabledArray[this.currentSlider])return!1;if(this.setValueOnPos(i),this.isRange&&this.tooltipMerge){var s=setInterval(function(){return e.handleOverlapTooltip()},16.7);setTimeout(function(){return window.clearInterval(s)},1e3*this.speed)}},moveStart:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,i=arguments[2];if(this.disabledArray[e])return!1;if(this.stopPropagation&&t.stopPropagation(),this.isRange&&(this.currentSlider=e,i)){if(!this.processDragable)return!1;this.processFlag=!0,this.processSign={pos:this.position,start:this.getPos(t.targetTouches&&t.targetTouches[0]?t.targetTouches[0]:t)}}!i&&this.useKeyboard&&(this.focusFlag=!0,this.focusSlider=e),this.flag=!0,this.$emit("drag-start",this)},moving:function(t){if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;t.preventDefault(),t.targetTouches&&t.targetTouches[0]&&(t=t.targetTouches[0]),this.processFlag?(this.currentSlider=0,this.setValueOnPos(this.processSign.pos[0]+this.getPos(t)-this.processSign.start,!0),this.currentSlider=1,this.setValueOnPos(this.processSign.pos[1]+this.getPos(t)-this.processSign.start,!0)):this.setValueOnPos(this.getPos(t),!0),this.isRange&&this.tooltipMerge&&this.handleOverlapTooltip()},moveEnd:function(t){var e=this;if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;this.$emit("drag-end",this),this.lazy&&this.isDiff(this.val,this.value)&&this.syncValue(),this.flag=!1,window.setTimeout(function(){e.processFlag=!1},0),this.setPosition()},setValueOnPos:function(t,e){var i=this.isRange?this.limit[this.currentSlider]:this.limit,s=this.isRange?this.valueLimit[this.currentSlider]:this.valueLimit;if(t>=i[0]&&t<=i[1]){this.setTransform(t);var r=this.getValueByIndex(Math.round(t/this.gap));this.setCurrentValue(r,e),this.isRange&&this.fixed&&(this.setTransform(t+this.fixedValue*this.gap*(0===this.currentSlider?1:-1),!0),this.setCurrentValue((r*this.multiple+this.fixedValue*this.spacing*this.multiple*(0===this.currentSlider?1:-1))/this.multiple,e,!0))}else t<i[0]?(this.setTransform(i[0]),this.setCurrentValue(s[0]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][0],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][0],e,!0)):this.fixed||this.disabledArray[0]||1!==this.currentSlider||(this.focusSlider=0,this.currentSlider=0)):(this.setTransform(i[1]),this.setCurrentValue(s[1]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][1],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][1],e,!0)):this.fixed||this.disabledArray[1]||0!==this.currentSlider||(this.focusSlider=1,this.currentSlider=1))},isDiff:function(t,e){return Object.prototype.toString.call(t)!==Object.prototype.toString.call(e)||(Array.isArray(t)&&t.length===e.length?t.some(function(t,i){return t!==e[i]}):t!==e)},setCurrentValue:function(t,e,i){var s=i?this.idleSlider:this.currentSlider;if(t<this.minimum||t>this.maximum)return!1;this.isRange?this.isDiff(this.currentValue[s],t)&&(this.currentValue.splice(s,1,t),this.lazy&&this.flag||this.syncValue()):this.isDiff(this.currentValue,t)&&(this.currentValue=t,this.lazy&&this.flag||this.syncValue()),e||this.setPosition()},getValueByIndex:function(t){return(this.spacing*this.multiple*t+this.minimum*this.multiple)/this.multiple},getIndexByValue:function(t){return Math.round((t-this.minimum)*this.multiple)/(this.spacing*this.multiple)},setIndex:function(t){if(Array.isArray(t)&&this.isRange){var e=void 0;e=this.data?[this.data[t[0]],this.data[t[1]]]:[this.getValueByIndex(t[0]),this.getValueByIndex(t[1])],this.setValue(e)}else t=this.getValueByIndex(t),this.isRange&&(this.currentSlider=t>(this.currentValue[1]-this.currentValue[0])/2+this.currentValue[0]?1:0),this.setCurrentValue(t)},setValue:function(t,e,i){var s=this;if(this.isDiff(this.val,t)){var r=this.limitValue(t);this.val=this.isRange?r.concat():r,this.computedFixedValue(),this.syncValue(e)}this.$nextTick(function(){return s.setPosition(i)})},computedFixedValue:function(){if(!this.fixed)return this.fixedValue=0,!1;this.fixedValue=this.currentIndex[1]-this.currentIndex[0]},setPosition:function(t){this.flag||this.setTransitionTime(void 0===t?this.speed:t),this.isRange?(this.setTransform(this.position[0],1===this.currentSlider),this.setTransform(this.position[1],0===this.currentSlider)):this.setTransform(this.position),this.flag||this.setTransitionTime(0)},setTransform:function(t,e){var i=e?this.idleSlider:this.currentSlider,r=s(("vertical"===this.direction?this.dotHeightVal/2-t:t-this.dotWidthVal/2)*(this.reverse?-1:1)),o="vertical"===this.direction?"translateY("+r+"px)":"translateX("+r+"px)",n=this.fixed?this.fixedValue*this.gap+"px":(0===i?this.position[1]-t:t-this.position[0])+"px",l=this.fixed?(0===i?t:t-this.fixedValue*this.gap)+"px":(0===i?t:this.position[0])+"px";this.isRange?(this.slider[i].style.transform=o,this.slider[i].style.WebkitTransform=o,this.slider[i].style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=n,this.$refs.process.style[this.reverse?"top":"bottom"]=l):(this.$refs.process.style.width=n,this.$refs.process.style[this.reverse?"right":"left"]=l)):(this.slider.style.transform=o,this.slider.style.WebkitTransform=o,this.slider.style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=t+"px",this.$refs.process.style[this.reverse?"top":"bottom"]=0):(this.$refs.process.style.width=t+"px",this.$refs.process.style[this.reverse?"right":"left"]=0))},setTransitionTime:function(t){if(t||this.$refs.process.offsetWidth,this.isRange){for(var e=0;e<this.slider.length;e++)this.slider[e].style.transitionDuration=t+"s",this.slider[e].style.WebkitTransitionDuration=t+"s";this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"}else this.slider.style.transitionDuration=t+"s",this.slider.style.WebkitTransitionDuration=t+"s",this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"},limitValue:function(t){var e=this;if(this.data)return t;var i=function(i){return i<e.min?(e.printError("The value of the slider is "+t+", the minimum value is "+e.min+", the value of this slider can not be less than the minimum value"),e.min):i>e.max?(e.printError("The value of the slider is "+t+", the maximum value is "+e.max+", the value of this slider can not be greater than the maximum value"),e.max):i};return this.isRange?t.map(function(t){return i(t)}):i(t)},syncValue:function(t){var e=this.isRange?this.val.concat():this.val;this.$emit("input",e),this.keydownFlag&&this.$emit("on-keypress",e),t||this.$emit("callback",e)},getValue:function(){return this.val},getIndex:function(){return this.currentIndex},getStaticData:function(){this.$refs.elem&&(this.size="vertical"===this.direction?this.$refs.elem.offsetHeight:this.$refs.elem.offsetWidth,this.offset="vertical"===this.direction?this.$refs.elem.getBoundingClientRect().top+window.pageYOffset||document.documentElement.scrollTop:this.$refs.elem.getBoundingClientRect().left)},refresh:function(){this.$refs.elem&&(this.getStaticData(),this.computedFixedValue(),this.setPosition())},printError:function(t){this.debug&&console.error("[VueSlider error]: "+t)},handleOverlapTooltip:function(){var t=this.tooltipDirection[0]===this.tooltipDirection[1];if(this.isRange&&t){var e=this.reverse?this.$refs.tooltip1:this.$refs.tooltip0,i=this.reverse?this.$refs.tooltip0:this.$refs.tooltip1,s=e.getBoundingClientRect().right,r=i.getBoundingClientRect().left,o=e.getBoundingClientRect().y,n=i.getBoundingClientRect().y+i.getBoundingClientRect().height,l="horizontal"===this.direction&&s>r,a="vertical"===this.direction&&n>o;l||a?this.handleDisplayMergedTooltip(!0):this.handleDisplayMergedTooltip(!1)}},handleDisplayMergedTooltip:function(t){var e=this.$refs.tooltip0,i=this.$refs.tooltip1,s=this.$refs.process.getElementsByClassName("vue-merged-tooltip")[0];t?(e.style.visibility="hidden",i.style.visibility="hidden",s.style.visibility="visible"):(e.style.visibility="visible",i.style.visibility="visible",s.style.visibility="hidden")}},mounted:function(){var t=this;if(this.isComponentExists=!0,"undefined"==typeof window||"undefined"==typeof document)return this.printError("window or document is undefined, can not be initialization.");this.$nextTick(function(){t.isComponentExists&&(t.getStaticData(),t.setValue(t.limitValue(t.value),!0,t.startAnimation?t.speed:0),t.bindEvents())}),this.isMounted=!0},beforeDestroy:function(){this.isComponentExists=!1,this.unbindEvents()}}},function(t,e,i){"use strict";var s=i(0);t.exports=s},function(t,e,i){e=t.exports=i(4)(),e.push([t.i,'.vue-slider-component{position:relative;box-sizing:border-box;-ms-user-select:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none}.vue-slider-component.vue-slider-disabled{opacity:.5;cursor:not-allowed}.vue-slider-component.vue-slider-has-label{margin-bottom:15px}.vue-slider-component.vue-slider-disabled .vue-slider-dot{cursor:not-allowed}.vue-slider-component .vue-slider{position:relative;display:block;border-radius:15px;background-color:#ccc}.vue-slider-component .vue-slider:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.vue-slider-component .vue-slider-process{position:absolute;border-radius:15px;background-color:#3498db;transition:all 0s;z-index:1}.vue-slider-component .vue-slider-process.vue-slider-process-dragable{cursor:pointer;z-index:3}.vue-slider-component.vue-slider-horizontal .vue-slider-process{width:0;height:100%;top:0;left:0;will-change:width}.vue-slider-component.vue-slider-vertical .vue-slider-process{width:100%;height:0;bottom:0;left:0;will-change:height}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-process{width:0;height:100%;top:0;right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-process{width:100%;height:0;top:0;left:0}.vue-slider-component .vue-slider-dot{position:absolute;border-radius:50%;background-color:#fff;box-shadow:.5px .5px 2px 1px rgba(0,0,0,.32);transition:all 0s;will-change:transform;cursor:pointer;z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-focus{box-shadow:0 0 2px 1px #3498db}.vue-slider-component .vue-slider-dot.vue-slider-dot-dragging{z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-disabled{z-index:4}.vue-slider-component.vue-slider-horizontal .vue-slider-dot{left:0}.vue-slider-component.vue-slider-vertical .vue-slider-dot{bottom:0}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-dot{right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-dot{top:0}.vue-slider-component .vue-slider-tooltip-wrap{display:none;position:absolute;z-index:9}.vue-slider-component .vue-slider-tooltip{display:block;font-size:14px;white-space:nowrap;padding:2px 5px;min-width:20px;text-align:center;color:#fff;border-radius:5px;border:1px solid #3498db;background-color:#3498db}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top{top:-9px;left:50%;transform:translate(-50%,-100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom{bottom:-9px;left:50%;transform:translate(-50%,100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left{top:50%;left:-9px;transform:translate(-100%,-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right{top:50%;right:-9px;transform:translate(100%,-50%)}.vue-slider-component .vue-slider-tooltip-top .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top .vue-slider-tooltip:before{content:"";position:absolute;bottom:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-top-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-merged-tooltip{display:block;visibility:hidden}.vue-slider-component .vue-slider-tooltip-bottom .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom .vue-slider-tooltip:before{content:"";position:absolute;top:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-bottom-color:inherit;transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-left .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left .vue-slider-tooltip:before{content:"";position:absolute;top:50%;right:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-left-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-tooltip-right .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right .vue-slider-tooltip:before{content:"";position:absolute;top:50%;left:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-right-color:inherit;transform:translateY(-50%)}.vue-slider-component .vue-slider-dot.vue-slider-hover:hover .vue-slider-tooltip-wrap{display:block}.vue-slider-component .vue-slider-dot.vue-slider-always .vue-slider-tooltip-wrap{display:block!important}.vue-slider-component .vue-slider-piecewise{position:absolute;width:100%;padding:0;margin:0;left:0;top:0;height:100%;list-style:none}.vue-slider-component .vue-slider-piecewise-item{position:absolute;width:8px;height:8px}.vue-slider-component .vue-slider-piecewise-dot{position:absolute;left:50%;top:50%;width:100%;height:100%;display:inline-block;background-color:rgba(0,0,0,.16);border-radius:50%;transform:translate(-50%,-50%);z-index:2;transition:all .3s}.vue-slider-component .vue-slider-piecewise-item:first-child .vue-slider-piecewise-dot,.vue-slider-component .vue-slider-piecewise-item:last-child .vue-slider-piecewise-dot{visibility:hidden}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-horizontal .vue-slider-piecewise-label{position:absolute;display:inline-block;top:100%;left:50%;white-space:nowrap;font-size:12px;color:#333;transform:translate(-50%,8px);visibility:visible}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-vertical .vue-slider-piecewise-label{position:absolute;display:inline-block;top:50%;left:100%;white-space:nowrap;font-size:12px;color:#333;transform:translate(8px,-50%);visibility:visible}.vue-slider-component .vue-slider-sr-only{clip:rect(1px,1px,1px,1px);height:1px;width:1px;overflow:hidden;position:absolute!important}',""])},function(t,e){t.exports=function(){var t=[];return t.toString=function(){for(var t=[],e=0;e<this.length;e++){var i=this[e];i[2]?t.push("@media "+i[2]+"{"+i[1]+"}"):t.push(i[1])}return t.join("")},t.i=function(e,i){"string"==typeof e&&(e=[[null,e,""]]);for(var s={},r=0;r<this.length;r++){var o=this[r][0];"number"==typeof o&&(s[o]=!0)}for(r=0;r<e.length;r++){var n=e[r];"number"==typeof n[0]&&s[n[0]]||(i&&!n[2]?n[2]=i:i&&(n[2]="("+n[2]+") and ("+i+")"),t.push(n))}},t}},function(t,e){t.exports=function(t,e,i,s){var r,o=t=t||{},n=typeof t.default;"object"!==n&&"function"!==n||(r=t,o=t.default);var l="function"==typeof o?o.options:o;if(e&&(l.render=e.render,l.staticRenderFns=e.staticRenderFns),i&&(l._scopeId=i),s){var a=Object.create(l.computed||null);Object.keys(s).forEach(function(t){var e=s[t];a[t]=function(){return e}}),l.computed=a}return{esModule:r,exports:o,options:l}}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("div",{directives:[{name:"show",rawName:"v-show",value:t.show,expression:"show"}],ref:"wrap",class:["vue-slider-component",t.flowDirection,t.disabledClass,t.stateClass,{"vue-slider-has-label":t.piecewiseLabel}],style:[t.wrapStyles,t.boolDisabled?t.disabledStyle:null],on:{click:t.wrapClick}},[i("div",{ref:"elem",staticClass:"vue-slider",style:[t.elemStyles,t.bgStyle],attrs:{"aria-hidden":"true"}},[t.isRange?[i("div",{key:"dot0",ref:"dot0",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[0]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[0]?t.disabledDotStyles[0]:null,t.sliderStyles[0],t.focusFlag&&0===t.focusSlider?t.focusStyles[0]:null],on:{mousedown:function(e){t.moveStart(e,0)},touchstart:function(e){t.moveStart(e,0)}}},[i("div",{ref:"tooltip0",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[0]},[t._v(t._s(t.formatter?t.formatting(t.val[0]):t.val[0]))])],{value:t.val[0],index:0,disabled:!t.boolDisabled&&t.disabledArray[0]})],2)]),t._v(" "),i("div",{key:"dot1",ref:"dot1",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&1===t.focusSlider,"vue-slider-dot-dragging":t.flag&&1===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[1]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[1]?t.disabledDotStyles[1]:null,t.sliderStyles[1],t.focusFlag&&1===t.focusSlider?t.focusStyles[1]:null],on:{mousedown:function(e){t.moveStart(e,1)},touchstart:function(e){t.moveStart(e,1)}}},[i("div",{ref:"tooltip1",class:["vue-slider-tooltip-"+t.tooltipDirection[1],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[1]},[t._v(t._s(t.formatter?t.formatting(t.val[1]):t.val[1]))])],{value:t.val[1],index:1,disabled:!t.boolDisabled&&t.disabledArray[1]})],2)])]:[i("div",{key:"dot",ref:"dot",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider}],style:[t.dotStyles,t.sliderStyles,t.focusFlag&&0===t.focusSlider?t.focusStyles:null],on:{mousedown:t.moveStart,touchstart:t.moveStart}},[i("div",{class:["vue-slider-tooltip-"+t.tooltipDirection,"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v(t._s(t.formatter?t.formatting(t.val):t.val))])],{value:t.val})],2)])],t._v(" "),i("ul",{staticClass:"vue-slider-piecewise"},t._l(t.piecewiseDotWrap,function(e,s){return i("li",{key:s,staticClass:"vue-slider-piecewise-item",style:[t.piecewiseDotStyle,e.style]},[t._t("piecewise",[t.piecewise?i("span",{staticClass:"vue-slider-piecewise-dot",style:[t.piecewiseStyle,e.inRange?t.piecewiseActiveStyle:null]}):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange}),t._v(" "),t._t("label",[t.piecewiseLabel?i("span",{staticClass:"vue-slider-piecewise-label",style:[t.labelStyle,e.inRange?t.labelActiveStyle:null]},[t._v("\n            "+t._s(e.label)+"\n          ")]):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange})],2)})),t._v(" "),i("div",{ref:"process",class:["vue-slider-process",{"vue-slider-process-dragable":t.isRange&&t.processDragable}],style:t.processStyle,on:{click:t.processClick,mousedown:function(e){t.moveStart(e,0,!0)},touchstart:function(e){t.moveStart(e,0,!0)}}},[i("div",{ref:"mergedTooltip",staticClass:"vue-merged-tooltip",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"],style:t.tooltipMergedPosition},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v("\n            "+t._s(t.mergeFormatter?t.mergeFormatting(t.val[0],t.val[1]):t.formatter?t.val[0]===t.val[1]?t.formatting(t.val[0]):t.formatting(t.val[0])+" - "+t.formatting(t.val[1]):t.val[0]===t.val[1]?t.val[0]:t.val[0]+" - "+t.val[1])+"\n          ")])])],2)]),t._v(" "),t.isRange||t.data?t._e():i("input",{directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],staticClass:"vue-slider-sr-only",attrs:{type:"range",min:t.min,max:t.max},domProps:{value:t.val},on:{__r:function(e){t.val=e.target.value}}})],2)])},staticRenderFns:[]}},function(t,e,i){var s=i(3);"string"==typeof s&&(s=[[t.i,s,""]]),s.locals&&(t.exports=s.locals);i(8)("743d98f5",s,!0)},function(t,e,i){function s(t){for(var e=0;e<t.length;e++){var i=t[e],s=d[i.id];if(s){s.refs++;for(var r=0;r<s.parts.length;r++)s.parts[r](i.parts[r]);for(;r<i.parts.length;r++)s.parts.push(o(i.parts[r]));s.parts.length>i.parts.length&&(s.parts.length=i.parts.length)}else{for(var n=[],r=0;r<i.parts.length;r++)n.push(o(i.parts[r]));d[i.id]={id:i.id,refs:1,parts:n}}}}function r(){var t=document.createElement("style");return t.type="text/css",h.appendChild(t),t}function o(t){var e,i,s=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(s){if(f)return v;s.parentNode.removeChild(s)}if(m){var o=p++;s=c||(c=r()),e=n.bind(null,s,o,!1),i=n.bind(null,s,o,!0)}else s=r(),e=l.bind(null,s),i=function(){s.parentNode.removeChild(s)};return e(t),function(s){if(s){if(s.css===t.css&&s.media===t.media&&s.sourceMap===t.sourceMap)return;e(t=s)}else i()}}function n(t,e,i,s){var r=i?"":s.css;if(t.styleSheet)t.styleSheet.cssText=g(e,r);else{var o=document.createTextNode(r),n=t.childNodes;n[e]&&t.removeChild(n[e]),n.length?t.insertBefore(o,n[e]):t.appendChild(o)}}function l(t,e){var i=e.css,s=e.media,r=e.sourceMap;if(s&&t.setAttribute("media",s),r&&(i+="\n/*# sourceURL="+r.sources[0]+" */",i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=i;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(i))}}var a="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!a)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var u=i(9),d={},h=a&&(document.head||document.getElementsByTagName("head")[0]),c=null,p=0,f=!1,v=function(){},m="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,i){f=i;var r=u(t,e);return s(r),function(e){for(var i=[],o=0;o<r.length;o++){var n=r[o],l=d[n.id];l.refs--,i.push(l)}e?(r=u(t,e),s(r)):r=[];for(var o=0;o<i.length;o++){var l=i[o];if(0===l.refs){for(var a=0;a<l.parts.length;a++)l.parts[a]();delete d[l.id]}}}};var g=function(){var t=[];return function(e,i){return t[e]=i,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t,e){for(var i=[],s={},r=0;r<e.length;r++){var o=e[r],n=o[0],l=o[1],a=o[2],u=o[3],d={id:t+":"+r,css:l,media:a,sourceMap:u};s[n]?s[n].parts.push(d):i.push(s[n]={id:n,parts:[d]})}return i}}])});
+!function(t,e){ true?module.exports=e():"function"==typeof define&&define.amd?define("vue-slider-component",[],e):"object"==typeof exports?exports["vue-slider-component"]=e():t["vue-slider-component"]=e()}(this,function(){return function(t){function e(s){if(i[s])return i[s].exports;var r=i[s]={i:s,l:!1,exports:{}};return t[s].call(r.exports,r,r.exports,e),r.l=!0,r.exports}var i={};return e.m=t,e.c=i,e.i=function(t){return t},e.d=function(t,i,s){e.o(t,i)||Object.defineProperty(t,i,{configurable:!1,enumerable:!0,get:s})},e.n=function(t){var i=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(i,"a",i),i},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=2)}([function(t,e,i){i(7);var s=i(5)(i(1),i(6),null,null);t.exports=s.exports},function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var s=function(){var t="undefined"!=typeof window?window.devicePixelRatio||1:1;return function(e){return Math.round(e*t)/t}}();e.default={name:"VueSliderComponent",props:{width:{type:[Number,String],default:"auto"},height:{type:[Number,String],default:6},data:{type:Array,default:null},dotSize:{type:Number,default:16},dotWidth:{type:Number,required:!1},dotHeight:{type:Number,required:!1},min:{type:Number,default:0},max:{type:Number,default:100},interval:{type:Number,default:1},show:{type:Boolean,default:!0},disabled:{type:[Boolean,Array],default:!1},piecewise:{type:Boolean,default:!1},tooltip:{type:[String,Boolean],default:"always"},eventType:{type:String,default:"auto"},direction:{type:String,default:"horizontal"},reverse:{type:Boolean,default:!1},lazy:{type:Boolean,default:!1},clickable:{type:Boolean,default:!0},speed:{type:Number,default:.5},realTime:{type:Boolean,default:!1},stopPropagation:{type:Boolean,default:!1},value:{type:[String,Number,Array,Object],default:0},piecewiseLabel:{type:Boolean,default:!1},debug:{type:Boolean,default:!0},fixed:{type:Boolean,default:!1},processDragable:{type:Boolean,default:!1},useKeyboard:{type:Boolean,default:!1},actionsKeyboard:{type:Array,default:function(){return[function(t){return t-1},function(t){return t+1}]}},tooltipMerge:{type:Boolean,default:!0},sliderStyle:[Array,Object,Function],focusStyle:[Array,Object,Function],tooltipDir:[Array,String],formatter:[String,Function],mergeFormatter:[String,Function],piecewiseStyle:Object,disabledStyle:Object,piecewiseActiveStyle:Object,processStyle:Object,bgStyle:Object,tooltipStyle:[Array,Object,Function],disabledDotStyle:[Array,Object,Function],labelStyle:Object,labelActiveStyle:Object},data:function(){return{flag:!1,keydownFlag:null,focusFlag:!1,processFlag:!1,processSign:null,size:0,fixedValue:0,focusSlider:0,currentValue:0,currentSlider:0,isComponentExists:!0,isMounted:!1}},computed:{dotWidthVal:function(){return"number"==typeof this.dotWidth?this.dotWidth:this.dotSize},dotHeightVal:function(){return"number"==typeof this.dotHeight?this.dotHeight:this.dotSize},flowDirection:function(){return"vue-slider-"+this.direction+(this.reverse?"-reverse":"")},tooltipMergedPosition:function(){if(!this.isMounted)return{};var t=this.tooltipDirection[0];if(this.$refs.dot0){if("vertical"===this.direction){var e={};return e[t]="-"+(this.dotHeightVal/2-this.width/2+9)+"px",e}var i={};return i[t]="-"+(this.dotWidthVal/2-this.height/2+9)+"px",i.left="50%",i}},tooltipDirection:function(){var t=this.tooltipDir||("vertical"===this.direction?"left":"top");return Array.isArray(t)?this.isRange?t:t[1]:this.isRange?[t,t]:t},tooltipStatus:function(){return"hover"===this.tooltip&&this.flag?"vue-slider-always":this.tooltip?"vue-slider-"+this.tooltip:""},tooltipClass:function(){return["vue-slider-tooltip-"+this.tooltipDirection,"vue-slider-tooltip"]},disabledArray:function(){return Array.isArray(this.disabled)?this.disabled:[this.disabled,this.disabled]},boolDisabled:function(){return this.disabledArray.every(function(t){return!0===t})},isDisabled:function(){return"none"===this.eventType||this.boolDisabled},disabledClass:function(){return this.boolDisabled?"vue-slider-disabled":""},stateClass:function(){return{"vue-slider-state-process-drag":this.processFlag,"vue-slider-state-drag":this.flag&&!this.processFlag&&!this.keydownFlag,"vue-slider-state-focus":this.focusFlag}},isRange:function(){return Array.isArray(this.value)},slider:function(){return this.isRange?[this.$refs.dot0,this.$refs.dot1]:this.$refs.dot},minimum:function(){return this.data?0:this.min},val:{get:function(){return this.data?this.isRange?[this.data[this.currentValue[0]],this.data[this.currentValue[1]]]:this.data[this.currentValue]:this.currentValue},set:function(t){if(this.data)if(this.isRange){var e=this.data.indexOf(t[0]),i=this.data.indexOf(t[1]);e>-1&&i>-1&&(this.currentValue=[e,i])}else{var s=this.data.indexOf(t);s>-1&&(this.currentValue=s)}else this.currentValue=t}},currentIndex:function(){return this.isRange?this.data?this.currentValue:[this.getIndexByValue(this.currentValue[0]),this.getIndexByValue(this.currentValue[1])]:this.getIndexByValue(this.currentValue)},indexRange:function(){return this.isRange?this.currentIndex:[0,this.currentIndex]},maximum:function(){return this.data?this.data.length-1:this.max},multiple:function(){var t=(""+this.interval).split(".")[1];return t?Math.pow(10,t.length):1},spacing:function(){return this.data?1:this.interval},total:function(){return this.data?this.data.length-1:(Math.floor((this.maximum-this.minimum)*this.multiple)%(this.interval*this.multiple)!=0&&this.printError("Prop[interval] is illegal, Please make sure that the interval can be divisible"),(this.maximum-this.minimum)/this.interval)},gap:function(){return this.size/this.total},position:function(){return this.isRange?[(this.currentValue[0]-this.minimum)/this.spacing*this.gap,(this.currentValue[1]-this.minimum)/this.spacing*this.gap]:(this.currentValue-this.minimum)/this.spacing*this.gap},limit:function(){return this.isRange?this.fixed?[[0,(this.total-this.fixedValue)*this.gap],[this.fixedValue*this.gap,this.size]]:[[0,this.position[1]],[this.position[0],this.size]]:[0,this.size]},valueLimit:function(){return this.isRange?this.fixed?[[this.minimum,this.maximum-this.fixedValue*(this.spacing*this.multiple)/this.multiple],[this.minimum+this.fixedValue*(this.spacing*this.multiple)/this.multiple,this.maximum]]:[[this.minimum,this.currentValue[1]],[this.currentValue[0],this.maximum]]:[this.minimum,this.maximum]},idleSlider:function(){return 0===this.currentSlider?1:0},wrapStyles:function(){return"vertical"===this.direction?{height:"number"==typeof this.height?this.height+"px":this.height,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}:{width:"number"==typeof this.width?this.width+"px":this.width,padding:this.dotHeightVal/2+"px "+this.dotWidthVal/2+"px"}},sliderStyles:function(){return Array.isArray(this.sliderStyle)?this.isRange?this.sliderStyle:this.sliderStyle[1]:"function"==typeof this.sliderStyle?this.sliderStyle(this.val,this.currentIndex):this.isRange?[this.sliderStyle,this.sliderStyle]:this.sliderStyle},focusStyles:function(){return Array.isArray(this.focusStyle)?this.isRange?this.focusStyle:this.focusStyle[1]:"function"==typeof this.focusStyle?this.focusStyle(this.val,this.currentIndex):this.isRange?[this.focusStyle,this.focusStyle]:this.focusStyle},disabledDotStyles:function(){var t=this.disabledDotStyle;if(Array.isArray(t))return t;if("function"==typeof t){var e=t(this.val,this.currentIndex);return Array.isArray(e)?e:[e,e]}return t?[t,t]:[{backgroundColor:"#ccc"},{backgroundColor:"#ccc"}]},tooltipStyles:function(){return Array.isArray(this.tooltipStyle)?this.isRange?this.tooltipStyle:this.tooltipStyle[1]:"function"==typeof this.tooltipStyle?this.tooltipStyle(this.val,this.currentIndex):this.isRange?[this.tooltipStyle,this.tooltipStyle]:this.tooltipStyle},elemStyles:function(){return"vertical"===this.direction?{width:this.width+"px",height:"100%"}:{height:this.height+"px"}},dotStyles:function(){return"vertical"===this.direction?{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",left:-(this.dotWidthVal-this.width)/2+"px"}:{width:this.dotWidthVal+"px",height:this.dotHeightVal+"px",top:-(this.dotHeightVal-this.height)/2+"px"}},piecewiseDotStyle:function(){return"vertical"===this.direction?{width:this.width+"px",height:this.width+"px"}:{width:this.height+"px",height:this.height+"px"}},piecewiseDotWrap:function(){if(!this.piecewise&&!this.piecewiseLabel)return!1;for(var t=[],e=0;e<=this.total;e++){var i="vertical"===this.direction?{bottom:this.gap*e-this.width/2+"px",left:0}:{left:this.gap*e-this.height/2+"px",top:0},s=this.reverse?this.total-e:e,r=this.data?this.data[s]:this.spacing*s+this.min;t.push({style:i,label:this.formatter?this.formatting(r):r,inRange:s>=this.indexRange[0]&&s<=this.indexRange[1]})}return t}},watch:{value:function(t){this.flag||this.setValue(t,!0)},max:function(t){if(t<this.min)return this.printError("The maximum value can not be less than the minimum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},min:function(t){if(t>this.max)return this.printError("The minimum value can not be greater than the maximum value.");var e=this.limitValue(this.val);this.setValue(e),this.refresh()},show:function(t){var e=this;t&&!this.size&&this.$nextTick(function(){e.refresh()})},fixed:function(){this.computedFixedValue()}},methods:{bindEvents:function(){document.addEventListener("touchmove",this.moving,{passive:!1}),document.addEventListener("touchend",this.moveEnd,{passive:!1}),document.addEventListener("mousedown",this.blurSlider),document.addEventListener("mousemove",this.moving),document.addEventListener("mouseup",this.moveEnd),document.addEventListener("mouseleave",this.moveEnd),document.addEventListener("keydown",this.handleKeydown),document.addEventListener("keyup",this.handleKeyup),window.addEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.addEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.addEventListener("transitionend",this.handleOverlapTooltip))},unbindEvents:function(){document.removeEventListener("touchmove",this.moving),document.removeEventListener("touchend",this.moveEnd),document.removeEventListener("mousedown",this.blurSlider),document.removeEventListener("mousemove",this.moving),document.removeEventListener("mouseup",this.moveEnd),document.removeEventListener("mouseleave",this.moveEnd),document.removeEventListener("keydown",this.handleKeydown),document.removeEventListener("keyup",this.handleKeyup),window.removeEventListener("resize",this.refresh),this.isRange&&this.tooltipMerge&&(this.$refs.dot0.removeEventListener("transitionend",this.handleOverlapTooltip),this.$refs.dot1.removeEventListener("transitionend",this.handleOverlapTooltip))},handleKeydown:function(t){if(!this.useKeyboard||!this.focusFlag)return!1;switch(t.keyCode){case 37:case 40:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[0]);break;case 38:case 39:t.preventDefault(),this.keydownFlag=!0,this.flag=!0,this.changeFocusSlider(this.actionsKeyboard[1])}},handleKeyup:function(){this.keydownFlag&&(this.keydownFlag=!1,this.flag=!1)},changeFocusSlider:function(t){var e=this;if(this.isRange){var i=this.currentIndex.map(function(i,s){if(s===e.focusSlider||e.fixed){var r=t(i),o=e.fixed?e.valueLimit[s]:[0,e.total];if(r<=o[1]&&r>=o[0])return r}return i});i[0]>i[1]&&(this.focusSlider=0===this.focusSlider?1:0,i=i.reverse()),this.setIndex(i)}else this.setIndex(t(this.currentIndex))},blurSlider:function(t){var e=this.isRange?this.$refs["dot"+this.focusSlider]:this.$refs.dot;if(!e||e===t.target)return!1;this.focusFlag=!1},formatting:function(t){return"string"==typeof this.formatter?this.formatter.replace(/\{value\}/,t):this.formatter(t)},mergeFormatting:function(t,e){return"string"==typeof this.mergeFormatter?this.mergeFormatter.replace(/\{(value1|value2)\}/g,function(i,s){return"value1"===s?t:e}):this.mergeFormatter(t,e)},getPos:function(t){return this.realTime&&this.getStaticData(),"vertical"===this.direction?this.reverse?t.pageY-this.offset:this.size-(t.pageY-this.offset):this.reverse?this.size-(t.clientX-this.offset):t.clientX-this.offset},processClick:function(t){this.fixed&&t.stopPropagation()},wrapClick:function(t){var e=this;if(this.isDisabled||!this.clickable||this.processFlag)return!1;var i=this.getPos(t);if(this.isRange)if(this.disabledArray.every(function(t){return!1===t}))this.currentSlider=i>(this.position[1]-this.position[0])/2+this.position[0]?1:0;else if(this.disabledArray[0]){if(i<this.position[0])return!1;this.currentSlider=1}else if(this.disabledArray[1]){if(i>this.position[1])return!1;this.currentSlider=0}if(this.disabledArray[this.currentSlider])return!1;if(this.setValueOnPos(i),this.isRange&&this.tooltipMerge){var s=setInterval(function(){return e.handleOverlapTooltip()},16.7);setTimeout(function(){return window.clearInterval(s)},1e3*this.speed)}},moveStart:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,i=arguments[2];if(this.disabledArray[e])return!1;if(this.stopPropagation&&t.stopPropagation(),this.isRange&&(this.currentSlider=e,i)){if(!this.processDragable)return!1;this.processFlag=!0,this.processSign={pos:this.position,start:this.getPos(t.targetTouches&&t.targetTouches[0]?t.targetTouches[0]:t)}}!i&&this.useKeyboard&&(this.focusFlag=!0,this.focusSlider=e),this.flag=!0,this.$emit("drag-start",this)},moving:function(t){if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;t.preventDefault(),t.targetTouches&&t.targetTouches[0]&&(t=t.targetTouches[0]),this.processFlag?(this.currentSlider=0,this.setValueOnPos(this.processSign.pos[0]+this.getPos(t)-this.processSign.start,!0),this.currentSlider=1,this.setValueOnPos(this.processSign.pos[1]+this.getPos(t)-this.processSign.start,!0)):this.setValueOnPos(this.getPos(t),!0),this.isRange&&this.tooltipMerge&&this.handleOverlapTooltip()},moveEnd:function(t){var e=this;if(this.stopPropagation&&t.stopPropagation(),!this.flag)return!1;this.$emit("drag-end",this),this.lazy&&this.isDiff(this.val,this.value)&&this.syncValue(),this.flag=!1,window.setTimeout(function(){e.processFlag=!1},0),this.setPosition()},setValueOnPos:function(t,e){var i=this.isRange?this.limit[this.currentSlider]:this.limit,s=this.isRange?this.valueLimit[this.currentSlider]:this.valueLimit;if(t>=i[0]&&t<=i[1]){this.setTransform(t);var r=this.getValueByIndex(Math.round(t/this.gap));this.setCurrentValue(r,e),this.isRange&&this.fixed&&(this.setTransform(t+this.fixedValue*this.gap*(0===this.currentSlider?1:-1),!0),this.setCurrentValue((r*this.multiple+this.fixedValue*this.spacing*this.multiple*(0===this.currentSlider?1:-1))/this.multiple,e,!0))}else t<i[0]?(this.setTransform(i[0]),this.setCurrentValue(s[0]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][0],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][0],e,!0)):this.fixed||this.disabledArray[0]||1!==this.currentSlider||(this.focusSlider=0,this.currentSlider=0)):(this.setTransform(i[1]),this.setCurrentValue(s[1]),this.isRange&&this.fixed?(this.setTransform(this.limit[this.idleSlider][1],!0),this.setCurrentValue(this.valueLimit[this.idleSlider][1],e,!0)):this.fixed||this.disabledArray[1]||0!==this.currentSlider||(this.focusSlider=1,this.currentSlider=1))},isDiff:function(t,e){return Object.prototype.toString.call(t)!==Object.prototype.toString.call(e)||(Array.isArray(t)&&t.length===e.length?t.some(function(t,i){return t!==e[i]}):t!==e)},setCurrentValue:function(t,e,i){var s=i?this.idleSlider:this.currentSlider;if(t<this.minimum||t>this.maximum)return!1;this.isRange?this.isDiff(this.currentValue[s],t)&&(this.currentValue.splice(s,1,t),this.lazy&&this.flag||this.syncValue()):this.isDiff(this.currentValue,t)&&(this.currentValue=t,this.lazy&&this.flag||this.syncValue()),e||this.setPosition()},getValueByIndex:function(t){return(this.spacing*this.multiple*t+this.minimum*this.multiple)/this.multiple},getIndexByValue:function(t){return Math.round((t-this.minimum)*this.multiple)/(this.spacing*this.multiple)},setIndex:function(t){if(Array.isArray(t)&&this.isRange){var e=void 0;e=this.data?[this.data[t[0]],this.data[t[1]]]:[this.getValueByIndex(t[0]),this.getValueByIndex(t[1])],this.setValue(e)}else t=this.getValueByIndex(t),this.isRange&&(this.currentSlider=t>(this.currentValue[1]-this.currentValue[0])/2+this.currentValue[0]?1:0),this.setCurrentValue(t)},setValue:function(t,e,i){var s=this;if(this.isDiff(this.val,t)){var r=this.limitValue(t);this.val=this.isRange?r.concat():r,this.computedFixedValue(),this.syncValue(e)}this.$nextTick(function(){return s.setPosition(i)})},computedFixedValue:function(){if(!this.fixed)return this.fixedValue=0,!1;this.fixedValue=this.currentIndex[1]-this.currentIndex[0]},setPosition:function(t){this.flag||this.setTransitionTime(void 0===t?this.speed:t),this.isRange?(this.setTransform(this.position[0],1===this.currentSlider),this.setTransform(this.position[1],0===this.currentSlider)):this.setTransform(this.position),this.flag||this.setTransitionTime(0)},setTransform:function(t,e){var i=e?this.idleSlider:this.currentSlider,r=s(("vertical"===this.direction?this.dotHeightVal/2-t:t-this.dotWidthVal/2)*(this.reverse?-1:1)),o="vertical"===this.direction?"translateY("+r+"px)":"translateX("+r+"px)",n=this.fixed?this.fixedValue*this.gap+"px":(0===i?this.position[1]-t:t-this.position[0])+"px",l=this.fixed?(0===i?t:t-this.fixedValue*this.gap)+"px":(0===i?t:this.position[0])+"px";this.isRange?(this.slider[i].style.transform=o,this.slider[i].style.WebkitTransform=o,this.slider[i].style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=n,this.$refs.process.style[this.reverse?"top":"bottom"]=l):(this.$refs.process.style.width=n,this.$refs.process.style[this.reverse?"right":"left"]=l)):(this.slider.style.transform=o,this.slider.style.WebkitTransform=o,this.slider.style.msTransform=o,"vertical"===this.direction?(this.$refs.process.style.height=t+"px",this.$refs.process.style[this.reverse?"top":"bottom"]=0):(this.$refs.process.style.width=t+"px",this.$refs.process.style[this.reverse?"right":"left"]=0))},setTransitionTime:function(t){if(t||this.$refs.process.offsetWidth,this.isRange){for(var e=0;e<this.slider.length;e++)this.slider[e].style.transitionDuration=t+"s",this.slider[e].style.WebkitTransitionDuration=t+"s";this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"}else this.slider.style.transitionDuration=t+"s",this.slider.style.WebkitTransitionDuration=t+"s",this.$refs.process.style.transitionDuration=t+"s",this.$refs.process.style.WebkitTransitionDuration=t+"s"},limitValue:function(t){var e=this;if(this.data)return t;var i=function(i){return i<e.min?(e.printError("The value of the slider is "+t+", the minimum value is "+e.min+", the value of this slider can not be less than the minimum value"),e.min):i>e.max?(e.printError("The value of the slider is "+t+", the maximum value is "+e.max+", the value of this slider can not be greater than the maximum value"),e.max):i};return this.isRange?t.map(function(t){return i(t)}):i(t)},syncValue:function(t){var e=this.isRange?this.val.concat():this.val;this.$emit("input",e),t||this.$emit("callback",e)},getValue:function(){return this.val},getIndex:function(){return this.currentIndex},getStaticData:function(){this.$refs.elem&&(this.size="vertical"===this.direction?this.$refs.elem.offsetHeight:this.$refs.elem.offsetWidth,this.offset="vertical"===this.direction?this.$refs.elem.getBoundingClientRect().top+window.pageYOffset||document.documentElement.scrollTop:this.$refs.elem.getBoundingClientRect().left)},refresh:function(){this.$refs.elem&&(this.getStaticData(),this.computedFixedValue(),this.setPosition())},printError:function(t){this.debug&&console.error("[VueSlider error]: "+t)},handleOverlapTooltip:function(){var t=this.tooltipDirection[0]===this.tooltipDirection[1];if(this.isRange&&t){var e=this.reverse?this.$refs.tooltip1:this.$refs.tooltip0,i=this.reverse?this.$refs.tooltip0:this.$refs.tooltip1,s=e.getBoundingClientRect().right,r=i.getBoundingClientRect().left,o=e.getBoundingClientRect().y,n=i.getBoundingClientRect().y+i.getBoundingClientRect().height,l="horizontal"===this.direction&&s>r,a="vertical"===this.direction&&n>o;l||a?this.handleDisplayMergedTooltip(!0):this.handleDisplayMergedTooltip(!1)}},handleDisplayMergedTooltip:function(t){var e=this.$refs.tooltip0,i=this.$refs.tooltip1,s=this.$refs.process.getElementsByClassName("vue-merged-tooltip")[0];t?(e.style.visibility="hidden",i.style.visibility="hidden",s.style.visibility="visible"):(e.style.visibility="visible",i.style.visibility="visible",s.style.visibility="hidden")}},mounted:function(){var t=this;if(this.isComponentExists=!0,"undefined"==typeof window||"undefined"==typeof document)return this.printError("window or document is undefined, can not be initialization.");this.$nextTick(function(){t.isComponentExists&&(t.getStaticData(),t.setValue(t.limitValue(t.value),!0,0),t.bindEvents())}),this.isMounted=!0},beforeDestroy:function(){this.isComponentExists=!1,this.unbindEvents()}}},function(t,e,i){"use strict";var s=i(0);t.exports=s},function(t,e,i){e=t.exports=i(4)(),e.push([t.i,'.vue-slider-component{position:relative;box-sizing:border-box;-ms-user-select:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none}.vue-slider-component.vue-slider-disabled{opacity:.5;cursor:not-allowed}.vue-slider-component.vue-slider-has-label{margin-bottom:15px}.vue-slider-component.vue-slider-disabled .vue-slider-dot{cursor:not-allowed}.vue-slider-component .vue-slider{position:relative;display:block;border-radius:15px;background-color:#ccc}.vue-slider-component .vue-slider:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.vue-slider-component .vue-slider-process{position:absolute;border-radius:15px;background-color:#3498db;transition:all 0s;z-index:1}.vue-slider-component .vue-slider-process.vue-slider-process-dragable{cursor:pointer;z-index:3}.vue-slider-component.vue-slider-horizontal .vue-slider-process{width:0;height:100%;top:0;left:0;will-change:width}.vue-slider-component.vue-slider-vertical .vue-slider-process{width:100%;height:0;bottom:0;left:0;will-change:height}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-process{width:0;height:100%;top:0;right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-process{width:100%;height:0;top:0;left:0}.vue-slider-component .vue-slider-dot{position:absolute;border-radius:50%;background-color:#fff;box-shadow:.5px .5px 2px 1px rgba(0,0,0,.32);transition:all 0s;will-change:transform;cursor:pointer;z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-focus{box-shadow:0 0 2px 1px #3498db}.vue-slider-component .vue-slider-dot.vue-slider-dot-dragging{z-index:5}.vue-slider-component .vue-slider-dot.vue-slider-dot-disabled{z-index:4}.vue-slider-component.vue-slider-horizontal .vue-slider-dot{left:0}.vue-slider-component.vue-slider-vertical .vue-slider-dot{bottom:0}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-dot{right:0}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-dot{top:0}.vue-slider-component .vue-slider-tooltip-wrap{display:none;position:absolute;z-index:9}.vue-slider-component .vue-slider-tooltip{display:block;font-size:14px;white-space:nowrap;padding:2px 5px;min-width:20px;text-align:center;color:#fff;border-radius:5px;border:1px solid #3498db;background-color:#3498db}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top{top:-9px;left:50%;-webkit-transform:translate(-50%,-100%);transform:translate(-50%,-100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom{bottom:-9px;left:50%;-webkit-transform:translate(-50%,100%);transform:translate(-50%,100%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left{top:50%;left:-9px;-webkit-transform:translate(-100%,-50%);transform:translate(-100%,-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right{top:50%;right:-9px;-webkit-transform:translate(100%,-50%);transform:translate(100%,-50%)}.vue-slider-component .vue-slider-tooltip-top .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-top .vue-slider-tooltip:before{content:"";position:absolute;bottom:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-top-color:inherit;-webkit-transform:translate(-50%);transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-wrap.vue-merged-tooltip{display:block;visibility:hidden}.vue-slider-component .vue-slider-tooltip-bottom .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-bottom .vue-slider-tooltip:before{content:"";position:absolute;top:-10px;left:50%;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-bottom-color:inherit;-webkit-transform:translate(-50%);transform:translate(-50%)}.vue-slider-component .vue-slider-tooltip-left .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-left .vue-slider-tooltip:before{content:"";position:absolute;top:50%;right:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-left-color:inherit;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.vue-slider-component .vue-slider-tooltip-right .vue-merged-tooltip .vue-slider-tooltip:before,.vue-slider-component .vue-slider-tooltip-wrap.vue-slider-tooltip-right .vue-slider-tooltip:before{content:"";position:absolute;top:50%;left:-10px;width:0;height:0;border:5px solid transparent;border:6px solid transparent\\0;border-right-color:inherit;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.vue-slider-component .vue-slider-dot.vue-slider-hover:hover .vue-slider-tooltip-wrap{display:block}.vue-slider-component .vue-slider-dot.vue-slider-always .vue-slider-tooltip-wrap{display:block!important}.vue-slider-component .vue-slider-piecewise{position:absolute;width:100%;padding:0;margin:0;left:0;top:0;height:100%;list-style:none}.vue-slider-component .vue-slider-piecewise-item{position:absolute;width:8px;height:8px}.vue-slider-component .vue-slider-piecewise-dot{position:absolute;left:50%;top:50%;width:100%;height:100%;display:inline-block;background-color:rgba(0,0,0,.16);border-radius:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:2;transition:all .3s}.vue-slider-component .vue-slider-piecewise-item:first-child .vue-slider-piecewise-dot,.vue-slider-component .vue-slider-piecewise-item:last-child .vue-slider-piecewise-dot{visibility:hidden}.vue-slider-component.vue-slider-horizontal-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-horizontal .vue-slider-piecewise-label{position:absolute;display:inline-block;top:100%;left:50%;white-space:nowrap;font-size:12px;color:#333;-webkit-transform:translate(-50%,8px);transform:translate(-50%,8px);visibility:visible}.vue-slider-component.vue-slider-vertical-reverse .vue-slider-piecewise-label,.vue-slider-component.vue-slider-vertical .vue-slider-piecewise-label{position:absolute;display:inline-block;top:50%;left:100%;white-space:nowrap;font-size:12px;color:#333;-webkit-transform:translate(8px,-50%);transform:translate(8px,-50%);visibility:visible}.vue-slider-component .vue-slider-sr-only{clip:rect(1px,1px,1px,1px);height:1px;width:1px;overflow:hidden;position:absolute!important}',""])},function(t,e){t.exports=function(){var t=[];return t.toString=function(){for(var t=[],e=0;e<this.length;e++){var i=this[e];i[2]?t.push("@media "+i[2]+"{"+i[1]+"}"):t.push(i[1])}return t.join("")},t.i=function(e,i){"string"==typeof e&&(e=[[null,e,""]]);for(var s={},r=0;r<this.length;r++){var o=this[r][0];"number"==typeof o&&(s[o]=!0)}for(r=0;r<e.length;r++){var n=e[r];"number"==typeof n[0]&&s[n[0]]||(i&&!n[2]?n[2]=i:i&&(n[2]="("+n[2]+") and ("+i+")"),t.push(n))}},t}},function(t,e){t.exports=function(t,e,i,s){var r,o=t=t||{},n=typeof t.default;"object"!==n&&"function"!==n||(r=t,o=t.default);var l="function"==typeof o?o.options:o;if(e&&(l.render=e.render,l.staticRenderFns=e.staticRenderFns),i&&(l._scopeId=i),s){var a=Object.create(l.computed||null);Object.keys(s).forEach(function(t){var e=s[t];a[t]=function(){return e}}),l.computed=a}return{esModule:r,exports:o,options:l}}},function(t,e){t.exports={render:function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("div",{directives:[{name:"show",rawName:"v-show",value:t.show,expression:"show"}],ref:"wrap",class:["vue-slider-component",t.flowDirection,t.disabledClass,t.stateClass,{"vue-slider-has-label":t.piecewiseLabel}],style:[t.wrapStyles,t.boolDisabled?t.disabledStyle:null],on:{click:t.wrapClick}},[i("div",{ref:"elem",staticClass:"vue-slider",style:[t.elemStyles,t.bgStyle],attrs:{"aria-hidden":"true"}},[t.isRange?[i("div",{key:"dot0",ref:"dot0",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[0]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[0]?t.disabledDotStyles[0]:null,t.sliderStyles[0],t.focusFlag&&0===t.focusSlider?t.focusStyles[0]:null],on:{mousedown:function(e){t.moveStart(e,0)},touchstart:function(e){t.moveStart(e,0)}}},[i("div",{ref:"tooltip0",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[0]},[t._v(t._s(t.formatter?t.formatting(t.val[0]):t.val[0]))])],{value:t.val[0],index:0,disabled:!t.boolDisabled&&t.disabledArray[0]})],2)]),t._v(" "),i("div",{key:"dot1",ref:"dot1",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&1===t.focusSlider,"vue-slider-dot-dragging":t.flag&&1===t.currentSlider,"vue-slider-dot-disabled":!t.boolDisabled&&t.disabledArray[1]}],style:[t.dotStyles,!t.boolDisabled&&t.disabledArray[1]?t.disabledDotStyles[1]:null,t.sliderStyles[1],t.focusFlag&&1===t.focusSlider?t.focusStyles[1]:null],on:{mousedown:function(e){t.moveStart(e,1)},touchstart:function(e){t.moveStart(e,1)}}},[i("div",{ref:"tooltip1",class:["vue-slider-tooltip-"+t.tooltipDirection[1],"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles[1]},[t._v(t._s(t.formatter?t.formatting(t.val[1]):t.val[1]))])],{value:t.val[1],index:1,disabled:!t.boolDisabled&&t.disabledArray[1]})],2)])]:[i("div",{key:"dot",ref:"dot",class:[t.tooltipStatus,"vue-slider-dot",{"vue-slider-dot-focus":t.focusFlag&&0===t.focusSlider,"vue-slider-dot-dragging":t.flag&&0===t.currentSlider}],style:[t.dotStyles,t.sliderStyles,t.focusFlag&&0===t.focusSlider?t.focusStyles:null],on:{mousedown:t.moveStart,touchstart:t.moveStart}},[i("div",{class:["vue-slider-tooltip-"+t.tooltipDirection,"vue-slider-tooltip-wrap"]},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v(t._s(t.formatter?t.formatting(t.val):t.val))])],{value:t.val})],2)])],t._v(" "),i("ul",{staticClass:"vue-slider-piecewise"},t._l(t.piecewiseDotWrap,function(e,s){return i("li",{key:s,staticClass:"vue-slider-piecewise-item",style:[t.piecewiseDotStyle,e.style]},[t._t("piecewise",[t.piecewise?i("span",{staticClass:"vue-slider-piecewise-dot",style:[t.piecewiseStyle,e.inRange?t.piecewiseActiveStyle:null]}):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange}),t._v(" "),t._t("label",[t.piecewiseLabel?i("span",{staticClass:"vue-slider-piecewise-label",style:[t.labelStyle,e.inRange?t.labelActiveStyle:null]},[t._v("\n            "+t._s(e.label)+"\n          ")]):t._e()],{label:e.label,index:s,first:0===s,last:s===t.piecewiseDotWrap.length-1,active:e.inRange})],2)})),t._v(" "),i("div",{ref:"process",class:["vue-slider-process",{"vue-slider-process-dragable":t.isRange&&t.processDragable}],style:t.processStyle,on:{click:t.processClick,mousedown:function(e){t.moveStart(e,0,!0)},touchstart:function(e){t.moveStart(e,0,!0)}}},[i("div",{ref:"mergedTooltip",staticClass:"vue-merged-tooltip",class:["vue-slider-tooltip-"+t.tooltipDirection[0],"vue-slider-tooltip-wrap"],style:t.tooltipMergedPosition},[t._t("tooltip",[i("span",{staticClass:"vue-slider-tooltip",style:t.tooltipStyles},[t._v("\n            "+t._s(t.mergeFormatter?t.mergeFormatting(t.val[0],t.val[1]):t.formatter?t.val[0]===t.val[1]?t.formatting(t.val[0]):t.formatting(t.val[0])+" - "+t.formatting(t.val[1]):t.val[0]===t.val[1]?t.val[0]:t.val[0]+" - "+t.val[1])+"\n          ")])])],2)]),t._v(" "),t.isRange||t.data?t._e():i("input",{directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],staticClass:"vue-slider-sr-only",attrs:{type:"range",min:t.min,max:t.max},domProps:{value:t.val},on:{__r:function(e){t.val=e.target.value}}})],2)])},staticRenderFns:[]}},function(t,e,i){var s=i(3);"string"==typeof s&&(s=[[t.i,s,""]]),s.locals&&(t.exports=s.locals);i(8)("743d98f5",s,!0)},function(t,e,i){function s(t){for(var e=0;e<t.length;e++){var i=t[e],s=d[i.id];if(s){s.refs++;for(var r=0;r<s.parts.length;r++)s.parts[r](i.parts[r]);for(;r<i.parts.length;r++)s.parts.push(o(i.parts[r]));s.parts.length>i.parts.length&&(s.parts.length=i.parts.length)}else{for(var n=[],r=0;r<i.parts.length;r++)n.push(o(i.parts[r]));d[i.id]={id:i.id,refs:1,parts:n}}}}function r(){var t=document.createElement("style");return t.type="text/css",h.appendChild(t),t}function o(t){var e,i,s=document.querySelector('style[data-vue-ssr-id~="'+t.id+'"]');if(s){if(f)return v;s.parentNode.removeChild(s)}if(m){var o=p++;s=c||(c=r()),e=n.bind(null,s,o,!1),i=n.bind(null,s,o,!0)}else s=r(),e=l.bind(null,s),i=function(){s.parentNode.removeChild(s)};return e(t),function(s){if(s){if(s.css===t.css&&s.media===t.media&&s.sourceMap===t.sourceMap)return;e(t=s)}else i()}}function n(t,e,i,s){var r=i?"":s.css;if(t.styleSheet)t.styleSheet.cssText=g(e,r);else{var o=document.createTextNode(r),n=t.childNodes;n[e]&&t.removeChild(n[e]),n.length?t.insertBefore(o,n[e]):t.appendChild(o)}}function l(t,e){var i=e.css,s=e.media,r=e.sourceMap;if(s&&t.setAttribute("media",s),r&&(i+="\n/*# sourceURL="+r.sources[0]+" */",i+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */"),t.styleSheet)t.styleSheet.cssText=i;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(i))}}var a="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!a)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var u=i(9),d={},h=a&&(document.head||document.getElementsByTagName("head")[0]),c=null,p=0,f=!1,v=function(){},m="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());t.exports=function(t,e,i){f=i;var r=u(t,e);return s(r),function(e){for(var i=[],o=0;o<r.length;o++){var n=r[o],l=d[n.id];l.refs--,i.push(l)}e?(r=u(t,e),s(r)):r=[];for(var o=0;o<i.length;o++){var l=i[o];if(0===l.refs){for(var a=0;a<l.parts.length;a++)l.parts[a]();delete d[l.id]}}}};var g=function(){var t=[];return function(e,i){return t[e]=i,t.filter(Boolean).join("\n")}}()},function(t,e){t.exports=function(t,e){for(var i=[],s={},r=0;r<e.length;r++){var o=e[r],n=o[0],l=o[1],a=o[2],u=o[3],d={id:t+":"+r,css:l,media:a,sourceMap:u};s[n]?s[n].parts.push(d):i.push(s[n]={id:n,parts:[d]})}return i}}])});
 
 /***/ }),
 /* 51 */
diff --git a/public/themes/default/assets/mix-manifest.json b/public/themes/default/assets/mix-manifest.json
index b7e923adb..2141a2aae 100644
--- a/public/themes/default/assets/mix-manifest.json
+++ b/public/themes/default/assets/mix-manifest.json
@@ -1,4 +1,4 @@
 {
     "/js/shop.js": "/js/shop.js",
     "/css/shop.css": "/css/shop.css"
-}
+}
\ No newline at end of file

From 3a3c89484d6489aa38e2b3d005fc71daab636aa9 Mon Sep 17 00:00:00 2001
From: prashant-webkul <prashant.singh852@webkul.com>
Date: Wed, 17 Oct 2018 12:53:01 +0530
Subject: [PATCH 8/8] before merge

---
 .../Admin/src/DataGrids/OrderDataGrid.php     |   9 +-
 .../assets/images/cross-icon-adj.svg          |  11 ++
 .../Shop/src/Resources/assets/sass/app.scss   |   2 +-
 .../Shop/src/Resources/assets/sass/icons.scss |   6 ++
 .../Shop/src/Resources/views/index.blade.php  |  17 +--
 .../views/layouts/header/index.blade.php      |  82 +++++++-------
 .../Resources/views/products/index.blade.php  | 102 ++++++++----------
 .../assets/images/cross-icon-adj.svg          |  11 ++
 public/themes/default/assets/css/shop.css     |  10 +-
 9 files changed, 122 insertions(+), 128 deletions(-)
 create mode 100644 packages/Webkul/Shop/src/Resources/assets/images/cross-icon-adj.svg
 create mode 100644 packages/Webkul/Ui/src/Resources/assets/images/cross-icon-adj.svg

diff --git a/packages/Webkul/Admin/src/DataGrids/OrderDataGrid.php b/packages/Webkul/Admin/src/DataGrids/OrderDataGrid.php
index 18868b4ea..5324637a4 100644
--- a/packages/Webkul/Admin/src/DataGrids/OrderDataGrid.php
+++ b/packages/Webkul/Admin/src/DataGrids/OrderDataGrid.php
@@ -5,7 +5,6 @@ namespace Webkul\Admin\DataGrids;
 use Illuminate\View\View;
 use Webkul\Ui\DataGrid\Facades\DataGrid;
 
-
 /**
  * Order DataGrid
  *
@@ -26,10 +25,10 @@ class OrderDataGrid
     {
 
             return DataGrid::make([
-            'name' => 'Categories',
-            'table' => 'categories as cat',
-            'select' => 'cat.id',
-            'perpage' => 10,
+            'name' => 'Orders',
+            'table' => 'orders as ord',
+            'select' => 'ord.id',
+            'perpage' => 5,
             'aliased' => true, //use this with false as default and true in case of joins
 
             'massoperations' =>[
diff --git a/packages/Webkul/Shop/src/Resources/assets/images/cross-icon-adj.svg b/packages/Webkul/Shop/src/Resources/assets/images/cross-icon-adj.svg
new file mode 100644
index 000000000..d62bc542c
--- /dev/null
+++ b/packages/Webkul/Shop/src/Resources/assets/images/cross-icon-adj.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 50 (54983) - http://www.bohemiancoding.com/sketch -->
+    <title>Artboard</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <path d="M9.06852618,23.2496556 L22.5678375,9.75034436" id="Line-2" stroke="#242424" stroke-width="3"></path>
+        <path d="M9.06852618,9.75034436 L22.5678375,23.2496556" id="Line-2" stroke="#242424" stroke-width="3"></path>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
index d490af457..a85b71e72 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss
@@ -481,7 +481,7 @@ section.slider-block {
         }
 
         .nav a:first-child{
-            margin-left: 20px;
+            // margin-left: 20px;
         }
 
         .nav  li  > .icon{
diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss b/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss
index fdac4be74..d6d741b6b 100644
--- a/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss
+++ b/packages/Webkul/Shop/src/Resources/assets/sass/icons.scss
@@ -17,6 +17,12 @@
     height: 24px;
 }
 
+.icon-menu-close-adj {
+    background-image:URL('../images/cross-icon-adj.svg');
+    width: 32px;
+    height: 32px;
+}
+
 .grid-view-icon {
     background-image:URL('../images/icon-grid-view.svg');
     width: 24px;
diff --git a/packages/Webkul/Shop/src/Resources/views/index.blade.php b/packages/Webkul/Shop/src/Resources/views/index.blade.php
index a8e715d27..38d8cd592 100644
--- a/packages/Webkul/Shop/src/Resources/views/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/index.blade.php
@@ -1,22 +1,11 @@
 @inject('rateHelper' , 'Webkul\Shipping\Helper\Rate')
-
-
 <div>
-
     @foreach($rateHelper->collectRates() as $key=>$count)
-
-    <div class="shipping-method">
-
-        <input type="radio" name="price"> ${{ core()->currency($count) }}  <span> {{ $key }} </span>
-
-
-    </div>
-
+        <div class="shipping-method">
+            <input type="radio" name="price"> ${{ core()->currency($count) }}  <span> {{ $key }} </span>
+        </div>
     @endforeach
-
-
 </div>
-
 <style>
     span {
         margin-left: 10px;
diff --git a/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php b/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
index ebc599d08..bf526f0e5 100644
--- a/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/layouts/header/index.blade.php
@@ -262,54 +262,46 @@
     </div>
 </div>
 
-
-
 @push('scripts')
+    <script>
+        window.onload = function() {
+            var hamMenu = document.getElementById("hammenu");
+            var search = document.getElementById("search");
+            var searchResponsive = document.getElementsByClassName('search-responsive')[0];
+            var sortLimit = document.getElementsByClassName('reponsive-sorter-limiter')[0];
+            var layerFilter = document.getElementsByClassName('responsive-layred-filter')[0];
+            var navResponsive = document.getElementsByClassName('responsive-nav')[0];
+            var thumbList = document.getElementsByClassName('thumb-list')[0];
 
-<script>
+            search.addEventListener("click", header);
+            hamMenu.addEventListener("click", header);
 
-    window.onload = function() {
-        var hamMenu = document.getElementById("hammenu");
-        var search = document.getElementById("search");
-
-        var searchResponsive = document.getElementsByClassName('search-responsive')[0];
-        var sortLimit = document.getElementsByClassName('reponsive-sorter-limiter')[0];
-        var layerFilter = document.getElementsByClassName('responsive-layred-filter')[0];
-        var navResponsive = document.getElementsByClassName('responsive-nav')[0];
-        var thumbList = document.getElementsByClassName('thumb-list')[0];
-
-        search.addEventListener("click", header);
-        hamMenu.addEventListener("click", header);
-
-
-        // for header responsive icon
-        function header(){
-            var className = document.getElementById(this.id).className;
-            if(className === 'icon icon-search' ){
-                search.classList.remove("icon-search");
-                search.classList.add("icon-menu-close");
-                hamMenu.classList.remove("icon-menu-close");
-                hamMenu.classList.add("icon-menu");
-                searchResponsive.style.display = 'block';
-                navResponsive.style.display = 'none';
-            }else if(className === 'icon icon-menu'){
-                hamMenu.classList.remove("icon-menu");
-                hamMenu.classList.add("icon-menu-close");
-                search.classList.remove("icon-menu-close");
-                search.classList.add("icon-search");
-                searchResponsive.style.display = 'none';
-                navResponsive.style.display = 'block';
-            }else{
-                search.classList.remove("icon-menu-close");
-                search.classList.add("icon-search");
-                hamMenu.classList.remove("icon-menu-close");
-                hamMenu.classList.add("icon-menu");
-                searchResponsive.style.display = 'none';
-                navResponsive.style.display = 'none';
+            // for header responsive icon
+            function header(){
+                var className = document.getElementById(this.id).className;
+                if(className === 'icon icon-search' ){
+                    search.classList.remove("icon-search");
+                    search.classList.add("icon-menu-close");
+                    hamMenu.classList.remove("icon-menu-close");
+                    hamMenu.classList.add("icon-menu");
+                    searchResponsive.style.display = 'block';
+                    navResponsive.style.display = 'none';
+                }else if(className === 'icon icon-menu'){
+                    hamMenu.classList.remove("icon-menu");
+                    hamMenu.classList.add("icon-menu-close");
+                    search.classList.remove("icon-menu-close");
+                    search.classList.add("icon-search");
+                    searchResponsive.style.display = 'none';
+                    navResponsive.style.display = 'block';
+                }else{
+                    search.classList.remove("icon-menu-close");
+                    search.classList.add("icon-search");
+                    hamMenu.classList.remove("icon-menu-close");
+                    hamMenu.classList.add("icon-menu");
+                    searchResponsive.style.display = 'none';
+                    navResponsive.style.display = 'none';
+                }
             }
         }
-    }
-
-</script>
-
+    </script>
 @endpush
\ No newline at end of file
diff --git a/packages/Webkul/Shop/src/Resources/views/products/index.blade.php b/packages/Webkul/Shop/src/Resources/views/products/index.blade.php
index aeede3b00..23339d396 100644
--- a/packages/Webkul/Shop/src/Resources/views/products/index.blade.php
+++ b/packages/Webkul/Shop/src/Resources/views/products/index.blade.php
@@ -3,16 +3,13 @@
 @section('content-wrapper')
 
 @inject ('productRepository', 'Webkul\Product\Repositories\ProductRepository')
-
     <div class="main">
-
         <div class="category-container">
             @include ('shop::products.list.layered-navigation')
 
             <div class="category-block">
-
                 <div class="hero-image mb-35">
-                    <img src="https://images.pexels.com/photos/428338/pexels-photo-428338.jpeg?cs=srgb&dl=adolescent-casual-cute-428338.jpg&fm=jpg" />
+                <img    src="https://images.pexels.com/photos/428338/pexels-photo-428338.jpeg?cs=srgb&dl=adolescent-casual-cute-428338.jpg&fm=jpg" />
                 </div>
 
                 <?php $products = $productRepository->findAllByCategory($category->id); ?>
@@ -20,87 +17,74 @@
                 @include ('shop::products.list.toolbar')
 
                 @inject ('toolbarHelper', 'Webkul\Product\Product\Toolbar')
-
                 @if ($toolbarHelper->getCurrentMode() == 'grid')
                     <div class="product-grid-3">
-
                         @foreach ($products as $product)
-
                             @include ('shop::products.list.card', ['product' => $product])
-
                         @endforeach
-
                     </div>
                 @else
                     <div class="product-list">
-
                         @foreach ($products as $product)
-
                             @include ('shop::products.list.card', ['product' => $product])
-
                         @endforeach
-
                     </div>
                 @endif
 
                 <div class="bottom-toolbar">
-
                     {{ $products->appends(request()->input())->links() }}
-
                 </div>
             </div>
         </div>
     </div>
-
 @stop
 
-
 @push('scripts')
+    <script>
+        $(document).ready(function() {
+            var sort = document.getElementById("sort");
+            var filter = document.getElementById("filter");
+            var sortLimit = document.getElementsByClassName('reponsive-sorter-limiter')[0];
+            var layerFilter = document.getElementsByClassName('responsive-layred-filter')[0];
 
-<script>
-    $(document).ready(function() {
-
-        var sort = document.getElementById("sort");
-        var filter = document.getElementById("filter");
-        var sortLimit = document.getElementsByClassName('reponsive-sorter-limiter')[0];
-        var layerFilter = document.getElementsByClassName('responsive-layred-filter')[0];
-
-        if(sort && filter){
-            sort.addEventListener("click", sortFilter);
-            filter.addEventListener("click", sortFilter);
-        }
-
-        function sortFilter(){
-            var className = document.getElementById(this.id).className;
-
-            if(className === 'icon sort-icon' ){
-                sort.classList.remove("sort-icon");
-                sort.classList.add("icon-menu-close");
-                filter.classList.remove("icon-menu-close");
-                filter.classList.add("filter-icon");
-                sortLimit.style.display ="flex";
-                sortLimit.style.justifyContent="space-between";
-                layerFilter.style.display ="none";
-            }else if(className === 'icon filter-icon'){
-                filter.classList.remove("filter-icon");
-                filter.classList.add("icon-menu-close");
-                sort.classList.remove("icon-menu-close");
-                sort.classList.add("sort-icon");
-                layerFilter.style.display ="block";
-                sortLimit.style.display ="none";
-            }else{
-                sort.classList.remove("icon-menu-close");
-                sort.classList.add("sort-icon");
-                filter.classList.remove("icon-menu-close");
-                filter.classList.add("filter-icon");
-                sortLimit.style.display ="none";
-                layerFilter.style.display ="none";
+            if(sort && filter){
+                sort.addEventListener("click", sortFilter);
+                filter.addEventListener("click", sortFilter);
             }
-        }
-    })
-</script>
 
-@endpush
+            function sortFilter(){
+                var className = document.getElementById(this.id).className;
 
+                if(className === 'icon sort-icon'){
+                    sort.classList.remove("sort-icon");
+                    sort.classList.add("icon-menu-close-adj");
 
+                    filter.classList.remove("icon-menu-close-adj");
+                    filter.classList.add("filter-icon");
 
+                    sortLimit.style.display ="flex";
+                    sortLimit.style.justifyContent="space-between";
+                    layerFilter.style.display ="none";
+                }else if(className === 'icon filter-icon'){
+                    filter.classList.remove("filter-icon");
+                    filter.classList.add("icon-menu-close-adj");
+
+                    sort.classList.remove("icon-menu-close-adj");
+                    sort.classList.add("sort-icon");
+
+                    layerFilter.style.display ="block";
+                    sortLimit.style.display ="none";
+                }else{
+                    sort.classList.remove("icon-menu-close-adj");
+                    sort.classList.add("sort-icon");
+
+                    filter.classList.remove("icon-menu-close-adj");
+                    filter.classList.add("filter-icon");
+
+                    sortLimit.style.display ="none";
+                    layerFilter.style.display ="none";
+                }
+            }
+        });
+    </script>
+@endpush
\ No newline at end of file
diff --git a/packages/Webkul/Ui/src/Resources/assets/images/cross-icon-adj.svg b/packages/Webkul/Ui/src/Resources/assets/images/cross-icon-adj.svg
new file mode 100644
index 000000000..d62bc542c
--- /dev/null
+++ b/packages/Webkul/Ui/src/Resources/assets/images/cross-icon-adj.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 50 (54983) - http://www.bohemiancoding.com/sketch -->
+    <title>Artboard</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+        <path d="M9.06852618,23.2496556 L22.5678375,9.75034436" id="Line-2" stroke="#242424" stroke-width="3"></path>
+        <path d="M9.06852618,9.75034436 L22.5678375,23.2496556" id="Line-2" stroke="#242424" stroke-width="3"></path>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/public/themes/default/assets/css/shop.css b/public/themes/default/assets/css/shop.css
index ffa85e69f..a351e9b50 100644
--- a/public/themes/default/assets/css/shop.css
+++ b/public/themes/default/assets/css/shop.css
@@ -17,6 +17,12 @@
   height: 24px;
 }
 
+.icon-menu-close-adj {
+  background-image: URL("../images/cross-icon-adj.svg");
+  width: 32px;
+  height: 32px;
+}
+
 .grid-view-icon {
   background-image: URL("../images/icon-grid-view.svg");
   width: 24px;
@@ -1160,10 +1166,6 @@ section.slider-block div.slider-content div.slider-control .light-right-icon {
   position: relative;
 }
 
-.header .header-bottom .nav a:first-child {
-  margin-left: 20px;
-}
-
 .header .header-bottom .nav li > .icon {
   display: none;
 }