Menu Close

Youless tile for Laravel Dashboard

I am using Laravel Dashboard from www.spatie.be. Check out their solution and how to install and use different tiles at this link or read the complete story about how this Dashboard was evolved at this link

Youless LS120 Energy Meter

I have a Youless LS120 energy monitor and I want to see actual energy usage on my dashboard. I decided to create my own tile and it ended up in creating my first composer package ever.

This is how it looks like:

It shows you the actual energy being consumed at the meter. This can also be a negative value when you produce enough energy with your solarpanels.

If you click on the showed value in the tile you will be routed to a statistics page that looks like this:

Youless Tile Detail view

Touching anywhere on the screen will bring you back to the main dashboard or just wait 60 seconds and it will go back automatically. That way you always go back to your main dashboard.

Installation

To install the package to your Laravel-Dashboard use composer:

composer require xibel/laravel-dashboard-youless-tile

Configure

In the \config\dashboard.php config file, you must add this configuration in the tiles key:

return [
    // ...
    'tiles' => [
        'youless' => [
            'url' => env('YOULESS_URL'),
            'refresh_interval_in_seconds' => 10,
        ],
    ],
];

In app\Console\Kernel.php you should schedule the xibel\YoulessTile\Commands\FetchDataFromYoulessCommand to run every 1 minute.

protected function schedule(Schedule $schedule)
{
    // Youless tile
        $schedule->command(\xibel\YoulessTile\Commands\FetchDataFromYoulessCommand::class)->everyMinute();

}

To fetch data from your Youless at lease once, run ‘php artisan schedule:run’. Use a tool like supervisor to keep the scheduler running.

In the .env file, you must add the ‘YOULESS_URL’ key and provide your Youless IP address or hostname:

YOULESS_URL=x.x.x.x

In your dashboard view you use the livewire:youless-summary-tile component.

<x-dashboard>
    <livewire:youless-tile position="a1" />
</x-dashboard>

Contribute

To contribute please check out the Github repo here.

(Packagist link)

Leave a Reply

Your email address will not be published. Required fields are marked *