roilafx / constructorevo
Модуль для создания наполнения страницы при помощи Drag and Drop
Installs: 14
Dependents: 0
Suggesters: 0
Security: 0
Stars: 1
Watchers: 1
Forks: 0
Open Issues: 0
Language:JavaScript
pkg:composer/roilafx/constructorevo
This package is auto-updated.
Last update: 2025-12-24 03:17:39 UTC
README
Гибкий визуальный конструктор страниц для Evolution CE, позволяющий создавать и редактировать макеты страниц с помощью drag-and-drop интерфейса.
✨ Возможности
-
🖱️ Drag-and-Drop интерфейс - Перетаскивайте элементы на рабочую область
-
📱 Адаптивный дизайн - Создавайте макеты, которые работают на всех устройствах
-
🎨 Rich панель свойств - Настраивайте внешний вид и поведение элементов
-
🔧 Поддержка TV-параметров - Интеграция с Template Variables
-
📋 Буфер обмена - Копируйте, вырезайте и вставляйте элементы
-
🎯 Контекстное меню - Быстрый доступ к часто используемым действиям
🏗️ Поддерживаемые элементы
-
📝 Текст - Текстовые блоки с поддержкой различных HTML-тегов (div, p, h1-h6, span)
-
🔗 Ссылка - Гиперссылки с настройкой target, title и rel атрибутов
-
🖼️ Изображение - Изображения с alt-текстом и настройками отображения
-
🎛️ Кнопка - Кнопки различных типов (button, submit, reset)
-
📊 Строка (Row) - Горизонтальные контейнеры с Flexbox
-
📐 Колонка (Column) - Вертикальные контейнеры с Flexbox
-
🏷️ TV-параметры - Автоматическая интеграция с Template Variables
💡 Использование
-
Добавление элементов - Перетащите элемент из левой панели на рабочую область
-
Быстрое редактирование - Используйте двойной клик по текстовым элементам для быстрого редактирования
-
Назначение свойств - Настройте свойства элемента в правой панели
Редактирование свойств
Панель свойств разделена на категории:
-
Основные - ID, классы, data-атрибуты
-
Содержимое - Текст, URL, значения
-
Расположение - Display, position, overflow
-
Flexbox - Направление, выравнивание, перенос
-
Размеры - Ширина, высота, минимальные/максимальные размеры
-
Отступы - Padding и margin
-
Стили - Цвета, границы, тени
-
Текст - Шрифты, выравнивание, декорации
-
Анимация - Transition, animation
Работа с TV-параметрами
TV-параметры автоматически группируются по категориям. Просто перетащите нужный TV на рабочую область, и он будет отображать данные текущего документа.
🛠️ Технические особенности
-
Модульная структура - Каждый компонент в отдельном файле
-
Bootstrap 5 - Используется для интерфейса конструктора
-
Bootstrap Icons - Векторные иконки для элементов
Вывод результата
Вывод выполняется при помощи сниппета documentBuilder параметров нет.
runSnippet('documentBuilder')
🐛 Известные проблемы
-
Ссылки в конструкторе - Для предотвращения переходов по ссылкам ничего нет
-
Абсолютные URL - При вводе относительных путей в ссылках браузер может преобразовывать их в абсолютные
-
Сложные CSS-значения - Некоторые сложные CSS-функции могут не корректно обрабатываться
🚀 Установка
Выполните команды из директории /core:
- Установка пакета
php artisan package:installrequire roilafx/constructorevo "*"
- Публикация стилей и скриптов
php artisan vendor:publish --provider="roilafx\constructor\constructorServiceProvider"