search tabs added

app/Http/Livewire/Frontend/Footer.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace App\Http\Livewire\Frontend;
+
+use Livewire\Component;
+
+class Footer extends Component
+{
+    public function render()
+    {
+        return view('livewire.frontend.footer');
+    }
+}

app/Http/Livewire/Frontend/Header.php

@@ -5,7 +5,7 @@ namespace App\Http\Livewire\Frontend;
 use App\Models\Country;
 use Livewire\Component;
 
-class SearchCities extends Component
+class Header extends Component
 {
     public Country $country;
     public string $c = 'de';
@@ -29,6 +29,6 @@ class SearchCities extends Component
 
     public function render()
     {
-        return view('livewire.frontend.search-cities');
+        return view('livewire.frontend.header');
     }
 }

app/Http/Livewire/Frontend/SearchCity.php

@@ -0,0 +1,16 @@
+<?php
+
+namespace App\Http\Livewire\Frontend;
+
+use App\Models\Country;
+use Livewire\Component;
+
+class SearchCity extends Component
+{
+    public Country $country;
+
+    public function render()
+    {
+        return view('livewire.frontend.search-city');
+    }
+}

app/Http/Livewire/Frontend/SearchCourse.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace App\Http\Livewire\Frontend;
+
+use Livewire\Component;
+
+class SearchCourse extends Component
+{
+    public function render()
+    {
+        return view('livewire.frontend.search-course');
+    }
+}

app/Http/Livewire/Frontend/SearchEvent.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace App\Http\Livewire\Frontend;
+
+use Livewire\Component;
+
+class SearchEvent extends Component
+{
+    public function render()
+    {
+        return view('livewire.frontend.search-event');
+    }
+}

app/Http/Livewire/Frontend/SearchLecturer.php

@@ -0,0 +1,16 @@
+<?php
+
+namespace App\Http\Livewire\Frontend;
+
+use App\Models\Country;
+use Livewire\Component;
+
+class SearchLecturer extends Component
+{
+    public Country $country;
+
+    public function render()
+    {
+        return view('livewire.frontend.search-lecturer');
+    }
+}

app/Http/Livewire/Frontend/SearchTabs.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace App\Http\Livewire\Frontend;
+
+use Livewire\Component;
+
+class SearchTabs extends Component
+{
+    public function render()
+    {
+        return view('livewire.frontend.search-tabs');
+    }
+}

app/Http/Livewire/Tables/LecturerTable.php

@@ -3,6 +3,7 @@
 namespace App\Http\Livewire\Tables;
 
 use App\Models\Lecturer;
+use Illuminate\Database\Eloquent\Builder;
 use Rappasoft\LaravelLivewireTables\DataTableComponent;
 use Rappasoft\LaravelLivewireTables\Views\Column;
 use Rappasoft\LaravelLivewireTables\Views\Columns\BooleanColumn;
@@ -43,4 +44,9 @@ class LecturerTable extends DataTableComponent
 
         ];
     }
+
+    public function builder(): Builder
+    {
+        return Lecturer::query();
+    }
 }

resources/views/livewire/frontend/footer.blade.php

@@ -0,0 +1,33 @@
+<div class="bottom-0 py-6 bg-gray-900 w-full">
+    <div class="px-10 mx-auto max-w-7xl">
+        <div class="flex flex-col items-center md:flex-row md:justify-between">
+            <a href="#_">
+                <img src="{{ asset('img/einundzwanzig-horizontal-inverted.svg') }}"
+                     class="text-white fill-current" alt="">
+            </a>
+
+            <div class="flex flex-row justify-center mb-4 -ml-4 -mr-4">
+                <a href="#"
+                   class="p-4 text-gray-700 hover:text-gray-400">
+
+                </a>
+                <a href="#" class="p-4 text-gray-700 hover:text-gray-400">
+
+                </a>
+                <a href="#" class="p-4 text-gray-700 hover:text-gray-400">
+
+                </a>
+            </div>
+        </div>
+        <div class="flex flex-col justify-between text-center md:flex-row">
+            <p class="order-last text-sm leading-tight text-gray-500 md:order-first"> Built with ❤️ by our
+                team. </p>
+            <ul class="flex flex-row justify-center pb-3 -ml-4 -mr-4 text-sm">
+                {{--<li> <a href="#_" class="px-4 text-gray-500 hover:text-white">Contact</a> </li>
+                <li> <a href="#_" class="px-4 text-gray-500 hover:text-white">About US</a> </li>
+                <li> <a href="#_" class="px-4 text-gray-500 hover:text-white">FAQ's</a> </li>
+                <li> <a href="#_" class="px-4 text-gray-500 hover:text-white">Terms</a></li>--}}
+            </ul>
+        </div>
+    </div>
+</div>

resources/views/livewire/frontend/header.blade.php

@@ -1,5 +1,4 @@
-<div class="bg-21gray flex flex-col h-screen justify-between">
+<div>
-    {{-- HEADER --}}
     <section class="w-full">
         <div class="max-w-7xl mx-auto px-10">
             <div class="flex flex-col flex-wrap items-center justify-between py-7 mx-auto md:flex-row max-w-7xl">
@@ -72,80 +71,4 @@
             </div>
         </div>
     </section>
-    {{-- MAIN --}}
-    <section class="w-full mb-12">
-        <div class="max-w-7xl mx-auto px-10">
-            <div class="border-b border-gray-200 pb-5 sm:pb-0 my-6">
-                <h3 class="text-lg font-medium leading-6 text-gray-200">Suche</h3>
-                <div class="mt-3 sm:mt-4">
-                    <!-- Dropdown menu on small screens -->
-                    <div class="sm:hidden">
-                        <label for="current-tab" class="sr-only">Select a tab</label>
-                        <select id="current-tab" name="current-tab"
-                                class="block w-full rounded-md border-gray-300 py-2 pl-3 pr-10 text-base focus:border-indigo-500 focus:outline-none focus:ring-indigo-500 sm:text-sm">
-                            <option selected>Städte</option>
-                            <option>Dozenten</option>
-                            <option>Kurse</option>
-                            <option>Termine</option>
-                        </select>
-                    </div>
-                    <!-- Tabs at small breakpoint and up -->
-                    <div class="hidden sm:block">
-                        <nav class="-mb-px flex space-x-8">
-                            @php
-                                $currentTab = 'border-amber-500 text-amber-600';
-                                $notCurrentTab = 'border-transparent text-gray-200 hover:text-gray-400 hover:border-gray-300';
-                            @endphp
-                            <a href="#"
-                               class="{{ $currentTab }} whitespace-nowrap pb-4 px-1 border-b-2 font-medium text-sm">Städte</a>
-
-                            <a href="#"
-                               class="{{ $notCurrentTab }} whitespace-nowrap pb-4 px-1 border-b-2 font-medium text-sm">Dozenten</a>
-
-                            <a href="#"
-                               class="{{ $notCurrentTab }} whitespace-nowrap pb-4 px-1 border-b-2 font-medium text-sm">Kurse</a>
-
-                            <a href="#"
-                               class="{{ $notCurrentTab }} whitespace-nowrap pb-4 px-1 border-b-2 font-medium text-sm">Termine</a>
-                        </nav>
-                    </div>
-                </div>
-            </div>
-            <livewire:tables.city-table :country="$c"/>
-        </div>
-    </section>
-    {{-- FOOTER --}}
-    <div class="bottom-0 py-6 bg-gray-900 w-full">
-        <div class="px-10 mx-auto max-w-7xl">
-            <div class="flex flex-col items-center md:flex-row md:justify-between">
-                <a href="#_">
-                    <img src="{{ asset('img/einundzwanzig-horizontal-inverted.svg') }}"
-                         class="text-white fill-current" alt="">
-                </a>
-
-                <div class="flex flex-row justify-center mb-4 -ml-4 -mr-4">
-                    <a href="#"
-                       class="p-4 text-gray-700 hover:text-gray-400">
-
-                    </a>
-                    <a href="#" class="p-4 text-gray-700 hover:text-gray-400">
-
-                    </a>
-                    <a href="#" class="p-4 text-gray-700 hover:text-gray-400">
-
-                    </a>
-                </div>
-            </div>
-            <div class="flex flex-col justify-between text-center md:flex-row">
-                <p class="order-last text-sm leading-tight text-gray-500 md:order-first"> Built with ❤️ by our
-                    team. </p>
-                <ul class="flex flex-row justify-center pb-3 -ml-4 -mr-4 text-sm">
-                    {{--<li> <a href="#_" class="px-4 text-gray-500 hover:text-white">Contact</a> </li>
-                    <li> <a href="#_" class="px-4 text-gray-500 hover:text-white">About US</a> </li>
-                    <li> <a href="#_" class="px-4 text-gray-500 hover:text-white">FAQ's</a> </li>
-                    <li> <a href="#_" class="px-4 text-gray-500 hover:text-white">Terms</a></li>--}}
-                </ul>
-            </div>
-        </div>
-    </div>
 </div>

resources/views/livewire/frontend/search-city.blade.php

@@ -0,0 +1,13 @@
+<div class="bg-21gray flex flex-col h-screen justify-between">
+    {{-- HEADER --}}
+    <livewire:frontend.header :country="$country"/>
+    {{-- MAIN --}}
+    <section class="w-full mb-12">
+        <div class="max-w-7xl mx-auto px-10">
+            <livewire:frontend.search-tabs/>
+            <livewire:tables.city-table :country="$country->code"/>
+        </div>
+    </section>
+    {{-- FOOTER --}}
+    <livewire:frontend.footer/>
+</div>

resources/views/livewire/frontend/search-course.blade.php

@@ -0,0 +1,3 @@
+<div>
+    {{-- Be like water. --}}
+</div>

resources/views/livewire/frontend/search-event.blade.php

@@ -0,0 +1,3 @@
+<div>
+    {{-- The best athlete wants his opponent at his best. --}}
+</div>

resources/views/livewire/frontend/search-lecturer.blade.php

@@ -0,0 +1,13 @@
+<div class="bg-21gray flex flex-col h-screen justify-between">
+    {{-- HEADER --}}
+    <livewire:frontend.header :country="$country"/>
+    {{-- MAIN --}}
+    <section class="w-full mb-12">
+        <div class="max-w-7xl mx-auto px-10">
+            <livewire:frontend.search-tabs/>
+            <livewire:tables.lecturer-table/>
+        </div>
+    </section>
+    {{-- FOOTER --}}
+    <livewire:frontend.footer/>
+</div>

resources/views/livewire/frontend/search-tabs.blade.php

@@ -0,0 +1,38 @@
+<div>
+    <div class="border-b border-gray-200 pb-5 sm:pb-0 my-6">
+        <h3 class="text-lg font-medium leading-6 text-gray-200">Suche</h3>
+        <div class="mt-3 sm:mt-4">
+            <!-- Dropdown menu on small screens -->
+            <div class="sm:hidden">
+                <label for="current-tab" class="sr-only">Select a tab</label>
+                <select id="current-tab" name="current-tab"
+                        class="block w-full rounded-md border-gray-300 py-2 pl-3 pr-10 text-base focus:border-indigo-500 focus:outline-none focus:ring-indigo-500 sm:text-sm">
+                    <option selected>Städte</option>
+                    <option>Dozenten</option>
+                    <option>Kurse</option>
+                    <option>Termine</option>
+                </select>
+            </div>
+            <!-- Tabs at small breakpoint and up -->
+            <div class="hidden sm:block">
+                <nav class="-mb-px flex space-x-8">
+                    @php
+                        $currentTab = 'border-amber-500 text-amber-600';
+                        $notCurrentTab = 'border-transparent text-gray-200 hover:text-gray-400 hover:border-gray-300';
+                    @endphp
+                    <a href="{{ route('search.city', ['country' => 'de']) }}"
+                       class="{{ request()->routeIs('search.city') ? $currentTab : $notCurrentTab }} whitespace-nowrap pb-4 px-1 border-b-2 font-medium text-sm">Städte</a>
+
+                    <a href="{{ route('search.lecturer', ['country' => 'de']) }}"
+                       class="{{ request()->routeIs('search.lecturer') ? $currentTab : $notCurrentTab }} whitespace-nowrap pb-4 px-1 border-b-2 font-medium text-sm">Dozenten</a>
+
+                    <a href="{{ route('search.course', ['country' => 'de']) }}"
+                       class="{{ request()->routeIs('search.course') ? $currentTab : $notCurrentTab }} whitespace-nowrap pb-4 px-1 border-b-2 font-medium text-sm">Kurse</a>
+
+                    <a href="{{ route('search.event', ['country' => 'de']) }}"
+                       class="{{ request()->routeIs('search.event') ? $currentTab : $notCurrentTab }} whitespace-nowrap pb-4 px-1 border-b-2 font-medium text-sm">Termine</a>
+                </nav>
+            </div>
+        </div>
+    </div>
+</div>

routes/web.php

@@ -14,12 +14,21 @@ use Illuminate\Support\Facades\Route;
 */
 
 Route::get('/', function () {
-    return to_route('search.cities', ['country' => 'de']);
+    return to_route('search.city', ['country' => 'de']);
 })
      ->name('welcome');
 
-Route::get('/{country:code}/suche', \App\Http\Livewire\Frontend\SearchCities::class)
+Route::get('/{country:code}/suche/stadt', \App\Http\Livewire\Frontend\SearchCity::class)
-     ->name('search.cities');
+     ->name('search.city');
+
+Route::get('/{country:code}/suche/dozent', \App\Http\Livewire\Frontend\SearchLecturer::class)
+     ->name('search.lecturer');
+
+Route::get('/{country:code}/suche/kurs', \App\Http\Livewire\Frontend\SearchCity::class)
+     ->name('search.course');
+
+Route::get('/{country:code}/suche/termin', \App\Http\Livewire\Frontend\SearchCity::class)
+     ->name('search.event');
 
 Route::get('/dozenten', \App\Http\Livewire\Guest\Welcome::class)
      ->name('search.lecturers');