8. diel - Jednoduchý redakčný systém v Nette - Dokončenie administrácia

V minulej lekcii, Jednoduchý redakčný systém v Nette - Administrácia , sme rozpracovali administráciu článkov. Dnes ju spolu s kontaktným formulárom dokončíme.

Presenter

Začneme dokončením Presenter z minula.

App / CoreModule / presenters / ContactPresen­ter.php

Pridáme tak ešte jeden presenter pre kontaktný formulár:

<?php

namespace App\CoreModule\Presenters;

use App\Presenters\BasePresenter;
use Nette\Application\UI\Form;
use Nette\Mail\IMailer;
use Nette\Mail\Message;
use Nette\Mail\SendException;
use Nette\Utils\ArrayHash;

/**
 * Presenter pro kontaktní formulář.
 * @package App\CoreModule\Presenters
 */
class ContactPresenter extends BasePresenter
{
    /** @var string Kontaktní email, na který se budou posílat emaily z kontaktního formuláře. */
    private $contactEmail;

    /** @var IMailer Služba Nette pro odesílání emailů. */
    private $mailer;

    /**
     * Konstruktor s nastavením kontaktního emailu a injektovanou Nette službou pro odesílání emailů.
     * @param string  $contactEmail kontaktní email
     * @param IMailer $mailer       automaticky injektovaná Nette služba pro odesílání emailů
     */
    public function __construct($contactEmail, IMailer $mailer)
    {
        parent::__construct();
        $this->contactEmail = $contactEmail;
        $this->mailer = $mailer;
    }

    /**
     * Vytváří a vrací kontaktní formulář.
     * @return Form kontaktní formulář
     */
    protected function createComponentContactForm()
    {
        $form = new Form;
        $form->getElementPrototype()->setAttribute('novalidate', true);
        $form->addEmail('email', 'Vaše emailová adresa')->setRequired();
        $form->addText('y', 'Zadejte aktuální rok')->setOmitted()->setRequired()
            ->addRule(Form::EQUAL, 'Chybně vyplněný antispam.', date("Y"));
        $form->addTextArea('message', 'Zpráva')->setRequired()
            ->addRule(Form::MIN_LENGTH, 'Zpráva musí být minimálně %d znaků dlouhá.', 10);
        $form->addSubmit('send', 'Odeslat');

        // Funkce se vykonaná při úspěšném odeslání kontaktního formuláře a odešle email.
        $form->onSuccess[] = function (Form $form, ArrayHash $values) {
            try {
                $mail = new Message;
                $mail->setFrom($values->email)
                    ->addTo($this->contactEmail)
                    ->setSubject('Email z webu')
                    ->setBody($values->message);
                $this->mailer->send($mail);
                $this->flashMessage('Email byl úspěšně odeslán.');
                $this->redirect('this');
            } catch (SendException $e) {
                $this->flashMessage('Email se nepodařilo odeslat.');
            }
        };

        return $form;
    }
}

Tu si všimnite predovšetkým použitie Nette knižnice pre odosielanie emailov z formulára.

App / CoreModule / config / config.neon

Ďalej nesmieme zabudnúť odovzdať konfiguráciu kontaktného emailu do nášho nového prezentačného:

#
# Konfigurační soubor pro CoreModule.
#
parameters:
    defaultArticleUrl: 'uvod'          # URL výhozího článku
    contactEmail: '[email protected]' # Kontaktní email


# Nastavení služeb pro CoreModule.
services:
    # Definice vlastních služeb dále přístupných pomocí DI.
    - App\CoreModule\Model\ArticleManager

    # Předání nastavení při vytváření služeb presenterů.
    - App\CoreModule\Presenters\ArticlePresenter(%defaultArticleUrl%)
    - App\CoreModule\Presenters\ContactPresenter(%contactEmail%)

App / config / config.neon

Ak ste pozorne čítali kód, všimli ste si, že u tvorby formulárov v metóde setRequired() nie je vyplnená chybová hláška. To je z toho dôvodu, že nám bude stačiť všade rovnaká a tú si globálne nastavíme v hlavnom konfiguračnom súbore pripísaním nasledujúcich riadkov:

...
# Nastavení výchozích chybových hlášek pro formuláře.
forms:
    messages:
        REQUIRED: 'Povinné pole.'
        EMAIL: 'Neplatná emailová adresa.'
...

App / router / RouterFactory.php

Nakoniec musíme opäť upraviť routovanie, aby naše aplikácie brala do úvahy nové Presenter a ich akcie. Ukážeme si tu tiež rovno príklad preklade slovenských URL adries na anglické názvy podujatí:

<?php

namespace App;

use Nette\Application\IRouter;
use Nette\Application\Routers\Route;
use Nette\Application\Routers\RouteList;
use Nette\StaticClass;

/**
 * Továrna na routovací pravidla.
 * Řídí směrování a generovaní URL adres v celé aplikaci.
 * @package App
 */
class RouterFactory
{
    use StaticClass;

    /**
     * Vytváří a vrací seznam routovacích pravidel pro aplikaci.
     * @return IRouter výsledný router pro aplikaci
     */
    public static function createRouter()
    {
        $router = new RouteList;
        $router[] = new Route('kontakt', 'Core:Contact:default');
        $router[] = new Route('administrace', 'Core:Administration:default');
        $router[] = new Route('<action>[/<url>]', [
            'presenter' => 'Core:Article',
            'action' => [
                Route::FILTER_STRICT => true,
                Route::FILTER_TABLE => [
                    // řetězec v URL => akce presenteru
                    'seznam-clanku' => 'list',
                    'editor' => 'editor',
                    'odstranit' => 'remove'
                ]
            ]
        ]);
        $router[] = new Route('[<url>]', 'Core:Article:default');
        return $router;
    }
}

Ak sa čudujete, prečo majú niektoré Presenter svojou vlastnou route, tak je to z toho dôvodu, že potrebujeme rozlíšiť medzi URL článku a názvom prezentačného, pretože obe majú rovnaký tvar - /presenter vs. /url. V tomto prípade teda vždy dostane prednosť názov prezentačného pred vykreslením URL článku.

Šablóny

Teraz sa môžeme pozrieť zase na šablóny (templates).

App/templates/@la­yout.latte

Tu len doplníme odkazy na jednotlivé Presenter a ich akcie pomocou Latte makier a pridáme odkaz na administračné rozhranie do pätičky. Nebudem sem vypisovať už znovu celú šablónu, iba vykonané zmeny:

...
<ul>
    <li><a n:href=:Core:Article:>Úvod</a></li>
    <li><a n:href=:Core:Article:list>Seznam článků</a></li>
    <li><a n:href=:Core:Contact:>Kontakt</a></li>
</ul>
...
<footer>
    <p>
        Ukázkový tutoriál pro jednoduchý redakční systém v Nette z programátorské sociální sítě
        <a href="http://www.itnetwork.cz" target="_blank">itnetwork.cz</a>.
        <a n:href=:Core:Administration:>Administrace</a>
    </p>
</footer>
...

App / CoreModule / templates / Article / list.latte

Pridáme si šablónu pre výpis zoznamu článkov:

{block title}Výpis článků{/block}
{block description}Výpis všech článků.{/block}
{block content}
<table>
    <tr n:foreach="$articles as $article">
        <td>
            <h2><a n:href="Article: $article->url">{$article->title}</a></h2>
            {$article->description}
            <br>
            <a n:href="editor $article->url">Editovat</a>
            <a n:href="remove $article->url">Odstranit</a>
        </td>
    </tr>
</table>

App / CoreModule / templates / Article / editor.latte

Ďalej pridáme šablónu pre editor článkov. Tu si všimnite ako jednoducho sme zariadili vykreslenie formulára a tiež spôsobu pridávanie ďalších JavaScript knižníc:

{block title}Editor{/block}
{block description}Editor článků.{/block}
{block content}
    {* Formulář pro editaci. *}
    {control editorForm}
{/block}

{block scripts}
    {include parent}
    <script type="text/javascript" src="//cdn.tinymce.com/4/tinymce.min.js"></script>
    <script type="text/javascript">
        tinymce.init({
            selector: 'textarea[name=content]',
            plugins: [
                'advlist autolink lists link image charmap print preview anchor',
                'searchreplace visualblocks code fullscreen',
                'insertdatetime media table contextmenu paste'
            ],
            toolbar: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
            entities: '160,nbsp',
            entity_encoding: 'raw'
        });
    </script>
{/block}

App / CoreModule / templates / Administration / default.latte

Nasleduje šablóna pre administračné rozhranie:

{block title}Administrace webu{/block}
{block description}Administrace webu.{/block}
{block content}
<p>Vítejte v administraci!</p>
<h2><a n:href=Article:editor>Editor článků</a></h2>
<h2><a n:href=Article:list>Seznam článků</a></h2>

App / CoreModule / templates / Contact / default.latte

A na záver šablóna pre stránku s kontaktným formulárom:

{block title}Kontaktní formulář{/block}
{block description}Kontaktní formulář.{/block}
{block content}
<p>Kontaktujte nás odesláním formuláře níže.</p>
{* Formulář pro kontakt. *}
{control contactForm}

Gratulujem, práve vám beží jednoduché administračné rozhranie pre články v Nette s kontaktným formulárom ako bonus.

Teraz v rámci kurzu budeme pokračovať v rozširovaní administrácie a začneme sa venovať zabezpečenia nášho webu, čo by malo vyústiť v plne funkčný prihlasovanie a registráciu užívateľov s definíciou ich práv, takže sa určite máte na čo tešiť Konkrétne v nasledujúcej lekcii, Jednoduchý redakčný systém v Nette - Model užívateľov , začneme rozšírením databázy a pridaním modelu užívateľov.

Mal si s čímkoľvek problém? Stiahni si vzorovú aplikáciu nižšie a porovnaj ju so svojím projektom, chybu tak ľahko nájdeš.