@extends('layouts.app')

@section('title', 'Edit Staff Profile | Institution Axis')

@section('sidebar-menu')
    @include('schooladmin.partials.sidebar')
@endsection

@section('sidebar-footer')
    <p>{{ auth()->user()->school?->name ?? 'Institution Axis' }}</p>
@endsection

@section('breadcrumb')
    <span><a href="{{ route('schooladmin.dashboard') }}">Home</a></span> /
    <span><a href="{{ route('schooladmin.staff.index') }}">Staff</a></span> /
    <span><a href="{{ route('schooladmin.staff.show', $staff) }}">{{ $staff->full_name }}</a></span> /
    <span class="active-page">Edit</span>
@endsection

@section('navbar-right')
    <div class="notification-icon"><i class="fas fa-bell"></i><span class="badge-notify">5</span></div>
    <div class="profile-dropdown dropdown">
        <a href="#" class="dropdown-toggle" data-bs-toggle="dropdown">
            <img src="https://ui-avatars.com/api/?background=e54027&color=fff&name=Admin" class="avatar-sm">
            <span>{{ auth()->user()->name }}</span>
            <i class="fas fa-chevron-down"></i>
        </a>
        <ul class="dropdown-menu dropdown-menu-end">
            <li><a class="dropdown-item text-danger" href="{{ route('logout') }}">Logout</a></li>
        </ul>
    </div>
@endsection

@section('content')
<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <h4 class="fw-bold mb-0"><i class="fas fa-user-edit me-2 text-primary"></i>Edit Staff Profile</h4>
        <small class="text-muted">Update {{ $staff->full_name }}'s information</small>
    </div>
    <a href="{{ route('schooladmin.staff.show', $staff) }}" class="btn btn-outline-secondary rounded-pill px-3">
        <i class="fas fa-arrow-left me-1"></i>Back to Profile
    </a>
</div>

@if($errors->any())
<div class="alert alert-danger">
    <ul class="mb-0">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
</div>
@endif

<form action="{{ route('schooladmin.staff.update', $staff) }}" method="POST">
    @csrf @method('PUT')

    <div class="card shadow-sm border-0 rounded-4 mb-4">
        <div class="card-header bg-white py-3 d-flex align-items-center gap-3">
            <img src="{{ $staff->avatar_url }}" class="rounded-circle" width="44" height="44">
            <div>
                <div class="fw-semibold">{{ $staff->full_name }}</div>
                <small class="text-muted">{{ $staff->user->email }}</small>
            </div>
        </div>
        <div class="card-body">
            <div class="row g-3">
                <div class="col-md-3">
                    <label class="form-label">Staff Number <span class="text-danger">*</span></label>
                    <input type="text" name="staff_number" class="form-control @error('staff_number') is-invalid @enderror"
                           value="{{ old('staff_number', $staff->staff_number) }}">
                    @error('staff_number')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
                <div class="col-md-3">
                    <label class="form-label">Department</label>
                    <input type="text" name="department" class="form-control"
                           value="{{ old('department', $staff->department) }}">
                </div>
                <div class="col-md-3">
                    <label class="form-label">Designation</label>
                    <input type="text" name="designation" class="form-control"
                           value="{{ old('designation', $staff->designation) }}">
                </div>
                <div class="col-md-3">
                    <label class="form-label">Status <span class="text-danger">*</span></label>
                    <select name="status" class="form-select">
                        @foreach(['active','inactive','suspended'] as $s)
                        <option value="{{ $s }}" {{ old('status', $staff->status) === $s ? 'selected' : '' }}>
                            {{ ucfirst($s) }}
                        </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-3">
                    <label class="form-label">Gender</label>
                    <select name="gender" class="form-select">
                        <option value="">— Select —</option>
                        @foreach(['male','female','other'] as $g)
                        <option value="{{ $g }}" {{ old('gender', $staff->gender) === $g ? 'selected' : '' }}>
                            {{ ucfirst($g) }}
                        </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-3">
                    <label class="form-label">Date of Birth</label>
                    <input type="date" name="date_of_birth" class="form-control"
                           value="{{ old('date_of_birth', $staff->date_of_birth?->format('Y-m-d')) }}">
                </div>
                <div class="col-md-3">
                    <label class="form-label">Date of Joining</label>
                    <input type="date" name="date_of_joining" class="form-control"
                           value="{{ old('date_of_joining', $staff->date_of_joining?->format('Y-m-d')) }}">
                </div>
                <div class="col-md-3">
                    <label class="form-label">Phone</label>
                    <input type="text" name="phone" class="form-control"
                           value="{{ old('phone', $staff->phone) }}">
                </div>
                <div class="col-md-6">
                    <label class="form-label">Emergency Contact</label>
                    <input type="text" name="emergency_contact" class="form-control"
                           value="{{ old('emergency_contact', $staff->emergency_contact) }}">
                </div>
                <div class="col-md-6">
                    <label class="form-label">Qualifications</label>
                    <textarea name="qualifications" class="form-control" rows="2">{{ old('qualifications', $staff->qualifications) }}</textarea>
                </div>
                <div class="col-12">
                    <label class="form-label">Internal Notes</label>
                    <textarea name="notes" class="form-control" rows="2">{{ old('notes', $staff->notes) }}</textarea>
                </div>
            </div>
        </div>
    </div>

    <div class="d-flex gap-2 justify-content-end">
        <a href="{{ route('schooladmin.staff.show', $staff) }}" class="btn btn-outline-secondary px-4">Cancel</a>
        <button type="submit" class="btn btn-primary px-5 rounded-pill">
            <i class="fas fa-save me-2"></i>Save Changes
        </button>
    </div>
</form>
@endsection