KoolReport's Forum

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

Dashboard fields vs Koolreport columns #2795

Closed GHSix opened this topic on on Aug 16, 2022 - 12 comments

GHSix commented on Aug 16, 2022

What is the equivalent of Dashboard protected function fields(){...} formating content in Koolreport ->columns([...])?

Currency::create('val')
                ->label('Value')
                ->BRL()
                ->symbol()
                ->decimals(2)

In other words, how to use Currency class inside columns to format values, if possible?

KoolReport commented on Aug 16, 2022

Could you please further explain? I have not fully understood.

GHSix commented on Aug 16, 2022

On dashboard, if I want formatted fields, for example, date and money, I'll do like:

...
protected function fields()
    {
        return [
            DateTime::create('dt')->displayFormat('m/y'),
            Currency::create('val')
                ->label('Value')
                ->BRL()
                ->symbol()
                ->decimals(2)
        ];
    }

On pure KR style inside dashboard, how do I do the same formatting? I have tried this, but can't get it to work:

...
                   ->dataSource(...->run())
                    ->columns([
                        'dt' => ['type' => 'string'],
                        'val' => ['type' => 'number', 'formatValue'=>function($value, $row){
                            return Currency::create($value)
                                ->label('Value')
                                ->BRL()
                                ->symbol()
                                ->decimals(2);
                        }]
                    ])

Is it possible to pass DataTime and Currency classes to formatValue or column to get the same formatting as in fields function?

The reason I'm at it now is because I was tring hard to not mix pure KR into dashboard but I guess I'm givin it up.

KoolReport commented on Aug 16, 2022

I see, you do:

->columns([
    'dt' => ['type' => 'string'],
    'val' => ['type' => 'number',"decimals"=>2, "prefix"=>"BRL","label"=>"Value"]
])

Beside prefix the column option has suffix as well.

GHSix commented on Aug 16, 2022

It will not render the same result. It will render R$1,234,567.00 and Currency will render R$1.234.567,00 (different pontuation format).

I guess I can use formatValue and money_format to get what I want, I was just thinking that if it was possible to directly use dashboard formatting classes it would be easyer.

KoolReport commented on Aug 16, 2022

I get it, you do this:

'val' => [
        "label"=>"Value",
        'type' => 'number',
        "decimals"=>2, 
        "prefix"=>'R$',
        "thousandSeparator"=>".",
        "decimalPoint"=>",",
]
GHSix commented on Aug 16, 2022

I see.

There are docs for this? I will need to format dates as well.

GHSix commented on Aug 16, 2022

I did like:

->columns([
        'dt' => [
                'formatValue' => function($val) {
                        return (new \DateTime($val))->format('m/Y');
                }
        ],
        'val' => [...]
])

It did work for Google Charts but, for D3 it will keep showing dates as "31/12/2022 00:00:00". Why?

KoolReport commented on Aug 17, 2022

You try this:

        'dt' => [
            "type"=>"datetime",
            "format"=>"Y-m-d H:i:s",
            "displayFormat"=>"m/Y",
        ],

Let me know if it works.

GHSix commented on Aug 17, 2022

No.

But it changed the display from "2022-12-31 00:00:00" to "2022/31/12" and just "31/12" for the 2nd result and on when it's more than 4 results.

GHSix commented on Sep 23, 2022

Any news on the right way to format dates on D3 charts?

GHSix commented on Oct 7, 2022

I have found how to correctly format dates on D3 charts.

protected function onInit()
    {
        $this->height('240px')
        ->options([
            'axis' => [
                'x' => [
                    'type' => 'timeseries',
                    'tick' => [
                        'format' => '%m/%Y'  // <- This one will format dates on the chart
                    ]
                ]
            ]
        ]);
    }

protected function fields()
    {
        return [
            DateTime::create('dt')
                ->displayFormat('m/Y'),  // <- This will format dates only on "exported Details table"
            ...

In other words, looks like Koolreport Dashboard is not passing displayFormat value to C3Js chart options, so we need to do that ourselves. It was a pain to do, but it's a one time only proccess and now it works. The good thing here is that we can have two distinct formats, one for the table data (displayFormat) and other to the chart data (tick/format), if needed.

Anyways, I hope to see displayFormat been forwarded to the chat options in a future version.

KoolReport commented on Oct 8, 2022

That's great to hear that you have found the way. I will forward your information to dev.team.

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