@extends('layouts.app')
@section('title', 'Staff Profile')
@php $canManage = auth()->user()->isAdmin() || auth()->user()->isSupervisor(); @endphp
@section('content')
<div class="row">
    {{-- LEFT: profile summary --}}
    <div class="col-lg-4 mb-4">
        <div class="card">
            <div class="mi-brand-strip rounded-top"></div>
            <div class="card-body text-center">
                @if($staff->photoUrl())
                    <img src="{{ $staff->photoUrl() }}" class="rounded-circle border mx-auto mb-3" style="width:96px;height:96px;object-fit:cover" alt="photo">
                @else
                    <div class="icon icon-lg icon-shape bg-gradient-primary rounded-circle mx-auto mb-3 d-flex align-items-center justify-content-center" style="width:96px;height:96px">
                        <span class="text-white h3 mb-0">{{ strtoupper(substr($staff->name,0,1)) }}</span>
                    </div>
                @endif
                <h5 class="mb-0">{{ $staff->name }}</h5>
                <p class="text-sm text-muted mb-2">{{ $staff->designation ?? 'Worker' }} · {{ $staff->passport_no }}</p>
                <span class="badge bg-{{ $staff->statusColor() }}">{{ ucfirst($staff->status) }}</span>
                @if($canManage)
                    <div class="mt-3"><a href="{{ route('staff.edit', $staff) }}" class="btn btn-sm btn-outline-primary"><i class="bi bi-pencil me-1"></i>Edit Profile</a></div>
                @endif
            </div>
            <hr class="horizontal dark my-0">
            <div class="card-body text-sm">
                <div class="d-flex justify-content-between py-1"><span class="text-muted">Running No</span><span>#{{ $staff->running_no }}</span></div>
                <div class="d-flex justify-content-between py-1"><span class="text-muted">Site / Project</span><span>{{ $staff->site?->name ?? '—' }}</span></div>
                <div class="d-flex justify-content-between py-1"><span class="text-muted">Department</span><span>{{ $staff->department ?? '—' }}</span></div>
                <div class="d-flex justify-content-between py-1"><span class="text-muted">Nationality</span><span>{{ $staff->nationality?->name ?? '—' }}</span></div>
                <div class="d-flex justify-content-between py-1"><span class="text-muted">Gender</span><span>{{ ucfirst($staff->gender ?? '—') }}</span></div>
                <div class="d-flex justify-content-between py-1"><span class="text-muted">Date Joined</span><span>{{ optional($staff->date_of_join)->format('d M Y') ?? '—' }}</span></div>
                @if($staff->resign_date)<div class="d-flex justify-content-between py-1"><span class="text-muted">Resigned</span><span>{{ $staff->resign_date->format('d M Y') }}</span></div>@endif
            </div>
            <hr class="horizontal dark my-0">
            <div class="card-body text-sm">
                <h6 class="text-xs text-uppercase text-muted">Payroll & Bank</h6>
                <div class="d-flex justify-content-between py-1"><span class="text-muted">Basic Rate</span><span>RM {{ number_format((float)$staff->basic_rate, 2) }} / {{ $staff->pay_basis }}</span></div>
                <div class="d-flex justify-content-between py-1"><span class="text-muted">Bank</span><span>{{ $staff->bank?->name ?? '—' }}</span></div>
                <div class="d-flex justify-content-between py-1"><span class="text-muted">Account</span><span>{{ $staff->account_number ?? '—' }}</span></div>
            </div>
        </div>
    </div>

    {{-- RIGHT: tabbed sections --}}
    <div class="col-lg-8 mb-4">
        <div class="card">
            <div class="card-header pb-0">
                <ul class="nav nav-pills nav-fill flex-column flex-sm-row text-xs" id="profileTabs" role="tablist">
                    @foreach(['passport'=>'Passport','permit'=>'Permit','fomema'=>'FOMEMA','sites'=>'Sites','documents'=>'Documents','payslips'=>'Payslips'] as $k=>$label)
                    <li class="nav-item"><button class="nav-link {{ $loop->first ? 'active' : '' }}" data-bs-toggle="tab" data-bs-target="#tab-{{ $k }}" type="button">{{ $label }}</button></li>
                    @endforeach
                </ul>
            </div>
            <div class="card-body">
                <div class="tab-content">
                    <div class="tab-pane fade show active" id="tab-passport">
                        @include('staff._renewal_tab', ['type'=>'passport','label'=>'Passport','col'=>'passport_expiry'])
                    </div>
                    <div class="tab-pane fade" id="tab-permit">
                        @include('staff._renewal_tab', ['type'=>'permit','label'=>'Permit','col'=>'permit_expiry'])
                    </div>
                    <div class="tab-pane fade" id="tab-fomema">
                        @include('staff._renewal_tab', ['type'=>'fomema','label'=>'FOMEMA','col'=>'fomema_expiry'])
                    </div>

                    {{-- SITES --}}
                    <div class="tab-pane fade" id="tab-sites">
                        <div class="row">
                            <div class="col-md-5 mb-3">
                                <div class="border rounded p-3 h-100">
                                    <span class="text-xs text-uppercase text-muted">Current Site</span>
                                    <div class="h5 mb-0 mt-1">{{ $staff->site?->name ?? 'Unassigned' }}</div>
                                    <span class="text-xs text-muted">{{ $staff->site?->client }}</span>
                                </div>
                            </div>
                            @if($canManage)
                            <div class="col-md-7 mb-3">
                                <div class="border rounded p-3">
                                    <h6 class="text-sm mb-2">Reassign Site</h6>
                                    <form action="{{ route('staff.reassign', $staff) }}" method="POST">
                                        @csrf
                                        <div class="row g-2">
                                            <div class="col-7"><label class="form-label text-xs">New Site *</label>
                                                <select name="site_id" class="form-select form-select-sm searchable" required>
                                                    <option value="">—</option>
                                                    @foreach($sites as $site)<option value="{{ $site->id }}" @selected($staff->site_id==$site->id)>{{ $site->name }}</option>@endforeach
                                                </select></div>
                                            <div class="col-5"><label class="form-label text-xs">Assigned On</label><input type="date" name="assigned_on" value="{{ now()->format('Y-m-d') }}" class="form-control form-control-sm"></div>
                                            <div class="col-12"><label class="form-label text-xs">Remarks</label><input name="remarks" class="form-control form-control-sm"></div>
                                            <div class="col-12 text-end"><button class="btn btn-primary btn-sm mb-0">Reassign</button></div>
                                        </div>
                                    </form>
                                </div>
                            </div>
                            @endif
                            <div class="col-12">
                                <h6 class="text-xs text-uppercase text-muted">Assignment History</h6>
                                <div class="table-responsive"><table class="table table-sm align-items-center mb-0">
                                    <thead><tr class="text-xxs text-uppercase text-secondary"><th>Site</th><th>From</th><th>To</th><th>Remarks</th><th>By</th></tr></thead>
                                    <tbody>
                                    @forelse($staff->siteAssignments as $a)
                                        <tr>
                                            <td class="text-sm font-weight-bold">{{ $a->site?->name ?? '—' }}</td>
                                            <td class="text-sm">{{ optional($a->assigned_on)->format('d/m/Y') ?? '—' }}</td>
                                            <td class="text-sm">@if($a->ended_on){{ $a->ended_on->format('d/m/Y') }}@else<span class="badge bg-success">Current</span>@endif</td>
                                            <td class="text-sm">{{ $a->remarks ?? '—' }}</td>
                                            <td class="text-sm">{{ $a->creator?->name ?? '—' }}</td>
                                        </tr>
                                    @empty
                                        <tr><td colspan="5" class="text-center text-muted py-3">No site assignment history yet.</td></tr>
                                    @endforelse
                                    </tbody>
                                </table></div>
                            </div>
                        </div>
                    </div>

                    {{-- DOCUMENTS --}}
                    <div class="tab-pane fade" id="tab-documents">
                        @if($canManage)
                        <div class="border rounded p-3 mb-3">
                            <h6 class="text-sm mb-2">Upload Document</h6>
                            <form action="{{ route('documents.store', $staff) }}" method="POST" enctype="multipart/form-data">
                                @csrf
                                <div class="row g-2 align-items-end">
                                    <div class="col-md-4"><label class="form-label text-xs">Title *</label><input name="title" class="form-control form-control-sm" required></div>
                                    <div class="col-md-3"><label class="form-label text-xs">Type</label>
                                        <select name="type" class="form-select form-select-sm">
                                            <option value="contract">Contract</option><option value="passport">Passport</option>
                                            <option value="permit">Permit</option><option value="fomema">FOMEMA</option>
                                            <option value="insurance">Insurance</option><option value="other" selected>Other</option>
                                        </select></div>
                                    <div class="col-md-3"><label class="form-label text-xs">Expiry</label><input type="date" name="expiry_date" class="form-control form-control-sm"></div>
                                    <div class="col-md-2"><input type="file" name="file" class="form-control form-control-sm" required></div>
                                    <div class="col-12 text-end"><button class="btn btn-primary btn-sm mb-0"><i class="bi bi-upload me-1"></i>Upload</button></div>
                                </div>
                            </form>
                        </div>
                        @endif
                        <div class="table-responsive"><table class="table table-sm align-items-center mb-0">
                            <thead><tr class="text-xxs text-uppercase text-secondary"><th>Title</th><th>Type</th><th>Expiry</th><th>Uploaded</th><th></th></tr></thead>
                            <tbody>
                            @forelse($staff->documents as $doc)
                                <tr>
                                    <td class="text-sm font-weight-bold">{{ $doc->title }}</td>
                                    <td class="text-sm">{{ ucfirst($doc->type) }}</td>
                                    <td class="text-sm">{{ optional($doc->expiry_date)->format('d/m/y') ?? '—' }}</td>
                                    <td class="text-sm text-muted">{{ $doc->created_at->format('d/m/y') }}</td>
                                    <td class="text-end">
                                        <a href="{{ route('documents.download', $doc) }}" class="text-secondary me-2"><i class="bi bi-download"></i></a>
                                        @if($canManage)
                                        <form action="{{ route('documents.destroy', $doc) }}" method="POST" class="d-inline" onsubmit="return confirm('Delete this document?')">
                                            @csrf @method('DELETE')<button class="btn btn-link p-0 text-danger"><i class="bi bi-trash"></i></button>
                                        </form>@endif
                                    </td>
                                </tr>
                            @empty
                                <tr><td colspan="5" class="text-center text-muted py-3">No documents uploaded.</td></tr>
                            @endforelse
                            </tbody>
                        </table></div>
                    </div>

                    {{-- PAYSLIPS --}}
                    <div class="tab-pane fade" id="tab-payslips">
                        <div class="table-responsive"><table class="table table-sm align-items-center mb-0">
                            <thead><tr class="text-xxs text-uppercase text-secondary"><th>Period</th><th>Nett Pay</th><th>Status</th><th></th></tr></thead>
                            <tbody>
                            @forelse($staff->payslips as $p)
                                <tr>
                                    <td class="text-sm font-weight-bold">{{ $p->periodLabel() }}</td>
                                    <td class="text-sm">RM {{ number_format($p->nett_pay, 2) }}</td>
                                    <td><span class="badge bg-{{ $p->status==='finalized'?'success':'secondary' }}">{{ ucfirst($p->status) }}</span></td>
                                    <td class="text-end">
                                        @if(auth()->user()->isAdmin() || auth()->user()->isFinance())<a href="{{ route('payroll.show', $p) }}" class="text-secondary me-2"><i class="bi bi-eye"></i></a>@endif
                                        @if($p->status==='finalized')<a href="{{ route('payslips.pdf', $p) }}" class="text-secondary"><i class="bi bi-file-earmark-pdf"></i></a>@endif
                                    </td>
                                </tr>
                            @empty
                                <tr><td colspan="4" class="text-center text-muted py-3">No payslips yet.</td></tr>
                            @endforelse
                            </tbody>
                        </table></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection