@extends('layouts.app')
@section('title','Staff')
@section('content')
@php
    $filters = [];
    if(request()->filled('search')) $filters[] = ['label'=>'Search','value'=>request('search'),'removeUrl'=>route('admin.users.index',request()->except(['search','page']))];
    if(request()->filled('status')) $filters[] = ['label'=>'Status','value'=>ucfirst((string)request('status')),'removeUrl'=>route('admin.users.index',request()->except(['status','page']))];
@endphp

<x-ui.page-toolbar title="Staff" description="Manage employee accounts, roles, branch assignments and access status." :breadcrumbs="[['label'=>'Dashboard','url'=>route('dashboard')],['label'=>'Administration'],['label'=>'Staff']]">
    @if(auth()->user()->can('users.create'))
        <x-slot:actions><a class="mf-btn mf-btn-primary" href="{{ route('admin.users.create') }}">+ New staff user</a></x-slot:actions>
    @endif
</x-ui.page-toolbar>

<x-ui.quick-status-tabs :tabs="[['label'=>'All','value'=>''],['label'=>'Active','value'=>'active'],['label'=>'Inactive','value'=>'inactive']]" />
<x-ui.table-toolbar table-id="staff-table" search-placeholder="Search staff, position, phone, username or email…" :columns="[
    'employee'=>'Employee','username'=>'Username','roles'=>'Roles','branches'=>'Branches','status'=>'Status'
]" export-filename="staff.csv" />
<x-ui.applied-filter-chips :filters="$filters" :clear-url="route('admin.users.index')" />

<div class="mf-table-frame">
<table id="staff-table" class="mf-table" data-standard-table>
<thead><tr><th data-table-column="employee">Employee</th><th data-table-column="username">Username</th><th data-table-column="roles">Roles</th><th data-table-column="branches">Branches</th><th data-table-column="status">Status</th><th data-no-export></th></tr></thead>
<tbody>
@forelse($users as $staff)
<tr>
    <td data-table-column="employee"><span class="font-medium">{{ $staff->name }}</span><div class="text-xs text-muted-foreground">{{ $staff->employee_number ?: ($staff->email ?: ($staff->phone ?: $staff->position)) }}</div></td>
    <td data-table-column="username">{{ $staff->username ?: '—' }}</td>
    <td data-table-column="roles"><div class="flex flex-wrap gap-1">@forelse($staff->roles as $role)<span class="rounded-md border px-2 py-0.5 text-[11px]">{{ $role->display_name }}</span>@empty<span class="text-muted-foreground">—</span>@endforelse</div></td>
    <td data-table-column="branches">{{ $staff->branches->pluck('name')->join(', ') ?: '—' }}</td>
    <td data-table-column="status"><span class="mf-badge {{ $staff->status==='active'?'mf-badge-success':'mf-badge-muted' }}">{{ ucfirst($staff->status) }}</span></td>
    <td data-no-export class="mf-table-row-actions">@if(auth()->user()->can('users.update'))<a class="text-sm text-primary hover:underline" href="{{ route('admin.users.edit',$staff) }}">Edit</a>@endif</td>
</tr>
@empty<tr><td colspan="6" class="text-center text-muted-foreground">No staff users found.</td></tr>@endforelse
</tbody>
</table>
</div>
<div class="mt-4">{{ $users->links() }}</div>
@endsection
