12. Новая Админка (4.0)

[Shturman]

12. Новая Админка И для самых терпеливых Тут не паханное поле.
Я думал о Бутстрапе - как о базовом внешнем виде, и всё остальное довесками. Так как при разработке новых модулей вопрос стоит именно в оформление админки. И то оформление, как правило, не очень сложное.

Всё что касается базового функционала админки, как там это сделано, мне кажется, мало кого волнует. Главное не чтобы глючило и быстро грузилось.

@Rinat дал линк на инструмент https://www.webix.com/ru/

[Rinat]

О! Привет!
Webix - это библиотека для построения графического интерфейса на javascript.

Подписываюсь под webix'ом и всем руками за, так как это сильно ускорит процесс разработки.
Сейчас, если модуль в админке чем-то отличается от стандартной формы - приходится вешать кучу обработчиков, писать лишний javascript код и пр пр.
У меня больше времени уходит чтобы написать админку для модуля, чем сам модуль сейчас.
C Webix-ом проще:
Вот форма, вот данные - обрабатывай.
Посмотрите пример на главной странице
http://webix.com/

А вот пример самой админки:
http://webix.com/demos/admin-app/#!/app/dashboard

Если ввести бутрап - это сути не изменит, просто будет красивый внешний вид и поддержка мобильников. По сути шило на мыло, придется также писать кучу html кода, писать кучу обработчиков и пр пр, не очень удобно.

[Shturman]

Лично я часто сталкивался с тем что разработчику гораздо проще навоять что-то в админке чем, тратить время на изучение инстумента. Потому бутсрап сделает это хотябы одинаковым. Спасибо за предложенный инструмент и развернутый ответ, соберем еще мнений и аргументов и взвесим

[Rinat]

По поводу изучения инструмента:
Я не зная инструмент, сделал базовую админку для другого проекта за 2 -3  дня буквально. Там интуитивно все очень понятно.
А какие фишки даст админка на бутстрапе, помимо поддержки мобильников? Это же такая же html админка, просто приятно оформленная, не более.
Кстати webix тоже с мобильниками дружит

[bubek]

А http://webix.com/ это онлайн инструмент. или можно также и оффлайн использовать?

[Rinat]

Не понял вопроса, честно говоря.

Webix - это библиотека для построения web приложения на javascript.

bubek: Видел старый сантафокс? Вот там extjs используется - это из этой же оперы но только посложнее.
Ну или, если очень грубо проводить паралели, то это что-то  вроде http://jqueryui.com/, на основе которого сделан лейоут Санты 3

[Shturman]

@Rinat ,мне не известен ни один модуль, который использовал бы ExtJs в своей админке Зато, мне известен скрипт ,безопасности, который свою админку сделал не в стандартных элементах, а в своих
Бустрап хорошо распространен и позволит решить визуальные проблемы, хорошо документирован, в том числе и на русском.
Понятно, что от движка в данном случае потребуются дополнительные инструменты помогающие строить формы, и что чисто бутстрап это не замена EXtJS или WebIx, а единообразие интерфейса прежде всего.
Но повторюсь, мне пока не известны примеры модулей, которые использовали бы компоненты админки, и не факт что это нужно в дальнейшем.

[bubek]

Бустрап хорошо распространен и позволит решить визуальные проблемы, хорошо документирован, в том числе и на русском.

+

[Rinat]

Давай на практике.

Простое дерево структуры в админке (.

Как бы ты сделал на бутстрапе?
1) Сгенерировал на php  html код
<ul>
 <li> Страница 1
         <ul>
           <li>Подстраница 1</li>
           <li>Подстраница 2</li>
          </ul>
         </li>
     </li>
.... и т.п.
2) Затем правил бы css свойства так чтобы эти списки были похожи на дерево
3) Затем писал бы javascript код для раскрытия списка, закрытия списка
4) Затем писал бы писал остальной javascript код (при создании, перенесении страницы и т.п.)
Если не использовать что-то сторонее, то уйдет достаточно много времени


Как бы ты сделал на webix?

1) Вывел бы весь массив json (одна функция в php)
2) Написал что-то вроде:
 {
view:"tree",
url: путь к данным массива json
select:true
},
И все.... при необходимости привязал это к какой-то форме. Если переименоваются оттуда данные - в дереве тоже переменовываются. Добавляются - в дереве тоже добавляются. Никаких onclick, onselect и пр.  кучи обработчиков.



Админка каталога товаров:
Как бы ты сделал на бутстрапе?
1) Писал список товаров на php
2) Писал добавление на php
3) Писал редактирование товаров
4) Писал бы удаление
и пр пр.. я уже не говорю про удаление скопом, редактирование скопом и пр. Для этого всего надо писать свой php код, который парсит html шаблоны и на основе этого генерирует html код. Затем это все еще обрабатывается javascript кодом

Как бы на webix? Выбирал бы нужный контрол, например таблица datagrid. Хочешь делать редактирование скопом? Да поставь editable: true и все. Удаление добавление и сохранение? Добавь свойсво save - и укажи url страницы, где сохраняются данные, а там обрабатывай...

Аналогично и со всем другим

[Shturman]

@rinat Рано практики. нет смысла сравнивать бутстрап и вебикс на прямую. Это разные же продукты. Я писал выше, что к бустрапу нужно еще что-то в качестве фреймворка JS, и jquery тут не самый плохой вариант, именно по тем же соображениям. Распространен, легок, большинство его знает, а вебикс надо изучать, хотя вроде и просто.

Но самое главное ты не увидел в моем посте мне кажется что большинству без разницы какой будет js фреймворк, так как его не будут использовать.
 

[Rinat]

Ну как вариант основной каркас можно сделать на webix который поддерживает и бутстрап и jquery и что угодно. Можно спокойно html код свой вставлять и его использовать.
Таким образом любой программист может писать так как он хочет, правда бардак будет небольшой

[Oslix]

Кстати, а там я не увидел WYSIWYG редкатора.
И не увидел сортровку drag and drop.
Т.е. между категориями можно перетащить, но внутри одной категории порадок драгом не меняется.

[Rinat]

Все интегрируется:
http://docs.webix.com/desktop__text_editors.html.
По драг энд дроп там много примеров:

http://webix.com/blog/drag-and-drop-in-webix-ui/
http://docs.webix.com/desktop__dnd_hierarchy.html

[Shturman]

В конце неделе покажу админку уже Даже если там нет встроенного редактора или будут проблемы с лицензированием - это не очень большая проблема.

[Rinat]

Ну и как тебе webix?