• Create a page
  • Add page to application
  • Page property
• Menu system
  • sidebar
  • topMenu
  • accountMenu
• Page actions
• Page access control
• Dashboard Wrapper
• Events

Page

An Application can have more than one page. And each page can have its own menu system and list of dashboards. Image you have a public page for everyone and a member page for login user to access dashboards inside.

Create a page #

In order to create standard page, you just need to make new class derived from koolreport\dashboard\pages\Main page

use koolreport\dashboard\pages\Main;
use koolreport\dashboard\menu\Section;
use koolreport\dashboard\menu\Group;
use koolreport\dashboard\menu\MenuItem;

class MemberPage extends Main
{
    protected function sidebar()
    {
        //Provide list of dashboards on sidebar
        return [
            "Sale Report"=>SaleReport::create(),
            "Human Resource"=>HumanResource::create(),
            "Menu Item"=>MenuItem::create()->onClick("alert(1)"),
            "Section 1"=>Section::create()->sub([
                "Group 11"=>Group::create()->sub([
                    "Dashboard 111"=>Dashboard111::create(),
                    "Dashboard 112"=>Dashboard112::create(),
                ]),
                "Group 12"=>Group::create()->sub([
                    "Dashboard 121"=>Dashboard121::create(),
                    "Dashboard 122"=>Dashboard122::create(),
                ]),
            ]),
            "Section 2"=>Section::create()->sub([
                "Group 11"=>Group::create()->sub([
                    "Dashboard 211"=>Dashboard211::create(),
                    "Dashboard 212"=>Dashboard212::create(),
                ]),
                "Group 12"=>Group::create()->sub([
                    "Dashboard 221"=>Dashboard221::create(),
                    "Dashboard 222"=>Dashboard222::create(),
                ]),
            ])
        ];
    }
}

Add page to application #

Pages after created can be added to pages list of application:

class App extends Application
{
    ...
    protected function pages()
    {
        return [
            PublicPage::create(),
            MemberPage::create(),
        ];
    }
    ...
}

Page property #

__Example:

class App extends Application
{
    ...
    protected function pages()
    {
        return [
            PublicPage::create()->default(true),
            MemberPage::create()->loginRequired(true),
        ];
    }
    ...
}

Menu system #

Standard page derived from Main is provided with sidebar, topMenu and accountMenu.

sidebar #

Sidebar is the main menu of the right hand side of the page which is capable of holding list of dashboards.

class MyPage extends Main
{
    protected function sidebar()
    {
        return [
            "Home"=>HomeDashboard::create(),
            "Marketing"=>Section::create()->sub([
                "Register"=>RegisterDashboard::create(),
                "Churn Rate"=>ChurnRate::create(),
            ])
        ];
    }
}

If sidebar is not provided then page will take default sidebar from Application.

topMenu #

Top menu is the menu on top of page.

class MyPage extends Main
{
    protected function topMenu()
    {
        return [
            "Simple link"=>MenuItem::create()
                ->href("https://www.anywebsite.com")
                ->target("_blank"),

            "With Icon and Badge"=>MenuItem::create()
                ->href("https://www.example.com")
                ->icon("fa fa-book")
                ->badge(["NEW","danger"]),
            
            "Execute javascript"=>MenuItem::create()
                ->onClick("alert('hola')"),
            
            "Load Dashboard"=>MenuItem::create()
                ->onClick(Client::dashboard("SaleBoard")->load()),

            "Mega Menu"=>MegaMenu::create()->sub([
                "Group 1"=>Group::create()->sub([
                    "Item 11"=>MenuItem::create(),
                    "Item 12"=>MenuItem::create(),
                ]),
                "Group 2"=>Group::create()->sub([
                    "Item 21"=>MenuItem::create(),
                    "Item 22"=>MenuItem::create(),
                ]),
            ])            

            "Disabled Item"=>MenuItem::create()->disabled(true),
        ];
    }
}

If topMenu is not provided then page will take default topMenu from Application

accountMenu #

Account menu is the menu on top of page sticked with user avatar. Account menu is only shown when user is login.

class MyPage extends Main
{
    protected function accountMenu()
    {
        return [
            "Simple link"=>MenuItem::create()
                ->href("https://www.anywebsite.com")
                ->target("_blank"),

            "With Icon and Badge"=>MenuItem::create()
                ->href("https://www.example.com")
                ->icon("fa fa-book")
                ->badge(["NEW","danger"]),
            
            "Execute javascript"=>MenuItem::create()
                ->onClick("alert('hola')"),
            
            "Load Dashboard"=>MenuItem::create()
                ->onClick(Client::dashboard("SaleBoard")->load()),

            "Disabled Item"=>MenuItem::create()->disabled(true),
            
            "Logout"=>MenuItem::create()
                ->onClick(Client::logout()),
        ];
    }
}

If accountMenu is not provided then page will take default accountMenu from Application

Page actions #

Page is supported server-side action, you can create any custom action of your own

class MyPage extends Main
{
    protected function actionMyAction($request, $response)
    {
        ...
        $value = $request->params("key");
        ...
    }
}

To call the action from client-side, you can use the Client helper like following

Button::create()->onClick(
    Client::page()->action("myAction",["key"=>"value"]);
);

Page access control #

Page provided the property loginRequired which is good to prohibit unauthenticated users. However, if you need more advanced user accessing control to page, you use the allowAccess() method:

<?php
use koolreport\dashboard\pages\Main;

class MyPage extends Main
{
    protected function allowAccess($request)
    {
        //For example, the page is for admin only
        return $request->user()->hasRole("admin");
    }
}

Dashboard Wrapper #

Wrapper is a specical page that will take only one Dashboard as its content. Wrapper does not support menu system as Main does but it allows you to create a clean and fresh page content with the help of dashboard.

<?php
//App.php
use koolreport\dashboard\Application;
use koolreport\dashboard\pages\Wrapper;

class App extends Application
{
    protected function pages()
    {
        return [
            PublicPage::create()->default(true),
            "WrapperPage"=>Wrapper::create()
                            ->wrapDashboard(AnyDashboard::create())
                            ->loginRequired(true),
        ];
    }
}

<?php
//AnyDashboard.php
use koolreport\dashboard\Dashboard;
use koolreport\dashboard\containers\Html;

class AnyDashboard extends Dashboard
{
    protected function content()
    {
        return [
            Html::h1("Your title"),
            Html::p("Any content is allowed")
        ];
    }
}

Events #

Page emits events during its process and we can catch those events to customize how page behaves.

Learn more about Page's events