@extends('layouts.app')

@section('title', 'Team Weekly Schedules')
@section('page-title', 'Team Weekly Schedule Management')

@section('styles')
<style>
    .schedule-table {
        font-size: 0.85rem;
    }
    .schedule-table th, .schedule-table td {
        vertical-align: top;
        padding: 0.5rem;
    }
    .client-badge {
        background: #e9ecef;
        padding: 2px 6px;
        border-radius: 4px;
        font-size: 0.75rem;
        margin: 2px;
        display: inline-block;
    }
    .status-badge {
        font-size: 0.7rem;
        padding: 2px 8px;
    }
    .week-nav {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 20px;
    }
    .leader-own-row {
        background-color: #e8f4f8;
    }
</style>
@endsection

@section('content')
@php
    // Calculate dates for the week
    $startOfWeek = Carbon\Carbon::now()->setISODate($currentYear, $currentWeek)->startOfWeek(Carbon\Carbon::SUNDAY);
    $dates = [
        'sunday' => $startOfWeek->copy()->startOfWeek(Carbon\Carbon::SUNDAY)->format('d M Y'),
        'monday' => $startOfWeek->copy()->startOfWeek(Carbon\Carbon::SUNDAY)->addDay(1)->format('d M Y'),
        'tuesday' => $startOfWeek->copy()->startOfWeek(Carbon\Carbon::SUNDAY)->addDay(2)->format('d M Y'),
        'wednesday' => $startOfWeek->copy()->startOfWeek(Carbon\Carbon::SUNDAY)->addDay(3)->format('d M Y'),
        'thursday' => $startOfWeek->copy()->startOfWeek(Carbon\Carbon::SUNDAY)->addDay(4)->format('d M Y'),
    ];
@endphp
<div class="card">
    <div class="card-header">
        <h6 class="mb-0"><i class="fas fa-calendar-week me-2"></i>Weekly Schedule - Week {{ $currentWeek }}, {{ $currentYear }}</h6>
    </div>
    <div class="card-body">
        <!-- Week Navigation -->
        <div class="week-nav">
            <a href="{{ route('leader.weekly-schedule.index', ['week' => $currentWeek - 1, 'year' => $currentYear]) }}" class="btn btn-sm btn-secondary">
                <i class="fas fa-chevron-left"></i> Previous Week
            </a>
            <div>
                <form method="GET" action="{{ route('leader.weekly-schedule.index') }}" class="d-inline">
                    <input type="number" name="week" value="{{ $currentWeek }}" class="form-control form-control-sm d-inline" style="width: 80px;">
                    <input type="number" name="year" value="{{ $currentYear }}" class="form-control form-control-sm d-inline" style="width: 80px;">
                    <button type="submit" class="btn btn-sm btn-primary">Go</button>
                </form>
                <a href="{{ route('leader.weekly-schedule.report', ['week' => $currentWeek, 'year' => $currentYear]) }}" class="btn btn-sm btn-info ms-2">
                    <i class="fas fa-chart-bar"></i> View Report
                </a>
                <button type="button" class="btn btn-sm btn-success ms-2" onclick="approveAll()">
                    <i class="fas fa-check-double"></i> Approve All
                </button>
            </div>
            <a href="{{ route('leader.weekly-schedule.index', ['week' => $currentWeek + 1, 'year' => $currentYear]) }}" class="btn btn-sm btn-secondary">
                Next Week <i class="fas fa-chevron-right"></i>
            </a>
        </div>
        
        <!-- Schedule Table -->
        <div class="table-responsive">
            <table class="table table-bordered schedule-table">
                <thead class="table-light">
                    <tr>
                        <th style="width: 120px;">Team Member</th>
                        <th style="width: 15%;">
                            Sunday<br>
                            <small class="text-muted">{{ $dates['sunday'] }}</small>
                        </th>
                        <th style="width: 15%;">
                            Monday<br>
                            <small class="text-muted">{{ $dates['monday'] }}</small>
                        </th>
                        <th style="width: 15%;">
                            Tuesday<br>
                            <small class="text-muted">{{ $dates['tuesday'] }}</small>
                        </th>
                        <th style="width: 15%;">
                            Wednesday<br>
                            <small class="text-muted">{{ $dates['wednesday'] }}</small>
                        </th>
                        <th style="width: 15%;">
                            Thursday<br>
                            <small class="text-muted">{{ $dates['thursday'] }}</small>
                        </th>
                        <th style="width: 80px;">Status</th>
                        <th style="width: 100px;">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($teamMembers as $member)
                    @php
                        $memberSchedules = $schedules[$member->id] ?? collect();
                        $allDaysFilled = true;
                        $daysCount = 0;
                        $submittedCount = 0;
                        $approvedCount = 0;
                        $hasContent = false;
                        
                        foreach(['sunday', 'monday', 'tuesday', 'wednesday', 'thursday'] as $day) {
                            $schedule = $memberSchedules->firstWhere('day_of_week', $day);
                            $clients = $schedule->clients ?? [];
                            if(count($clients) > 0) {
                                $daysCount++;
                                $hasContent = true;
                            }
                            if($schedule && $schedule->status == 'submitted') $submittedCount++;
                            if($schedule && $schedule->status == 'approved') $approvedCount++;
                        }
                        $overallStatus = $approvedCount > 0 ? 'approved' : ($submittedCount > 0 ? 'submitted' : ($hasContent ? 'draft' : 'empty'));
                        $rowClass = ($member->isTeamLeader()) ? 'leader-own-row' : '';
                    @endphp
                    <tr class="{{ $rowClass }}">
                        <td>
                            <strong>{{ $member->name }}</strong>
                            <br><small class="text-muted">{{ ucfirst($member->role) }}</small>
                            @if($member->isTeamLeader())
                                <br><span class="badge bg-primary">You</span>
                            @endif
                        </td>
                        
                        @foreach(['sunday', 'monday', 'tuesday', 'wednesday', 'thursday'] as $day)
                        @php
                            $schedule = $memberSchedules->firstWhere('day_of_week', $day);
                            $clients = $schedule->clients ?? [];
                            $notes = $schedule->notes ?? '';
                        @endphp
                        <td>
                            @if(count($clients) > 0)
                                @foreach($clients as $index => $client)
                                    <div class="client-badge">
                                        {{ $index + 1 }}. {{ $client['company_name'] ?? $client['name'] ?? 'Client' }}
                                        @if(isset($client['address']))
                                            <br><small class="text-muted">{{ $client['address'] }}</small>
                                        @endif
                                    </div>
                                @endforeach
                                @if($notes)
                                    <small class="text-muted d-block mt-1">
                                        <i class="fas fa-sticky-note"></i> {{ Str::limit($notes, 40) }}
                                    </small>
                                @endif
                            @else
                                <span class="text-muted">—</span>
                            @endif
                        </td>
                        @endforeach
                        
                        <td>
                            @if($overallStatus == 'approved')
                                <span class="badge bg-success status-badge">Approved</span>
                            @elseif($overallStatus == 'submitted')
                                <span class="badge bg-warning status-badge">Submitted</span>
                            @elseif($overallStatus == 'draft')
                                <span class="badge bg-info status-badge">Draft</span>
                            @else
                                <span class="badge bg-secondary status-badge">Not Set</span>
                            @endif
                        </td>
                        
                        <td>
                            <div class="btn-group-vertical btn-group-sm w-100">
                                <!-- Edit Full Week Button -->
                                <a href="{{ route('leader.weekly-schedule.edit-full-week', ['user_id' => $member->id, 'week' => $currentWeek, 'year' => $currentYear]) }}" 
                                class="btn btn-sm btn-primary">
                                    <i class="fas fa-calendar-week"></i> Edit Full Week
                                </a>
                                
                                @if(!$member->isTeamLeader())
                                                    @if($overallStatus == 'submitted')
                                                        <form method="POST" action="{{ route('leader.weekly-schedule.approve', $member->id) }}" class="d-inline w-100 mt-1">
    @csrf
    <input type="hidden" name="week" value="{{ $currentWeek }}">
    <input type="hidden" name="year" value="{{ $currentYear }}">
    <button type="submit" class="btn btn-sm btn-success w-100" onclick="return confirm('Approve {{ $member->name }}\'s schedule?')">
        <i class="fas fa-check"></i> Accept & Approve
    </button>
</form>
                                                        <button type="button" class="btn btn-sm btn-danger mt-1" 
                                                                data-bs-toggle="modal" 
                                                                data-bs-target="#rejectModal{{ $member->id }}">
                                                            <i class="fas fa-times"></i> Reject
                                                        </button>
                                                    @elseif($overallStatus == 'approved')
                                                        <span class="badge bg-success p-2 mt-1">✓ Approved</span>
                                                    @else
                                                        <span class="badge bg-secondary p-2 mt-1">Awaiting Submission</span>
                                                    @endif
                                                @else
                                                    <span class="badge bg-info p-2 mt-1">Your Schedule</span>
                                                @endif
                                            </div>
                        </td>
                    </tr>
                    
                    <!-- Reject Modal -->
                    @if(!$member->isTeamLeader())
                    <div class="modal fade" id="rejectModal{{ $member->id }}" tabindex="-1">
                        <div class="modal-dialog">
                            <form method="POST" action="{{ route('leader.weekly-schedule.reject', $member->id) }}">
                                @csrf
                                <input type="hidden" name="week" value="{{ $currentWeek }}">
                                <input type="hidden" name="year" value="{{ $currentYear }}">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <h5 class="modal-title">Reject Schedule - {{ $member->name }}</h5>
                                        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                                    </div>
                                    <div class="modal-body">
                                        <div class="mb-3">
                                            <label class="form-label">Reason for Rejection <span class="text-danger">*</span></label>
                                            <textarea name="rejection_reason" class="form-control" rows="3" required></textarea>
                                        </div>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
                                        <button type="submit" class="btn btn-danger">Reject Schedule</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                    @endif
                    @endforeach
                </tbody>
            </table>
        </div>
        
        <!-- Legend -->
        <div class="mt-3 p-2 bg-light rounded">
            <small>
                <span class="badge bg-primary">Edit Schedule</span> - Create or modify daily client visits
                <span class="badge bg-success ms-2">Accept & Approve</span> - Approve member's submitted schedule
                <span class="badge bg-danger ms-2">Reject</span> - Reject with reason
                <span class="badge bg-info ms-2">Leader Row</span> - Your own schedule
            </small>
        </div>
    </div>
</div>

@push('scripts')
<script>
    function approveAll() {
        if(confirm('Approve all submitted schedules for this week?')) {
            var form = document.createElement('form');
            form.method = 'POST';
            form.action = '{{ route("leader.weekly-schedule.approve-all") }}';
            form.innerHTML = '@csrf<input type="hidden" name="week" value="{{ $currentWeek }}"><input type="hidden" name="year" value="{{ $currentYear }}">';
            document.body.appendChild(form);
            form.submit();
        }
    }
</script>
@endpush
@endsection