diff --git a/packages/Webkul/Cart/src/Cart.php b/packages/Webkul/Cart/src/Cart.php index 094ca5330..21ef0a103 100644 --- a/packages/Webkul/Cart/src/Cart.php +++ b/packages/Webkul/Cart/src/Cart.php @@ -50,8 +50,8 @@ class Cart { * instance with the * current item added. * - * @param @id - * @param $data + * @param Integer $id + * @param Mixed $data * * @return Mixed */ @@ -68,6 +68,14 @@ class Cart { $data['cart_id'] = $cart->id; $data['product_id'] = $id; + if ($data['is_configurable'] == "true") { + $temp = $data['super_attribute']; + + unset($data['super_attribute']); + + $data['additional'] = json_encode($temp); + } + if($result = $this->cartItem->create($data)) { session()->put('cart', $cart); @@ -93,6 +101,10 @@ class Cart { * @return Mixed */ public function add($id, $data) { + + // session()->forget('cart'); + // return redirect()->back(); + if(session()->has('cart')) { $cart = session()->get('cart'); @@ -117,6 +129,14 @@ class Cart { $data['product_id'] = $id; + if ($data['is_configurable'] == "true") { + $temp = $data['super_attribute']; + + unset($data['super_attribute']); + + $data['additional'] = json_encode($temp); + } + $cart->items()->create($data); session()->flash('success', 'Item Successfully Added To Cart'); @@ -136,6 +156,7 @@ class Cart { * use detach to remove the * current product from cart tables * + * @param Integer $id * @return Mixed */ public function remove($id) { diff --git a/packages/Webkul/Cart/src/Http/Controllers/CartController.php b/packages/Webkul/Cart/src/Http/Controllers/CartController.php index 5b77c35d4..a27596180 100644 --- a/packages/Webkul/Cart/src/Http/Controllers/CartController.php +++ b/packages/Webkul/Cart/src/Http/Controllers/CartController.php @@ -5,16 +5,16 @@ namespace Webkul\Cart\Http\Controllers; use Illuminate\Http\Request; use Illuminate\Http\Response; -//Cart repositories use Webkul\Cart\Repositories\CartRepository; use Webkul\Cart\Repositories\CartItemRepository; -//Product Repository use Webkul\Product\Repositories\ProductRepository; -//Customer repositories use Webkul\Customer\Repositories\CustomerRepository; +use Webkul\Product\Product\ProductImage; +use Webkul\Product\Product\View as ProductView; + use Cart; use Cookie; @@ -45,7 +45,9 @@ class CartController extends Controller protected $product; - public function __construct(CartRepository $cart, CartItemRepository $cartItem, CustomerRepository $customer, ProductRepository $product) { + protected $productView; + + public function __construct(CartRepository $cart, CartItemRepository $cartItem, CustomerRepository $customer, ProductRepository $product, ProductImage $productImage, ProductView $productView) { $this->middleware('customer')->except(['add', 'remove', 'test']); @@ -56,6 +58,12 @@ class CartController extends Controller $this->cartItem = $cartItem; $this->product = $product; + + $this->productImage = $productImage; + + $this->productView = $productView; + + $this->_config = request('_config'); } /** @@ -99,6 +107,67 @@ class CartController extends Controller return redirect()->back(); } + /** + * Method to populate + * the cart page which + * will be populated + * before the checkout + * process. + * + * @return Mixed + */ + public function beforeCheckout() { + if(auth()->guard('customer')->check()) { + $cart = $this->cart->findOneByField('customer_id', auth()->guard('customer')->user()->id); + + if(isset($cart)) { + $cart = $this->cart->findOneByField('id', 144); + + $cartItems = $this->cart->items($cart['id']); + + $products = array(); + + foreach($cartItems as $cartItem) { + $image = $this->productImage->getGalleryImages($cartItem->product); + + if(isset($image[0]['small_image_url'])) { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, $image[0]['small_image_url'], $cartItem->quantity]; + } + else { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, 'null', $cartItem->quantity]; + } + + } + } + } else { + if(session()->has('cart')) { + $cart = session()->get('cart'); + + if(isset($cart)) { + $cart = $this->cart->findOneByField('id', 144); + + $cartItems = $this->cart->items($cart['id']); + + $products = array(); + + foreach($cartItems as $cartItem) { + $image = $this->productImage->getGalleryImages($cartItem->product); + + if(isset($image[0]['small_image_url'])) { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, $image[0]['small_image_url'], $cartItem->quantity]; + } + else { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, 'null', $cartItem->quantity]; + } + + } + } + } + } + + return view($this->_config['view'])->with('products', $products); + } + /** * This method will return * the quantities from @@ -151,6 +220,26 @@ class CartController extends Controller } public function test() { + $cart = $this->cart->findOneByField('id', 144); + $cartItems = $this->cart->items($cart['id']); + + $products = array(); + + foreach($cartItems as $cartItem) { + $image = $this->productImage->getGalleryImages($cartItem->product); + + dump($cartItem->product); + + if(isset($image[0]['small_image_url'])) { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, $image[0]['small_image_url'], $cartItem->quantity]; + } + else { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, 'null', $cartItem->quantity]; + } + + } + + dd($products); } } \ No newline at end of file diff --git a/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php b/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php index e797a15b9..8f8022a0d 100644 --- a/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php +++ b/packages/Webkul/Cart/src/Http/Controllers/CheckoutController.php @@ -1,13 +1,14 @@ all())) { + // return response()->json(['redirect_url' => route('store.home')], 403) + } return response()->json(Shipping::collectRates()); } @@ -71,7 +76,7 @@ class CheckoutController extends Controller * * @return \Illuminate\Http\Response */ - public function saveAPayment() + public function savePayment() { } } \ No newline at end of file diff --git a/packages/Webkul/Cart/src/Http/Requests/CustomerAddressForm.php b/packages/Webkul/Cart/src/Http/Requests/CustomerAddressForm.php new file mode 100644 index 000000000..bd1043844 --- /dev/null +++ b/packages/Webkul/Cart/src/Http/Requests/CustomerAddressForm.php @@ -0,0 +1,57 @@ +rules = [ + 'billing.first_name' => ['required'], + 'billing.last_name' => ['required'], + 'billing.email' => ['required'], + 'billing.address1' => ['required'], + 'billing.city' => ['required'], + 'billing.state' => ['required'], + 'billing.postcode' => ['required'], + 'billing.phone' => ['required'], + 'billing.country' => ['required'] + ]; + + if(!$this->get('billing')['use_for_shipping']) { + $this->rules = array_merge($this->rules, [ + 'shipping.first_name' => ['required'], + 'shipping.last_name' => ['required'], + 'shipping.email' => ['required'], + 'shipping.address1' => ['required'], + 'shipping.city' => ['required'], + 'shipping.state' => ['required'], + 'shipping.postcode' => ['required'], + 'shipping.phone' => ['required'], + 'shipping.country' => ['required'] + ]); + } + + return $this->rules; + } +} diff --git a/packages/Webkul/Cart/src/Http/ViewComposers/CartComposer.php b/packages/Webkul/Cart/src/Http/ViewComposers/CartComposer.php index 372f40d14..d1e88dfbe 100644 --- a/packages/Webkul/Cart/src/Http/ViewComposers/CartComposer.php +++ b/packages/Webkul/Cart/src/Http/ViewComposers/CartComposer.php @@ -6,17 +6,19 @@ use Illuminate\View\View; use Illuminate\Support\Collection; use Webkul\Cart\Repositories\CartRepository; - use Webkul\Cart\Repositories\CartItemRepository; +//Product Image Helper Class +use Webkul\Product\Product\ProductImage; + use Cart; + /** * cart List Composer on Navigation Menu * * @author Prashant Singh * @copyright 2018 Webkul Software Pvt Ltd (http://www.webkul.com) */ - class CartComposer { @@ -33,10 +35,12 @@ class CartComposer * @param View $view * @return void */ - public function __construct(CartRepository $cart, CartItemRepository $cartItem) { + public function __construct(CartRepository $cart, CartItemRepository $cartItem, ProductImage $productImage) { $this->cart = $cart; $this->cartItem = $cartItem; + + $this->productImage = $productImage; } public function compose(View $view) { @@ -44,30 +48,51 @@ class CartComposer $cart = $this->cart->findOneByField('customer_id', auth()->guard('customer')->user()->id); if(isset($cart)) { - $cart_items = $this->cart->items($cart['id']); + $cart = $this->cart->findOneByField('id', 144); - $cart_products = array(); + $cartItems = $this->cart->items($cart['id']); + + $products = array(); + + foreach($cartItems as $cartItem) { + $image = $this->productImage->getGalleryImages($cartItem->product); + + if(isset($image[0]['small_image_url'])) { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, $image[0]['small_image_url'], $cartItem->quantity]; + } + else { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, 'null', $cartItem->quantity]; + } - foreach($cart_items as $cart_item) { - array_push($cart_products, $this->cartItem->getProduct($cart_item->id)); } + session()->put('cart', $cart); - $view->with('cart', $cart_products); + $view->with('cart', $products); } } else { if(session()->has('cart')) { $cart = session()->get('cart'); if(isset($cart)) { + $cart = $this->cart->findOneByField('id', 144); + $cartItems = $this->cart->items($cart['id']); - $cart_products = array(); + $products = array(); + + foreach($cartItems as $cartItem) { + $image = $this->productImage->getGalleryImages($cartItem->product); + + if(isset($image[0]['small_image_url'])) { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, $image[0]['small_image_url'], $cartItem->quantity]; + } + else { + $products[$cartItem->product->id] = [$cartItem->product->name, $cartItem->price, 'null', $cartItem->quantity]; + } - foreach($cart_items as $cart_item) { - array_push($cart_products, $this->cartItem->getProduct($cart_item->id)); } - $view->with('cart', $cart_products); + $view->with('cart', $products); } } } diff --git a/packages/Webkul/Product/src/Product/ConfigurableOption.php b/packages/Webkul/Product/src/Product/ConfigurableOption.php index 216fd5408..ebf04db1a 100644 --- a/packages/Webkul/Product/src/Product/ConfigurableOption.php +++ b/packages/Webkul/Product/src/Product/ConfigurableOption.php @@ -235,4 +235,14 @@ class ConfigurableOption extends AbstractProduct return $images; } + + /** + * Get product images for configurable variations + * + * @param Product $product + * @return array + */ + protected function is($product) + { + } } \ 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 8acf7735e..053265fa3 100644 --- a/packages/Webkul/Shop/src/Http/routes.php +++ b/packages/Webkul/Shop/src/Http/routes.php @@ -16,6 +16,10 @@ Route::group(['middleware' => ['web']], function () { Route::get('test', 'Webkul\Cart\Http\Controllers\CartController@test'); + Route::get('cart', 'Webkul\Cart\Http\Controllers\CartController@beforeCheckout')->defaults('_config', [ + 'view' => 'shop::store.cart.index' + ]); + Route::post('/checkout/save-address', 'Webkul\Cart\Http\Controllers\CheckoutController@saveAddress')->name('shop.checkout.save-address'); Route::post('/checkout/save-shipping', 'Webkul\Cart\Http\Controllers\CheckoutController@saveShipping')->name('shop.checkout.save-shipping'); diff --git a/packages/Webkul/Shop/src/Resources/assets/js/app.js b/packages/Webkul/Shop/src/Resources/assets/js/app.js index 1507aa2da..87860f794 100644 --- a/packages/Webkul/Shop/src/Resources/assets/js/app.js +++ b/packages/Webkul/Shop/src/Resources/assets/js/app.js @@ -31,17 +31,27 @@ $(document).ready(function () { }); }, - addServerErrors: function () { - var scope = null; + addServerErrors: function (scope = null) { for (var key in serverErrors) { + var inputNames = []; + key.split('.').forEach(function(chunk, index) { + if(index) { + inputNames.push('[' + chunk + ']') + } else { + inputNames.push(chunk) + } + }) + + var inputName = inputNames.join(''); + const field = this.$validator.fields.find({ - name: key, + name: inputName, scope: scope }); if (field) { this.$validator.errors.add({ id: field.id, - field: key, + field: inputName, msg: serverErrors[key][0], scope: scope }); diff --git a/packages/Webkul/Shop/src/Resources/assets/js/components/cart-dropdown.vue b/packages/Webkul/Shop/src/Resources/assets/js/components/cart-dropdown.vue index bea9aa806..d9f8b74ba 100644 --- a/packages/Webkul/Shop/src/Resources/assets/js/components/cart-dropdown.vue +++ b/packages/Webkul/Shop/src/Resources/assets/js/components/cart-dropdown.vue @@ -11,19 +11,22 @@
-

Cart Subtotal - $80

+

Cart Subtotal - $ {{ subtotal }}

-
-
- +
+
+ +
+
+
-
Some Item Name
-
$ Some Price
-
Some Quantity
+
{{item[0]}}
+
$ {{ item[1] }}
+
Quantity - {{ item[3] }}
@@ -41,14 +44,16 @@ export default { props: { - items: Array, + items: Object, }, data(){ return { toggle: true, - totalitems: 0, - cart_items: [] + totalitems: parseInt(0), + cart_items: [], + placeholder: "http://localhost/bagisto/public/themes/default/assets/images/product/small-product-placeholder.png", + subtotal : parseInt(0) }; }, @@ -59,8 +64,9 @@ export default { }, mounted: function() { - if(this.items != undefined) + if(this.items != undefined) { this.initializeDropdown(); + } }, methods: { @@ -73,8 +79,13 @@ export default { }, initializeDropdown: function() { - this.totalitems = this.items.length; this.cart_items = this.items; + + var item; + for(item in this.cart_items) { + this.subtotal = this.subtotal + parseInt(this.cart_items[item][1]); + this.totalitems = this.totalitems + 1; + } } } } @@ -89,6 +100,7 @@ export default { background: #FFFFFF; border: 1px solid #E8E8E8; box-shadow: 1px 3px 6px 0 rgba(0,0,0,0.40); + color: #242424; padding: 20px; border-radius: 1px; right: 10%; @@ -112,34 +124,47 @@ export default { width: 22px; } + .dropdown-cart > .dropdown-header p.heading { + font-weight: lighter; + } + .dropdown-content { padding-top: 10px; padding-bottom: 10px; + margin-top: 7px; } .dropdown-content .item{ display: flex; flex-direction: row; border-bottom: 1px solid #E8E8E8; + padding-top: 9px; + padding-bottom: 9px; } + .dropdown-content .item img{ height: 75px; width: 75px; margin-right: 8px; } + .dropdown-content .item-details{ + height: 75px; + } + .item-details .item-name { font-size: 16px; font-weight: bold; - margin-bottom: 10px; + margin-bottom: 9px; } .item-details .item-price { - margin-bottom: 10px; + margin-bottom: 9px; } .item-details .item-qty { - margin-bottom: 10px; + font-weight: lighter; + margin-bottom: 9px; } .dropdown-footer { @@ -147,6 +172,7 @@ export default { flex-direction: row; justify-content: space-between; align-items: center; + margin-top: 4px; } .dropdown-footer button { diff --git a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss index 60ab1708d..a59bf9439 100644 --- a/packages/Webkul/Shop/src/Resources/assets/sass/app.scss +++ b/packages/Webkul/Shop/src/Resources/assets/sass/app.scss @@ -619,6 +619,7 @@ section.slider-block { margin-bottom: 5%; div.slider-content { + position: relative; height: 500px; margin-left: auto; margin-right: auto; @@ -627,7 +628,7 @@ section.slider-block { ul.slider-images { li{ - //both rules are equivalent to display none + //both combined are equivalent to display none position: absolute; visibility: hidden; } @@ -635,7 +636,7 @@ section.slider-block { li.show { display:block; visibility: visible; - width: 80%; + width: 100%; animation-name: example; animation-duration: 4s; } @@ -655,7 +656,7 @@ section.slider-block { position: absolute; user-select: none; bottom: 2%; - right: 11%; + right: 2%; .dark-left-icon { @@ -3217,6 +3218,28 @@ section.cart { border-radius: 50%; display: inline-flex; border: 1px solid #E8E8E8; + background-repeat: no-repeat; + background-position: center; + + &.address-info { + background-image: url('../images/address.svg'); + } + + &.shipping { + background-image: url('../images/shipping.svg'); + } + + &.payment { + background-image: url('../images/payment.svg'); + } + + &.review { + background-image: url('../images/finish.svg'); + } + } + + &.completed { + cursor: pointer; img { margin: auto; diff --git a/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php b/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php index a1ee8b54f..9fb6fbbf0 100644 --- a/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php +++ b/packages/Webkul/Shop/src/Resources/views/checkout/onepage.blade.php @@ -157,6 +157,9 @@ this_this.currentStep = 2; } }) + .catch(function (error) { + this_this.handleErrorResponse(error.response, 'address-form') + }) }, saveShipping () { @@ -169,11 +172,14 @@ this_this.currentStep = 3; } }) + .catch(function (error) { + this_this.handleErrorResponse(error.response, 'shipping-form') + }) }, savePayment () { var this_this = this; - this.$http.post("{{ route('shop.checkout.save-payment') }}", {'shipping_method': this.selected_shipping_method}) + this.$http.post("{{ route('shop.checkout.save-payment') }}", {'shipping_method': this.selected_payment_method}) .then(function(response) { if(response.data.jump_to_section == 'payment') { shippingHtml = Vue.compile(response.data.html) @@ -181,6 +187,20 @@ this_this.currentStep = 4; } }) + .catch(function (error) { + this_this.handleErrorResponse(error.response, 'payment-form') + }) + }, + + handleErrorResponse (response, scope) { + if(response.status == 422) { + serverErrors = response.data.errors; + this.$root.addServerErrors(scope) + } else if(response.status == 403) { + if(response.data.redirect_url) { + window.location.href = response.data.redirect_url; + } + } } } }) diff --git a/packages/Webkul/Shop/src/Resources/views/store/product/cart/compare.blade.php b/packages/Webkul/Shop/src/Resources/views/store/cart/compare.blade.php similarity index 100% rename from packages/Webkul/Shop/src/Resources/views/store/product/cart/compare.blade.php rename to packages/Webkul/Shop/src/Resources/views/store/cart/compare.blade.php diff --git a/packages/Webkul/Shop/src/Resources/views/store/product/cart/cart/index.blade.php b/packages/Webkul/Shop/src/Resources/views/store/cart/index.blade.php similarity index 79% rename from packages/Webkul/Shop/src/Resources/views/store/product/cart/cart/index.blade.php rename to packages/Webkul/Shop/src/Resources/views/store/cart/index.blade.php index 35ee21cef..4230a8dac 100644 --- a/packages/Webkul/Shop/src/Resources/views/store/product/cart/cart/index.blade.php +++ b/packages/Webkul/Shop/src/Resources/views/store/cart/index.blade.php @@ -7,9 +7,11 @@
+ {{-- {{ dd($products) }} --}} +
-
+ {{--
@@ -42,41 +44,45 @@
-
-
- - -
- -
- Rainbow Creation Embroided +
--}} + @foreach($products as $product) +
+
+
-
- - $24.00 - - - $25.00 - - - 10% Off - +
+ +
+ {{$product[0]}} +
+ +
+ + {{$product[1]}} + + + $25.00 + + + 10% Off + +
+ +
+ Color : Gray, Size : S, Sleeve type : Puffed Sleeves, Occasion : Birthday, Marriage Anniversary +
+ +
+
Quantity
+
{{ $product[3] }}
+ Remove + Move to Wishlist +
-
- Color : Gray, Size : S, Sleeve type : Puffed Sleeves, Occasion : Birthday, Marriage Anniversary -
- -
-
Quantity
-
1
- Remove - Move to Wishlist -
- -
+ @endforeach
Continue Shopping @@ -90,22 +96,12 @@ Price Detail
- -
- Item 1 - $25.00 -
- -
- Item 2 - $25.00 -
- -
- Item 3 - $25.00 -
- + @foreach($products as $product) +
+ {{ $product[0] }} + $ {{ $product[1] }} +
+ @endforeach
diff --git a/packages/Webkul/Shop/src/Resources/views/store/product/cart/sharelinks.blade.php b/packages/Webkul/Shop/src/Resources/views/store/product/cart/sharelinks.blade.php deleted file mode 100644 index e69de29bb..000000000 diff --git a/public/themes/default/assets/css/shop.css b/public/themes/default/assets/css/shop.css index 880c91248..0104a13f3 100644 --- a/public/themes/default/assets/css/shop.css +++ b/public/themes/default/assets/css/shop.css @@ -688,6 +688,7 @@ section.slider-block { } section.slider-block div.slider-content { + position: relative; height: 500px; margin-left: auto; margin-right: auto; @@ -701,7 +702,7 @@ section.slider-block div.slider-content ul.slider-images li { section.slider-block div.slider-content ul.slider-images li.show { display: block; visibility: visible; - width: 80%; + width: 100%; -webkit-animation-name: example; animation-name: example; -webkit-animation-duration: 4s; @@ -739,7 +740,7 @@ section.slider-block div.slider-content div.slider-control { -ms-user-select: none; user-select: none; bottom: 2%; - right: 11%; + right: 2%; } section.slider-block div.slider-content div.slider-control .dark-left-icon { diff --git a/public/themes/default/assets/js/shop.js b/public/themes/default/assets/js/shop.js index a24a8639e..0d8637235 100644 --- a/public/themes/default/assets/js/shop.js +++ b/public/themes/default/assets/js/shop.js @@ -1427,16 +1427,28 @@ $(document).ready(function () { }, addServerErrors: function addServerErrors() { - var scope = null; + var scope = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null; + for (var key in serverErrors) { + var inputNames = []; + key.split('.').forEach(function (chunk, index) { + if (index) { + inputNames.push('[' + chunk + ']'); + } else { + inputNames.push(chunk); + } + }); + + var inputName = inputNames.join(''); + var field = this.$validator.fields.find({ - name: key, + name: inputName, scope: scope }); if (field) { this.$validator.errors.add({ id: field.id, - field: key, + field: inputName, msg: serverErrors[key][0], scope: scope }); @@ -31573,7 +31585,7 @@ exports = module.exports = __webpack_require__(10)(false); // module -exports.push([module.i, "\n.show {\n display: none;\n}\n.dropdown-cart {\n position: absolute;\n background: #FFFFFF;\n border: 1px solid #E8E8E8;\n -webkit-box-shadow: 1px 3px 6px 0 rgba(0,0,0,0.40);\n box-shadow: 1px 3px 6px 0 rgba(0,0,0,0.40);\n padding: 20px;\n border-radius: 1px;\n right: 10%;\n top: 75px;\n width: 387px;\n z-index: 5;\n}\n.dropdown-cart > .dropdown-header {\n width: 100%;\n}\n.dropdown-cart > .dropdown-header p{\n display: inline;\n line-height: 25px;\n}\n.dropdown-cart > .dropdown-header i{\n cursor: pointer;\n float: right;\n height: 22px;\n width: 22px;\n}\n.dropdown-content {\n padding-top: 10px;\n padding-bottom: 10px;\n}\n.dropdown-content .item{\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n border-bottom: 1px solid #E8E8E8;\n}\n.dropdown-content .item img{\n height: 75px;\n width: 75px;\n margin-right: 8px;\n}\n.item-details .item-name {\n font-size: 16px;\n font-weight: bold;\n margin-bottom: 10px;\n}\n.item-details .item-price {\n margin-bottom: 10px;\n}\n.item-details .item-qty {\n margin-bottom: 10px;\n}\n.dropdown-footer {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n}\n.dropdown-footer button {\n border-radius: 0px;\n}\n\n", ""]); +exports.push([module.i, "\n.show {\n display: none;\n}\n.dropdown-cart {\n position: absolute;\n background: #FFFFFF;\n border: 1px solid #E8E8E8;\n -webkit-box-shadow: 1px 3px 6px 0 rgba(0,0,0,0.40);\n box-shadow: 1px 3px 6px 0 rgba(0,0,0,0.40);\n color: #242424;\n padding: 20px;\n border-radius: 1px;\n right: 10%;\n top: 75px;\n width: 387px;\n z-index: 5;\n}\n.dropdown-cart > .dropdown-header {\n width: 100%;\n}\n.dropdown-cart > .dropdown-header p{\n display: inline;\n line-height: 25px;\n}\n.dropdown-cart > .dropdown-header i{\n cursor: pointer;\n float: right;\n height: 22px;\n width: 22px;\n}\n.dropdown-cart > .dropdown-header p.heading {\n font-weight: lighter;\n}\n.dropdown-content {\n padding-top: 10px;\n padding-bottom: 10px;\n margin-top: 7px;\n}\n.dropdown-content .item{\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n border-bottom: 1px solid #E8E8E8;\n padding-top: 9px;\n padding-bottom: 9px;\n}\n.dropdown-content .item img{\n height: 75px;\n width: 75px;\n margin-right: 8px;\n}\n.dropdown-content .item-details{\n height: 75px;\n}\n.item-details .item-name {\n font-size: 16px;\n font-weight: bold;\n margin-bottom: 9px;\n}\n.item-details .item-price {\n margin-bottom: 9px;\n}\n.item-details .item-qty {\n font-weight: lighter;\n margin-bottom: 9px;\n}\n.dropdown-footer {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n margin-top: 4px;\n}\n.dropdown-footer button {\n border-radius: 0px;\n}\n\n", ""]); // exports @@ -31621,20 +31633,25 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); // // // +// +// +// // define the item component /* harmony default export */ __webpack_exports__["default"] = ({ props: { - items: Array + items: Object }, data: function data() { return { toggle: true, - totalitems: 0, - cart_items: [] + totalitems: parseInt(0), + cart_items: [], + placeholder: "http://localhost/bagisto/public/themes/default/assets/images/product/small-product-placeholder.png", + subtotal: parseInt(0) }; }, @@ -31644,7 +31661,9 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); }, mounted: function mounted() { - if (this.items != undefined) this.initializeDropdown(); + if (this.items != undefined) { + this.initializeDropdown(); + } }, methods: { @@ -31657,8 +31676,13 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); }, initializeDropdown: function initializeDropdown() { - this.totalitems = this.items.length; this.cart_items = this.items; + + var item; + for (item in this.cart_items) { + this.subtotal = this.subtotal + parseInt(this.cart_items[item][1]); + this.totalitems = this.totalitems + 1; + } } } }); @@ -31691,7 +31715,9 @@ var render = function() { _vm._v(" "), _c("div", { staticClass: "dropdown-cart", class: { show: _vm.toggle } }, [ _c("div", { staticClass: "dropdown-header" }, [ - _c("p", { staticClass: "heading" }, [_vm._v("Cart Subtotal - $80")]), + _c("p", { staticClass: "heading" }, [ + _vm._v("Cart Subtotal - $ " + _vm._s(_vm.subtotal)) + ]), _vm._v(" "), _c("i", { staticClass: "icon icon-menu-close", @@ -31699,31 +31725,41 @@ var render = function() { }) ]), _vm._v(" "), - _vm._m(0), + _c( + "div", + { staticClass: "dropdown-content" }, + _vm._l(_vm.items, function(item, index) { + return _c("div", { key: index, staticClass: "item" }, [ + item[2] != "null" + ? _c("div", { staticClass: "item-image" }, [ + _c("img", { attrs: { src: item[2] } }) + ]) + : _c("div", { staticClass: "item-image" }, [ + _c("img", { attrs: { src: _vm.placeholder } }) + ]), + _vm._v(" "), + _c("div", { staticClass: "item-details" }, [ + _c("div", { staticClass: "item-name" }, [ + _vm._v(_vm._s(item[0])) + ]), + _vm._v(" "), + _c("div", { staticClass: "item-price" }, [ + _vm._v("$ " + _vm._s(item[1])) + ]), + _vm._v(" "), + _c("div", { staticClass: "item-qty" }, [ + _vm._v("Quantity - " + _vm._s(item[3])) + ]) + ]) + ]) + }) + ), _vm._v(" "), - _vm._m(1) + _vm._m(0) ]) ]) } var staticRenderFns = [ - function() { - var _vm = this - var _h = _vm.$createElement - var _c = _vm._self._c || _h - return _c("div", { staticClass: "dropdown-content" }, [ - _c("div", { staticClass: "item" }, [ - _c("div", { staticClass: "item-image" }, [_c("img")]), - _vm._v(" "), - _c("div", { staticClass: "item-details" }, [ - _c("div", { staticClass: "item-name" }, [_vm._v("Some Item Name")]), - _vm._v(" "), - _c("div", { staticClass: "item-price" }, [_vm._v("$ Some Price")]), - _vm._v(" "), - _c("div", { staticClass: "item-qty" }, [_vm._v("Some Quantity")]) - ]) - ]) - ]) - }, function() { var _vm = this var _h = _vm.$createElement