F
Filament•3d ago
Señor Nikola

Generating Current View for PDF

Hi, This is kinda part of filament from my point of view that's why i decided to ask here if anyone knows solution. I am trying to develop action from filament, which will generate PDF from current view. So action contains basic stuff 
public function generatePdfAction(): Action
    {
        return Action::make('generatePdfAction')
            ->label('Generate PDF')
            ->extraAttributes(['data-generate-pdf' => true]) 
            ->action(function () {
                
            });
    }
public function generatePdfAction(): Action
    {
        return Action::make('generatePdfAction')
            ->label('Generate PDF')
            ->extraAttributes(['data-generate-pdf' => true]) 
            ->action(function () {
                
            });
    }
And this is my livewire component with js to send current page HTML 
<div>
    {{-- Care about people's approval and you will be their prisoner. --}}
    {!! $this->generatePdfAction()->render() !!}

    @push('scripts')
        <script>
            document.addEventListener('DOMContentLoaded', function () {
                document.querySelector('[data-generate-pdf]').addEventListener('click', function (e) {
                    e.preventDefault(); 

                    const fullHtml = document.documentElement.outerHTML;

                    Livewire.dispatch('generate-pdf', { html: fullHtml });
                });
            });
        </script>
    @endpush
</div>
<div>
    {{-- Care about people's approval and you will be their prisoner. --}}
    {!! $this->generatePdfAction()->render() !!}

    @push('scripts')
        <script>
            document.addEventListener('DOMContentLoaded', function () {
                document.querySelector('[data-generate-pdf]').addEventListener('click', function (e) {
                    e.preventDefault(); 

                    const fullHtml = document.documentElement.outerHTML;

                    Livewire.dispatch('generate-pdf', { html: fullHtml });
                });
            });
        </script>
    @endpush
</div>
And it works, PDF gets generated but issue arises that it is generated for tablet resolution and it is really narrow, any idea how can i get from filament html that is from my viewpoint? Is it possible or am I overeaching ? Btw, I am using spaties laravel pdf package.
3 Replies
Mohamed Ayaou
Mohamed Ayaou•3d ago
if you mean the issue is the sizes of your screen then you might just get it using js window.width or similar js apis and then pass it to the PDF generation library as the file aspects what are the default file size/dimensions for you PDF library?
Señor Nikola
Señor NikolaOP•2d ago
These are my dimensions that i have set up via browsershot if we meant on same thing 
    #[On('generate-pdf')]
    public function generatePdfFromHtml($html)
    {
        $filePath = storage_path('app/pdfs/current-page.pdf');
        
        Pdf::html($modifiedHtml)
            ->withBrowsershot(function ($browsershot) {
                $browsershot
                    ->setOption('viewport.width', 1920)
                    ->setOption('viewport.height', 1080)
                    ->windowSize(1920, 1080)
                    ->deviceScaleFactor(1)
                    ->setOption('args', ['--no-sandbox', '--disable-web-security'])
                    ->waitUntilNetworkIdle();
            })
            ->save($filePath);

        Notification::make()
            ->title('PDF Saved')
            ->body('The PDF has been saved to ' . $filePath)
            ->success()
            ->send();
    }
    #[On('generate-pdf')]
    public function generatePdfFromHtml($html)
    {
        $filePath = storage_path('app/pdfs/current-page.pdf');
        
        Pdf::html($modifiedHtml)
            ->withBrowsershot(function ($browsershot) {
                $browsershot
                    ->setOption('viewport.width', 1920)
                    ->setOption('viewport.height', 1080)
                    ->windowSize(1920, 1080)
                    ->deviceScaleFactor(1)
                    ->setOption('args', ['--no-sandbox', '--disable-web-security'])
                    ->waitUntilNetworkIdle();
            })
            ->save($filePath);

        Notification::make()
            ->title('PDF Saved')
            ->body('The PDF has been saved to ' . $filePath)
            ->success()
            ->send();
    }
Señor Nikola
Señor NikolaOP•2d ago
This is my end result (It's PDF view)
No description

Did you find this page helpful?