Olobase Component List
Layout
Layout, also known as VaLayout, is the main layout component that wraps the components shown in the following examples.
AppBar
AppBar is one of the main component that create components such as hierarchical menu and user profile with the Vuetify VNavigationDrawer component.
Aside
It is a customizable view where you can put some additional information. VaAsideLayout component is used to integrate content from anywhere, in any context.
Breadcrumbs
Breadcrumbs utomatically creates hierarchical links from the current route using the v-breadcrumbs component.
Footer
This area is the footer area that allows some corporate information to be displayed within the VFooter component.
Messages
This component is used to show special status messages such as info, error, warning, success using the vuetify v-snackbar component.
Listing
The List component allows displaying the settings, filters and parent options of the data table.
DataTableServer
Using the Vuetify v-data-table-server component it is used to paginate a list that follows a grid structure. It includes features such as sorting, search, pagination, filtering and selection. The list layout within the default slot is fully customizable.
DataIteratorServer
Viewing data that does not fit the grid structure or needs to be customized using the Vuetify v-data-iterator component and is similar to the va-data-table-server component in terms of functionality. It also includes features such as sorting, search, pagination, filtering and selection. The list layout within the default slot is fully customizable.
Inputs
Input components allow editing of specific properties of the current API resource object. It is mainly used in forms to create and edit views.
ArrayTableInput
It allows multiple data entries as arrays in tabular format. Supports adding new data, deleting and updating data.
AutoCompleteInput
Allows selection of value or values from searchable options. Supports multiple selections and references. Allows searching for linked resources from your API service.
AvatarInput
It facilitates the creation of a user's profile picture with cutting and shrinking options.
BooleanInput
When a value is sent to a boolean input type as boolean or 0/1, the input is displayed as a toggle button.
CheckListInput
It enables the creation together of checkbox input components grouped under each other at the first level. Features such as the toggle feature, the ability to select all entries with a higher checkbox, and searching within the list are supported by default.
ColorPickerInput
It creates the component that makes it easy to select HEX color codes.
CurrencyInput
It displays the currency sent to it according to the desired format using the vue-currency-input component.
DateInput
It is used to edit the date type value. Vuetify consists of a read-only text field associated with the date picker. It does not support time value, use classic VaTextInput for this case.
FileInput
Allows single line file uploads. Single or multi uploads are supported simultaneously. Use VaFileField or VaImageField with this element to show a preview of uploaded files.
NumberInput
Optimized for number editing. Supports min, max and step features.
PasswordInput
Used for password fields. There is show/hide behavior for the current input.
RadioGroupInput
Bir seçim listesinden değer seçmenizi sağlar. Referansları destekler. Hiçbir seçenek yoksa, varsayılan olarak, src/I18n/locales/tr.json dosyasından kaynak içeren yerelleştirilmiş listeleri alabilir.
Lets you select values from a selection list. Supports references. If no options are available, by default it can retrieve localized lists containing resources from src/I18n/locales/tr.json.
RatingInput
Edit the number value as rating stars. If half increments are enabled, the value must be a valid integer or decimal number. Icons can be edited via $ratingFull, $ratingEmpty and $ratingHalf in Vuetify settings.
RichTextInput
Create a WYSIWYG HTML editor using Trix.
TinyMceInput
Create a WYSIWYG HTML editor using Tinc MCE GPL license.
]
SelectInput
Lets you select a value or values from a selection list. Supports multiple selections and references. If no options are available, by default it can retrieve localized lists containing resources from src/I18n/locales/en.json.
SheetInput
It is the input component that allows you to read large amounts of Excel data and add it to the database in CLI mode. To save the imported data, it should be used with a sheet saving template that you have created yourself.
TextInput
Edits text for text value type via basic text input. Supports textarea mode for long texts via multi-line support. Can be used for any date, datetime or time arrangement; Use date, datetime-local, or time-based type. Processing will depend on browser support.
Others
Components that do not meet all 3 items above are listed here under "Others".
LanguageSwitcher
The LanguageSwitcher component allows the user to specify the default language value.
