Muitos dos componentes do ListPanel são tão complexos quanto um pequeno aplicativo. Eles permitem que o usuário adicione, edite e exclua itens, realize pesquisas facetadas, navegue por listas paginadas e muito mais.
Os ListPanels mais complexos fornecem uma classe helper para configurá-los e exibi-los na página.
Cada ListPanel estende a classe base, define props configuráveis como propriedades públicas e implementa um método getConfig()
que compila todas as props necessárias em um array associativo.
namespace PKP\components\listPanels;
class PKPAnnouncementsListPanel extends ListPanel {
/** @var string URL para o endpoint da API onde os itens podem ser recuperados */
public $apiUrl = '';
/** @var int quantos itens exibir em uma página nesta lista */
public $count = 30;
/**
* @copydoc ListPanel::getConfig()
*/
public function getConfig() {
\AppLocale::requireComponents(LOCALE_COMPONENT_PKP_MANAGER);
\AppLocale::requireComponents(LOCALE_COMPONENT_APP_MANAGER);
// Chama ListPanel::getConfig() para compilar props comuns
$config = parent::getConfig();
// Atribui props que foram configuradas para este objeto
$config['apiUrl'] = $this->apiUrl;
$config['count'] = $this->count;
// Atribui props necessárias que não precisam ser configuradas,
// como strings traduzidas
$config['addAnnouncementLabel'] = __('grid.action.addAnnouncement');
$config['deleteAnnouncementLabel'] = __('manager.announcements.deleteAnnouncement');
return $config;
}
}
Os props necessários para cada ListPanel estão documentados na Biblioteca de UI.
Em um PageHandler
, crie uma nova instância do ListPanel e passe as props de configuração.
$listPanel = new \PKP\components\listPanels\PKPAnnouncementsListPanel(
'announcementsListPanel',
__('announcement.announcements'),
[
'apiUrl' => $request->getDispatcher()->url(...),
'count' => 20,
]
);
Então chame o método getConfig()
e passe as props para o TemplateManager
como state.
$templateMgr = TemplateManager::getManager($request);
$templateMgr->setState([
'components' => [
$listPanel->id => $listPanel->getConfig(),
],
]);
Partes da interface do usuário na aplicaçãos do PKP ainda não foram convertidas para a biblioteca de interface do usuário. Saiba mais sobre esses controllers na próxima seção.