KoolReport's Forum

Official Support Area, Q&As, Discussions, Suggestions and Bug reports.
Forum's Guidelines

DateRangePicker custom range and default date #2331

Open Mathieu Viennet opened this topic on on Sep 10 - 3 comments

Mathieu Viennet commented on Sep 10

Hi!

I'm using Dashboard. I would like to create a custom date range with the Date Range Picker :

First day of the current month to Today

So for example we are September 10th : From September 1st to September 10th

1 - Where to put the default Start date and end date?

2 - Where should i put my "custom date function" ?

My SalesDateRange.php looks like this :

<?php

use \koolreport\dashboard\inputs\DateRangePicker;

class SalesDateRange extends DateRangePicker
{
    protected function onCreated()
    {
        $this->defaultValue($this::lastMonth());
    }

    protected function actionChange($request,$response)
    {
        //On client change, update table
        $this->sibling("SalesByDate")->update();
        $this->sibling("SalesTable")->update();
        $this->sibling("SalesNetMetric")->update();
        $this->sibling("SalesGrossMetric")->update();
        $this->sibling("SalesAvgOrderMetric")->update();
        $this->sibling("SalesNumOrderMetric")->update();
        
    }
}

And my board:

<?php

use \koolreport\dashboard\Dashboard;
use \koolreport\dashboard\containers\Row;
use \koolreport\dashboard\containers\Panel;
use \koolreport\dashboard\widgets\Text;
use \koolreport\dashboard\containers\Html;

class SalesBoard extends Dashboard
{
    protected function widgets()
    {
        return [
            Row::create()->sub([
                Row::create(),
                SalesDateRange::create()->width(1/3),
            ]),

           Row::create()->sub([
	            Panel::create()->sub([
                    SalesGrossMetric::create("SalesGrossMetric"),
                ])->width(1/4),
                Panel::create()->sub([
                    SalesNetMetric::create("SalesNetMetric"),
                ])->width(1/4),
                Panel::create()->sub([
                    SalesAvgOrderMetric::create("SalesAvgOrderMetric"),
                ])->width(1/4),
                Panel::create()->sub([
                    SalesNumOrderMetric::create("SalesNumOrderMetric"),
                ])->width(1/4)
            ]),


            Row::create()->sub([
                Panel::create()->sub([
                    SalesByDate::create(),
                ])->width(1/1),
            ]),
			Row::create([
                Panel::create()->width(1/1)
					->sub([ Html::h2("Daily Sales Details") ])
					->cssClass("trans-row")
                ]),
            SalesTable::create(),
        ];
    }
}

Thank you very much for your help!

KoolReport commented on Sep 11

Hi, basically you can do:

    protected function onCreated()
    {
        $this->defaultValue(["2021-09-01 00:00:00","2021-09-10 23:59:59"]);
    }

So you see it is just an array with first value is start date and second is end date. You can do your own calculation to get first day of month and today to feed to default value.

Hope that helps.

Mathieu Viennet commented on Sep 11

Thank you!

Also, if I want to add this date range as a custom selector (like Today, Yesterday, This month), where do i need to put that?

Thank you very much!

KoolReport commented on Sep 11

You use the ranges() function like in documentation.

Examples:

use \koolreport\dashboard\inputs\DateRangePicker;

class MyRangePicker extends DateRangePicker
{
    protected function onInit()
    {
        $this->format("MMM Do, YYYY")
            ->value(["2020-01-01 00:00:00","2020-03-01 00:00:00"])
            ->language("en")
            ->minDate("2020-01-01 00:00:00")
            ->maxDate("2020-04-01 00:00:00")
            ->icon("fa fa-calendar-alt")
            ->caret("fa fa-caret-down")
            ->ranges([
                "Today"=>DateRangePicker::today(),
                "Yesterday"=>DateRangePicker::yesterday(),
                "Last 7 days"=>DateRangePicker::last7days(),
                "Last 30 days"=>DateRangePicker::last30days(),
                "This month"=>DateRangePicker::thisMonth(),
                "Last month"=>DateRangePicker::lastMonth(),
            ]);
    }
}

Build Your Excellent Data Report

Let KoolReport help you to make great reports. It's free & open-source released under MIT license.

Download KoolReport View demo
help needed

Dashboard