Director dash started

config/adminlte.php

@@ -380,14 +380,14 @@ return [
             'text' => 'Home',
             'url' => 'home',
             'icon' => 'fas fa-home',
-            'can' => ['isClient', 'isAdmin'],
+            'can' => 'isClient',
         ],
 
         [
             'text' => 'Home 2',
             'url' => 'director',
             'icon' => 'fas fa-home',
-            'can' => ['isClient', 'isAdmin'],
+            'can' => 'isClient',
         ],
 
         [

resources/views/home/home2.blade.php

@@ -24,22 +24,57 @@
 
         <div class="d-flex flex-column flex-lg-row">
             <div class="col-lg-8">
-                <div>
-                    <div class="d-flex flex-column flex-sm-row justify-content-between">
-                        <x-adminlte-info-box title="National Registration Bureau" text="53,568,898" icon="fas fa-lg fa-users text-success" class="mr-3"/>
+                <x-adminlte-card title="Records Received" theme="" icon="fas fa-calendar-alt" removable collapsible>
+                    <!-- Month/Year Selector Row -->
+                    <div class="row mb-3">
+                        <div class="col-md-6">
+                            <div class="form-group">
+                                <label>Month</label>
+                                <select class="form-control select2" style="width: 100%;">
+                                    @foreach(['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] as $month)
+                                        <option value="{{ $month }}" {{ $month == 'May' ? 'selected' : '' }}>{{ $month }}</option>
+                                    @endforeach
+                                </select>
+                            </div>
+                        </div>
+                        <div class="col-md-6">
+                            <div class="form-group">
+                                <label>Year</label>
+                                <select class="form-control select2" style="width: 100%;">
+                                    @foreach(range(date('Y'), date('Y') - 15) as $year)
+                                        <option value="{{ $year }}" {{ $year == 2024 ? 'selected' : '' }}>{{ $year }}</option>
+                                    @endforeach
+                                </select>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Info Boxes Grid -->
+                    <div class="row">
+                        <div class="col-md-6">
+                            <x-adminlte-info-box title="National Registration Bureau" text="53,568,898" icon="fas fa-lg fa-users text-success" />
+                        </div>
+                        <div class="col-md-6">
                             <x-adminlte-info-box title="Civil Registration Department" text="23,984,343" icon="fas fa-lg fa-certificate text-success"/>
                         </div>
+                    </div>
 
-                    <div class="d-flex flex-column flex-sm-row justify-content-between">
-                        <x-adminlte-info-box title="Department of Immigration" text="17,763,238" icon="fas fa-lg fa-flag text-success" class="mr-3"/>
-                        <x-adminlte-info-box title="Refugee Affairs Department" text="11,821,317" icon="fas fa-lg fa-life-ring text-success"/>
+                    <div class="row mt-3">
+                        <div class="col-md-6">
+                            <x-adminlte-info-box title="Department of Immigration" text="17,763,238" icon="fas fa-lg fa-flag text-success" />
+                        </div>
+                        <div class="col-md-6">
+                            <x-adminlte-info-box title="Refugee Affairs Department" text="11,821,317" icon="fas fa-lg fa-life-ring text-success" />
+                        </div>
                     </div>
 
-                    <div class="d-flex flex-column flex-sm-row justify-content-between">
-                        <x-adminlte-info-box title="Registrar General" text="17,763,238" icon="fas fa-lg fa-server text-success" class=""/>
-    {{--                    <x-adminlte-info-box style="opacity: 0;" />--}}
+                    <div class="row mt-3">
+                        <div class="col-md-12">
+                            <x-adminlte-info-box title="Registrar General" text="17,763,238" icon="fas fa-lg fa-server text-success" />
                         </div>
                     </div>
+                </x-adminlte-card>
+
                 <div>
                     <div class="container-fluid d-flex flex-column p-3 bg-white rounded">
                         <div class="d-flex flex-column flex-sm-row justify-content-between align-items-center mb-3">
@@ -90,6 +125,7 @@
                         </div>
                     </div>
                 </div>
+
                 <div class="d-flex justify-content-between mt-3">
                     <x-adminlte-small-box title="10.8k" text="Remaining Tokens" icon="fas fa-lg fa-coins text-success"
                                           theme="white" url="#" url-text="View details" class="w-50 mr-3"/>
@@ -116,6 +152,7 @@
                     </div>
                 </div>
             </div>
+
             <div class="col-lg-4 d-flex flex-column">
                 <div>
                     <div>
@@ -299,6 +336,19 @@
                 }
             });
         });
+
+        $(document).ready(function() {
+            // Initialize Select2 for better dropdown UX
+            $('.select2').select2({
+                theme: 'bootstrap4'
+            });
+
+            // You can add change handlers here if needed
+            $('.select2').on('change', function() {
+                console.log('Month/Year changed - would reload data here');
+                // In a real app, you would fetch new data here
+            });
+        });
     </script>
 @stop