templates/bundles/EcommerceBundle/Main/cart.html.twig line 1

Open in your IDE?
  1. {% extends "standard_tpl.html.twig" %}
  3. {% set page_title_alt = "Cart" %}
  5. {% block page_banner 'minimal' %}
  7. {% block  content %}   
  8.    
  9.     <!-- Cart -->
  10.     <section class="cart-wrapper" data-controller="cart" data-url="{{ path('shopping_cart_json') }}">
  11.         <div class="container">
  12.             {% if cart.items|length > 0 %}
  13.             <form action="{{ path('shopping_cart_update') }}" method="post" class="cart-form">
  14.                 <div class="row justify-content-center">
  15.                     <div class="col-lg-9">
  16.                         <h2 class="checkout-form-title text-center">Shopping Cart</h2>
  17.                         <div class="shopping-table-wrapper">
  18.                             <table>
  19.                                 <thead>
  20.                                     <tr>
  21.                                         <th>Product</th>
  22.                                         <th class="text-center">Quantity</th>
  23.                                         <th class="text-right">Total</th>
  24.                                     </tr>
  25.                                 </thead>
  26.                                 <tbody data-cart-target="cartContent">
  27.                                     {% for item in cart.items %}
  28.                                     <tr class="cart-item" data-product-id="{{ item.id }}" data-product-price="{{ item.price }}">
  29.                                         <td class="order-card-details">
  30.                                             <div class="d-flex align-items-center order-card">
  31.                                                 <img src="{{ item.image|media_url }}" class="img-fluid" alt="{{ item.name }}">
  32.                                                 <div class="order-card-content d-md-block">
  33.                                                     <h3 class="order-card-title">{{ item.name }}</h3>
  34.                                                     <p>{{ currency(item.price) }}</p>
  35.                                                 </div>
  36.                                             </div>
  37.                                         </td>
  38.                                         <td class="text-center">
  39.                                             <div class="input-group fast-cart-group quantity-controls">
  40.                                                 <button class="btn btn-outline-secondary" type="button" data-action="cart#decrement" data-index="{{ item.id }}">-</button>
  41.                                                 <input type="text" name="products[{{item.id}}][qty]" data-cart-target="quantity" class="form-control checkout-form-input" type="number" aria-label="Example text with button addon" value="{{ item.qty }}">
  42.                                                 <button class="btn btn-outline-secondary" type="button" data-action="cart#increment" data-index="{{ item.id }}">+</button>
  43.                                             </div>
  44.                                             <a href="#" class="btn-cart-remove"  data-action="click->cart#removeItem" data-index="{{ item.id }}">Remove</a>
  45.                                         </td>
  46.                                         <td class="text-right" data-cart-target="total">{{ currency(item.getAmount()) }}</td>
  47.                                     </tr>
  48.                                     {% endfor %}
  49.                                 </tbody>
  50.                             </table>
  51.                         </div>
  52.                         <div class="order-summary-wrapper">
  53.                             <div class="d-flex justify-content-between mt-3">
  54.                                 <div>
  55.                                     <p class="text-right">Shipping & taxes calculated at checkout</p>
  56.                                 </div>
  57.                                 <div class="subtotal">
  58.                                     <span class="subtotal-label">Subtotal: </span>
  59.                                     <span data-cart-target="subtotalAmount">{{ currency(sub_total) }}</span>
  60.                                 </div>
  61.                             </div>
  62.                             
  63.                             
  64.                             <p>All charges are billed in USD. While the content of your cart is currently displayed in , the checkout will use USD at the most current exchange rate.</p>
  65.                             <p>
  66.                                 <input style="float:none; vertical-align: middle;" type="checkbox" class="agree_terms_conditions" />
  67.                                 <label style="display:inline; float:none" for="agree">
  68.                                     I agree with the <a href="#">terms and conditions</a>
  69.                                 </label>
  70.                             </p>
  71.                             <div class="d-flex justify-content-end mt-4 checkout-btn-list align-items-center">
  72.                                 <!-- <button type="submit" class="btn btn-teritary-fast">Update Cart</button> -->
  73.                                     <div class="col-md-3">
  74.                                         <a href="{{ path('shopping_checkout') }}" class="btn btn-teritary-fast btn-cart-checkout">
  75.                                             <span class="text">Check Out</span>
  76.                                         </a>
  77.                                     </div>
  78.                             </div>
  79.                         </div>
  80.                     </div>
  81.                 </div>
  82.             </form>
  83.             {% else %}
  84.             <div class="cart-empty-container row justify-content-center">
  85.                 <div class="col-md-5">
  86.                     <div class="cart-empty-content text-center">
  87.                         <h2>Your cart is currently empty.</h2>
  88.                         <p>Before proceed to checkout you must add some products 
  89.                         to your shopping cart. You will find a lot of interesting products 
  90.                         on our Website.
  91.                         </p>
  92.                         <a href="{{ path('product_list') }}" class="btn btn-teritary-fast"><span class="text">Go to shopping</span></a>
  93.                     </div>
  94.                 </div>
  95.             </div>
  96.             {% endif %}
  97.             <div class="spinner-wrapper" data-cart-target="spinner">
  98.                 <div class="spinner"></div>
  99.                 <span>Loading...</span>
  100.             </div>
  101.         </div>
  102.     </section>
  103.     <!-- Cart -->
  105. {% endblock %}