Repository navigation
[Feature] Галерея товара: компактный uploader и сортировка загрузки по имени файла #616
Description
Источник
modx.pro — комментарий Сергея Карповича:
- «Огромное drag-and-drop поле (зачем?)»
- Загруженные фото сортируются по дате загрузки, а не по имени; после загрузки мелко внизу под полем — приходится сортировать вручную
- В miniShop2 порядок совпадал с заранее пронумерованными именами файлов
Анализ (код)
UI: крупная зона загрузки
vueManager/src/components/gallery/GalleryUploader.vue:
- Uppy Dashboard inline,
height: 400,width: 100%— занимает верх формы. ProductGallery.vue: порядок блоков — toolbar → uploader → grid. Превью всегда ниже.
Сортировка при upload
core/components/minishop3/src/Processors/Gallery/Upload.php:
$position = ... ? 0 : $this->modx->getCount(...);
// position = текущее кол-во файлов → append в порядке завершения uploadGetList.php: defaultSortField = position, ASC — отображение следует position, не name/createdon.
При пакетной загрузке через Uppy порядок зависит от скорости ответа сервера, не от lexicographic имени (01.jpg, 02.jpg…). Поведение ms2 (ожидание пользователя) — natural sort по filename после batch или присвоение rank из имени.
Связанный headless scope
#566 — Web API images[] для витрины (другой слой, но порядок position там тоже важен).
Предложения
1. Компактный uploader (UX)
- Режим compact: Dashboard
height: 120–160илиnote + browseбез full dropzone до hover. - Опция «свернуть зону загрузки» после первого файла (accordion).
- Альтернатива: кнопка «Добавить» + modal uploader вместо permanent 400px block.
2. Сортировка по имени (поведение)
Вариант A (ms2-like, рекомендуется): после complete batch (Uppy upload-complete / server-side hook) — пересчитать position natural sort по file/name для product_id.
Вариант B: при каждом Upload вставлять по lexicographic rank среди siblings (дороже на concurrent uploads).
Вариант C: настройка media source gallerySortOnUpload = name|append (default name для parity ms2).
3. Layout
- Split view: grid слева / uploader справа на wide screens.
- Или sticky toolbar + inline drop на grid (drag onto thumbnails area).
Критерии приёмки
- Dropzone не доминирует над превью на типичном laptop viewport.
- Batch upload
01.jpg…10.jpg→ grid order 1..10 без ручного drag-sort. - Существующий drag-sort (
Gallery/Sort.php) не ломается. - Smoke/PHPUnit на assign position (unit или processor test).
Файлы
vueManager/src/components/gallery/GalleryUploader.vuevueManager/src/components/gallery/ProductGallery.vuecore/components/minishop3/src/Processors/Gallery/Upload.php(+ опционально post-batch resort service)
Out of scope
Замена Uppy на другой upload stack.
Activity