Реализация фронтенда
React SPA с доменной маршрутизацией, поддержкой i18n (EN/RU) и тематизацией платформ.
Статус реализации
| Модуль | Страниц | Компонентов | Статус |
|---|---|---|---|
| Landing | 1 | 1 | ✅ Готово |
| Auth | 5 | 2 | ✅ Готово (i18n, темы) |
| Investment | 12 | 9 | ✅ Готово (внешние провайдеры) |
| Commerce | 12 | 9 | ✅ Готово |
| Partner | 8 | 10 | ✅ Готово |
| Admin | 8 | 9 | ✅ Готово |
| Profile | 4 | 5 | ✅ Готово |
Итого: 50+ страниц, 45+ компонентов, 12 лейаутов
Просмотр прототипов
Открыть галерею прототипов - 48 статических HTML-страниц
Архитектура платформы
Платформа IWM состоит из 4 отдельных сайтов, каждый со своей навигацией и пользовательским опытом:
Ключевые концепции
Роли пользователей
| Роль | Сайт | Описание |
|---|---|---|
| Инвестор | IWM Invest | Просматривает стратегии, инвестирует, отслеживает портфель |
| Покупатель | IWM Shop | Просматривает товары, делает покупки, отслеживает заказы |
| Партнёр | IWM Partner | Создаёт реферальные ссылки, получает комиссии от привлечённых пользователей |
| Админ | IWM Admin | Управляет пользователями, проверяет KYC, обрабатывает финансовые операции |
Важное различие
- Пользователи (Покупатели/Инвесторы) = Выполняют действия (покупают/инвестируют). Они НЕ получают баллы или комиссии.
- Партнёры (MLM-участники) = Создают реферальные ссылки, приводят пользователей на платформы, получают карьерные баллы и комиссии от действий этих пользователей.
Все страницы прототипов (48 всего)
Авторизация (5 страниц)
Общий профиль (4 страницы)
IWM Invest - Инвестиционный сайт (12 страниц)
- Просмотр: Список стратегий | Детали стратегии
- Мастер: Шаг 1: Информация | Шаг 2: Сумма | Шаг 3: Документы | Шаг 4: KYC | Шаг 5: Оплата | Шаг 6: Подтверждение
- Портфель: Мой портфель | Детали инвестиции | Вывод средств
- Аккаунт: Мой аккаунт
IWM Shop - Магазин (12 страниц)
- Просмотр: Каталог товаров | Категория | Карточка товара
- Корзина: Корзина покупок
- Оформление: Шаг 1: Проверка | Шаг 2: Доставка | Шаг 3: Способ | Шаг 4: Оплата
- Заказы: История заказов | Детали заказа | Заявка на возврат
- Аккаунт: Мой аккаунт
IWM Partner - MLM-панель (7 страниц)
- Регистрация партнёра | Дашборд | Реферальные ссылки | Моя команда | Комиссии | Прогресс ранга | Выплаты
IWM Admin - Админ-панель (8 страниц)
- Дашборд | Управление пользователями | Детали пользователя | Очередь KYC | Проверка KYC | Комиссии | Выплаты | Отчёты
Пользовательские сценарии
Инвестиционный процесс (IWM Invest)
Процесс покупки (IWM Shop)
Партнёрский процесс (IWM Partner)
Технологии
| Компонент | Технология |
|---|---|
| Фреймворк | React 18 + TypeScript |
| Сборка | Vite 5 |
| Стили | TailwindCSS 3.4 |
| Состояние | Zustand |
| Роутинг | React Router 6 |
| i18n | react-i18next (EN/RU) |
| Иконки | Lucide React |
| UI-библиотека | @iwm/ui-components (27 компонентов) |
Прототипы (справочно)
| Компонент | Технология |
|---|---|
| CSS-фреймворк | Bootstrap 5.3.3 |
| Иконки | Bootstrap Icons |
| Интерактивность | Статический HTML (только ссылки) |
Структура навигации
Каждый сайт имеет собственную навигацию:
| Сайт | Бренд | Элементы навигации |
|---|---|---|
| IWM Invest | IWM Invest | Стратегии, Мой портфель, Мой аккаунт |
| IWM Shop | IWM Shop | Магазин, Корзина, Мой аккаунт, Мои заказы |
| IWM Partner | IWM Partner | Дашборд, Рефералы, Команда, Комиссии, Ранги, Выплаты |
| IWM Admin | IWM Admin | Дашборд, Пользователи, KYC, Комиссии, Выплаты, Отчёты |