After a fresh installation of Laravel with “LivewireVolt” I create “/resources/views/livewire/nom/products-list.blade.php” for listing “Products”, but when try to go to the address I receive an “Internal Server Error” message
I have a new Laravel 11 installation with Breeze and Volt packages
“/resources/views/livewire/nom/products-list.blade.php”
<?php
use LivewireVoltComponent;
use LivewireAttributes{Layout, Title};
use IlluminateSupportFacadesRedirect;
use IlluminateSupportFacadesDB;
use LivewireWithPagination;
use AppModelsProduct;
new
#[Layout('layouts.app')]
#[Title('Продукти')]
class extends Component {
//
public string $search = '';
public function addNom() {
return Redirect::to('nom/product.edit/'.'0');
}
public function editNom($id)
{
return Redirect::to('nom/product.edit/'.(string) $id);
}
public function with(): array {
$stext = $this->search;
$noms = Product::query()
->where(function ($qname) use ($stext) {
if($stext != '') {
$stext = '%'.$stext.'%';
$qname->where('name','LIKE',$stext);
}
})
->orderBy('name')
->paginate(10)
;
return [
'noms' => $noms,
];
}
}; ?>
<div>
<x-slot name="header">
<h2 class="text-xl font-semibold leading-tight text-gray-800">
{{ __('Продукти') }}
</h2>
</x-slot>
<div class="py-2">
<div class="mx-auto max-w-7xl sm:px-6 lg:px-8">
<x-flash-message />
<div class="grid grid-cols-3 gap-4 mt-4 mb-2">
<table>
<tr>
<td>
<x-button wire:click="addNom" class="w-2/3 col-span-1 h-11" >{{ __('Нов') }}</x-button>
</td>
<td>
</td>
</tr>
<tr>
<td>
<!-- Search -->
<div class="col-span-1">
<x-label for="search" value="{{ __(':') }}" />
<x-input.search
wire:model.live="search"
class="block w-full py-2 pl-12 pr-5 mt-4 text-lg"
placeholder="Търси..."
autocomplete="off"
/>
</div>
</td>
</tr>
</table>
</div>
<x-table>
<x-slot name="head">
<tr>
<th scope="col" class="px-3 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">
Name
</th>
<th scope="col" class="px-3 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">
Code
</th>
<th scope="col" class="px-3 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">
ME
</th>
<th scope="col" class="px-1 py-3 text-xs font-medium tracking-wider text-center text-gray-500 uppercase">
Edit
</th>
</tr>
</x-slot>
<x-slot name="body">
@foreach ($noms as $key => $nom)
<tr>
<td class="py-1">
<div class="flex items-center">
<div class="ml-4">
<div class="text-xs font-medium text-gray-900">
{{ $nom?->name }}
</div>
</div>
</div>
</td>
<td class="py-1">
<div class="flex items-center">
<div class="ml-4">
<div class="text-xs font-medium text-gray-900">
{{ $nom?->code }}
</div>
</div>
</div>
</td>
<td class="py-1">
<div class="flex items-center">
<div class="ml-4">
<div class="text-xs font-medium text-gray-900">
{{ $nom?->me }}
</div>
</div>
</div>
</td>
<td class="px-1 py-4 text-xs font-medium text-center">
<button
wire:click="editNom({{ $nom?->id }})"
title="Edit"
class="inline-flex items-center px-4 py-2 font-bold bg-yellow-400 rounded hover:bg-grey text-grey-darkest"
>
<svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" />
</svg>
</button>
</td>
</tr>
@endforeach
</x-slot>
{{ $noms->links() }}
</x-table>
</div>
</div>
</div>
web.php
Volt::route('nom/products.list', 'nom/products-list')->name('nom/products.list');
resources/views/layouts/app.blade.php
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.bunny.net">
<link href="https://fonts.bunny.net/css?family=figtree:400,500,600&display=swap" rel="stylesheet" />
@livewireStyles
<!-- Scripts -->
@vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body class="font-sans antialiased">
<div class="min-h-screen bg-gray-100">
<livewire:layout.navigation />
<!-- Page Heading -->
@if (isset($header))
<header class="bg-white shadow">
<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8">
{{ $header }}
</div>
</header>
@endif
<!-- Page Content -->
<main>
{{ $slot }}
</main>
</div>
@livewireScripts
</body>
</html>