TVTable 3.4.0

Привет всем!

Для того чтобы администрация форума не ругалась:
«Сегодня дорогие мои, не будет никаких сантиментов и смайликов. Только жесткач и технические данные в чистом виде! Кому нравится словоблудие и рукофлудие, свободен. Никого не держу. Досвидульки и ...»


Редизайн компонента

Освежил внешний вид компонента и привел стили к аутентичности с MODX



Никаких библиотек

Из компонента выпилен jQuery

Теперь нет привязки к количеству колонок и строк таблицы

Раньше было ограничение по минимальному количеству столбцов и строк 2x2, а теперь можно создать даже одну ячейку



Или таблицу из одного столбца



Удаление определенных столбцов

Появилась возможность удалять определенные столбцы



Сортировка строк с помощью перетаскивания (Drag'n'Drop)

Появилась возможность сортировать строки перетаскиванием



Появилось несколько параметров


Максимальное количество столбцов
Примечание: Существующие значения не будут изменены и в том случае, если количество столбцов в существующих данных будет больше указанного лимита, то у пользователей будет возможность удалять столбцы до указанного лимита.

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

Количество столбцов
Примечание: Имеет приоритет над свойством «Максимальное количество столбцов». Существующие значения не будут изменены и в том случае, если количество столбцов в существующих данных будет больше указанного лимита, то у пользователей будет возможность удалять столбцы до указанного лимита, а если количество столбцов будет меньше указанного лимита, то при следующем редактировании будет добавлено недостающее количество столбцов.

Количество строк
Примечание: Имеет приоритет над свойством «Максимальное количество строк». Существующие значения не будут изменены и в том случае, если количество строк в существующих данных будет больше указанного лимита, то у пользователей будет возможность удалять строки до указанного лимита, а если количество строк будет меньше указанного лимита, то при следующем редактировании будет добавлено недостающее количество строк.

Есть обратная совместимость

Т.е. постарался и сделал так, что при наличии данных у TV если менять 4 параметра представленных выше, компонент будет учитывать данные. Например, если в TV уже есть значения и в них 4 столбца и вы укажете в параметре Максимальное количество столбцов: 2, то у менеджера будет возможность только удалять столбцы до указанного лимита. И так со всеми этими 4-мя параметрами.

Заголовки столбцов и заголовок по умолчанию
Теперь можно к столбцам указать заголовки и заголовок по умолчанию



Ширина полей в пикселях
Помню, что кто-то просил эту настройку. Теперь можно указывать ширину ячеек в пикселях. Например, чтобы было вот так:



Кнопка очистки таблицы
Добавлена кнопка для очистки таблицы, системная настройка tvtable_clear_button (По умочанию: выключена)

Изменения в сниппете


  • В параметр tv теперь можно указывать не только ID, но и название TV
  • Теперь выводится thead, параметр head (По умолчанию: включен)
  • Добавлены свойства bodyClass и headClass для добавления CSS-классов в tbody и thead соответственно
  • Параметр classname переименован в tableClass (но classname всё равно будет работать)
  • Появился параметр displayHeaders для вывода/добавления заголовков в качестве первой строки (По умолчанию выключен)
  • Добавлен плейсхолдер idx

Изменено поведение сниппета при указанных getX и/или getY


  • Если указать только getX, то на выходе получим таблицу с указанной строкой
  • Если указать только getY, то на выходе получим таблицу с указанным столбцом
  • Если указать и getX и getY, то на выходе получим содержимое указанной ячейки по координатам
  • Также в них кроме индекса можно указывать first и last
Несколько примеров для наглядности:

Вывод последней строки
&getX=`last`

Вывод последнего столбца
&getY=`last`

Вывести первый столбец
&getY=`first` // Или 0

Вывести первую строку
&getX=`first` // Или 0

Вывести содержимое ячейки которая находится по координатам: последняя строка, последний столбец
&getX=`last`
&getY=`last`

Вывести содержимое ячейки которая находится по координатам: вторая строка, последний столбец
&getX=`1`
&getY=`last`

Вывести содержимое ячейки которая находится по координатам: последняя строка, второй столбец
&getX=`last`
&getY=`2`

Важно! При обновлении будьте внимательны, из чанка теперь убран <tbody>

Исправлен баг
когда в БД записовался пустой массив в случае если таблица была пустая, теперь если все поля таблицы пустые, то в БД ничего не записывается

Важно!

У меня была задача сделать компонент универсальным, чтобы не только таблицы можно было создавать, но и какие-то другие мульти-данные. Т.е. некий JSON TV и потому много сил и времени потратил.

Кейсы, которые покрывает теперь компонент:


Определенное количество строк, в примере 7



Определенное количество столбцов, в примере 3



Например: Таблица 4x4



Максимальное количество столбцов, в примере 3



Максимальное количество строк, в примере 5



Максимальное количество строк и максимальное количество столбцов, в примере 5 и 3



Определенное количество строк и максимальное количество столбцов, в примере 3 и 2



Видео с демонстрацией кейсов


Всем спасибо за внимание, а мне?

Cписок донатеров:

  1. @Сергей: Могу ошибаться, но по-моему 500.00 руб. Извини Сергей, забыл. За статьи по MIGX
  2. @PG: 500.00 руб. За некоторые функции TVTable
  3. @Сергей: 200.00 руб.
  4. @Андрей Шевяков: 200.00 руб.
Если вдруг кому-то захочется поблагодарить рублём, то так уж и быть: Карта Сбербанка +79609354545 или в профиле есть Yandex.Деньги
Баха Волков
07 июня 2019, 18:35
modx.pro
8
1 401
+21

Комментарии: 26

Баха Волков
07 июня 2019, 18:38
0
Компонент всё еще в beta т.к. есть много нюансов и его нужно довести до ума. Если вдруг у кого будет желание, то присылайте PR или пишите свои мысли, попробуем что-нибудь придумать. Как никак у компонента уже аж 3 автора)
mngatoff
07 июня 2019, 19:21
+2
помнится, основное, что меня три года назад остановило, было то, что выводя тв на страницу получаешь массив массивов — то есть [[… ]]

и модкс пытался прочитать это как свой тег, и всё шло прахом

а так вообще обновления выглядят оч убедительно, лайк
    Баха Волков
    09 июня 2019, 16:31
    0
    В базе храниться конечно же двумерный JSON и видимо поэтому так получается.

    Спасибо!
      Василий Краковецкий
      30 июня 2019, 17:45
      0
      Это дело решается
      $value = str_replace('[[', '[[ ', $value);
      перед сохранением или выводом — в итоге и json не ломается и модикс выводит не как тэги а как контент.
    iWatchYouFromAfar
    07 июня 2019, 20:26
    +3
    Никогда не использовал пакет, хотя помнится мне как-то раз решился, но не помню почему так и не установил. Баха, тебе респект что вник в чужой код, что обновил все это и выложил в паблик через PR!

    P.S.
    Отдельно респект за подробное описания, мне для своего мини-пакета было лень все это делать… :)
      Баха Волков
      09 июня 2019, 16:34
      +2
      Спасибо Паша!

      Только не PR, а наша Яна с удовольствием добавила меня как автора на GitHub
      Николай Савин
      08 июня 2019, 13:29
      +1
      Просто и без лишних слов (дабы администрация не ругалась) ставлю большой однозначный плюс!
        Наумов Алексей
        10 июня 2019, 09:11
        +1
        Конечно плюс!
        А можно добавить подтверждение удаления НЕ ПУСТЫХ столбцов (и строк наверное тоже)? Обидно так случайно нажав кнопку «Удалить» грохнуть данные.

        И еще огромная хотелка, группы, хочу вносить такие данные:


        Насколько реально?
          Баха Волков
          10 июня 2019, 13:06
          1
          0
          А можно добавить подтверждение удаления НЕ ПУСТЫХ столбцов (и строк наверное тоже)? Обидно так случайно нажав кнопку «Удалить» грохнуть данные.
          Хорошая идея, записал, сделаю.

          И еще огромная хотелка, группы, хочу вносить такие данные:
          Пока не планирую. Объясню, почему. Связка MIGX + TVTable полностью покроет такие задачи. У меня на рабочем сайте именно так и реализовано.



          Спасибо Николай!
            Наумов Алексей
            10 июня 2019, 13:40
            0
            Окей)
            MIGX, конечно, покрывает задачу, правда данные «скрыты» внутри групп, их не видно. Да и несколько сложнее настраивать.
              Баха Волков
              10 июня 2019, 16:57
              0
              С доводами согласен, тогда запишу на будущее
            Баха Волков
            12 июня 2019, 10:47
            0
            Подтверждение перед удалением строк, столбцов и очисткой таблицы сделал. На GitHub лежит транспортный пакет, можешь протестировать.
            yani
            11 июня 2019, 11:33
            +1
            Ну ничего себе, красота какая! =)
              Evgeny
              26 июля 2019, 18:20
              +1
              Спасибо огромное! Особенно за Drag'n'Drop.
                Aborrol
                27 июля 2019, 02:10
                0
                Баха, нет планов по добавлению импорта в таблицу из csv?
                  Баха Волков
                  28 июля 2019, 10:26
                  +2
                  В планах не было, но теперь есть, но это не скоро
                  Murashkin
                  04 сентября 2019, 10:48
                  0
                  Подскажите, можно ли ограничить вывод количества строк (столбцов)? Например, мне нужно выводить только первые три строки. С помощью getX только какую-то одну получается вывести.
                    Баха Волков
                    09 сентября 2019, 12:16
                    0
                    У сниппета нет такого параметра, так что можете только получить сырые данные, т.е. JSON и сделать лимит. Напишите если у вас не получится
                    Andrey Burym
                    24 октября 2019, 11:50
                    0
                    День добрый,
                    а вот «Появилась возможность сортировать строки перетаскиванием» – так у меня она так и не появилась. Установлен пакет 3.4.1-beta, в js вижу
                    this.drag = (this.field.dataset.drag == 'true' || this.field.dataset.drag == 1) || false;
                    пробовал ставить this.drag = true,
                    функционал так и не появился. (ModX 2.7.1)
                    Подскажите, пожалуйста, что поправить/настроить?
                      Баха Волков
                      05 ноября 2019, 23:01
                      0
                      Добрый @Andrey Burym

                      В настройках ввода TV точно включен?
                        Andrey Burym
                        06 ноября 2019, 08:59
                        0
                        день добрый,
                        точно включён,
                        не знаю, может я что-то пропустил в описании пакета (?),
                        но после установки MIGX – drag&drop появился. Всё ok.
                        Спасибо.
                      Андрей
                      11 февраля 2020, 23:05
                      0
                      Добрый день!
                      Скажите, пожалуйста, планируется ли возможность добавления функции объединения ячеек? Компонент крутой, но этого очень не хватает…
                        Баха Волков
                        12 февраля 2020, 13:30
                        0
                        День добрый! В ближайшее время я точно не планирую.
                        Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
                        26