0.0.43 • Published 2 years ago
vuetify-hasura-table v0.0.43
Плюсы
- Принимает все те же пропсы/слоты, что и обычная VDataTable
- Интегрирует таблицу с движком Hasura
- Из коробки поддерживает серверную сортировку, пагинацию, фильтрацию и поиск
- По желанию добавляет столбец для удаления строки (с кастомизируемым способом удаления)
- Используя систему плагинов, можно интегрировать ее с другой таблицей (например, с vuetify-schema-table)
- Текст всех сообщений (к примеру в модалке с подтвеждением удаления) может локализироваться (по умолчанию стоит английский язык). Пример локализации можно посмотреть в файле ~/plugins/vuetifyLocalization.js
- Поддерживает возможность получения связанной сущности и сортировку по ней. Для этого нужно использовать специальный синтаксиси и в поле "value" передать путь к детям. Текст, который нужно показать в столбце, выделяется с помощью знака *: { assistant { *name* } } или {autos_aggregate: {nodes: {count}}} -- выведет в стобце количество автомобилей у водителя
- При первом отобжении передает таблице-ребенку skeletonLoading = true, тем самым (по надобности) включает режим скелетон-загрузки
Минусы
- Модалку с подтверждением удаления пока нельзя кастомизировать
- Фильтры и поисковую строку необходимо делать вручную. Эта либа принимает только пропсы, но внешний вид нужно делать ручками
Props
- fields -- массив полей, который будет передаваться, во-первых, дальше таблицу-ребенку, а во-вторых, информация из этого массива используется для интеграции с Хасурой. Пример значения: fields: { text: 'Начало аренды', value: 'rentStartDate', type: 'datetime', timezone: 3 }, { text: 'Конец аренды', value: 'rentEndDate', type: 'datetime', timezone: 3 }, { text: 'Адрес', value: 'deliveryAddress' }, { text: 'Клиент', value: 'client { *name* }' }, { text: 'Ассистент', value: 'assistant { *name* }' }
- source -- название таблицы в Hasura
- defaultSelections -- массив селекторов, которые получаются с сервера всегда. По умолчанию, это поле 'id'
- sortMapper -- функция, которая используется для определения порядка сортировки
- noDelete -- булевый флаг, если нам не нужна возможность удаления строк
- deleteParams -- параметры, определяющие как строка будет удаляться: idType -- тип поля с id (uuid! по умолчанию), customMutation -- функция для переопределения мутации удаления
- filters -- объект с фильтрами, которые будут слаться при интеграции. Например, эта computed-функция позволит отображать строки только за выбранный день: computed: { filters () { const date = moment(this.date, 'YYYY-MM-DD').toDate() return { _and: { rentStartDate: { _gt: moment(date).utc().add(-3, 'hours').toISOString() } }, { rentStartDate: { _lt: moment(date).utc().add(1, 'day').add(-3, 'hours').toISOString() } } } } }
- search -- строки с поиском (если нужно включить поиск).
- searchFilter -- функция, используемая для поиска. Обязательный параметр, когда нужен поиск. Принимает на вход
search
, на выходе выдает объект с фильтром - searchDelay -- debounce задержка при поиске, чтобы слишком часто не слать запросы. По умолчанию -- 200мс.
0.0.42
2 years ago
0.0.43
2 years ago
0.0.40
3 years ago
0.0.41
3 years ago
0.0.39
3 years ago
0.0.38
3 years ago
0.0.37
3 years ago
0.0.36
3 years ago
0.0.35
3 years ago
0.0.34
3 years ago
0.0.33
3 years ago
0.0.32
3 years ago
0.0.30
3 years ago
0.0.31
3 years ago
0.0.29
3 years ago
0.0.28
4 years ago
0.0.27
4 years ago
0.0.26
4 years ago
0.0.25
4 years ago
0.0.24
4 years ago
0.0.23
4 years ago
0.0.22
4 years ago
0.0.21
4 years ago
0.0.20
4 years ago
0.0.19
4 years ago
0.0.18
4 years ago
0.0.17
4 years ago
0.0.16
4 years ago
0.0.14
4 years ago
0.0.15
4 years ago
0.0.13
4 years ago
0.0.10
4 years ago
0.0.11
4 years ago
0.0.12
4 years ago
0.0.9
4 years ago
0.0.8
4 years ago
0.0.7
4 years ago
0.0.6
4 years ago
0.0.5
4 years ago
0.0.4
4 years ago
0.0.3
4 years ago
0.0.2
4 years ago