Student listing for directors complete

app/Http/Controllers/StudentController.php

@@ -13,7 +13,7 @@ class StudentController extends Controller
      */
     public function index()
     {
-        $students = Auth::user()->students();
+        $students = Auth::user()->students;
         return view('students.index',['students' => $students]);
     }
 

app/Models/Student.php

@@ -21,4 +21,10 @@ class Student extends Model
         return $this->hasManyThrough(User::class, School::class);
     }
 
+    public function full_name(Bool $last_name_first = false): String
+    {
+        if ($last_name_first) return $this->last_name . ', ' . $this->first_name;
+        return $this->first_name . ' ' . $this->last_name;
+    }
+
 }

app/Models/User.php

@@ -53,8 +53,9 @@ class User extends Authenticatable implements MustVerifyEmail
         ];
     }
 
-    public function full_name(): string
+    public function full_name(Bool $last_name_first = false): String
     {
+        if ($last_name_first) return $this->last_name . ', ' . $this->first_name;
         return $this->first_name . ' ' . $this->last_name;
     }
 
@@ -71,7 +72,7 @@ class User extends Authenticatable implements MustVerifyEmail
 
     public function students(): HasManyThrough
     {
-        return $this->hasManyThrough(Student::class, School::class);
+        return $this->hasManyThrough(Student::class, School::class, 'id','school_id','school_id','id');
     }
 
 

resources/views/components/badge_pill.blade.php

@@ -0,0 +1,2 @@
+@php($classes = "inline-flex items-center rounded-full bg-indigo-50 px-2 py-1 text-xs font-medium text-indigo-700 ring-1 ring-inset ring-indigo-700/10")
+<span {{ $attributes->merge(['class' => $classes]) }}>{{ $slot }}</span>

resources/views/components/table/body.blade.php

@@ -0,0 +1,3 @@
+<tbody {{ $attributes->merge(['class' => "divide-y divide-gray-200 bg-white" ]) }}>
+    {{ $slot }}
+</tbody>

resources/views/components/table/container.blade.php

@@ -0,0 +1,3 @@
+<div {{ $attributes->merge(['class' => 'px-4 sm:px-6 lg:px-8']) }}>
+    {{ $slot }}
+</div>

resources/views/components/table/table.blade.php

@@ -0,0 +1,11 @@
+<div class="mt-8 flow-root">
+    <div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
+        <div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8">
+            <div class="overflow-hidden shadow ring-1 ring-black ring-opacity-5 sm:rounded-lg">
+                <table class="min-w-full divide-y divide-gray-300">
+                    {{ $slot }}
+                </table>
+            </div>
+        </div>
+    </div>
+</div>

resources/views/components/table/table_header_row.blade.php

@@ -0,0 +1,5 @@
+<thead class="bg-gray-50">
+    <tr>
+        {{ $slot }}
+    </tr>
+</thead>

resources/views/components/table/td.blade.php

@@ -0,0 +1,7 @@
+@props(['first' => false, 'emphasis'=> false])
+@php
+    $td_classes = "whitespace-nowrap py-4 text-sm";
+    $td_classes .= $first ? ' pl-4 pr-3 sm:pl-6':' px-3';
+    $td_classes .= $emphasis ? ' text-gray-900 font-medium':' text-gray-500';
+@endphp
+<td {{ $attributes->merge(['class'=>$td_classes]) }}>{{ $slot }}</td>

resources/views/components/table/td_right_link.blade.php

@@ -0,0 +1,17 @@
+@props(['sr_text' => false,'button' => false,'a' => false])
+@php $td_class = "relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6"; @endphp
+@php $link_class = "text-indigo-600 hover:text-indigo-900"; @endphp
+<td {{ $attributes->merge(['class' => $td_class]) }}>
+    @if($a)
+        <a {{ $a->attributes->merge(['class' => $link_class]) }}>
+            {{ $a  }}@if($sr_text)<span class="sr-only">{{ $sr_text }}</span>@endif
+        </a>
+    @elseif($button)
+        @php($aria_label = $button . $sr_text)
+        <button {{ $button->attributes->merge(['class' => $link_class, 'aria-label'=> $aria_label]) }}>
+            {{ $button  }}
+        </button>
+    @else
+        {{ $slot }}{{ $sr_text ? '<span class="sr-only">' . $sr_text . '</span>' : '' }}
+    @endif
+</td>

resources/views/components/table/th.blade.php

@@ -0,0 +1,8 @@
+@props(['first' => false, 'placeholder' => false])
+@php
+    $th_classes = "py-3.5 text-left text-sm font-semibold text-gray-900";
+    $th_classes .= $first ? ' pl-4 pr-3 sm:pl-6':' px-3';
+    if($placeholder) $th_classes =  "relative py-3.5 pl-3 pr-4 sm:pr-6";
+@endphp
+
+<th {{ $attributes->merge(['scope' =>'col','class' => $th_classes]) }}>{{ $slot }}</th>

resources/views/components/table/title_above_table.blade.php

@@ -0,0 +1,17 @@
+@props(['title' => false,'subtitle' => false, 'button' => false])
+<div class="sm:flex sm:items-center">
+    <div class="sm:flex-auto">
+        @if($title)
+            <h1 {{ $title->attributes->merge(['class' => 'text-base font-semibold leading-6 text-gray-900']) }}>{{ $title }}</h1>
+        @endif
+        @if($subtitle)
+            <p {{ $subtitle->attributes->merge(['class' => 'mt-2 text-sm text-gray-700']) }}>{{ $subtitle }}</p>
+        @endif
+    </div>
+    <div class="mt-4 sm:ml-16 sm:mt-0 sm:flex-none">
+        @if($button)
+            @php $button_classes = 'block rounded-md bg-indigo-600 px-3 py-2 text-center text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600'; @endphp
+            <button {{ $button->attributes->merge(['type' => 'button','class' => $button_classes]) }}>{{ $button }}</button>
+        @endif
+    </div>
+</div>

resources/views/students/index.blade.php

@@ -1,5 +1,33 @@
 @php use Illuminate\Support\Facades\Auth; @endphp
 <x-layout.app>
     <x-slot:page_title>Students</x-slot:page_title>
-    {{ dd(Auth::user()->students) }}
+
+    <x-table.container class="mx-auto max-w-2xl">
+        <x-table.title_above_table>
+            <x-slot:title>Students <x-badge_pill>{{ $students->count() }}</x-badge_pill></x-slot:title>
+            <x-slot:subtitle>Before submitting entries, you must enter your students</x-slot:subtitle>
+            <x-slot:button>Add Student</x-slot:button>
+        </x-table.title_above_table>
+
+        <x-table.table>
+            <x-table.table_header_row>
+                <x-table.th first>Name</x-table.th>
+                <x-table.th>Grade</x-table.th>
+                <x-table.th :placeholder="true">
+                    <span class="sr-only">Edit</span>
+                </x-table.th>
+                <x-table.body>
+                    @foreach($students as $student)
+                        <tr>
+                            <x-table.td :first="true">{{ $student->full_name(true) }}</x-table.td>
+                            <x-table.td>{{ $student->grade }}</x-table.td>
+                            <x-table.td_right_link sr_text=", {{ $student->full_name() }}">
+                                <x-slot:a href="/students/{{ $student->id }}/edit">Edit</x-slot:a>
+                            </x-table.td_right_link>
+                        </tr>
+                    @endforeach
+                </x-table.body>
+            </x-table.table_header_row>
+        </x-table.table>
+    </x-table.container>
 </x-layout.app>