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 #

Nametypedefaultdescription
defaultboolfalseWhether this page is the default page. Default page will be loaded if no page is specified to be loaded
loginRequiredboolfalseWhether this page requires user authentication, when is has true value, user will be requuired to login in order to access the page

__Example:

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

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

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.

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

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

Get started with KoolReport

KoolReport will help you to construct good php data report by gathering your data from multiple sources, transforming them into valuable insights, and finally visualizing them in stunning charts and graphs.