diff --git a/app/Services/Admin/HR/AttendanceService.php b/app/Services/Admin/HR/AttendanceService.php
index d722c3e..9cdf722 100644
--- a/app/Services/Admin/HR/AttendanceService.php
+++ b/app/Services/Admin/HR/AttendanceService.php
@@ -37,7 +37,7 @@ public function getIndexData(int $year, int $month): array
         return [
             'attendances' => $this->getByMonth($year, $month, $employeeId),
             'leaves' => $this->getLeavesByMonth($year, $month, $employeeId),
-            'employees' => $isAdmin ? $this->employeeService->getAll() : [],
+            'employees' => $isAdmin ? $this->getEmployeesWithAttendancePermission() : [],
             'todayAttendance' => $isAdmin ? null : $this->getToday(),
             'currentYear' => $year,
             'currentMonth' => $month,
@@ -79,7 +79,7 @@ public function getByMonthData(int $year, int $month): array
         return [
             'attendances' => $this->getByMonth($year, $month, $employeeId),
             'leaves' => $this->getLeavesByMonth($year, $month, $employeeId),
-            'employees' => $this->employeeService->getAll(),
+            'employees' => $this->getEmployeesWithAttendancePermission(),
             'monthStats' => $this->getMonthStats($year, $month, $employeeId),
         ];
     }
@@ -341,4 +341,16 @@ private function formatAttendance(Attendance $attendance): array
 
         return $toArray;
     }
+
+    private function getEmployeesWithAttendancePermission(): Collection
+    {
+        return Employee::with(['user.userProfile', 'user.roles'])
+            ->whereHas('user', fn ($q) => $q->where('is_active', true)
+                ->whereHas('roles', fn ($rq) => $rq->whereHas('permissions', fn ($pq) => $pq->where('name', 'attendances.view'))))
+            ->get()
+            ->map(fn (Employee $employee) => [
+                'id' => $employee->id,
+                'name' => $employee->user?->userProfile?->full_name ?? '-',
+            ]);
+    }
 }
diff --git a/resources/js/pages/admin/hr/attendance/index.tsx b/resources/js/pages/admin/hr/attendance/index.tsx
index 64d4d39..9c87896 100644
--- a/resources/js/pages/admin/hr/attendance/index.tsx
+++ b/resources/js/pages/admin/hr/attendance/index.tsx
@@ -452,6 +452,7 @@ export default function AttendanceIndex({
                         <div className="flex items-center gap-3 border-b px-6 py-2 text-xs text-muted-foreground">
                             <Badge variant="default" className="text-[10px]">Hadir</Badge>
                             <Badge variant="destructive" className="text-[10px]">Terlambat</Badge>
+                            <Badge variant="outline" className="text-[10px] border-orange-300 bg-orange-50 text-orange-700">Belum Pulang</Badge>
                             <Badge className="text-[10px] bg-purple-100 text-purple-700 hover:bg-purple-100">Cuti</Badge>
                         </div>
                     )}
@@ -608,6 +609,11 @@ export default function AttendanceIndex({
                                                                         ? 'Terlambat'
                                                                         : 'Hadir'}
                                                                 </span>
+                                                                {!att.check_out_at && (
+                                                                    <span className="inline-flex items-center justify-center rounded-full bg-orange-100 px-1.5 py-0.5 text-[10px] font-semibold text-orange-700">
+                                                                        Belum Pulang
+                                                                    </span>
+                                                                )}
                                                                 <span className="text-[10px] text-muted-foreground">
                                                                     Masuk :{' '}
                                                                     {formatTime(
@@ -616,9 +622,9 @@ export default function AttendanceIndex({
                                                                 </span>
                                                                 <span className="text-[10px] text-muted-foreground">
                                                                     Pulang :{' '}
-                                                                    {formatTime(
-                                                                        att.check_out_at,
-                                                                    )}
+                                                                    {att.check_out_at
+                                                                        ? formatTime(att.check_out_at)
+                                                                        : '-'}
                                                                 </span>
                                                                 {late && (
                                                                     <span className="text-[10px] text-yellow-600">