Элементы форм
Все компоненты ввода данных · Glass Design System
Текстовые поля
UInput и UTextarea — ввод текста
ФИО или название организации
Подробное описание ситуации для оператора
Выбор
USelect, USelectMenu, UInputMenu — выбор из списка
Выберите город дислокации
Поиск по имени оператора
Начните вводить адрес для автодополнения
Числовой ввод
UInputNumber — поле с кнопками +/-
Активных единиц
Дата
UInputDate и UCalendar — выбор даты
Выберите дату из календаря
Встроенный календарь
| S | M | T | W | T | F | S |
|---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
Время
Выбор времени
Теги
UInputTags — редактируемый список тегов
Нажмите Enter для добавления нового тега
PIN-код
UPinInput — ввод кода подтверждения
Введите 6-значный код из SMS
Переключатели
USwitch — вкл/выкл состояния
Цвета
Чекбоксы
UCheckbox и UCheckboxGroup — множественный выбор
Одиночные
Группа (card-вариант)
Радио-группа
URadioGroup — единственный выбор из списка
Тип услуги (card-вариант)
Ползунок
USlider — одиночное значение и диапазон
Цвета
Загрузка файлов
UFileUpload — drag & drop зона загрузки
Допустимые форматы: JPG, PNG. Максимум 10 МБ.
Перетащите файлы сюда
или нажмите для выбора
Выбор цвета
UColorPicker — палитра цветов
Выберите цвет для маркировки зоны
Поля формы
UFormField — обёртка с label, description, hint, error
Описание поля для пользователя
Поле, которое необходимо заполнить
Пример валидации
Быстрая заявка
QOR Glass UI · Система безопасности · Nuxt UI 4