Главная страница>Исходный код ASP>Другие категории
Скачать

ЧИТАЙТЕ

Что такое KilikTableBundle?

KilikTableBundle — это быстрый, современный и простой в использовании способ манипулирования информацией, разбитой на страницы, с функциями фильтрации и упорядочивания, а также с помощью ajax-запросов.

Этот пакет находится в стадии разработки.

Ссылки:

  • Живая демонстрация
  • КиликТаблицаДемоКомплект

Рабочие особенности:

  • нумерация страниц
  • базовая фильтрация (например, %...%)
  • расширенная фильтрация (<,>,<=,>=,=,!,!=)
  • порядок по столбцу (и обратный)
  • базовый шаблон таблицы, расширяемый
  • хранить фильтры и заказы в локальном хранилище браузера (API REST)
  • фильтрация запросов с группировкой по
  • показать упорядоченный столбец (нормальный и обратный)
  • Селектор максимального количества элементов на странице (настраиваемый)
  • задержка событий нажатия клавиш (чтобы предотвратить множественные перезагрузки)
  • установите флажок и выберите фильтр
  • CSV-экспорт отфильтрованных строк
  • настройка видимых столбцов (скрыть/показать флажки)
  • столбец отображает ячейки столбца с обратным вызовом
  • пользовательские ячейки столбца отображения с шаблоном
  • несколько списков на одной странице
  • предварительная загрузка фильтров по умолчанию и сброс фильтров локального хранилища
  • умная фильтрация по многим словам (Filter::TYPE_LIKE_WORDS_AND)
  • (бета) поддержка вызовов API для загрузки ресурсов через веб-сервисы

Планируемые функции:

  • больше переводов
  • добавить расширенные шаблоны

Установка 

composer require kilik/table

Исправьте свой AppKernel.php (symfony <4): 

 class AppKernel extends Kernel
{
    public function registerBundles ()
    {
        $ bundles = [
            // ...
            new  Kilik  TableBundle  KilikTableBundle (),
        ];
        
        // ...
    }
}

Исправьте свой AppKernel.php (symfony >=4): 

 <?php

return [
    Kilik  TableBundle KilikTableBundle::class => [ ' all ' => true ],
];

Установить ресурсы 

./bin/console assets:install --symlink

И создайте свой первый список:

Функция отключена в ветке 1.0 (совместимость с Symfony 4 незавершена) 

./bin/console kilik:table:generate

(С параметрами по умолчанию ваш список доступен здесь http://localhost/yourcontroller/list)

Использование

Эту документацию необходимо заполнить.

Вот несколько примеров, демонстрирующих новейшие функции.

Оптимизированная версия для загрузки объектов из имени репозитория: 

 $ table = ( new Table ())
    // ...
    -> setEntityLoaderRepository ( " KilikDemoBundle:Product " )
    // ...

Оптимизированная версия для загрузки сущностей из метода обратного вызова (стремительная загрузка): 

 $ table = ( new Table ())
    // ...
    -> setEntityLoaderCallback ( function ( $ ids ) {
        return $ this -> manager ()-> getRepository ( ' KilikDemoBundle:Product ' )-> findById ( $ ids );
    })
// ...

Массовые акции

Определить массовое действие для списка 

 $ massAction = new MassAction ( ' delete ' , ' Delete selected items ' ); 
// First parameter 'delete' must not contain space or special characters (identifier)
$ massAction -> setAction ( ' path/to/my-form-action.php ' );

$ table = ( new Table ())
    // ...
    -> addMassAction ( $ massAction )
    // ...
    
// Then your form action, you can grab selected rows as entities
$ selectedEntities = $ this -> get ( ' kilik_table ' )
    -> getSelectedRows ( $ request , $ this -> getTable ());

foreach ( $ selectedEntities as $ entity ) {
    // ...
    $ entity -> doSomething ();
    // ...
}

Если массовое действие не имеет указанного действия, запускается событие JavaScript. Вы можете проверить все строки следующим образом: 

 $ ( "#table_id" ) . on ( 'kilik:massAction' , function ( e , detail ) {
    if ( detail . checked . length === 0 ) return false ;
    if ( detail . action === 'delete' ) {
        //...
    }
} ) ;

События / Слушатели

  • kilik:init:start событие jQuery, когда начинается процесс инициализации таблицы 
 $ ( document ) . on ( 'kilik:init:start' , function ( event , table ) {
    // Do something with event or table object
} ) ;
  • kilik:init:end Событие jQuery, когда процесс инициализации таблицы завершается 
 $ ( document ) . on ( 'kilik:init:start' , function ( event , table ) {
    // Do something with event or table object
} ) ;

Автозагрузка таблиц Kilik

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

{% block tableMetadata %}
    < div style =" display:none;width:0; height:0; " data-kiliktable-id =" {{ table.id }} " data-kiliktable-path =" {{ table.path }} " > {{ table.options | json_encode | raw }} </ div >
{% endblock tableMetadata %}

Вы можете получить доступ к конфигурациям таблиц из атрибутов HTML с помощью jQuery, см. пример: 

 var loadKiliktables = function ( ) {
    var $kilikTables = $ ( "[data-kiliktable-id]" ) ;
    if ( $kilikTables && $kilikTables . length > 0 ) {
        $kilikTables . each ( function ( index , currentTable ) {
            var $currentTable = $ ( currentTable ) ;
            var id = $currentTable . data ( "kiliktable-id" ) ;
            if ( id . length > 0 ) {
                var path = $currentTable . data ( "kiliktable-path" ) ;
                var options = $currentTable . html ( ) ;
                new KilikTableFA ( id , path , JSON . parse ( options ) ) . init ( ) ;
            }
        } ) ;
    }
}

Бутстрап 4

Примечание. Интеграция с Bootstrap 4 (с Font Awesome) незавершена, используйте новую функцию JS: 

 $ ( document ) . ready ( function ( ) {
    var table = new KilikTableFA ( "{{ table.id }}" , "{{ table.path }}" , JSON . parse ( '{{ table.options | json_encode |raw }}' ) ) ;
    table . init ( ) ;
} ) ;

Использовать другое хранилище для фильтров таблиц

Если вы хотите использовать собственное хранилище для фильтров таблиц (например, сеанс). 

 // Disable using javascript local storage form filters
public function getTable ()
{
    return ( new Table ())-> setSkipLoadFilterFromLocalStorage ( true );
}

// On ajax action : store filters data
public function _list ( Request $ request )
{
    $ table = $ this -> getTable ();
    $ response = $ this -> get ( ' kilik_table ' )-> handleRequest ( $ table , $ request );
    
    // Handle request for table form
    $ this -> kilik -> createFormView ( $ table );
    $ table -> getForm ()-> handleRequest ( $ request );
    $ data = $ table -> getForm ()-> getData ();
    
    $ this -> filterStorage -> store ( $ data ); // Use your custom storage

    return $ response ;
}


// On default action
public function list ()
{
    $ table = $ this -> getTable ();
    $ data = $ this -> filterStorage -> get ();

    return $ this -> render ( ' list.html.twig ' , array (
        ' table ' => $ this -> kilik -> createFormView ( $ table , $ data ),
    ));
}

Настройте заполненные фильтры

Когда фильтр заполнен, в поле добавляется поле class table-filter-filled . По умолчанию стиль не применяется, но вы можете переопределить его в соответствии со своими потребностями: 

. table-filter-filled {
    ...
}

Фильтрация столбцов даты 

 $ table
    -> addColumn (
        ( new Column ())
            -> setSort ([ ' u.createdAt ' => ' asc ' ])
            -> setDisplayFormat (Column:: FORMAT_DATE )
            -> setDisplayFormatParams ( ' d/m/Y H:i:s ' ) // or for example FilterDate::INPUT_FORMAT_LITTLE_ENDIAN
            -> setFilter (( new FilterDate ())
                -> setName ( ' u_createdAt ' )
                -> setField ( ' u.createdAt ' )
                -> setInputFormat (FilterDate:: INPUT_FORMAT_LITTLE_ENDIAN )
            )
    )
;

Пользователи могут фильтровать эти данные с помощью различных операторов, например:

  • 26/02/1802 или =26/02/1802 : ожидается определенный день.
  • !=21/11/1694 : ожидается в любой день, кроме 21 ноября 1694 г.
  • >26/02/1802 18:00 : ожидает определенный день после 18:00 и без конечного ограничения
  • >=02/1802 : ожидается в феврале 1802 г. и позже
  • <2024 : ожидается в 2023 году и раньше.
  • <=26/02/1802 15 : ожидается 26 февраля 1802 г. в 15:00 или раньше.
  • = : ожидаемая дата равна NULL
  • != : ожидает, что дата не равна NULL

Для разработчиков пакетов 

 # prepare tests
./prepare-tests.sh

# run tests
./run-tests.sh

# launch composer
./scripts/composer.sh
Расширять
Дополнительная информация
Связанные приложения
Рекомендуем вам
Связанные новости Все