@extends('layouts.app')

@section('content')
<h1>{{ __('messages.approvals') }}</h1>

<div class="card table-wrap">
    <table>
        <thead>
        <tr>
            <th>{{ __('messages.employee') }}</th>
            <th>{{ __('messages.branch') }}</th>
            <th>{{ __('messages.clock_in') }}</th>
            <th>{{ __('messages.clock_out') }}</th>
            <th>{{ __('messages.reason') }}</th>
            <th>{{ __('messages.distance') }}</th>
            <th>{{ __('messages.actions') }}</th>
        </tr>
        </thead>
        <tbody>
        @forelse($logs as $log)
            <tr>
                <td>{{ $log->employee?->name }}<br><small>{{ $log->employee?->employee_code }}</small></td>
                <td>{{ $log->branch?->name }}</td>
                <td>{{ optional($log->clock_in_time)->format('Y-m-d H:i') }}</td>
                <td>{{ optional($log->clock_out_time)->format('Y-m-d H:i') ?? '-' }}</td>
                <td>{{ $log->approval_reason }}</td>
                <td>In: {{ $log->clock_in_distance_meters }}m<br>Out: {{ $log->clock_out_distance_meters ?? '-' }}m</td>
                <td>
                    <form method="post" action="{{ route('approvals.approve', $log) }}" class="stack">
                        @csrf
                        <input name="manager_note" placeholder="{{ __('messages.manager_note') }}">
                        <button class="btn btn-success">{{ __('messages.approve') }}</button>
                    </form>
                    <form method="post" action="{{ route('approvals.reject', $log) }}" class="stack">
                        @csrf
                        <input name="manager_note" placeholder="{{ __('messages.rejection_reason') }}" required>
                        <button class="btn btn-danger">{{ __('messages.reject') }}</button>
                    </form>
                </td>
            </tr>
        @empty
            <tr><td colspan="7">{{ __('messages.no_records') }}</td></tr>
        @endforelse
        </tbody>
    </table>
    {{ $logs->links() }}
</div>
@endsection