Компоненты кабинета партнёра

Краткое описание

Компонент	Назначение
Sidebar	Компонент боковой панели
CartList	Компонент отображения содержимого корзины
CatalogList	Компонент списка категорий
CategoryProductsList	Компонент списка товаров в категории с добавлением в корзину
Minicart	Мини-корзина, отображающая количество товаров и ссылку на корзину

Подробное описание

Sidebar

Компонент боковой панели навигации, используемой в партнёрском кабинете. Содержит ссылки на основные разделы: сводку, заказы, скидки, данные пользователя, адреса доставки, пользователей и магазин (каталог, корзина)

Особенности:

• Использует компонент UNavigationMenu из Nuxt UI
• Элементы меню задаются в виде вложенного массива sidebarItems

Пример использования:

<template>
	<Sidebar />
</template>

CartList

Компонент отображает содержимое корзины: список товаров с возможностью редактирования количества и удаления, а также сводную информацию по общей стоимости, весу и количеству товаров

Props:

Компонент не принимает внешние пропсы — все данные берутся из хранилища useCartStore

Особенности:

• Использует хранилище useCartStore для доступа к:

  • productsCart — список товаров в корзине
  • itemRemoveCart(id) — метод удаления товара
  • totalItemsPrice() — метод получения общей стоимости
  • totalItemsWeight() — метод получения общего веса
  • totalItemsCounts() — метод получения общего количества

• Для каждого товара отображаются:

  • Кнопка удаления
  • Ссылка на товар
  • Цена
  • Поле изменения количества

• Все значения цен форматируются функцией formattingPrice из пакета @aceramica/nuxt-shared

CatalogList

Компонент отображает список категорий товаров для перехода в соответствующие разделы каталога

CategoryProductsList

Компонент отображает список товаров определённой категории с возможностью добавления их в корзину

Особенности:

• Использует хранилище cartStore для работы с корзиной (useCartStore)

• Для каждого товара отображается:

  • Кнопка "Добавить в корзину", если товар ещё не добавлен

  • Если товар уже в корзине — появляется:

    • UInputNumber для изменения количества
    • Кнопка перехода в корзину

• Проверка добавления товара реализована функцией isItemAdded(itemId)

Minicart

Компонент мини-корзины, отображаемой в правом нижнем углу экрана, если в корзине есть хотя бы один товар

Особенности:

• Использует cartStore (useCartStore) для получения количества товаров в корзине
• Условный рендеринг (v-if) — отображается только если cartStore.totalItemsCounts() > 0
• Отображается как фиксированный элемент в правом нижнем углу экрана