[comment]: # aside:1

[comment]: # ({0a11f1a9-f7477fb0})
# Konfigurācija

Šajā lapā ir aprakstītas klases, kuras var izmantot, lai izveidotu logrīka konfigurācijas skatu ar pielāgotiem konfigurācijas laukiem.
Logrīka konfigurācijas skats ir logrīka daļa, kas ļauj lietotājam konfigurēt logrīka parametrus [attēlošanai](/presentation).

[comment]: # ({/0a11f1a9-f7477fb0})

[comment]: # ({68bbd84a-adf59b13})
### Logrīks

Primārā logrīka klase, paplašina visu paneļa logrīku bāzes klasi — *CWidget*.
Nepieciešama, lai pārrakstītu noklusējuma logrīka uzvedību.

Klasei *Widget* jāatrodas logrīka saknes direktorijā (piemēram, *zabbix/ui/modules/my_custom_widget*).

**Widget.php piemērs**

```php
<?php

namespace Modules\MyCustomWidget;

use Zabbix\Core\CWidget;

class Widget extends CWidget {

    public const MY_CONSTANT = 0;

    public function getTranslationStrings(): array {
        return [
            'class.widget.js' => [
                'No data' => _('No data')
            ]
        ];
    }
}
```

[comment]: # ({/68bbd84a-adf59b13})

[comment]: # ({e5aad37e-1ff26877})
### WidgetForm

Klase *WidgetForm* paplašina noklusējuma klasi *CWidgetForm* un satur [*CWidgetField*](#cwidgetfield) lauku kopu,
kas ir nepieciešama, lai definētu logrīka konfigurācijas glabāšanas struktūru datubāzē un apstrādātu ievades validāciju.

Klasei *WidgetForm* jāatrodas direktorijā *includes*.
Ja klasei ir cits nosaukums, tas jānorāda parametrā [*widget/form_class*](/devel/modules/file_structure/manifest#widget) failā *manifest.json*.

**includes/WidgetForm.php piemērs**

```php
<?php

namespace Modules\MyCustomWidget\Includes;

use Modules\MyCustomWidget\Widget;

use Zabbix\Widgets\{
    CWidgetField,
    CWidgetForm
};

use Zabbix\Widgets\Fields\{
    CWidgetFieldMultiSelectItem,
    CWidgetFieldTextBox,
    CWidgetFieldColor
};


class WidgetForm extends CWidgetForm {

    public const DEFAULT_COLOR_PALETTE = [
        'FF465C', 'B0AF07', '0EC9AC', '524BBC', 'ED1248', 'D1E754', '2AB5FF', '385CC7', 'EC1594', 'BAE37D',
        '6AC8FF', 'EE2B29', '3CA20D', '6F4BBC', '00A1FF', 'F3601B', '1CAE59', '45CFDB', '894BBC', '6D6D6D'
    ];

    public function addFields(): self {
        return $this
            ->addField(
                (new CWidgetFieldMultiSelectItem('itemid', _('Item')))
                    ->setFlags(CWidgetField::FLAG_NOT_EMPTY | CWidgetField::FLAG_LABEL_ASTERISK)
                    ->setMultiple(false)
            )
            ->addField(
                new CWidgetFieldTextBox('description', _('Description'))
            )
            ->addField(
                (new CWidgetFieldColor('chart_color', _('Color')))->setDefault('FF0000')
            );
    }
}
```

[comment]: # ({/e5aad37e-1ff26877})

[comment]: # ({3ca7a0e4-61f06fc3})
### CWidgetFormView

Klase *CWidgetFormView* ir nepieciešama, lai norādītu klasē *WidgetForm* definēto lauku attēlošanas loģiku,
nosakot to izskatu un darbību, kad tie tiek atveidoti konfigurācijas skatā.

Klase *CWidgetFormView* atbalsta šādas metodes:

-   *addField()* — kā parametru saņem klases *CWidgetFieldView* instanci;
    katrai [*CWidgetField*](#cwidgetfield) klasei ir atbilstoša *CWidgetFieldView* klase izmantošanai logrīka konfigurācijas skatā.
-   *addFieldset()* — kā parametru saņem klases *CWidgetFieldsGroupView* instanci, kas apvieno laukus sakļaujamā konteinerā.
-   *addFieldsGroup()* — kā parametru saņem *CWidgetFormFieldsetCollapsibleView* instanci, kas vizuāli (ar apmali) apvieno laukus grupā.
-   *includeJsFile()* — ļauj pievienot JavaScript failu logrīka konfigurācijas skatam.
-   *addJavaScript()* — ļauj pievienot iekļautu JavaScript, kas tiks izpildīts, tiklīdz logrīka konfigurācijas skats tiks ielādēts.

Klasei *CWidgetFormView* jāatrodas direktorijā *views*.

**views/widget.edit.php piemērs**

```php
<?php

/**
 * Mana pielāgotā logrīka formas skats.
 *
 * @var CView $this
 * @var array $data
 */

use Modules\MyCustomWidget\Includes\WidgetForm;

(new CWidgetFormView($data))
    ->addField(
        (new CWidgetFieldMultiSelectItemView($data['fields']['itemid']))->setPopupParameter('numeric', true)
    )
    ->addFieldset(
        (new CWidgetFormFieldsetCollapsibleView(_('Papildu konfigurācija')))
            ->addField(
                new CWidgetFieldTextBoxView($data['fields']['description'])
            )
            ->addField(
                new CWidgetFieldColorView($data['fields']['chart_color'])
            )
    )
    ->includeJsFile('widget.edit.js.php')
    ->addJavaScript('my_custom_widget_form.init('.json_encode([
        'color_palette' => WidgetForm::DEFAULT_COLOR_PALETTE
    ]).');')
    ->show();
```

[comment]: # ({/3ca7a0e4-61f06fc3})

[comment]: # ({d7c94075-d1c62429})
### JavaScript

JavaScript klase var tikt izmantota, lai logrīka konfigurācijas skatam pievienotu dinamisku darbību un interaktivitāti.
Piemēram, var inicializēt krāsu atlasītāju, kas definēts klasē [*CWidgetFormView*](#cwidgetformview).

JavaScript klase ir jāielādē kopā ar formu, tāpēc uz to jāatsaucas klasē [*CWidgetFormView*](#cwidgetformview), izmantojot metodes *includeJsFile()* un *addJavaScript()*.

Tālāk redzamajā piemērā singleton klases instance tiek nekavējoties izveidota un saglabāta ar nosaukumu *window.my_custom_widget_form*.
Tādējādi, atverot formu otro reizi, instance tiks izveidota no jauna.

JavaScript klasei jāatrodas direktorijā *views*.

**views/widget.edit.js.php piemērs**

```php
<?php

use Modules\MyCustomWidget\Widget;

?>

window.my_custom_widget_form = new class {

    init({color_palette}) {
        colorPalette.setThemeColors(color_palette);

        for (const colorpicker of jQuery('.<?= ZBX_STYLE_COLOR_PICKER ?> input')) {
            jQuery(colorpicker).colorpicker();
        }

        const overlay = overlays_stack.getById('widget_properties');

        for (const event of ['overlay.reload', 'overlay.close']) {
            overlay.$dialogue[0].addEventListener(event, () => { jQuery.colorpicker('hide'); });
        }
    }
};
```

[comment]: # ({/d7c94075-d1c62429})

[comment]: # ({e70cf9fd-708ecb6b})
### CWidgetField

Klase *CWidgetField* ir bāzes klase, no kuras tiek mantotas visas formas lauku klases (*CWidgetFieldCheckBox*, *CWidgetFieldTextArea*, *CWidgetFieldRadioButtonList* u.c.).
Klases, kas paplašina *CWidgetField*, ir atbildīgas par widget konfigurācijas vērtību saņemšanu, saglabāšanu un validēšanu.

Ir pieejamas šādas *CWidgetField* klases.

|CWidgetField class|Database field type|Description|
|----|----|----------|
|*CWidgetFieldCheckBox*|int32|Viena izvēles rūtiņa.|
|*CWidgetFieldCheckBoxList*|array of int32|Vairākas izvēles rūtiņas zem viena konfigurācijas lauka.|
|*CWidgetFieldColor*|string|Krāsas izvēles lauks.|
|*CWidgetFieldDatePicker*|string|Datuma izvēles lauks.|
|*CWidgetFieldIntegerBox*|int32|Lauks vesela skaitļa ievadei. Var izmantot minimālo un maksimālo vērtību konfigurēšanai.|
|*CWidgetFieldLatLng*|string|Teksta lauks, kas ļauj ievadīt ar komatiem atdalītu platumu, garumu un kartes tālummaiņas līmeni.|
|*CWidgetFieldMultiSelect*|-|Bāzes klase vairākatlases laukiem, ko paplašina visas *CWidgetFieldMultiSelect\** klases.|
|*CWidgetFieldMultiSelectAction*|ID|Vairākatlases lauks darbību izvēlei no darbību saraksta, kas definēts sadaļā *Alerts → Actions*.|
|*CWidgetFieldMultiSelectGraph*|ID|Vairākatlases lauks pielāgoto grafiku izvēlei.|
|*CWidgetFieldMultiSelectGraphPrototype*|ID|Vairākatlases lauks pielāgoto grafiku prototipu izvēlei.|
|*CWidgetFieldMultiSelectGroup*|ID|Vairākatlases lauks hostu grupu izvēlei.|
|*CWidgetFieldMultiSelectHost*|ID|Vairākatlases lauks hostu izvēlei.|
|*CWidgetFieldMultiSelectHostInventory*|array of int32|Vairākatlases lauks hosta inventāra lauku izvēlei.|
|*CWidgetFieldMultiSelectItem*|ID|Vairākatlases lauks vienumu izvēlei.|
|*CWidgetFieldMultiSelectItemPrototype*|ID|Vairākatlases lauks vienumu prototipu izvēlei.|
|*CWidgetFieldMultiSelectMap*|ID|Vairākatlases lauks karšu izvēlei.|
|*CWidgetFieldMultiSelectMediaType*|ID|Vairākatlases lauks mediju tipu izvēlei.|
|*CWidgetFieldMultiSelectOverrideHost*|ID|Vairākatlases lauks datu avota izvēlei hostiem no informācijas paneļa vai cita widget.|
|*CWidgetFieldMultiSelectService*|ID|Vairākatlases lauks pakalpojumu izvēlei.|
|*CWidgetFieldMultiSelectSla*|ID|Vairākatlases lauks SLA izvēlei.|
|*CWidgetFieldMultiSelectUser*|ID|Vairākatlases lauks lietotāju izvēlei.|
|*CWidgetFieldNavTree*|array of (multiple mixed)|Saglabā karšu navigācijas koka struktūru izmantošanai widget *Map navigation tree*.|
|*CWidgetFieldNumericBox*|string|Lauks peldošā komata skaitļa ievadei.|
|*CWidgetFieldPatternSelect*|-|Bāzes klase pattern select laukiem, ko paplašina visas *CWidgetPatternSelect\** klases.|
|*CWidgetFieldPatternSelectHost*|string|Vairākatlases lauks hostu izvēlei. Atbalsta hosta nosaukuma paraugus.|
|*CWidgetFieldPatternSelectItem*|string|Vairākatlases lauks vienumu izvēlei. Atbalsta vienuma nosaukuma paraugus.|
|*CWidgetFieldRadioButtonList*|int32|Radio pogu grupa, kas sastāv no vienas vai vairākām radio pogām.|
|*CWidgetFieldRangeControl*|int32|Slīdnis vesela skaitļa vērtības izvēlei.|
|*CWidgetFieldReference*|string|Saglabā unikālu šī widget identifikatoru informācijas panelī; tiek izmantots widget saziņai.|
|*CWidgetFieldSelect*|int32|Nolaižamais izvēles lauks.|
|*CWidgetFieldSeverities*|array of int32|*CWidgetFieldCheckBoxList* ar iepriekš iestatītām trigeru nopietnības pakāpēm.|
|*CWidgetFieldSparkline*|array of (multiple mixed)|Ļauj konfigurēt sparkline diagrammu.|
|*CWidgetFieldTags*|array of (string, int32, string)|Ļauj konfigurēt vienu vai vairākas tagu filtra rindas.|
|*CWidgetFieldTextArea*|string|Teksta apgabals vairākrindu teksta ievadei.|
|*CWidgetFieldTextBox*|string|Teksta lauks vienas rindas teksta ievadei.|
|*CWidgetFieldThresholds*|array of (string, string)|Ļauj konfigurēt krāsu un skaitļu pārus.|
|*CWidgetFieldTimePeriod*|array of string|Laika perioda izvēles lauks.|
|*CWidgetFieldTimeZone*|string|Nolaižamais saraksts ar laika joslām.|
|*CWidgetFieldUrl*|string|Teksta lauks, kas ļauj ievadīt URL.|

::: noteclassic
Maksimālais `int32` lauku garums ir 10 rakstzīmes, `ID` laukiem 20 rakstzīmes, bet `string` laukiem 2048 rakstzīmes.
Saliktiem tipiem (piem., `array of (string, int32, string)`) ierobežojums attiecas uz katru elementu atsevišķi.
Konkrēta lauka garuma ierobežojumus var iestatīt, izmantojot tādas metodes kā `setMaxLength()`.
:::

[comment]: # ({/e70cf9fd-708ecb6b})