[comment]: # translation:outdated

[comment]: # aside:1

[comment]: # ({b311df1e-8fe7205c})
# Maak een module (handleiding)

[comment]: # ({/b311df1e-8fe7205c})

[comment]: # ({98067368-5fb5b83a})
Dit is een stapsgewijze handleiding die laat zien hoe je een eenvoudige Zabbix-frontendmodule kunt maken.
Je kunt alle bestanden van deze module downloaden als een ZIP-archief: [MyAddress.zip](../../../../assets/en/devel/modules/examples/MyAddress.zip).

[comment]: # ({/98067368-5fb5b83a})

[comment]: # ({5fe8674d-5ce71b9d})
### Wat je gaat bouwen

Tijdens deze tutorial ga je eerst een frontend-module bouwen die een nieuwe sectie *Mijn Adres* aan het menu toevoegt.
Vervolgens zul je het converteren naar een [geavanceerdere](#deel-iii---module-actie) frontend-module die een HTTP-verzoek maakt naar *https://api.seeip.org*
en het antwoord weergeeft - het IP-adres van je computer - op een nieuwe pagina in de zojuist gecreëerde *Mijn Adres* menu sectie.
Zo ziet de afgewerkte module eruit:

![](../../../../assets/en/devel/modules/tutorials/module/my_address_finished.png){width="600"}

[comment]: # ({/5fe8674d-5ce71b9d})

[comment]: # ({a5c86d2c-8c2bcd9e})
### Deel I - Nieuw menugedeelte

[comment]: # ({/a5c86d2c-8c2bcd9e})

[comment]: # ({ee8779d6-1d4de634})
##### Voeg een lege module toe aan de Zabbix-frontend

1. Maak een directory genaamd *MyAddress* in *zabbix/ui/modules*.

2. Maak een bestand genaamd *manifest.json* aan met de basisgegevens van de module (zie de beschrijving van ondersteunde [parameters](../file_structure/manifest)).

**ui/modules/MyAddress/manifest.json**

```json
{
    "manifest_version": 2.0,
    "id": "my-address",
    "name": "Mijn IP-adres",
    "version": "1.0",
    "namespace": "MyAddress",
    "description": "Mijn Externe IP-adres"
}
```

3. Ga in de Zabbix-frontend naar de sectie *Beheer → Algemeen → Modules* en klik op de knop *Map scannen*.

![](../../../../assets/en/devel/modules/tutorials/widget/scan_dir.png)

4. Zoek de nieuwe module *Mijn IP-adres* in de lijst en klik op de hyperlink "Uitgeschakeld" om de status van de module te wijzigen van "Uitgeschakeld" naar "Ingeschakeld".

![](../../../../assets/en/devel/modules/tutorials/module/module_register.png){width="600"}

De module is nu geregistreerd in de frontend. Hij is echter nog niet zichtbaar, omdat je nog steeds de functionaliteit van de module moet definiëren.
Zodra je inhoud aan de modulemap toevoegt, zul je onmiddellijk de wijzigingen zien in de Zabbix-frontend wanneer je de pagina vernieuwt.

[comment]: # ({/ee8779d6-1d4de634})

[comment]: # ({64c4a481-d88b8114})
##### Creëer een menusectie

1. Maak een bestand genaamd *Module.php* aan in de *MyAddress*-map.

Dit bestand implementeert een nieuwe *Module*-klasse die de standaard *CModule*-klasse uitbreidt.
De *Module*-klasse zal een nieuwe *Mijn Adres* menusectie toevoegen aan het hoofdmenu.

De methode *setAction()* geeft een actie aan die wordt uitgevoerd wanneer er op de menusectie wordt geklikt.
Je kunt in eerste instantie de vooraf gedefinieerde actie *userprofile.edit* gebruiken, die de pagina *Gebruikersprofiel* opent.
In [deel III](#deel-iii---module-actie) van deze tutorial leer je hoe je een aangepaste actie kunt maken.

**ui/modules/MyAddress/Module.php**

```php
<?php

namespace Modules\MyAddress;

use Zabbix\Core\CModule,
    APP,
    CMenuItem;

class Module extends CModule {

    public function init(): void {
        APP::Component()->get('menu.main')
            ->add((new CMenuItem(_('Mijn Adres')))
            ->setAction('userprofile.edit'));
    }
}
```

:::noteclassic
Je kunt `'userprofile.edit'` vervangen door andere acties, bijvoorbeeld `'charts.view'` (opent aangepaste grafieken), `'problems.view'` (opent *Monitoring → Problemen*) of `'report.status'` (opent rapport over *Systeeminformatie*).
:::

3. Vernieuw de Zabbix-frontend. Er is nu een nieuwe *Mijn Adres* sectie onderaan het hoofdmenu van Zabbix.
Klik op *Mijn Adres* om de pagina *Gebruikersprofiel* te openen.

![](../../../../assets/en/devel/modules/tutorials/module/my_address_top_menu.png){width="600"}

[comment]: # ({/64c4a481-d88b8114})

[comment]: # ({b57cc7d5-5c3fc480})
### Deel II - Verandering van locatie menusectie

In dit deel verplaats je de menusectie *Mijn Adres* naar de sectie *Monitoring*.
Hierdoor kunnen gebruikers toegang krijgen tot twee submenupagina's vanuit de *Monitoring → Mijn Adres* menusectie.

1. Open en bewerk het bestand *Module.php*.

**ui/modules/MyAddress/Module.php**

```php
<?php

namespace Modules\MyAddress;

use Zabbix\Core\CModule,
    APP,
    CMenuItem;

class Module extends CModule {

    public function init(): void {
        APP::Component()->get('menu.main')
            ->findOrAdd(_('Monitoring'))
                ->getSubmenu()
                    ->insertAfter(_('Ontdekking'),
                        (new CMenuItem(_('Mijn Adres')))->setAction('userprofile.edit')
                    );
    }
}
```

2. Vernieuw de Zabbix-frontend. Vouw de sectie *Monitoring* uit en merk op dat de sectie *Mijn Adres* zich nu onder de sectie *Ontdekking* bevindt.

![](../../../../assets/en/devel/modules/tutorials/module/my_address_monitoring.png){width="600"}

[comment]: # ({/b57cc7d5-5c3fc480})

[comment]: # ({e124bf8f-8798eff6})
### Deel III - Module actie

Een actie wordt geïmplementeerd in twee bestanden - *actions/MyAddress.php* en *views/my.address.php*.
Het bestand ***actions/MyAddress.php*** zorgt voor de implementatie van de business logica, terwijl het bestand ***views/my.address.php*** verantwoordelijk is voor de weergave.

1. Maak een map genaamd *actions* in de *MyAddress*-map.

2. Maak een bestand genaamd *MyAddress.php* in de *actions*-map.

De logica van de actie wordt gedefinieerd in de klasse *MyAddress*.
Deze actieklasse zal vier functies implementeren: *init()*, *checkInput()*, *checkPermissions()* en *doAction()*.
De *doAction()*-functie wordt aangeroepen door de Zabbix-frontend wanneer de actie wordt aangevraagd.
Deze functie is verantwoordelijk voor de business logica van de module.

::: noteclassic
De data moet georganiseerd zijn als een associatieve array.
De array kan meerdere dimensies hebben en kan elke data bevatten die de view verwacht.
:::

**ui/modules/MyAddress/actions/MyAddress.php**

```php
<?php

namespace Modules\MyAddress\Actions;

use CController,
    CControllerResponseData;

class MyAddress extends CController {

    public function init(): void {
        $this->disableCsrfValidation();
    }

    protected function checkInput(): bool {
        return true;
    }

    protected function checkPermissions(): bool {
        return true;
    }

    protected function doAction(): void {
        $data = ['my-ip' => file_get_contents("https://api.seeip.org")];
        $response = new CControllerResponseData($data);
        $this->setResponse($response);
    }
}
```

3. Maak een nieuwe map genaamd *views* in de *MyAddress*-map.

4. Maak een bestand genaamd *my.address.php* in de *views*-map en definieer de weergave van de module.

Merk op dat de variabele `$data` beschikbaar is in de view zonder deze expliciet te definiëren.
Het framework geeft automatisch de associatieve array door aan de view.

**ui/modules/MyAddress/views/my.address.php**

```php
<?php

(new CHtmlPage())
    ->setTitle(_('De HTML-titel van mijn adrespagina'))
    ->addItem(new CDiv($data['my-ip']))
    ->show();
```

5. De module-actie moet worden geregistreerd in het *manifest.json*-bestand. Open *manifest.json* en voeg een nieuw object `actions` toe dat het volgende bevat:

-   de actiesleutel met de naam van de actie in kleine letters (a-z) en met punten gescheiden woorden (bijvoorbeeld `my.address`);
-   de naam van de actieklasse (`MyAddress`) als waarde voor de sleutel `class` van het object `my.address`;
-   de naam van de actieweergave (`my.address`) als waarde voor de sleutel `view` van het object `my.address`.

**ui/modules/MyAddress/manifest.json**

```json
{
    "manifest_version": 2.0,
    "id": "my-address",
    "name": "My IP Address",
    "version": "1.0",
    "namespace": "MyAddress",
    "description": "My External IP Address",
    "actions": {
        "my.address": {
            "class": "MyAddress",
            "view": "my.address"
        }
    }
}
```

6. Open *Module.php* en verander de naam van de actie in de **setAction()**-methode naar *my.address*.

**ui/modules/MyAddress/Module.php**

```php
<?php

namespace Modules\MyAddress;

use Zabbix\Core\CModule,
    APP,
    CMenuItem;

class Module extends CModule {

    public function init(): void {
        APP::Component()->get('menu.main')
            ->findOrAdd(_('Monitoring'))
                ->getSubmenu()
                    ->insertAfter(_('Discovery'),
                        (new CMenuItem(_('My Address')))->setAction('my.address')
                    );
    }
}
```

7. Vernieuw de Zabbix-frontend. Klik op de menusectie *Mijn Adres* om het IP-adres van je computer te zien.

![](../../../../assets/en/devel/modules/tutorials/module/my_address_finished.png){width="600"}

[comment]: # ({/e124bf8f-8798eff6})