Реализация реферальной системы и улучшение системы авторизации
- Добавлена полная реферальная система с GraphQL резолверами и UI компонентами - Улучшена система регистрации с поддержкой ВКонтакте и реферальных ссылок - Обновлена схема Prisma для поддержки реферальной системы - Добавлены новые файлы документации правил системы - Улучшена система партнерства и контрагентов - Обновлены компоненты авторизации для поддержки новых функций - Удален устаревший server.log 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Veronika Smirnova
1806
workflow-catalog.md
Normal file
1806
workflow-catalog.md
Normal file
@ -0,0 +1,1806 @@
|
||||
# КАТАЛОГ ВСЕХ БИЗНЕС-ПРОЦЕССОВ СИСТЕМЫ
|
||||
|
||||
> ⚠️ **НАЗНАЧЕНИЕ**: Полный каталог всех бизнес-процессов и workflow системы управления складами.
|
||||
> **Источник**: Все процессы из [rules-complete.md](./rules-complete.md) собраны в одном месте для удобного поиска.
|
||||
|
||||
---
|
||||
|
||||
## 📋 **ОГЛАВЛЕНИЕ**
|
||||
|
||||
### Основные процессы:
|
||||
- [1. Workflow поставок](#1-workflow-поставок) - 8 статусов, 6 этапов
|
||||
- [2. Процесс создания продукта](#2-процесс-создания-продукта) - 5 шагов с SLA
|
||||
- [3. UI процессы селлера](#3-ui-процессы-селлера) - 4-блочная система
|
||||
- [4. Workflow фулфилмента](#4-workflow-фулфилмента) - 3 этапа обработки
|
||||
- [5. Workflow логистики](#5-workflow-логистики) - 4 этапа доставки
|
||||
- [6. Система партнерства](#6-система-партнерства) - 2 способа, 4 статуса
|
||||
- [7. Интеграция с услугами](#7-интеграция-с-услугами) - 5-шаговый workflow
|
||||
- [8. Критические ситуации](#8-критические-ситуации) - отмены и чрезвычайные
|
||||
|
||||
### Вспомогательные процессы:
|
||||
- [9. Протоколы разработки](#9-протоколы-разработки) - последовательность работы
|
||||
- [10. Система учета движения товаров](#10-система-учета-движения-товаров)
|
||||
|
||||
### Индекс по ролям:
|
||||
- **Селлер**: процессы 1, 2, 3, 6
|
||||
- **Поставщик**: процессы 1, 6
|
||||
- **Фулфилмент**: процессы 1, 2, 4, 7
|
||||
- **Логистика**: процессы 1, 5
|
||||
|
||||
---
|
||||
|
||||
## 1. 🚚 **WORKFLOW ПОСТАВОК**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел 5, строки 519-563
|
||||
|
||||
### 1.1 Детализированная система статусов
|
||||
|
||||
**Статусы SupplyOrder (Заказ поставки):**
|
||||
|
||||
1. **PENDING** - Ожидает подтверждения поставщиком
|
||||
2. **SUPPLIER_APPROVED** - Одобрено поставщиком
|
||||
3. **CONFIRMED** - Подтвержден (готов к обработке)
|
||||
4. **LOGISTICS_CONFIRMED** - Подтверждено логистикой
|
||||
5. **SHIPPED** - Отгружено поставщиком
|
||||
6. **IN_TRANSIT** - В пути (логистика доставляет)
|
||||
7. **DELIVERED** - Доставлен на фулфилмент
|
||||
8. **CANCELLED** - Отменен
|
||||
|
||||
### 1.2 Пошаговый процесс поставки
|
||||
|
||||
**ЭТАП 1: Создание заказа**
|
||||
|
||||
1. Селлер заказывает товар/расходники у поставщика
|
||||
2. Система создает SupplyOrder со статусом `PENDING`
|
||||
3. Автоматическое уведомление поставщику
|
||||
|
||||
**ЭТАП 2: Обработка поставщиком**
|
||||
|
||||
4. Поставщик получает оповещение
|
||||
5. Поставщик нажимает "Одобрить"
|
||||
6. Статус меняется на `SUPPLIER_APPROVED`
|
||||
|
||||
**ЭТАП 3: Передача в фулфилмент**
|
||||
|
||||
7. Поставка отображается в кабинете фулфилмента
|
||||
8. Фулфилмент выбирает ответственного и логистику
|
||||
9. Статус меняется на `CONFIRMED`
|
||||
|
||||
**ЭТАП 4: Логистическое подтверждение**
|
||||
|
||||
10. Логистика подтверждает доставку
|
||||
11. Статус меняется на `LOGISTICS_CONFIRMED`
|
||||
|
||||
**ЭТАП 5: Отгрузка**
|
||||
|
||||
12. Поставщик отгружает товар
|
||||
13. Статус меняется на `SHIPPED`, затем `IN_TRANSIT`
|
||||
|
||||
**ЭТАП 6: Доставка и приемка**
|
||||
|
||||
14. Логистика доставляет на фулфилмент
|
||||
15. Фулфилмент принимает товар
|
||||
16. Статус меняется на `DELIVERED`
|
||||
|
||||
### 1.3 Система уведомлений
|
||||
|
||||
**Обязательные уведомления:**
|
||||
|
||||
- Поставщику: о новом заказе
|
||||
- Фулфилменту: о подтвержденной поставке
|
||||
- Логистике: о назначении на заявку
|
||||
- Селлеру: об изменении каждого статуса
|
||||
|
||||
---
|
||||
|
||||
## 2. 🔄 **ПРОЦЕСС СОЗДАНИЯ ПРОДУКТА**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел 6, строки 565-740
|
||||
|
||||
### 2.1 5-шаговый алгоритм создания
|
||||
|
||||
**ПРЕДВАРИТЕЛЬНОЕ УСЛОВИЕ**: Рецептура задана селлером
|
||||
|
||||
**ШАГ 1: Поступление на склад (автоматически)**
|
||||
- Товар поступает на склад фулфилмента
|
||||
- Система фиксирует поступление
|
||||
- Товар получает статус "доступен для обработки"
|
||||
|
||||
**ШАГ 2: Планирование работы (менеджер фулфилмента)**
|
||||
- Менеджер фулфилмента видит товар в интерфейсе
|
||||
- Планирует обработку согласно рецептуре
|
||||
- Назначает исполнителя
|
||||
|
||||
**ШАГ 3: Обработка товара (исполнитель)**
|
||||
- Исполнитель берет товар в работу
|
||||
- Применяет услуги согласно рецептуре
|
||||
- Использует расходники селлера и фулфилмента
|
||||
- Товар превращается в продукт
|
||||
|
||||
**ШАГ 4: Контроль качества (менеджер/отдел качества)**
|
||||
- Проверка соответствия рецептуре
|
||||
- Контроль качества обработки
|
||||
- Подтверждение или возврат на доработку
|
||||
|
||||
**ШАГ 5: Завершение (система + менеджер)**
|
||||
- Система создает запись о готовом продукте
|
||||
- Продукт получает статус FINISHED_PRODUCT
|
||||
- Готов к отправке селлеру
|
||||
|
||||
### 2.2 Временные рамки и SLA
|
||||
|
||||
| Этап | Время выполнения | Ответственный | KPI |
|
||||
|------|------------------|---------------|-----|
|
||||
| Поступление | Мгновенно | Система | 100% автоматизация |
|
||||
| Планирование | До 2 часов | Менеджер ФФ | 95% в срок |
|
||||
| Обработка | 1-3 дня | Исполнитель | Согласно сложности |
|
||||
| Контроль | До 4 часов | ОТК | 99% точность |
|
||||
|
||||
### 2.3 Детальная рецептура продукта
|
||||
|
||||
**РЕЦЕПТУРА ПРОДУКТА** (задается селлером при создании поставки):
|
||||
|
||||
- **БАЗОВЫЙ ТОВАР**: Исходный материал (обязательно)
|
||||
- Артикул товара
|
||||
- Количество единиц
|
||||
- Размерная сетка (если применимо)
|
||||
|
||||
- **УСЛУГА ФУЛФИЛМЕНТА**: Из каталога услуг фулфилмента
|
||||
- Тип услуги (глажка, упаковка, маркировка и т.д.)
|
||||
- Количество применений
|
||||
- Специальные требования
|
||||
|
||||
- **РАСХОДНИК СЕЛЛЕРА**: Материалы селлера (опционально)
|
||||
- Фирменная упаковка
|
||||
- Этикетки, бирки
|
||||
- Дополнительные аксессуары
|
||||
|
||||
- **РАСХОДНИК ФУЛФИЛМЕНТА**: Материалы фулфилмента (опционально)
|
||||
- Стандартная упаковка
|
||||
- Защитные материалы
|
||||
- Маркировочные элементы
|
||||
|
||||
- **СВЯЗЬ С МАРКЕТПЛЕЙСОМ**: Привязка к карточке (опционально)
|
||||
- ID карточки на маркетплейсе
|
||||
- Артикул маркетплейса
|
||||
- Особые требования МП
|
||||
|
||||
**ФОРМУЛА**: ПРОДУКТ = Товар + Услуга(и) + Расходники селлера + Расходники ФФ
|
||||
|
||||
### 2.4 Пошаговый алгоритм создания продукта
|
||||
|
||||
#### **ПРЕДВАРИТЕЛЬНОЕ УСЛОВИЕ: РЕЦЕПТУРА ЗАДАНА** (селлер)
|
||||
|
||||
```
|
||||
Время: при создании заявки на поставку
|
||||
Действие: селлер указывает рецептуру продукта
|
||||
Обязательные компоненты:
|
||||
✓ Базовый товар (от поставщика)
|
||||
✓ Услуги фулфилмента (упаковка, маркировка и т.д.)
|
||||
✓ Расходники (материалы для производства)
|
||||
Результат: рецептура сохраняется в заявке и передается фулфилменту
|
||||
```
|
||||
|
||||
#### **ШАГ 1: ПОСТУПЛЕНИЕ НА СКЛАД** (автоматически)
|
||||
|
||||
```
|
||||
Время: при смене статуса поставки DELIVERED
|
||||
Действие: товар переходит в статус "на складе"
|
||||
Ответственный: система
|
||||
Результат: +Прибыло в статистике товаров
|
||||
```
|
||||
|
||||
#### **ШАГ 2: ПЛАНИРОВАНИЕ РАБОТЫ** (менеджер фулфилмента)
|
||||
|
||||
```
|
||||
Время: в течение 2 рабочих дней после поступления
|
||||
Действие: назначение параметров обработки
|
||||
Ответственный: менеджер фулфилмента
|
||||
Обязательные поля:
|
||||
✓ Дедлайн выполнения (не более 5 рабочих дней)
|
||||
✓ Ответственный исполнитель (из списка сотрудников)
|
||||
✓ Рецептура (товар + услуги + расходники, указанная селлером в заявке на поставку)
|
||||
Опциональные поля:
|
||||
- Место хранения готовых продуктов (зона склада, стеллаж, ячейка)
|
||||
- Комментарии к работе
|
||||
Результат: поставка переходит во вкладку "В работе"
|
||||
```
|
||||
|
||||
#### **ШАГ 3: ОБРАБОТКА ТОВАРА** (исполнитель)
|
||||
|
||||
```
|
||||
Время: согласно дедлайну (обычно 1-3 дня)
|
||||
Действие: физическая обработка товара
|
||||
Ответственный: назначенный сотрудник
|
||||
Обязательные действия:
|
||||
1. Проверка качества товара
|
||||
2. Фиксация фактического количества
|
||||
3. Выявление и учет брака
|
||||
4. Применение рецептуры (услуги + расходники)
|
||||
5. Создание готового продукта
|
||||
Точки контроля:
|
||||
- Соответствие плану/факту
|
||||
- Качество выполнения услуг
|
||||
- Расход материалов по норме
|
||||
|
||||
УЧЕТ ПЛАН/ФАКТ:
|
||||
- ПЛАН: Количество товаров из поставки селлера (указано в заказе)
|
||||
- ФАКТ: Реальное количество после обработки = Брак + Хороший товар
|
||||
- ДЕТАЛИЗАЦИЯ: Учет ведется по каждому размеру/объему/варианту
|
||||
- КОРРЕКТИРОВКА: Статистика автоматически обновляется на фактические данные
|
||||
```
|
||||
|
||||
#### **ШАГ 4: КОНТРОЛЬ КАЧЕСТВА** (менеджер/отдел качества)
|
||||
|
||||
```
|
||||
Время: сразу после завершения ШАГ 3
|
||||
Действие: приемка готовой продукции
|
||||
Ответственный: менеджер или контролер качества
|
||||
Критерии приемки:
|
||||
✓ Соответствие рецептуре селлера
|
||||
✓ Качество выполненных услуг
|
||||
✓ Правильность упаковки/маркировки
|
||||
✓ Полнота комплектации
|
||||
Результат: продукт готов к отправке или отправлен на доработку
|
||||
```
|
||||
|
||||
#### **ШАГ 5: ЗАВЕРШЕНИЕ** (система + менеджер)
|
||||
|
||||
```
|
||||
Время: после успешного прохождения контроля качества
|
||||
Действие: финализация процесса
|
||||
Автоматические действия:
|
||||
- Создание записи FINISHED_PRODUCT в БД
|
||||
- Обновление статистики: товар "на складе" → продукт "готов"
|
||||
- Списание использованных расходников
|
||||
- Уведомление селлера о готовности
|
||||
Ручные действия менеджера:
|
||||
- Подтверждение перехода во вкладку "Выполнено"
|
||||
- Указание фактических расходов материалов
|
||||
- Добавление комментариев о выполненной работе
|
||||
```
|
||||
|
||||
### 2.5 Временные рамки и SLA
|
||||
|
||||
| Этап | Стандартное время | Максимальное время | Ответственный |
|
||||
| ----------------- | ----------------- | ------------------ | -------------- |
|
||||
| Планирование | 1 рабочий день | 2 рабочих дня | Менеджер ФФ |
|
||||
| Обработка | 2-3 рабочих дня | 5 рабочих дней | Исполнитель |
|
||||
| Контроль качества | 4 часа | 1 рабочий день | Отдел качества |
|
||||
| Завершение | 2 часа | 4 часа | Менеджер ФФ |
|
||||
|
||||
### 2.6 Детальная рецептура продукта
|
||||
|
||||
**РЕЦЕПТУРА ПРОДУКТА** (задается селлером при создании поставки):
|
||||
|
||||
- **БАЗОВЫЙ ТОВАР**: Исходный материал (обязательно)
|
||||
- Артикул товара
|
||||
- Количество единиц
|
||||
- Размерная сетка (если применимо)
|
||||
|
||||
- **УСЛУГА ФУЛФИЛМЕНТА**: Из каталога услуг фулфилмента
|
||||
- Тип услуги (глажка, упаковка, маркировка и т.д.)
|
||||
- Количество применений
|
||||
- Специальные требования
|
||||
|
||||
- **РАСХОДНИК СЕЛЛЕРА**: Материалы селлера (опционально)
|
||||
- Фирменная упаковка
|
||||
- Этикетки, бирки
|
||||
- Дополнительные аксессуары
|
||||
|
||||
- **РАСХОДНИК ФУЛФИЛМЕНТА**: Материалы фулфилмента (опционально)
|
||||
- Стандартная упаковка
|
||||
- Защитные материалы
|
||||
- Маркировочные элементы
|
||||
|
||||
- **СВЯЗЬ С МАРКЕТПЛЕЙСОМ**: Привязка к карточке (опционально)
|
||||
- ID карточки на маркетплейсе
|
||||
- Артикул маркетплейса
|
||||
- Особые требования МП
|
||||
|
||||
**ФОРМУЛА**: ПРОДУКТ = Товар + Услуга(и) + Расходники селлера + Расходники ФФ
|
||||
|
||||
### 2.7 Учет план/факт в процессе работы
|
||||
|
||||
**ПЛАН**: Количество товара из поставки селлера
|
||||
**ФАКТ**: Реальное количество после пересчета (работник фулфилмента производит сортировку при пересчете)
|
||||
|
||||
**ФИКСАЦИЯ ПОТЕРЬ:**
|
||||
|
||||
- **КОГДА**: В процессе работы (вкладка "В работе")
|
||||
- **ЧТО**: Недостача, повреждения (без создания записей брака)
|
||||
- **КАК**: Корректировка количества в статистике
|
||||
|
||||
**WORKFLOW СОЗДАНИЯ ПРОДУКТА:**
|
||||
|
||||
1. Товар поступает на склад фулфилмента (статус "на складе")
|
||||
2. Товар берется в работу (переход в статус "в обработке")
|
||||
3. Исполнитель производит пересчет и сортировку
|
||||
4. Создается готовый продукт (тип FINISHED_PRODUCT)
|
||||
5. Продукт готов к отправке на маркетплейсы
|
||||
|
||||
**ВЛИЯНИЕ НА СТАТИСТИКУ:**
|
||||
|
||||
- При принятии поставки: +План в статистику
|
||||
- При выявлении факта: корректировка на реальные данные
|
||||
- **ФОРМУЛА**: Факт = Потери + Хороший товар
|
||||
_Где потери - это недостача/повреждения, выявленные при пересчете и сортировке_
|
||||
- **ЛОГИКА**: Фактическое количество = сумма всех пересчитанных предметов
|
||||
- **ПЛАН/ФАКТ**: Корректировка статистики при выявлении расхождений
|
||||
|
||||
---
|
||||
|
||||
## 3. 🎨 **UI ПРОЦЕССЫ СЕЛЛЕРА**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел 9, строки 871-1885 (1015 строк)
|
||||
|
||||
### 3.1 Структура раздела "Мои поставки"
|
||||
|
||||
#### **🏢 ПОСТАВКИ НА ФУЛФИЛМЕНТ**:
|
||||
|
||||
- **Товар** - поставка товаров для создания продуктов
|
||||
- **Карточки** - поставка через WB API с рецептурой (результат: WildberriesSupply)
|
||||
- **Поставщики** - заказ товаров у поставщиков с рецептурой (результат: SupplyOrder)
|
||||
- **Расходники селлера** - поставка материалов для товаров селлера
|
||||
|
||||
#### **🛒 ПОСТАВКИ НА МАРКЕТПЛЕЙСЫ** _(планируется)_:
|
||||
|
||||
- **Wildberries** - прямые поставки на WB
|
||||
- **Ozon** - прямые поставки на Ozon
|
||||
|
||||
### 3.2 UI структура создания поставки расходников селлера
|
||||
|
||||
#### **📄 Структура страницы создания поставки:**
|
||||
|
||||
**ОБНОВЛЕННАЯ СТРУКТУРА СИСТЕМЫ (4 БЛОКА):**
|
||||
|
||||
**БЛОК 1: ПОСТАВЩИКИ** _(адаптивная сетка)_
|
||||
|
||||
- **Заголовок**: Минималистичный "🏢 Поставщики" без лишних элементов
|
||||
- **Поиск**: Компактное поле справа "Поиск поставщиков..." (w-64)
|
||||
- **Отображение**: Карточки поставщиков из раздела "Партнеры" в адаптивной сетке
|
||||
- **Выбор**: Клик выделяет карточку поставщика
|
||||
- **Результат**: Загружаются карточки товаров выбранного поставщика в блок 2
|
||||
|
||||
**БЛОК 2: КАРТОЧКИ ТОВАРОВ** _(горизонтальный скролл - НОВЫЙ)_
|
||||
|
||||
- **Отображение**: ТОЛЬКО минималистичные карточки товаров 80×112px
|
||||
- **Содержание**: ТОЛЬКО изображение товара, БЕЗ текста/названий/цен
|
||||
- **Навигация**: Горизонтальный скролл при множестве товаров
|
||||
- **Выбор**: Клик добавляет товар в детальный каталог
|
||||
- **Результат**: Товар добавляется в блок 3 для управления поставкой
|
||||
|
||||
**БЛОК 3: ТОВАРЫ ПОСТАВЩИКА** _(детальный каталог)_
|
||||
|
||||
- **Отображение**: Детальные карточки выбранных товаров
|
||||
- **Управление**: Количество, параметры, настройки поставки
|
||||
- **Результат**: Формирование окончательной поставки
|
||||
|
||||
**БЛОК 4: КОРЗИНА И НАСТРОЙКИ** _(правая панель)_
|
||||
|
||||
- **Отображение**: Корзина поставки + настройки
|
||||
- **Управление**: Фулфилмент-центр, дата, логистика
|
||||
|
||||
#### **3.2.1 Детальные правила горизонтального скролла поставщиков**
|
||||
|
||||
**СТРУКТУРА И ОТОБРАЖЕНИЕ:**
|
||||
|
||||
- **Источник данных**: Партнеры типа `WHOLESALE` из раздела "Партнеры"
|
||||
- **Контейнер**: Фиксированная высота 176px (h-44) с горизонтальным скроллом
|
||||
- **Блок поставщиков**: Общая высота 180px, включает заголовок + контейнер скролла
|
||||
- **Направление**: Слева направо (LTR)
|
||||
- **Поведение**: Плавный скролл с автоскрытием полосы прокрутки
|
||||
|
||||
**РАЗМЕРЫ И АДАПТИВНОСТЬ:**
|
||||
|
||||
- **Десктоп**: Карточка 216×92px, отступы 12px между карточками, 16px от краев
|
||||
- **Планшет**: Карточка 200×92px, отступы 12px между карточками
|
||||
- **Мобильный**: Карточка 184×92px, отступы 12px между карточками
|
||||
- **Высота блока**: 180px фиксированная для всего блока поставщиков
|
||||
|
||||
**ВЗАИМОДЕЙСТВИЕ:**
|
||||
|
||||
- **Навигация**: Колесо мыши (Shift+скролл), стрелки клавиатуры, свайп на тач
|
||||
- **Выбор**: Клик по карточке → активная рамка + загрузка товаров в блок 2
|
||||
- **Состояния**: Default, Hover (box-shadow), Active (цветная рамка), Loading (скелетон)
|
||||
|
||||
**ГРАНИЧНЫЕ СЛУЧАИ:**
|
||||
|
||||
- **1-4 карточки**: Выравнивание по левому краю, скролл неактивен
|
||||
- **5+ карточек**: Полный горизонтальный скролл
|
||||
- **Нет партнеров**: Заглушка с ссылкой на раздел "Партнеры"
|
||||
|
||||
**ТЕХНИЧЕСКАЯ РЕАЛИЗАЦИЯ:**
|
||||
|
||||
**Критическая Flex-архитектура:**
|
||||
|
||||
```css
|
||||
.parent-container {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.left-block {
|
||||
flex: 1;
|
||||
min-width: 0; /* КРИТИЧЕСКИ ВАЖНО для overflow */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.suppliers-container {
|
||||
height: 180px; /* Общая высота блока */
|
||||
flex-shrink: 0;
|
||||
min-width: 0; /* Предотвращает растяжение */
|
||||
}
|
||||
|
||||
.right-block {
|
||||
width: 384px; /* w-96 */
|
||||
flex-shrink: 0; /* Защита от сжатия */
|
||||
}
|
||||
```
|
||||
|
||||
**Контейнер скролла:**
|
||||
|
||||
```css
|
||||
.suppliers-block {
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
scroll-behavior: smooth;
|
||||
gap: 12px;
|
||||
padding: 0 16px 8px 16px; /* px-4 pb-2 */
|
||||
height: 176px; /* h-44 */
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: #64748b33 transparent;
|
||||
}
|
||||
|
||||
.suppliers-block:hover {
|
||||
scrollbar-color: #cbd5e0 #64748b22;
|
||||
}
|
||||
|
||||
.supplier-card {
|
||||
flex-shrink: 0;
|
||||
width: 216px; /* Десктоп */
|
||||
height: 92px; /* Фиксированная высота */
|
||||
padding: 8px; /* p-2 */
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
```
|
||||
|
||||
**СОДЕРЖАНИЕ КАРТОЧКИ ПОСТАВЩИКА:**
|
||||
|
||||
**Структура (3 строки в 92px высоты):**
|
||||
|
||||
- **Строка 1**: Название + рейтинг (справа, если есть)
|
||||
- **Строка 2**: ИНН (формат "ИНН: 1234567890")
|
||||
- **Строка 3**: Бейдж рынка (отдельная строка)
|
||||
|
||||
**Элементы:**
|
||||
|
||||
- **Аватар**: Размер xs, слева с gap-2
|
||||
- **Текст**: text-xs для компактности
|
||||
- **Отступы**: mb-1 между строками 1-2, mb-0.5 между строками 2-3
|
||||
- **Padding карточки**: 8px (p-2)
|
||||
|
||||
**ЦВЕТОВАЯ СХЕМА РЫНКОВ:**
|
||||
|
||||
- **"Садовод"** (sadovod): Зеленый `bg-green-500/20 text-green-300 border-green-500/30`
|
||||
- **"ТЯК Москва"** (tyak-moscow): Синий `bg-blue-500/20 text-blue-300 border-blue-500/30`
|
||||
- **Другие/не указан**: Серый `bg-gray-500/20 text-gray-300 border-gray-500/30`
|
||||
|
||||
**ДОСТУПНОСТЬ:**
|
||||
|
||||
- `role="tablist"` для контейнера
|
||||
- `role="tab"` для карточек
|
||||
- `aria-selected="true/false"` для выбранной карточки
|
||||
- `tabindex="0"` для активной, `-1` для неактивных
|
||||
|
||||
#### **3.2.2 Правила блока "Карточки товаров" (Блок 2)**
|
||||
|
||||
**НАЗНАЧЕНИЕ И ЛОГИКА:**
|
||||
|
||||
- **Источник данных**: Товары выбранного поставщика из Блока 1
|
||||
- **Триггер отображения**: Клик на карточку поставщика → загрузка карточек товаров
|
||||
- **Взаимодействие**: Клик на карточку товара → добавление в Блок 3 "Товары поставщика"
|
||||
- **Поведение**: Горизонтальный скролл при множестве товаров
|
||||
|
||||
**АРХИТЕКТУРА И РАЗМЕРЫ:**
|
||||
|
||||
- **Внешний контейнер**: bg-white/10 backdrop-blur-xl border border-white/20 rounded-2xl flex-shrink-0
|
||||
- **Внутренний контейнер скролла**: flex gap-3 overflow-x-auto p-4
|
||||
- **Стилизация скролла**: scrollbarWidth: 'thin' для тонкой полосы прокрутки
|
||||
- **Отступы**: padding: 16px (p-4) внутри, gap: 12px (gap-3) между карточками
|
||||
- **Адаптивная высота**: по содержимому карточек (БЕЗ фиксированной высоты)
|
||||
- **Визуальное единство**: стеклянный эффект как у других блоков системы
|
||||
- **БЕЗ заголовков/иконок**: только чистые карточки товаров в контейнере
|
||||
|
||||
**РАЗМЕРЫ КАРТОЧЕК ТОВАРОВ:**
|
||||
|
||||
- **Компактная карточка**: 80×112px (w-20 h-28), соотношение 5:7
|
||||
- **Адаптивность**: фиксированный размер для всех устройств
|
||||
|
||||
**СОДЕРЖАНИЕ КАРТОЧКИ ТОВАРА:**
|
||||
|
||||
- **ТОЛЬКО изображение товара**: 80×112px, object-cover
|
||||
- **Минималистичный дизайн**: БЕЗ текста, названий, цен, иконок
|
||||
- **Состояния**: Default, Selected, Active (БЕЗ Hover-эффектов)
|
||||
- **Рамка**: border-white/10, при выборе border-white/30
|
||||
- **Фон**: bg-white/5 полупрозрачный
|
||||
|
||||
**ДЕЙСТВИЕ:**
|
||||
Клик на карточку → добавление товара в Блок 3 (детальный каталог)
|
||||
|
||||
#### **3.2.3 Правила Блока 3 "Детальный каталог товаров"**
|
||||
|
||||
**НАЗНАЧЕНИЕ И СТРУКТУРА:**
|
||||
|
||||
- **Контент**: Детальные карточки выбранных товаров с полным управлением
|
||||
- **Верхняя панель**: Выбор даты + Выбор Fulfillment + Поиск
|
||||
- **Основная область**: Сетка карточек товаров с детальной информацией
|
||||
|
||||
#### **3.2.3.1 Структура верхней панели Блока 3**
|
||||
|
||||
**МИНИМАЛИСТИЧНАЯ ПАНЕЛЬ УПРАВЛЕНИЯ:**
|
||||
|
||||
- **Выбор даты поставки**: DatePicker для планирования поставки
|
||||
- **Выбор Fulfillment-центра**: Select dropdown со списком доступных фулфилментов
|
||||
- **Поиск по товарам**: Input с иконкой поиска и placeholder
|
||||
- **Компоновка**: Горизонтальная строка с равномерным распределением
|
||||
|
||||
**ТЕХНИЧЕСКИЕ ТРЕБОВАНИЯ:**
|
||||
|
||||
```tsx
|
||||
// Структура компонентов панели
|
||||
<div className="flex items-center gap-4 p-4 bg-white/10 backdrop-blur-xl border border-white/20 rounded-2xl mb-4">
|
||||
<DatePicker placeholder="Дата поставки" />
|
||||
<Select placeholder="Выберите фулфилмент">
|
||||
<SelectContent>
|
||||
{fulfillmentCenters.map((center) => (
|
||||
<SelectItem value={center.id}>{center.name}</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<div className="relative flex-1">
|
||||
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-white/40" />
|
||||
<Input placeholder="Поиск товаров..." className="pl-10 glass-input" />
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
|
||||
#### **3.2.3.2 Структура основной области карточек**
|
||||
|
||||
**СЕТКА ТОВАРОВ:**
|
||||
|
||||
- **Адаптивная сетка**: `grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4`
|
||||
- **Детальные карточки**: Полная информация + количество + управление
|
||||
- **Состояния**: Default, Selected, Editing
|
||||
- **Интерактивность**: Изменение количества, удаление, настройки рецептуры
|
||||
|
||||
**ФУНКЦИОНАЛЬНОСТЬ ПАНЕЛИ:**
|
||||
|
||||
- **Выбор даты**: Планирование времени поставки (обязательное поле)
|
||||
- **Выбор фулфилмента**: Определение исполнителя поставки (обязательное поле)
|
||||
- **Поиск**: Фильтрация товаров в каталоге по названию/артикулу
|
||||
- **Валидация**: Блокировка создания поставки без заполнения даты и фулфилмента
|
||||
|
||||
**ГРАНИЧНЫЕ СЛУЧАИ:**
|
||||
|
||||
- **Пустой каталог**: Заглушка "Добавьте товары"
|
||||
- **Нет фулфилментов**: Сообщение "Настройте партнерство с фулфилмент-центрами"
|
||||
- **Поиск без результатов**: "По запросу ничего не найдено"
|
||||
|
||||
#### **3.2.2.1 Структура контейнера Блока 2**
|
||||
|
||||
**ДВУХУРОВНЕВАЯ АРХИТЕКТУРА:**
|
||||
|
||||
**УРОВЕНЬ 1 - Внешний контейнер (блок):**
|
||||
|
||||
```jsx
|
||||
<div className="bg-white/10 backdrop-blur-xl border border-white/20 rounded-2xl flex-shrink-0">
|
||||
```
|
||||
|
||||
- **Назначение**: Визуальное обрамление блока, единство с другими блоками
|
||||
- **Стилизация**: Стеклянный эффект с размытием и полупрозрачностью
|
||||
- **Рамка**: Тонкая белая рамка border-white/20 с закруглёнными углами
|
||||
- **Поведение**: flex-shrink-0 предотвращает сжатие блока
|
||||
|
||||
**УРОВЕНЬ 2 - Внутренний контейнер (скролл):**
|
||||
|
||||
```jsx
|
||||
<div className="flex gap-3 overflow-x-auto p-4" style={{ scrollbarWidth: 'thin' }}>
|
||||
```
|
||||
|
||||
- **Назначение**: Горизонтальная прокрутка карточек товаров
|
||||
- **Раскладка**: Flex с промежутками gap-3 (12px) между карточками
|
||||
- **Отступы**: padding p-4 (16px) со всех сторон
|
||||
- **Скролл**: overflow-x-auto с тонкой полосой прокрутки
|
||||
- **Поведение**: Автоматическое появление скролла при превышении ширины
|
||||
|
||||
**ПРАВИЛА КОНТЕЙНЕРОВ:**
|
||||
|
||||
- Внешний контейнер НЕ содержит заголовков, иконок, описаний
|
||||
- Внутренний контейнер содержит ТОЛЬКО карточки товаров
|
||||
- Высота адаптируется под размер карточек (80×112px + отступы)
|
||||
- Визуальное единство со всеми блоками формы поставки
|
||||
|
||||
**ТЕХНИЧЕСКИЕ ПРАВИЛА:**
|
||||
|
||||
- **Условие отображения**: selectedSupplier && products.length > 0
|
||||
- **Источник данных**: products массив из GraphQL запроса organizationProducts
|
||||
- **Реактивность**: Автоматическое обновление при смене поставщика
|
||||
- **Производительность**: React.memo для карточек при большом количестве товаров
|
||||
- **Доступность**: Клавиатурная навигация (Tab, Enter для выбора)
|
||||
|
||||
**UX ПРАВИЛА ВЗАИМОДЕЙСТВИЯ:**
|
||||
|
||||
- **Скролл**: Автоматическое появление при превышении ширины контейнера
|
||||
- **Индикация загрузки**: Скелетоны карточек во время загрузки товаров
|
||||
- **Пустое состояние**: Скрытие блока при отсутствии поставщика или товаров
|
||||
- **Фокус**: Первая карточка получает фокус при загрузке товаров
|
||||
- **Навигация**: Стрелки ←→ для перемещения между карточками
|
||||
|
||||
**СОСТОЯНИЯ БЛОКА:**
|
||||
|
||||
- **Скрыт**: При отсутствии выбранного поставщика
|
||||
- **Скрыт**: При отсутствии товаров у поставщика
|
||||
- **Активен**: При наличии поставщика и товаров
|
||||
- **Загрузка**: Показ скелетонов карточек во время запроса
|
||||
|
||||
**ПРАВИЛА ПРОИЗВОДИТЕЛЬНОСТИ:**
|
||||
|
||||
- **Виртуализация**: При количестве товаров > 100
|
||||
- **Ленивая загрузка изображений**: loading="lazy" для всех изображений
|
||||
- **Мемоизация**: React.memo для компонентов карточек
|
||||
- **Дебаунс**: 300мс для поисковых запросов (если будет добавлен поиск)
|
||||
|
||||
**ПРАВИЛА АДАПТИВНОСТИ:**
|
||||
|
||||
- **Мобильные устройства**: Свайп для горизонтальной прокрутки
|
||||
- **Планшеты**: Сохранение размеров карточек 80×112px
|
||||
- **Десктоп**: Полная функциональность с клавиатурной навигацией
|
||||
- **Высокие разрешения**: Сохранение пропорций и читаемости
|
||||
|
||||
**ПРАВИЛА БЕЗОПАСНОСТИ И ВАЛИДАЦИИ:**
|
||||
|
||||
- **Валидация данных**: Проверка существования product.id перед добавлением
|
||||
- **Дубликаты**: Предотвращение добавления одного товара дважды в детальный каталог
|
||||
- **Санитизация**: Безопасное отображение названий товаров (XSS защита)
|
||||
- **Обработка ошибок**: Graceful degradation при ошибках загрузки изображений
|
||||
- **Защита от спама**: Дебаунс кликов 200мс для предотвращения множественных добавлений
|
||||
|
||||
**ПРАВИЛА ИНТЕГРАЦИИ С ДРУГИМИ БЛОКАМИ:**
|
||||
|
||||
- **Блок 1 (Поставщики)**: Слушает изменения selectedSupplier для обновления товаров
|
||||
- **Блок 3 (Детальный каталог)**: Передаёт выбранные товары через setAllSelectedProducts
|
||||
- **Блок 4 (Корзина)**: Товары добавляются в корзину из Блока 3, не напрямую из Блока 2
|
||||
- **Синхронизация состояний**: Реактивное обновление при изменении данных в любом блоке
|
||||
|
||||
**ПРАВИЛА АНАЛИТИКИ И МЕТРИК:**
|
||||
|
||||
- **Отслеживание кликов**: Логирование добавления товаров в детальный каталог
|
||||
- **Метрики производительности**: Время загрузки товаров поставщика
|
||||
- **Пользовательское поведение**: Количество просмотренных товаров на поставщика
|
||||
- **A/B тестирование**: Готовность к тестированию различных размеров карточек
|
||||
|
||||
**ПРАВИЛА ЛОКАЛИЗАЦИИ:**
|
||||
|
||||
- **Alt-текст изображений**: На языке интерфейса пользователя
|
||||
- **Направление скролла**: RTL поддержка для арабского/иврита
|
||||
- **Размеры карточек**: Неизменны для всех локалей (80×112px)
|
||||
- **Сообщения об ошибках**: Локализованные уведомления при проблемах загрузки
|
||||
|
||||
#### **3.2.1.1 Заголовок и поиск Блока 1**
|
||||
|
||||
**МИНИМАЛИСТИЧНЫЙ ДИЗАЙН:**
|
||||
|
||||
```jsx
|
||||
<div className="flex items-center justify-between gap-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<Building2 className="h-5 w-5 text-blue-400" />
|
||||
<h2 className="text-lg font-semibold text-white">Поставщики</h2>
|
||||
</div>
|
||||
<div className="w-64">
|
||||
<div className="relative">
|
||||
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-white/40 h-4 w-4" />
|
||||
<Input
|
||||
placeholder="Поиск поставщиков..."
|
||||
className="bg-white/5 border-white/10 text-white placeholder:text-white/50 pl-10 h-9"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
|
||||
**ПРАВИЛА ЗАГОЛОВКА:**
|
||||
|
||||
- **Иконка**: Building2 h-5 w-5 text-blue-400 (без фонового контейнера)
|
||||
- **Текст**: "Поставщики" (убран избыточный "товаров")
|
||||
- **Размер**: text-lg font-semibold (увеличен для лучшей читаемости)
|
||||
- **БЕЗ бэджа**: Убран избыточный бэдж "Создание поставки"
|
||||
- **Выравнивание**: flex items-center gap-2 (компактное)
|
||||
|
||||
**ПРАВИЛА ПОИСКА:**
|
||||
|
||||
- **Позиция**: Справа от заголовка (justify-between)
|
||||
- **Ширина**: w-64 (256px) фиксированная ширина
|
||||
- **Плейсхолдер**: "Поиск поставщиков..." (конкретное описание)
|
||||
- **Иконка**: Search h-4 w-4 слева в поле
|
||||
- **Стили**: Стандартные glass-эффекты, focus:border-white/20
|
||||
|
||||
**ПРАВИЛА КНОПКИ "НАЙТИ В МАРКЕТЕ":**
|
||||
|
||||
- **Условие**: Показывается только при allCounterparties.length === 0
|
||||
- **Позиция**: Отдельный блок под заголовком (mt-4)
|
||||
- **НЕ интегрирована**: В поле поиска (отдельно)
|
||||
- **Стили**: glass-secondary outline button размера sm
|
||||
|
||||
#### **3.2.1.2 Структура карточки поставщика в Блоке 1**
|
||||
|
||||
**МИНИМАЛИСТИЧНАЯ КАРТОЧКА ПОСТАВЩИКА:**
|
||||
|
||||
**СТРУКТУРА ИНФОРМАЦИИ:**
|
||||
|
||||
```jsx
|
||||
<div className="flex items-start gap-2">
|
||||
<OrganizationAvatar organization={supplier} size="sm" />
|
||||
<div className="flex-1 min-w-0">
|
||||
<h4 className="text-white font-medium text-sm truncate">{supplier.name || supplier.fullName}</h4>
|
||||
<div className="flex items-center gap-2 mt-1">
|
||||
<p className="text-white/60 text-xs font-mono">ИНН: {supplier.inn}</p>
|
||||
{supplier.market && <Badge className="market-badge">{getMarketLabel(supplier.market)}</Badge>}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
```
|
||||
|
||||
**ПРАВИЛА СОДЕРЖАНИЯ КАРТОЧКИ:**
|
||||
|
||||
**✅ ОСТАВИТЬ:**
|
||||
|
||||
- **Аватар организации**: OrganizationAvatar size="sm" слева
|
||||
- **Название поставщика**: supplier.name || supplier.fullName (приоритет name)
|
||||
- **ИНН**: font-mono, text-white/60, с префиксом "ИНН: "
|
||||
|
||||
**🔸 ДОБАВИТЬ:**
|
||||
|
||||
- **Принадлежность к рынку**: Badge с названием рынка из supplier.market
|
||||
- **Рынки**: "Садовод", "ТЯК Москва" и другие из Organization.market поля
|
||||
|
||||
**❌ УБРАТЬ:**
|
||||
|
||||
- **Рейтинг**: Звездочка и цифра rating (избыточно)
|
||||
- **Тип бэдж**: "Поставщик" badge (и так понятно из контекста)
|
||||
- **Адрес**: supplier.address (занимает место, не критично)
|
||||
|
||||
**СТИЛИ РЫНОЧНЫХ БЭДЖЕЙ:**
|
||||
|
||||
- **Садовод**: bg-green-500/20 text-green-300 border-green-500/30
|
||||
- **ТЯК Москва**: bg-blue-500/20 text-blue-300 border-blue-500/30
|
||||
- **По умолчанию**: bg-gray-500/20 text-gray-300 border-gray-500/30
|
||||
|
||||
**ПРАВИЛА АДАПТИВНОСТИ:**
|
||||
|
||||
- **Мобильные**: Сохранение структуры, truncate для длинных названий
|
||||
- **Планшеты/десктоп**: Полное отображение в сетке
|
||||
- **Малые экраны**: line-clamp-1 для названия организации
|
||||
|
||||
**СОСТОЯНИЯ КАРТОЧКИ:**
|
||||
|
||||
- **Default**: bg-white/5 border-white/10
|
||||
- **Hover**: hover:border-white/20 hover:bg-white/10
|
||||
- **Selected**: bg-white/15 border-white/40 shadow-lg
|
||||
- **Disabled**: opacity-50 cursor-not-allowed (при недоступности)
|
||||
|
||||
**ПРАВИЛА ИНТЕГРАЦИИ С РЫНКАМИ:**
|
||||
|
||||
**ИСТОЧНИК ДАННЫХ:**
|
||||
|
||||
- **Поле БД**: Organization.market (String?) - поле принадлежности к рынку
|
||||
- **Настройка**: Указывается в настройках кабинета поставщика
|
||||
- **Опциональность**: Поле может быть пустым (рынок не указан)
|
||||
|
||||
**ФУНКЦИЯ getMarketLabel():**
|
||||
|
||||
```jsx
|
||||
const getMarketLabel = (market?: string) => {
|
||||
const marketLabels = {
|
||||
'sadovod': 'Садовод',
|
||||
'tyak-moscow': 'ТЯК Москва',
|
||||
'opt-market': 'ОПТ Маркет',
|
||||
}
|
||||
return marketLabels[market as keyof typeof marketLabels] || market
|
||||
}
|
||||
```
|
||||
|
||||
**СТИЛИ ДЛЯ РЫНКОВ:**
|
||||
|
||||
```jsx
|
||||
const getMarketBadgeStyle = (market?: string) => {
|
||||
const styles = {
|
||||
'sadovod': 'bg-green-500/20 text-green-300 border-green-500/30',
|
||||
'tyak-moscow': 'bg-blue-500/20 text-blue-300 border-blue-500/30',
|
||||
'opt-market': 'bg-purple-500/20 text-purple-300 border-purple-500/30',
|
||||
}
|
||||
return styles[market as keyof typeof styles] || 'bg-gray-500/20 text-gray-300 border-gray-500/30'
|
||||
}
|
||||
```
|
||||
|
||||
**ПРАВИЛА ОТОБРАЖЕНИЯ:**
|
||||
|
||||
- **Условие**: Показывать badge только если supplier.market существует
|
||||
- **Размер**: text-xs для соответствия ИНН
|
||||
- **Позиция**: Справа от ИНН в той же строке
|
||||
- **Приоритет**: Рынок важнее типа организации для селлера
|
||||
|
||||
### 3.3 ПРАВИЛО ПЕРСИСТЕНТНОСТИ ВЫБРАННЫХ ТОВАРОВ
|
||||
|
||||
**🎯 ОСНОВНОЙ ПРИНЦИП:**
|
||||
Выбранные товары в детальном каталоге (блок 3) сохраняются при смене поставщика и могут быть удалены только явным действием пользователя.
|
||||
|
||||
**🔄 WORKFLOW СЦЕНАРИИ:**
|
||||
|
||||
**СЦЕНАРИЙ 1: Добавление товаров от разных поставщиков**
|
||||
|
||||
1. Пользователь выбирает Поставщика А
|
||||
2. Добавляет Товар 1 и Товар 2 в детальный каталог
|
||||
3. Переключается на Поставщика Б
|
||||
4. Товар 1 и Товар 2 остаются в блоке 3
|
||||
5. Добавляет Товар 3 от Поставщика Б
|
||||
6. В блоке 3: Товар 1, Товар 2 (от А) + Товар 3 (от Б)
|
||||
|
||||
**СЦЕНАРИЙ 2: Визуальная индикация в блоке 2**
|
||||
|
||||
- При переключении на поставщика, товары которого уже есть в блоке 3, показываются как "выбранные"
|
||||
- Товары от других поставщиков в блоке 2 не отображаются
|
||||
|
||||
**🛠️ ТЕХНИЧЕСКИЕ ПРАВИЛА:**
|
||||
|
||||
**Состояние selectedProductsForDetailView:**
|
||||
|
||||
- Глобальное состояние всех выбранных товаров
|
||||
- НЕ зависит от текущего поставщика
|
||||
- НЕ очищается при смене поставщика
|
||||
- Очищается только явными действиями пользователя
|
||||
|
||||
**Единственные способы удаления:**
|
||||
|
||||
1. Кнопка "Удалить из каталога" в карточке товара (блок 3)
|
||||
2. Кнопка "Очистить каталог" в заголовке блока 3
|
||||
3. НЕ при смене поставщика
|
||||
|
||||
**🎨 UX ПРАВИЛА:**
|
||||
|
||||
- Счетчик товаров: "Детальный каталог (X товаров от Y поставщиков)"
|
||||
- Визуальная индикация выбранных товаров в блоке 2
|
||||
- Информация о поставщике для каждого товара в блоке 3
|
||||
|
||||
### 3.4 Правила кнопки "Создать поставку" в разделе "Мои поставки"
|
||||
|
||||
#### **3.4.1 Общие принципы**
|
||||
|
||||
- **КОНТЕКСТНОСТЬ**: Кнопка создания появляется только в активном табе
|
||||
- **РАСПОЛОЖЕНИЕ**: Правая часть строки таба, на том же уровне что и название
|
||||
- **СТИЛИСТИКА**: В том же стиле что и сами табы (соответствует уровню иерархии)
|
||||
- **ФУНКЦИОНАЛЬНОСТЬ**: Кнопка ведет на страницу создания поставки соответствующего типа
|
||||
|
||||
#### **3.4.2 Размещение кнопок по табам**
|
||||
|
||||
**УРОВЕНЬ 2 (Подтабы фулфилмента):**
|
||||
|
||||
- **📦 Товар → Карточки**: Кнопка "Создать поставку" → `/supplies/create-cards`
|
||||
- **📦 Товар → Поставщики**: Кнопка "Создать поставку" → `/supplies/create-suppliers`
|
||||
- **🔧 Расходники селлера**: Кнопка "Создать поставку" → `/supplies/create-consumables`
|
||||
|
||||
**УРОВЕНЬ 2 (Подтабы маркетплейсов):**
|
||||
|
||||
- **🟣 Wildberries**: Кнопка "Создать поставку" → `/supplies/create-wildberries`
|
||||
- **🔵 Ozon**: Кнопка "Создать поставку" → `/supplies/create-ozon`
|
||||
|
||||
#### **3.4.3 ПРАВИЛА КОРЗИНЫ - ЕДИНЫЙ СТАНДАРТ**
|
||||
|
||||
**КРИТИЧЕСКИ ВАЖНО**: Все корзины в системе должны следовать единому стандарту дизайна и функциональности.
|
||||
|
||||
##### **3.4.3.1 Размеры и позиционирование**
|
||||
|
||||
```tsx
|
||||
<div className="w-72 flex-shrink-0">
|
||||
<div className="bg-white/10 backdrop-blur border-white/20 p-3 sticky top-0 rounded-2xl">
|
||||
```
|
||||
|
||||
**ОБЯЗАТЕЛЬНЫЕ ПАРАМЕТРЫ**:
|
||||
|
||||
- **Ширина**: `w-72` (288px) - фиксированная ширина для всех корзин
|
||||
- **Флекс**: `flex-shrink-0` - корзина не сжимается
|
||||
- **Позиция**: `sticky top-0` - прилипает к верху при прокрутке
|
||||
- **Стиль**: Glass morphism эффект с `backdrop-blur` и `bg-white/10`
|
||||
|
||||
##### **3.4.3.2 Автодобавление товаров**
|
||||
|
||||
**ПРАВИЛО AUTO-ADD**: При вводе количества товар автоматически добавляется в корзину.
|
||||
|
||||
```tsx
|
||||
// ОБЯЗАТЕЛЬНАЯ РЕАЛИЗАЦИЯ:
|
||||
const handleQuantityChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
const inputValue = e.target.value
|
||||
const newQuantity = inputValue === '' ? 0 : Math.max(0, parseInt(inputValue) || 0)
|
||||
|
||||
if (newQuantity > 0) {
|
||||
// Автоматически добавляем товар в корзину
|
||||
updateProductQuantity(product.id, newQuantity)
|
||||
} else {
|
||||
// Удаляем товар из корзины при количестве 0
|
||||
removeFromCart(product.id)
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 3.2.7.5 Синхронизация данных между блоками
|
||||
|
||||
**ПРАВИЛО СИНХРОНИЗАЦИИ**: Данные в корзине должны отражать выборы из всех блоков формы:
|
||||
|
||||
1. **Дата поставки**: Из Блока 3 (дата пикер)
|
||||
2. **Фулфилмент-центр**: Название выбранного FF (реальные данные!)
|
||||
3. **Логистическая компания**: Только партнеры типа `'LOGIST'`
|
||||
|
||||
**ПОРЯДОК ОТОБРАЖЕНИЯ В КОРЗИНЕ**:
|
||||
|
||||
```
|
||||
Дата поставки: 08.08.2025
|
||||
Фулфилмент-центр: ФУЛФИЛМЕНТ РУ
|
||||
Логистическая компания: [Выпадающий список]
|
||||
```
|
||||
|
||||
#### 3.2.7.6 Критические требования
|
||||
|
||||
🚨 **БЕЗОПАСНОСТЬ ТИПОВ**:
|
||||
|
||||
- Всегда проверять на `null/undefined`: `selectedSupplier?.id || ''`
|
||||
- Использовать optional chaining для всех вложенных объектов
|
||||
|
||||
🚨 **ПРОИЗВОДИТЕЛЬНОСТЬ**:
|
||||
|
||||
- Мемоизация расчетов: `useMemo` для дорогих вычислений
|
||||
- Debounce для инпутов количества
|
||||
|
||||
🚨 **UX КОНСИСТЕНТНОСТЬ**:
|
||||
|
||||
- Единые стили для всех корзин в системе
|
||||
- Одинаковое поведение auto-add во всех формах
|
||||
- Синхронная валидация данных
|
||||
```
|
||||
|
||||
**ДЕФОЛТНОЕ ЗНАЧЕНИЕ**: Пустой инпут (`value={''}`) вместо `value={0}`
|
||||
|
||||
##### **3.4.3.3 Структура корзины**
|
||||
|
||||
**ОБЯЗАТЕЛЬНЫЕ ЭЛЕМЕНТЫ**:
|
||||
|
||||
1. **Заголовок**: "Корзина (X шт)" с иконкой корзины
|
||||
2. **Список товаров**:
|
||||
- Название товара (БЕЗ суффикса "(с рецептурой)")
|
||||
- Цена за единицу × количество
|
||||
- Кнопка удаления (X справа)
|
||||
3. **Мета-информация**: Дата поставки, фулфилмент-центр, логистика
|
||||
4. **Итого**: Общая сумма с выделением зелёным цветом
|
||||
5. **Кнопка действия**: "Создать поставку" с градиентом
|
||||
|
||||
**ЗАПРЕЩЕНО**: Отображать текст "(с рецептурой)" в названиях товаров в корзине
|
||||
|
||||
##### **3.4.3.4 Единая функция расчета стоимости**
|
||||
|
||||
**КРИТИЧЕСКИ ВАЖНО**: Использовать единую функцию расчета для избежания расхождений:
|
||||
|
||||
```tsx
|
||||
const getProductTotalWithRecipe = (productId: string, quantity: number) => {
|
||||
const product = products.find((p) => p.id === productId)
|
||||
if (!product) return 0
|
||||
|
||||
// Базовая цена товара
|
||||
let total = (product.pricePerUnit || 0) * quantity
|
||||
|
||||
// Добавляем услуги
|
||||
if (product.services && product.services.length > 0) {
|
||||
const servicesTotal = product.services.reduce((sum, service) => {
|
||||
return sum + (service.pricePerUnit || 0) * quantity
|
||||
}, 0)
|
||||
total += servicesTotal
|
||||
}
|
||||
|
||||
// Добавляем FF расходники (используем .price, НЕ .pricePerUnit!)
|
||||
if (product.ffConsumables && product.ffConsumables.length > 0) {
|
||||
const ffConsumablesTotal = product.ffConsumables.reduce((sum, consumable) => {
|
||||
return sum + (consumable.price || 0) * quantity // ВАЖНО: .price!
|
||||
}, 0)
|
||||
total += ffConsumablesTotal
|
||||
}
|
||||
|
||||
// Добавляем расходники продавца
|
||||
if (product.sellerConsumables && product.sellerConsumables.length > 0) {
|
||||
const sellerConsumablesTotal = product.sellerConsumables.reduce((sum, consumable) => {
|
||||
return sum + (consumable.pricePerUnit || 0) * quantity
|
||||
}, 0)
|
||||
total += sellerConsumablesTotal
|
||||
}
|
||||
|
||||
return total
|
||||
}
|
||||
```
|
||||
|
||||
### 3.4 Высота основного блока и функционал
|
||||
|
||||
#### **3.4.1 Высота основного блока**
|
||||
|
||||
**ФОРМУЛА РАСЧЕТА**:
|
||||
|
||||
```css
|
||||
height: calc(100vh - headerHeight - tabsHeight - statsHeight - margins);
|
||||
```
|
||||
|
||||
**ПРАВИЛО ВЫРАВНИВАНИЯ**:
|
||||
|
||||
- Нижняя граница основного блока должна быть на одном уровне с нижней границей sidebar
|
||||
- При изменении размера окна высота пересчитывается
|
||||
- Внутренний скролл: `overflow-y-auto`
|
||||
|
||||
#### **3.4.2 Сохранение функционала**
|
||||
|
||||
**КРИТИЧЕСКИ ВАЖНО**: При добавлении блока статистики весь существующий функционал сохраняется:
|
||||
|
||||
- Таблицы с данными поставок
|
||||
- Фильтры и сортировка
|
||||
- Кнопки действий
|
||||
- Детализация при клике
|
||||
- Пагинация
|
||||
- Поиск
|
||||
|
||||
**ЗАПРЕЩЕНО**:
|
||||
|
||||
- Удалять существующие компоненты
|
||||
- Изменять логику работы таблиц
|
||||
- Нарушать существующие API вызовы
|
||||
|
||||
### 3.5 Табы "Карточки" и "Поставщики" - объединённая логика
|
||||
|
||||
#### **3.5.1 Принцип единого типа предмета**
|
||||
|
||||
**КЛЮЧЕВОЕ ПРАВИЛО**: Табы "Карточки" и "Поставщики" - это два способа создания поставок одного типа предмета (ТОВАР)
|
||||
|
||||
**СПОСОБЫ СОЗДАНИЯ**:
|
||||
|
||||
- **Карточки** - импорт товаров через WB API с автоматическим созданием поставки
|
||||
- **Поставщики** - прямой заказ товаров у поставщика с указанием рецептуры
|
||||
|
||||
**РЕЗУЛЬТАТ**: Оба способа создают `SupplyOrder` с товарами типа `PRODUCT`
|
||||
|
||||
#### **3.5.2 Общая статистика**
|
||||
|
||||
**ПРАВИЛО**: Блок статистики показывает ОДИНАКОВЫЕ данные для обоих табов
|
||||
|
||||
**МЕТРИКИ ДЛЯ ТАБОВ "КАРТОЧКИ" И "ПОСТАВЩИКИ"**:
|
||||
|
||||
- Всего поставок товаров (из всех источников)
|
||||
- Активных поставок товаров (в работе)
|
||||
- Сумма активных поставок товаров
|
||||
- Товаров в пути (все способы доставки)
|
||||
|
||||
**ЗАПРЕЩЕНО**: Разделять статистику по способу создания
|
||||
|
||||
#### **3.5.3 Общий основной блок**
|
||||
|
||||
**СОДЕРЖИМОЕ**: Единая таблица всех поставок товаров
|
||||
|
||||
**ИСТОЧНИКИ ДАННЫХ**:
|
||||
|
||||
- Поставки, созданные через импорт карточек WB
|
||||
- Поставки, созданные через заказ у поставщиков
|
||||
- Все промежуточные и завершённые поставки
|
||||
|
||||
**РАЗЛИЧИЯ ТАБОВ**:
|
||||
|
||||
- Только кнопки создания ведут на разные страницы
|
||||
- Таб "Карточки": `/supplies/create-cards`
|
||||
- Таб "Поставщики": `/supplies/create-suppliers`
|
||||
|
||||
### 3.7 Структура страницы создания поставки расходников
|
||||
|
||||
#### **3.7.1 Обязательная структура страницы**
|
||||
|
||||
**ПРИНЦИП**: Страница состоит из трёх визуально разделённых блоков
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────┐
|
||||
│ 1. БЛОК ТАБОВ (навигация) │
|
||||
│ - Фиксированная высота │
|
||||
│ - Glass-эффект │
|
||||
│ - Иерархическая структура │
|
||||
├─────────────────────────────────────────┤
|
||||
│ 2. БЛОК СТАТИСТИКИ (метрики) │
|
||||
│ - Контекстные данные │
|
||||
│ - 4 карточки в ряд (desktop) │
|
||||
│ - Динамическое обновление │
|
||||
├─────────────────────────────────────────┤
|
||||
│ 3. ОСНОВНОЙ БЛОК (контент) │
|
||||
│ - Сохраняет весь функционал │
|
||||
│ - Таблицы, фильтры, действия │
|
||||
│ - Высота до низа sidebar │
|
||||
└─────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
#### **3.5.2 Блок статистики - контекстные метрики**
|
||||
|
||||
**ПРАВИЛО**: Статистика меняется в зависимости от выбранных табов
|
||||
|
||||
**Для путей "Фулфилмент → Товар → Карточки/Поставщики":**
|
||||
|
||||
- Всего поставок
|
||||
- Активных поставок
|
||||
- Сумма активных поставок
|
||||
- В пути
|
||||
|
||||
**Для пути "Фулфилмент → Расходники селлера":**
|
||||
|
||||
- Всего поставок
|
||||
- Активных поставок
|
||||
- Видов расходников
|
||||
- Критические остатки
|
||||
|
||||
**Для путей "Маркетплейсы → Wildberries/Ozon":**
|
||||
|
||||
- Поставок на маркетплейс
|
||||
- Товаров отправлено
|
||||
- Возвраты за неделю
|
||||
- Эффективность поставок
|
||||
|
||||
### 3.6 Многоуровневая таблица поставок
|
||||
|
||||
#### **ПЕРВЫЙ УРОВЕНЬ** _(основной список)_:
|
||||
|
||||
- **СОРТИРОВКА**: Номер поставки от большего к меньшему
|
||||
- **ОБЯЗАТЕЛЬНЫЕ КОЛОНКИ**:
|
||||
- Порядковый номер поставки
|
||||
- Количество видов расходников
|
||||
- Стоимость всей поставки
|
||||
- Количество категорий
|
||||
- Статус поставки
|
||||
|
||||
#### **ВТОРОЙ УРОВЕНЬ** _(детализация по клику)_:
|
||||
|
||||
- **АКТИВАЦИЯ**: По клику на строку первого уровня
|
||||
- **СОДЕРЖАНИЕ**:
|
||||
- Название расходника
|
||||
- Количество
|
||||
- Цена
|
||||
- Категория
|
||||
- Поставщик
|
||||
- **ОГРАНИЧЕНИЯ**: Только просмотр, редактирование запрещено
|
||||
|
||||
---
|
||||
|
||||
## 4. 🏭 **WORKFLOW ФУЛФИЛМЕНТА**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел 11.2, строки 2003-2022
|
||||
|
||||
### 4.1 Трехэтапный процесс
|
||||
|
||||
**ЭТАП 1: Приемка товаров**
|
||||
|
||||
1. Фулфилмент получает поставки от поставщиков
|
||||
2. Товары размещаются на складе по модулям
|
||||
3. Ведется учет поступлений и остатков
|
||||
|
||||
**ЭТАП 2: Обработка товаров**
|
||||
|
||||
4. Товары обрабатываются согласно рецептурам селлеров
|
||||
5. Применяются услуги фулфилмента
|
||||
6. Создаются готовые продукты
|
||||
|
||||
**ЭТАП 3: Управление услугами**
|
||||
|
||||
7. Фулфилмент предоставляет каталог услуг для рецептур
|
||||
8. Устанавливает цены на расходники
|
||||
9. Управляет логистическими маршрутами
|
||||
|
||||
### 4.2 Движение товаров
|
||||
|
||||
**Поступление товаров**:
|
||||
- **ПОСТАВКИ**: От поставщиков через систему заказов
|
||||
- **ВОЗВРАТЫ**: Товары, возвращенные с ПВЗ
|
||||
- **ПЕРЕМЕЩЕНИЯ**: Между складами и магазинами
|
||||
|
||||
**Расход товаров**:
|
||||
- **ОТГРУЗКА**: Товары отправлены селлерам
|
||||
- **СПИСАНИЕ**: Брак, утрата, утилизация
|
||||
- **ВОЗВРАТ**: Возврат поставщику
|
||||
- **ИСПОЛЬЗОВАНИЕ**: Расходники для операций
|
||||
|
||||
---
|
||||
|
||||
## 5. 🚚 **WORKFLOW ЛОГИСТИКИ**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел 12.2, строки 2063-2089
|
||||
|
||||
### 5.1 Четырехэтапный процесс доставки
|
||||
|
||||
**ЭТАП 1: Получение заявки**
|
||||
|
||||
1. Логистика получает уведомление о новой поставке
|
||||
2. Заявка появляется в разделе "Заявки" кабинета логистики
|
||||
3. Логист изучает детали поставки (объем, вес, маршрут)
|
||||
|
||||
**ЭТАП 2: Подтверждение доставки**
|
||||
|
||||
4. Логист нажимает кнопку "Одобрить"
|
||||
5. Статус поставки меняется на `LOGISTICS_CONFIRMED`
|
||||
6. Уведомления отправляются всем участникам
|
||||
|
||||
**ЭТАП 3: Забор товара**
|
||||
|
||||
7. Логист приезжает к поставщику за товаром
|
||||
8. Поставщик отгружает товар логисту
|
||||
9. Поставщик отмечает "Отправлено"
|
||||
10. Статус меняется на `SHIPPED`, затем `IN_TRANSIT`
|
||||
|
||||
**ЭТАП 4: Доставка**
|
||||
|
||||
11. Логистика доставляет товар на фулфилмент-центр
|
||||
12. В кабинете логистики нажимают "Доставлено"
|
||||
13. Фулфилмент принимает товар и отмечает "Принято"
|
||||
|
||||
---
|
||||
|
||||
## 6. 🤝 **СИСТЕМА ПАРТНЕРСТВА**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел 13.2, строки 2156-2186
|
||||
|
||||
### 6.1 Два способа установления партнерства
|
||||
|
||||
**СПОСОБ 1: Автоматическое партнерство**
|
||||
|
||||
1. Пользователь А указывает email организации Б при создании поставки/заявки
|
||||
2. Система проверяет: зарегистрирована ли организация с таким email
|
||||
3. Если ДА → автоматически создается связь Partnership
|
||||
4. Если НЕТ → отправляется приглашение на email
|
||||
5. При регистрации по приглашению → автоматически создается Partnership
|
||||
6. Обе организации видят друг друга в разделе "Партнеры"
|
||||
7. Могут создавать заказы друг другу
|
||||
|
||||
**СПОСОБ 2: Заявочная система**
|
||||
|
||||
1. Пользователь А идет в раздел "Партнеры"
|
||||
2. Нажимает "Добавить партнера"
|
||||
3. Указывает данные организации Б (ИНН, название)
|
||||
4. Система создает PartnershipRequest со статусом PENDING
|
||||
5. Организация Б получает уведомление о заявке
|
||||
6. Организация Б принимает (ACCEPTED) или отклоняет (REJECTED) заявку
|
||||
|
||||
### 6.2 Статусы заявок
|
||||
|
||||
**4 статуса PartnershipRequest**:
|
||||
|
||||
- **PENDING** - ожидает ответа
|
||||
- **ACCEPTED** - принята (создается Partnership)
|
||||
- **REJECTED** - отклонена
|
||||
- **CANCELLED** - отменена инициатором
|
||||
|
||||
---
|
||||
|
||||
## 7. 🔧 **ИНТЕГРАЦИЯ С УСЛУГАМИ**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел 14.3, строки 2342-2349
|
||||
|
||||
### 7.1 5-шаговый workflow использования услуг
|
||||
|
||||
1. **Селлер выбирает услугу** из каталога при создании рецептуры
|
||||
2. **Система включает услугу** в состав заказа
|
||||
3. **Фулфилмент получает задание** на выполнение услуги
|
||||
4. **Исполнитель применяет услугу** к товару согласно технологии
|
||||
5. **Система создает готовый продукт** с учетом всех услуг
|
||||
|
||||
### 7.2 Связь с рецептурами
|
||||
|
||||
**Архитектура интеграции**:
|
||||
|
||||
```
|
||||
СЕЛЛЕР (создание поставки)
|
||||
└── Рецептура
|
||||
├── Товар (от поставщика)
|
||||
├── Услуги фулфилмента ← Каталог услуг
|
||||
├── Расходники селлера
|
||||
└── Расходники фулфилмента
|
||||
↓
|
||||
ФУЛФИЛМЕНТ (обработка)
|
||||
├── Входящие поставки → Товары на складе
|
||||
└── Услуги → Выполнение по рецептуре
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 8. 🚨 **КРИТИЧЕСКИЕ СИТУАЦИИ**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел 24, строки 3151-3190
|
||||
|
||||
### 8.1 Отмена заказов на разных этапах
|
||||
|
||||
**ТИП 1: Отмена до подтверждения поставщиком**
|
||||
- Селлер может отменить заказ в статусе PENDING
|
||||
- Система меняет статус на CANCELLED
|
||||
- Уведомление поставщику об отмене
|
||||
|
||||
**ТИП 2: Отмена после подтверждения поставщиком**
|
||||
- Требуется согласие поставщика
|
||||
- Возможны штрафные санкции
|
||||
- Согласование через мессенджер
|
||||
|
||||
**ТИП 3: Отмена во время транспортировки**
|
||||
- Связь с логистикой для возврата груза
|
||||
- Дополнительные транспортные расходы
|
||||
- Перерасчет стоимости
|
||||
|
||||
**ТИП 4: Отмена после доставки**
|
||||
- Процедура возврата товара
|
||||
- Контроль качества возвращаемого товара
|
||||
- Возмещение понесенных расходов
|
||||
|
||||
### 8.2 Алгоритм частичной доставки
|
||||
|
||||
**ШАГ 1: Выявление недостачи**
|
||||
- Фулфилмент сверяет план и факт
|
||||
- Фиксирует недостающие позиции
|
||||
- Уведомляет всех участников
|
||||
|
||||
**ШАГ 2: Принятие решения**
|
||||
- Селлер выбирает: ждать доставку или принять частично
|
||||
- Поставщик объясняет причины недостачи
|
||||
- Согласование дальнейших действий
|
||||
|
||||
**ШАГ 3: Обработка частичной доставки**
|
||||
- Система разделяет заказ на выполненную и невыполненную части
|
||||
- Перерасчет стоимости и логистики
|
||||
- Создание нового заказа на недостающее
|
||||
|
||||
**ШАГ 4: Документооборот**
|
||||
- Корректировка документов
|
||||
- Фиксация фактических показателей
|
||||
- Закрытие или продление заказа
|
||||
|
||||
---
|
||||
|
||||
## 9. 🛠️ **ПРОТОКОЛЫ РАЗРАБОТКИ**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел "Обязательная последовательность", строки 41-49
|
||||
|
||||
### 9.1 7-шаговый workflow разработки
|
||||
|
||||
1. **Читать rules-complete.md** - перед любым изменением кода
|
||||
2. **Следовать правилам взаимодействия** - честность и прозрачность
|
||||
3. **Проверить специфичные правила кабинета** - если работа с конкретным типом организации
|
||||
4. **Использовать TodoWrite** - для планирования задач
|
||||
5. **Следовать техническим правилам** - GraphQL, TypeScript, система партнерства
|
||||
6. **Проверять реализацию** - соответствие правилам и архитектуре
|
||||
7. **Проводить финальную проверку** - качество и корректность результата
|
||||
|
||||
### 9.2 Протокол высокой сложности
|
||||
|
||||
**3-этапный процесс для сложных задач**:
|
||||
|
||||
1. **СТОП! ГЛУБОКИЙ АНАЛИЗ** - уточнить все требования у пользователя
|
||||
2. **ИССЛЕДОВАНИЕ** - изучить все связанные файлы параллельно
|
||||
3. **ДЕТАЛЬНЫЙ ПЛАН** - с промежуточными проверками и rollback точками
|
||||
|
||||
---
|
||||
|
||||
## 10. 📊 **СИСТЕМА УЧЕТА ДВИЖЕНИЯ ТОВАРОВ**
|
||||
|
||||
> **Источник**: rules-complete.md, раздел 7, строки 742-770
|
||||
|
||||
### 10.1 Принципы учета
|
||||
|
||||
**ПРИНЦИП 1: Полная прозрачность**
|
||||
- Каждое движение товара фиксируется
|
||||
- Доступна история всех операций
|
||||
- Отчетность в реальном времени
|
||||
|
||||
**ПРИНЦИП 2: Двойной контроль**
|
||||
- План и факт сверяются системой
|
||||
- Выявление и анализ расхождений
|
||||
- Автоматические уведомления об отклонениях
|
||||
|
||||
**ПРИНЦИП 3: Статусная модель**
|
||||
- Каждый товар имеет четкий статус
|
||||
- Переходы между статусами контролируются
|
||||
- История изменений сохраняется
|
||||
|
||||
**ПРИНЦИП 4: Интеграция ролей**
|
||||
- Каждая роль видит релевантную информацию
|
||||
- Права доступа разграничены по функциям
|
||||
- Совместная работа через единую систему
|
||||
|
||||
**ПРИНЦИП 5: Автоматизация**
|
||||
- Минимум ручного ввода данных
|
||||
- Автоматические расчеты и уведомления
|
||||
- Система предотвращения ошибок
|
||||
|
||||
---
|
||||
|
||||
## 11. 🏪 **КАБИНЕТ ПОСТАВЩИКА**
|
||||
|
||||
> **Источник**: [rules-complete.md#10-кабинет-поставщика](./rules-complete.md#10--кабинет-поставщика)
|
||||
|
||||
### 11.1 Разделение понятий: РЫНОК vs МАРКЕТ
|
||||
|
||||
**🔍 КРИТИЧЕСКОЕ РАЗДЕЛЕНИЕ ПОНЯТИЙ:**
|
||||
|
||||
### **РЫНОК** 🏪 - физическое торговое место
|
||||
|
||||
- **Назначение**: Географическая принадлежность поставщиков
|
||||
- **Примеры**: Садовод, ТЯК Москва
|
||||
- **Структура**: Название + адрес
|
||||
- **Связь**: Поставщик принадлежит рынку
|
||||
|
||||
### **МАРКЕТ** 🛒 - раздел системы для торговли
|
||||
|
||||
- **Назначение**: Глобальный каталог товаров в системе
|
||||
- **Роут**: `/market` - просмотр и заказ товаров
|
||||
- **Содержание**: Все доступные товары от всех поставщиков
|
||||
- **Связь**: НЕ связан с физическими рынками
|
||||
|
||||
**🏢 АРХИТЕКТУРА ПРИНАДЛЕЖНОСТИ:**
|
||||
|
||||
```
|
||||
РЫНОК (физическое место)
|
||||
└── Поставщик (Organization.market)
|
||||
└── Товары/Расходники (наследуют рынок от поставщика)
|
||||
└── Отображаются в МАРКЕТЕ (/market)
|
||||
```
|
||||
|
||||
**🎯 ПРИНЦИПЫ ИЕРАРХИИ:**
|
||||
|
||||
1. **РЫНОК → ПОСТАВЩИК**: Поставщик работает на конкретном рынке
|
||||
2. **ПОСТАВЩИК → ТОВАРЫ**: Товары принадлежат поставщику с его рынка
|
||||
3. **ТОВАРЫ → МАРКЕТ**: Все товары показываются в глобальном маркете (/market)
|
||||
4. **НАСЛЕДОВАНИЕ**: Товары получают рынок от организации поставщика
|
||||
|
||||
**🏪 ФИЗИЧЕСКИЕ РЫНКИ В СИСТЕМЕ:**
|
||||
|
||||
- **"Садовод"** (`sadovod`) - Москва, 14-й км МКАД
|
||||
- **Цветовая схема**: `bg-green-500/20 text-green-300 border-green-500/30`
|
||||
- **"ТЯК Москва"** (`tyak-moscow`) - Москва, Алтуфьевское шоссе, 27
|
||||
- **Цветовая схема**: `bg-blue-500/20 text-blue-300 border-blue-500/30`
|
||||
|
||||
**🛒 МАРКЕТ В СИСТЕМЕ:**
|
||||
|
||||
- **Роут**: `/market` - глобальный каталог товаров
|
||||
- **Функции**: Просмотр, поиск, фильтрация, заказ товаров
|
||||
- **Источник**: Товары от всех поставщиков всех рынков
|
||||
- **Отображение рынка**: В карточках поставщиков и товаров
|
||||
|
||||
**🔧 ТЕХНИЧЕСКАЯ РЕАЛИЗАЦИЯ:**
|
||||
|
||||
- **Поле рынка**: `Organization.market` (String?) - принадлежность поставщика к рынку
|
||||
- **Настройка рынка**: В настройках организации поставщика
|
||||
- **Отображение в маркете**: Товары показывают рынок через `product.organization.market`
|
||||
- **Фильтрация**: В маркете по рынку поставщика
|
||||
|
||||
### 11.2 Основные возможности
|
||||
|
||||
**СОЗДАНИЕ КАРТОЧЕК**:
|
||||
|
||||
- **ТОВАР** - базовые товары поставщика
|
||||
- **РАСХОДНИКИ** - материалы и вспомогательные товары
|
||||
|
||||
### 11.3 Обязательные поля карточки
|
||||
|
||||
**Базовые параметры**:
|
||||
|
||||
- Фото (система загрузки и управления изображениями)
|
||||
- Название
|
||||
- Автоматическая генерация артикула СФ
|
||||
- Описание
|
||||
- Количество предметов в единицах
|
||||
- Количество комплектов (если применимо)
|
||||
- Категория (28 предустановленных + специализированные для расходников)
|
||||
- Бренд, Цвет, Размер/объем, Вес, Габариты, Материал
|
||||
- Цена за единицу и за комплект
|
||||
- Заказано, В пути, Остаток, Продано
|
||||
|
||||
### 11.4 Отображение информации в карточках
|
||||
|
||||
**Каждая карточка содержит**:
|
||||
|
||||
- Основное изображение
|
||||
- Название и артикул СФ
|
||||
- Цена за единицу/комплект
|
||||
- Категория и статус активности
|
||||
- Данные о движении: остаток, заказано, в пути, продано
|
||||
- Индикаторы низких остатков
|
||||
|
||||
### 11.5 Статистика поставщика
|
||||
|
||||
**Блок статистики включает**:
|
||||
|
||||
- **ТОВАРЫ**: Общая статистика товаров поставщика
|
||||
- **РАСХОДНИКИ**: Материалы и вспомогательные товары
|
||||
- Классифицируются при заказе в зависимости от заказчика
|
||||
- Общая статистика по всем расходникам
|
||||
|
||||
---
|
||||
|
||||
## 12. 🏠 **ОБЩИЕ ПРАВИЛА КАБИНЕТОВ**
|
||||
|
||||
> **Источник**: [rules-complete.md#8-общие-правила-кабинетов](./rules-complete.md#8--общие-правила-кабинетов)
|
||||
|
||||
### 12.1 Универсальная структура кабинетов
|
||||
|
||||
**ВСЕ ТИПЫ КАБИНЕТОВ** включают следующие обязательные разделы:
|
||||
|
||||
#### 12.1.1 Страница "Главная"
|
||||
|
||||
**СТАТУС**: Реализовано
|
||||
**ДОСТУП**: Через навигацию в sidebar для всех типов кабинетов
|
||||
**СОДЕРЖАНИЕ**: Универсальная страница с типо-зависимыми компонентами
|
||||
|
||||
**ПРАВИЛА**:
|
||||
|
||||
- **ОБЯЗАТЕЛЬНО**: Каждый тип кабинета должен иметь страницу "Главная"
|
||||
- **НАВИГАЦИЯ**: Доступ через кнопку в sidebar (первая в списке)
|
||||
- **УНИВЕРСАЛЬНОСТЬ**: Одинаковая структура навигации для всех кабинетов
|
||||
- **РОУТ**: `/home` с универсальным компонентом HomePageWrapper
|
||||
- **КОМПОНЕНТЫ**: 4 типо-зависимых компонента: SellerHomePage, FulfillmentHomePage, WholesaleHomePage, LogistHomePage
|
||||
|
||||
#### 12.1.2 Раздел "Экономика"
|
||||
|
||||
**СТАТУС**: Реализовано в системе
|
||||
**РАСПОЛОЖЕНИЕ**: Перед настройками в каждом кабинете
|
||||
**СОДЕРЖАНИЕ**: Пустые разделы-заглушки с пометкой "будет добавлен позже"
|
||||
|
||||
**ПРАВИЛА**:
|
||||
|
||||
- **ОБЯЗАТЕЛЬНО**: Каждый кабинет имеет раздел "Экономика"
|
||||
- **РОУТ**: `/economics` с универсальным компонентом EconomicsPageWrapper
|
||||
- **КОМПОНЕНТЫ**: 4 типо-зависимых компонента экономики: SellerEconomicsPage, FulfillmentEconomicsPage, WholesaleEconomicsPage, LogistEconomicsPage
|
||||
- **КНОПКА**: "Экономика" в sidebar навигации перед настройками
|
||||
- **БЕЗОПАСНОСТЬ**: Проверки доступа и безопасности в экономических компонентах
|
||||
|
||||
#### 12.1.3 Общие разделы для всех кабинетов
|
||||
|
||||
**УНИВЕРСАЛЬНЫЕ РАЗДЕЛЫ** (доступны всем типам):
|
||||
|
||||
- 🏠 **Главная** - основная страница кабинета (реализовано)
|
||||
- 🛒 **Маркет** - просмотр и заказ товаров
|
||||
- 🤝 **Партнеры** - управление контрагентами
|
||||
- 💬 **Мессенджер** - внутренняя связь
|
||||
- 💰 **Экономика** - финансовая аналитика (реализовано)
|
||||
- ⚙️ **Настройки** - профиль и конфигурация
|
||||
|
||||
**СПЕЦИАЛИЗИРОВАННЫЕ РАЗДЕЛЫ** (зависят от типа кабинета):
|
||||
|
||||
- Определяются в соответствующих разделах каждого кабинета
|
||||
|
||||
### 12.2 Правила sidebar навигации
|
||||
|
||||
#### 12.2.1 Структура навигации
|
||||
|
||||
**ОБЩИЙ ПРИНЦИП**:
|
||||
|
||||
- Условное отображение: `{user?.organization?.type === "TYPE" && (...)}`
|
||||
- Адаптивность: сворачиваемый sidebar с `getSidebarMargin()`
|
||||
- Состояния активности: подсветка текущего раздела
|
||||
|
||||
**ПОРЯДОК РАЗДЕЛОВ В SIDEBAR**:
|
||||
|
||||
1. 🏠 **Главная** (реализовано для всех)
|
||||
2. **Специализированные разделы** (зависят от типа кабинета)
|
||||
3. 🛒 **Маркет** (универсальный)
|
||||
4. 🤝 **Партнеры** (универсальный)
|
||||
5. 💬 **Мессенджер** (универсальный)
|
||||
6. 💰 **Экономика** (универсальный, реализовано)
|
||||
7. ⚙️ **Настройки** (универсальный)
|
||||
8. **Выход** (универсальный)
|
||||
|
||||
#### 12.2.2 Типо-зависимая логика
|
||||
|
||||
**АДАПТИВНЫЙ РОУТИНГ**:
|
||||
|
||||
```typescript
|
||||
// Пример: кнопка "Поставки" ведет на разные страницы
|
||||
const handleSuppliesClick = () => {
|
||||
switch (user?.organization?.type) {
|
||||
case 'FULFILLMENT':
|
||||
router.push('/fulfillment-supplies')
|
||||
break
|
||||
case 'SELLER':
|
||||
router.push('/supplies')
|
||||
break
|
||||
case 'WHOLESALE':
|
||||
router.push('/supplies')
|
||||
break
|
||||
case 'LOGIST':
|
||||
router.push('/logistics-orders')
|
||||
break
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 13. 📋 **КАТЕГОРИИ ТОВАРОВ И РАСХОДНИКОВ**
|
||||
|
||||
> **Источник**: [rules-complete.md#22-категории-товаров-и-расходников](./rules-complete.md#22--категории-товаров-и-расходников)
|
||||
|
||||
### 13.1 Полный список 28 универсальных категорий товаров
|
||||
|
||||
1. Одежда и обувь
|
||||
2. Косметика и парфюмерия
|
||||
3. Дом и сад
|
||||
4. Детские товары
|
||||
5. Спорт и отдых
|
||||
6. Электроника
|
||||
7. Книги
|
||||
8. Здоровье
|
||||
9. Автотовары
|
||||
10. Строительство и ремонт
|
||||
11. Продукты питания
|
||||
12. Зоотовары
|
||||
13. Дача, сад и огород
|
||||
14. Канцелярские товары
|
||||
15. Хобби и творчество
|
||||
16. Украшения и аксессуары
|
||||
17. Сумки и чемоданы
|
||||
18. Техника для дома
|
||||
19. Музыкальные инструменты
|
||||
20. Игры и игрушки
|
||||
21. Мебель
|
||||
22. Товары для красоты
|
||||
23. Бытовая химия
|
||||
24. Товары для путешествий
|
||||
25. Медицинские товары
|
||||
26. Религиозные товары
|
||||
27. Антиквариат и коллекционирование
|
||||
28. Прочие товары
|
||||
|
||||
### 13.2 12 специализированных категорий расходников
|
||||
|
||||
#### 🎁 **1. УПАКОВКА И ЗАЩИТА**
|
||||
|
||||
- Коробки (различных размеров)
|
||||
- Пакеты (полиэтиленовые, бумажные, фирменные)
|
||||
- Пузырчатая пленка, воздушные подушки
|
||||
- Стрейч-пленка, гофрокартон
|
||||
- Паллетная пленка, защитные уголки
|
||||
|
||||
#### 🏷️ **2. МАРКИРОВКА И ИДЕНТИФИКАЦИЯ**
|
||||
|
||||
- Этикетки (адресные, штрих-код, QR-код)
|
||||
- Бирки (ценники, размерники)
|
||||
- Стикеры и наклейки
|
||||
- Маркеры и ручки
|
||||
- Штампы и печати, термоэтикетки
|
||||
|
||||
#### 🔧 **3. КРЕПЕЖ И СОЕДИНЕНИЕ**
|
||||
|
||||
- Скотч (прозрачный, цветной, армированный)
|
||||
- Клей и клеевые составы
|
||||
- Стяжки пластиковые
|
||||
- Степлер и скобы
|
||||
- Веревки и шнуры, стрейч-лента
|
||||
|
||||
#### 📄 **4. ДОКУМЕНТООБОРОТ И ВКЛАДЫШИ**
|
||||
|
||||
- Накладные и сопроводительные документы
|
||||
- Инструкции по эксплуатации
|
||||
- Гарантийные талоны
|
||||
- Рекламные буклеты, визитки и флаеры
|
||||
- Благодарственные письма, купоны и промокоды
|
||||
|
||||
#### 🧼 **5. ГИГИЕНА И БЕЗОПАСНОСТЬ**
|
||||
|
||||
- Перчатки (латексные, нитриловые)
|
||||
- Маски и респираторы
|
||||
- Антисептики и дезинфекторы
|
||||
- Салфетки и тряпки
|
||||
- Фартуки и халаты, бахилы
|
||||
|
||||
#### 🛠️ **6. ИНСТРУМЕНТЫ И ПРИСПОСОБЛЕНИЯ**
|
||||
|
||||
- Ножи и резаки, ножницы
|
||||
- Линейки и рулетки
|
||||
- Упаковочные машины (ленточные)
|
||||
- Дозаторы скотча
|
||||
- Пистолеты для термоклея
|
||||
- Весы и мерная тара
|
||||
|
||||
#### 🎨 **7. БРЕНДИНГ И ДИЗАЙН**
|
||||
|
||||
- Фирменные пакеты с логотипом
|
||||
- Брендированные коробки
|
||||
- Цветная упаковочная бумага
|
||||
- Ленты и банты
|
||||
- Наклейки с логотипом компании
|
||||
- Подарочная упаковка
|
||||
|
||||
#### ⚡ **8. СПЕЦИАЛИЗИРОВАННЫЕ МАТЕРИАЛЫ**
|
||||
|
||||
- Антистатические пакеты
|
||||
- Влагопоглотители
|
||||
- Температурные индикаторы
|
||||
- Хрупкие наклейки
|
||||
- Пломбы и пломбировочные материалы
|
||||
- Защита от краж (магнитные датчики)
|
||||
|
||||
#### 🏪 **9. ТОРГОВОЕ ОБОРУДОВАНИЕ**
|
||||
|
||||
- Манекены и вешалки
|
||||
- Ценникодержатели
|
||||
- Подставки и стойки
|
||||
- Корзины и тележки
|
||||
- Зеркала примерочные
|
||||
- Освещение витрин
|
||||
|
||||
#### 🚚 **10. ЛОГИСТИКА И СКЛАДИРОВАНИЕ**
|
||||
|
||||
- Паллеты и поддоны
|
||||
- Контейнеры и ящики
|
||||
- Стеллажные системы
|
||||
- Погрузочные ремни
|
||||
- Защитные чехлы
|
||||
- Адресные ярлыки для груза
|
||||
|
||||
#### 💻 **11. ТЕХНИЧЕСКИЕ РАСХОДНИКИ**
|
||||
|
||||
- Картриджи для принтеров
|
||||
- Термоголовки, красящие ленты
|
||||
- Батарейки для сканеров
|
||||
- Чистящие средства для техники
|
||||
- Запчасти для упаковочного оборудования
|
||||
|
||||
#### 🎪 **12. СЕЗОННЫЕ И ПРАЗДНИЧНЫЕ**
|
||||
|
||||
- Новогодняя упаковка
|
||||
- Подарочные мешки
|
||||
- Праздничные ленты
|
||||
- Тематические наклейки
|
||||
- Открытки и поздравления
|
||||
- Сезонная упаковочная бумага
|
||||
|
||||
**ПРИМЕЧАНИЕ**: Данные категории являются рекомендательными и могут быть адаптированы под специфику конкретного поставщика расходников.
|
||||
|
||||
---
|
||||
|
||||
## 📊 **СТАТИСТИКА ПРОЦЕССОВ**
|
||||
|
||||
### По объему (строки):
|
||||
- **UI процессы селлера**: ~942 строки (самый объемный)
|
||||
- **Процесс создания продукта**: ~175 строк (самый детализированный)
|
||||
- **Категории товаров и расходников**: ~141 строка (классификационная система)
|
||||
- **Кабинет поставщика**: ~103 строки (процессы РЫНОК vs МАРКЕТ)
|
||||
- **Общие правила кабинетов**: ~96 строк (универсальные процессы)
|
||||
- **Workflow поставок**: ~45 строк (самый критичный)
|
||||
- **Система партнерства**: ~31 строка
|
||||
- **Workflow логистики**: ~27 строк
|
||||
- **Workflow фулфилмента**: ~20 строк
|
||||
|
||||
### По ролям:
|
||||
- **Селлер**: 6 процессов
|
||||
- **Поставщик**: 5 процессов
|
||||
- **Фулфилмент**: 5 процессов
|
||||
- **Логистика**: 3 процесса
|
||||
- **Универсальные**: 3 процесса
|
||||
|
||||
### По критичности:
|
||||
- **Критические**: Workflow поставок, Создание продукта, РЫНОК vs МАРКЕТ
|
||||
- **Важные**: UI процессы, Категории товаров, Общие правила кабинетов
|
||||
- **Вспомогательные**: Система партнерства, Учет движения, Протоколы разработки
|
||||
|
||||
---
|
||||
|
||||
**Дата создания**: Август 2025
|
||||
**Общий объем**: 1733 строки процессов (фактический подсчет)
|
||||
**Файл содержит**: 1805 строк всего (включая навигацию и статистику)
|
||||
**Источник**: [rules-complete.md](./rules-complete.md)
|
||||
|
||||
✅ **СТАТУС**: ПОЛНОСТЬЮ ЗАПОЛНЕН - все ключевые процессы добавлены
|
||||
|
||||
**Связанные файлы**:
|
||||
- [rules-complete.md](./rules-complete.md) - Основной файл с бизнес-правилами
|
||||
- [interaction-integrity-rules.md](./interaction-integrity-rules.md) - Методология работы
|
||||
- [visual-design-rules.md](./visual-design-rules.md) - Визуальные правила
|
||||
Reference in New Issue
Block a user