An open API service indexing awesome lists of open source software.

https://github.com/pfight/table-component-sample

Пример использования TableComposition компонента из Web-клиента.
https://github.com/pfight/table-component-sample

Last synced: 12 months ago
JSON representation

Пример использования TableComposition компонента из Web-клиента.

Awesome Lists containing this project

README

          

### Пример использования TableComposition

В данном репозитории приведен пример расширения Web-клиента, демонстрирующий работу с компонентами Composition и TableComposition из docsvision.web. В частности, приведены примеры:

- Отображения простого тега button при помощи компонента Composition и плагинов, демонстрирующий работу плагинов (папка SimpleComposition)
- Отображения статических и динамически загружаемых данных данных при помощи TableComposition (SampleTable)
- Расширения TableComposition при помощи плагинов (DemoCellContentPlugins, DemoRowDecoratorPlugins, OrderingPlugins, DemoCellWrapperPlugins)
- Интеграции TableComposition в страницу карточки при помощи выделения скрол-контейнера вне самой таблицы (TableScrollBlock)
- Добавление плагинов в таблицу карточек папки в Web-клиенте (SampleGridPluginFactory)

#### Сборка и установка

Для сборки необходимо иметь NodeJS v14.17.5+. Порядок сборки и установки:

1. Открыть консоль в папке TableWebExtension
2. Выполнить `npm run build`
3. Скопировать папку Dist/Site/Content/Modules/TableWebExtension в папку Site/Content/Modules в установке Web-клиента
4. Скопировать TableControlDescription.xml в папку Plugins в установке в Web-клиента

#### Настройка разметок

##### Простая композиция

- Добавить на разметку контрол Simple composition

##### Таблица вариант 1 - статичная таблица

- Добавить на разметку контрол Sample table с опцией UseOwnScroll - true, UseStaticData - true

##### Таблица вариант 2 - с динамически загружаемыми данными с известным размером модели

- Добавить на разметку контрол Sample table с опцией UseOwnScroll - true, UseStaticData - false, KnownModelSize = true

##### Таблица вариант 3 - с динамически загружаемыми данными с неизвестным размером модели

- Добавить на разметку контрол Sample table с опцией UseOwnScroll - true, UseStaticData - false, KnownModelSize = false

##### Таблица вариант 4 - с внешним скоролом

- Добавить на разметку контрол Table scroll block, добавить в него произвольное содержимое
- Добавить внутрь Table scroll block контрол Sample table с опцией UseOwnScroll - false.
- Убедиться, что между Table scroll block и Sample table нет промежуточных родителей с position: relative/absolute/fixed/sticky, и overflow: auto/scroll
- Убедиться, что родительский элемент Table scroll block ограничен по высоте

##### Плагин в таблице карточек папки

Открыть папку Входящие (5bf0fb94-23fa-4212-80c3-c598e9859901) в Web-клиенте, выставить настройку переноса строк "Переносятся"