Files

s.zotov 718821fdd6 Initial commit: ASPEKTER — визуальный конструктор email-рассылок

- z51-pug-builder: Svelte 5 SPA, визуальный редактор Pug-писем
- email-gen: Node.js рендерер Pug→HTML через email-templates + Juice
- email-gen-api: HTTP сервер рендеринга (порт 8787)
- coin-scout: сервис подбора монет из фидов
- Docker Compose для dev/prod
- Nginx конфиг с SSL для app.aspekter.ru

2026-04-13 11:36:39 +05:00

5.8 KiB

Raw Blame History

Конструктор писем VipAvenue (Svelte)

Подробная инструкция по использованию редактора для сборки Pug-кода писем.

Запуск проекта

Установите зависимости: npm install
Запустите dev-сервер: npm run dev
Откройте ссылку из терминала (обычно http://localhost:5173)

Сохранение в email-gen

Для записи let.pug и html.pug нужен локальный сервер. Автосохранение работает только для html.pug, а let.pug сохраняется кнопкой «Сохранить».

Сборка и запуск

Соберите фронт: npm run build
Запустите сервер: npm run serve
Откройте интерфейс: http://localhost:4173

Переменные окружения

EMAIL_GEN_ROOT — путь к корню email-gen
EMAIL_GEN_PROJECT — имя проекта (по умолчанию vipavenue)
EMAIL_GEN_HTML_PATH — путь к html.pug внутри email-gen (опционально)
EMAIL_GEN_LETTERS_DIR — путь к папке letters внутри email-gen (опционально)
EMAIL_GEN_PUBLIC_INDEX — путь к public/index.html (опционально)
PORT — порт сервера (по умолчанию 4173)

Кнопка HTML в конструкторе копирует содержимое public/index.html через /api/html.

Dev-режим (опционально)

Если запускаете npm run dev, укажите VITE_API_BASE=http://localhost:4173, чтобы кнопка сохранения обращалась к backend.

Общие элементы

Тёмная тема — переключатель в топбаре. Сохраняется в localStorage.
Папка изображений — глобальный префикс для всех картинок. В блоках указывается только имя файла и расширение.
Цены в товарах — один глобальный флажок. Управляет всеми товарными блоками (включая «3 товара + картинка»).
Собрать мужское / Собрать женское — переставляет сегменты относительно разделителя (dividerVA), сохраняя общие блоки до и после.
Сохранить как пресет — сохраняет текущее состояние блоков и настроек.
Сбросить — очищает блоки и Pug.

Работа с блоками

Добавляйте блок через выпадающий список «Тип блока».
Каждый блок имеет сегмент: O (общий), Ж, М. Сегментный бейдж меняется при клике.
Перетаскивайте блоки за «ручку» или кнопками ↑/↓.
Параметры блока сразу попадают в Pug (панель справа).
Кнопки «Скопировать код» / «Экспорт .pug» работают сверху и снизу панели кода.

Сегменты и сборка версий

Общие блоки до разделителя dividerVA всегда остаются сверху.
При сборке мужской версии: сегмент М становится над разделителем, Ж — под ним; общие блоки вокруг разделителя остаются на месте.
При возвращении на женскую версию порядок восстанавливается.

Пресеты

Вкладка «Пресеты»: Новинки, Акция, Новые коллекции, Мои пресеты.
Для Новинок/Акции/Новых коллекций введите женские и мужские ID (до 16), при необходимости цены.
Кнопки «Женская версия» / «Мужская версия» создают набор блоков и переходят в конструктор.
«Мои пресеты» — сохранённые состояния конструктора. Доступны загрузка/удаление.

Поля и картинки

В блоках с картинками указывайте только имя файла и расширение; базовый путь — в «Папка изображений».
Расширение по умолчанию: .png.

Хранение данных

localStorage ключи:
- vip_letter_editor_blocks_v1
- vip_letter_editor_settings_v1 (включая imageBaseUrl, showPrices, тема)
- vip_letter_editor_theme
- vip_letter_editor_custom_presets_v1

Частые действия

Показать превью HTML для текстового блока — чекбокс внутри текстового блока (если нужен рендер HTML).
Убрать отступ после блока — флажок внутри блока.
Ширина/высота, отступы — в доп. настройках (кнопка «Доп. настройки» там, где она есть).

Если что-то пошло не так: проверьте, что глобальный флажок цен включён/выключен как нужно, и убедитесь, что разделитель dividerVA стоит на месте, если используете сборку мужской/женской версии.

5.8 KiB Raw Blame History Unescape Escape