Giỏ hàng

Các nội dung cơ bản của trang giỏ hàng

Trang giỏ hàng là một trang trên một trang web mua sắm, trong đó người dùng có thể xem và quản lý các sản phẩm mà họ đã chọn để mua. Trong trang giỏ hàng, người dùng có thể thay đổi số lượng của mỗi sản phẩm, xóa sản phẩm khỏi giỏ hàng hoặc tiến hành thanh toán cho các sản phẩm trong giỏ hàng.

Các thẻ meta

{% extends layout_layout %}
{% block meta %}
    {{ headTitle('Giỏ hàng').setSeparator(' - ').setAutoEscape(false)|raw }}
    <meta name="keywords" content="Giỏ hàng">
    <meta name="description" content="Giỏ hàng">
    <link rel="canonical" href="{{ getCurrentUrl(true) }}" />
    <meta property="og:url" content="{{ getCurrentUrl(true) }}">
    <meta property="og:image" content="https://dummyimage.com/300x200/000/fff">
    <meta property="og:type" content="website">
    <meta property="og:title" content="Giỏ hàng">
{% endblock %}

Thông tin trang giỏ hàng

Một trang giỏ hàng thường bao gồm các thông tin cơ bản sau:

• Danh sách sản phẩm đã được thêm vào giỏ hàng, giá sản phẩm, số lượng sản phẩm, nút thêm bớt xóa sản phẩm.

{% set products = serviceCart().productList %}
{% if products is not empty %}
{% for p in products %}
    {% set discount = p.priceAfterDiscount(p.quantity) %}
    <div class="cart-prd row cartItem_{{ p.id }}">
        <div class="col-lg-2 col-4">
            <img alt="{{p.name}}" src="{{ p.thumbnailUri }}">
        </div>  
        <div class="col-lg-10 col-8 row">
            <div class="col-lg-4 col-12">
                <p class="cart-item__name">{{ p.name }}</p>
            </div>
            <p class="col-lg-2 col-12 price-per__one">
                {% if (discount > 0) %}
                    {{ discount|number_format(0) }}₫  <del>{{ p.price|number_format(0) }}₫</del>
                {% elseif (p.price is not empty and p.price <= 0) %}
                        Liên hệ
                {% elseif (p.oldprice > 0) %}
                    {{ p.price|number_format(0) }}₫  <del>{{ p.oldprice|number_format(0) }}₫</del>
                {% else%}   
                    {{ p.price|number_format(0) }}₫
                {% endif %}
            </p>
            <div class="cart-quantity _quantityCart d-flex align-items-center">
                  <a class="_subtract" data-id="{{ p.id }}">
                    <i class="fal fa-minus"></i>
                  </a>
                   <input aria-label="quantity" class="_numberProduct" data-id="{{ p.id }}" type="number" data-max="{{ p.inventory.available?p.inventory.available:p.available }}" value="{{ p.quantity }}">
                  <a class="_plus" data-id="{{ p.id }}">
                     <i class="fal fa-plus"></i>
                  </a>
            </div>
            <p class="col-lg-2 col-12 price-total">
                {% if (discount > 0) %}
                    {{ (discount * p.quantity) | number_format(0) }}₫
                {% else %}
                    {% if (p.price is not empty and p.price <= 0) %}
                        Liên hệ
                    {% else %}
                        {{ (p.price * p.quantity)|number_format(0) }}₫
                    {% endif %}
                {% endif %}
            </p>
            <div class="col-auto">
                <p class="_removeCart" data-id="{{ p.id }}">Xóa</p>
            </div>
        </div>
    </div>
{% endfor %}
{% endif %}

• Số tiền tạm tính, tổng giá trị của giỏ hàng

{% set totalCartMoney = serviceCart().totalMoney %}   
{{ totalCartMoney|number_format(0) }}