src/components/Cart/CartSummary.jsx - master - DevDenzo/DigitalStore

src/components/Cart/CartSummary.jsx

40 строк2 KB

Denis Sklyarskij

Добавлены отсутствующие стили

29 ноя 2025, 18:56

29 ноя 2025, 18:565df79b0

import React from 'react';
import { useSelector } from "react-redux";
import { CartMessage } from "./index";
import './CartSummary.css';

const CartSummary = () => {
    /* Список товаров в корзине */
    const cartItems = useSelector(state => state.cart.itemsCart);
    /* Состояние выбранных товаров в корзине */
    const selectedItems = useSelector(state => state.cart.selectedItems);
    /* Ни один товар в корзине не выбран */
    const isAllItemsUnselected = Object.values(selectedItems).every(value => value === false);
    /* Функция расчета итоговой суммы товаров в корзине */
    const getFinalAmount = () => cartItems.reduce((total, item) => total + item.price, 0);

    return (
        <>
            {isAllItemsUnselected ? (
                <CartMessage />
            ): (
                <div className="cart-summary">
                    <div className="cart-summary__row">
                        <span className="cart-summary__label">Ваша корзина</span>
                        <span className="cart-summary__text">{ cartItems.length } товаров</span>
                    </div>
                    <div className="cart-summary__row">
                        <span className="cart-summary__label">Товары ({ cartItems.length })</span>
                        <span className="cart-summary__text">Сумма товаров &#8381;</span>
                    </div>
                    <div className="cart-summary__row cart-summary__row--total">
                        <span className="cart-summary__label">Итого</span>
                        <span className="cart-summary__text">{ getFinalAmount() } &#8381;</span>
                    </div>
                </div>
            )}
        </>
    );
};

export default CartSummary;