@extends('layouts.app')
@section('title', 'Housekeeping')
@section('page-title', 'Housekeeping')

@section('content')
<div class="page-header">
    <div>
        <div class="breadcrumb"><a href="{{ route('hotel.dashboard') }}">Dashboard</a><span>/</span>Housekeeping</div>
        <h1>Housekeeping Tasks</h1>
    </div>
    <button onclick="openModal('add-task')" class="btn btn-primary"><i class="fas fa-plus"></i> Add Task</button>
</div>

<div class="stats-grid" style="grid-template-columns:repeat(3,1fr);margin-bottom:20px;">
    @php
        $hotelId = auth()->user()->hotel_id;
        $pending  = \App\Models\HousekeepingTask::where('hotel_id',$hotelId)->where('status','pending')->count();
        $inProg   = \App\Models\HousekeepingTask::where('hotel_id',$hotelId)->where('status','in_progress')->count();
        $done     = \App\Models\HousekeepingTask::where('hotel_id',$hotelId)->where('status','done')->whereDate('updated_at',today())->count();
    @endphp
    <div class="stat-card"><div class="stat-icon red"><i class="fas fa-clock"></i></div><div><div class="stat-value">{{ $pending }}</div><div class="stat-label">Pending</div></div></div>
    <div class="stat-card"><div class="stat-icon yellow"><i class="fas fa-spinner"></i></div><div><div class="stat-value">{{ $inProg }}</div><div class="stat-label">In Progress</div></div></div>
    <div class="stat-card"><div class="stat-icon green"><i class="fas fa-check-double"></i></div><div><div class="stat-value">{{ $done }}</div><div class="stat-label">Done Today</div></div></div>
</div>

<div class="card">
    <div class="filters-bar">
        <form method="GET" style="display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;width:100%;">
            <div class="form-group" style="margin:0;">
                <select name="status" class="form-control">
                    <option value="">All Status</option>
                    <option value="pending" {{ request('status')==='pending'?'selected':'' }}>Pending</option>
                    <option value="in_progress" {{ request('status')==='in_progress'?'selected':'' }}>In Progress</option>
                    <option value="done" {{ request('status')==='done'?'selected':'' }}>Done</option>
                </select>
            </div>
            <div class="form-group" style="margin:0;">
                <input type="date" name="date" class="form-control" value="{{ request('date', date('Y-m-d')) }}">
            </div>
            <button type="submit" class="btn btn-primary btn-sm"><i class="fas fa-filter"></i> Filter</button>
            <a href="{{ route('hotel.housekeeping.index') }}" class="btn btn-outline btn-sm">Reset</a>
        </form>
    </div>

    <div class="table-wrap">
        <table>
            <thead><tr><th>Room</th><th>Task</th><th>Assigned To</th><th>Scheduled</th><th>Status</th><th>Actions</th></tr></thead>
            <tbody>
                @forelse($tasks as $task)
                <tr>
                    <td style="font-weight:700;">Room {{ $task->room->room_number }}</td>
                    <td><span class="badge badge-primary">{{ ucfirst($task->task_type) }}</span>
                        @if($task->note)<div style="font-size:12px;color:#6b7280;margin-top:2px;">{{ Str::limit($task->note,50) }}</div>@endif
                    </td>
                    <td style="font-size:13px;">{{ $task->assignedTo->name ?? 'Unassigned' }}</td>
                    <td style="font-size:13px;">{{ $task->scheduled_date->format('d M Y') }}</td>
                    <td>
                        @if($task->status==='pending') <span class="badge badge-warning">Pending</span>
                        @elseif($task->status==='in_progress') <span class="badge badge-primary">In Progress</span>
                        @else <span class="badge badge-success">Done</span> @endif
                    </td>
                    <td>
                        @if($task->status !== 'done')
                        <div style="display:flex;gap:4px;">
                            @if($task->status === 'pending')
                            <form method="POST" action="{{ route('hotel.housekeeping.status', $task) }}">@csrf
                                <input type="hidden" name="status" value="in_progress">
                                <button type="submit" class="btn btn-sm btn-primary" title="Start"><i class="fas fa-play"></i></button>
                            </form>
                            @endif
                            <form method="POST" action="{{ route('hotel.housekeeping.status', $task) }}">@csrf
                                <input type="hidden" name="status" value="done">
                                <button type="submit" class="btn btn-sm btn-success" title="Mark Done"><i class="fas fa-check"></i></button>
                            </form>
                        </div>
                        @else
                        <span style="font-size:12px;color:#6b7280;">{{ $task->completed_at?->format('H:i') }}</span>
                        @endif
                    </td>
                </tr>
                @empty
                <tr><td colspan="6"><div class="empty-state"><i class="fas fa-broom"></i><h3>No tasks</h3></div></td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($tasks->hasPages())<div class="card-footer">{{ $tasks->links() }}</div>@endif
</div>

<!-- Add Task Modal -->
<div class="modal-overlay" id="add-task">
    <div class="modal">
        <div class="modal-header"><span class="modal-title">Add Housekeeping Task</span><button class="modal-close" onclick="closeModal('add-task')">×</button></div>
        <form method="POST" action="{{ route('hotel.housekeeping.store') }}">@csrf
            <div class="modal-body">
                <div class="form-group">
                    <label class="form-label">Room <span class="required">*</span></label>
                    <select name="room_id" class="form-control" required>
                        <option value="">— Select room —</option>
                        @foreach($rooms as $room)
                            <option value="{{ $room->id }}">Room {{ $room->room_number }} ({{ $room->status }})</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-row">
                    <div class="form-group">
                        <label class="form-label">Task Type <span class="required">*</span></label>
                        <select name="task_type" class="form-control" required>
                            <option value="cleaning">Cleaning</option>
                            <option value="inspection">Inspection</option>
                            <option value="maintenance">Maintenance</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label class="form-label">Scheduled Date <span class="required">*</span></label>
                        <input type="date" name="scheduled_date" class="form-control" required value="{{ date('Y-m-d') }}">
                    </div>
                </div>
                <div class="form-group">
                    <label class="form-label">Assign To</label>
                    <select name="assigned_to" class="form-control">
                        <option value="">— Unassigned —</option>
                        @foreach($staff as $member)
                            <option value="{{ $member->id }}">{{ $member->name }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group">
                    <label class="form-label">Note</label>
                    <textarea name="note" class="form-control" rows="2" placeholder="Any specific instructions..."></textarea>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-outline" onclick="closeModal('add-task')">Cancel</button>
                <button type="submit" class="btn btn-primary"><i class="fas fa-plus"></i> Add Task</button>
            </div>
        </form>
    </div>
</div>
@endsection