@extends('user::layouts/panel')

@push('meta')
<meta name="time-sheet-show-url" content="{{ route('panel.task.time-sheets.show', ['year' => ':year', 'week' => ':week']) }}">
@endpush

@push('module-links')
<link rel="stylesheet" href="{{ Module::asset('task:css/time-sheet/index.css') }}">
@endpush

@section('module-content')
<div class="container-fluid py-4">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="card shadow-sm border-0">
                <div class="card-header bg-white py-3">
                    <h5 class="text-primary fw-bold mb-0">
                        <i class="fas fa-calendar-week me-2"></i>選擇工時記錄週期
                    </h5>
                </div>
                <div class="card-body p-4">
                    <form method="GET" action="{{ route('panel.task.time-sheets') }}" class="row g-4">
                        <div class="col-md-8">
                            <label for="week" class="form-label fw-bold mb-3">請選擇週次</label>
                            <select id="week" name="week" class="form-select form-select-lg">
                                @foreach($weeks as $value => $label)
                                    @php
                                        list($yearOption, $weekOption) = explode('-', $value);
                                    @endphp
                                    <option value="{{ $value }}" {{ ($yearOption == $currentYear && $weekOption == $currentWeek) ? 'selected' : '' }}>
                                        {{ $label }}
                                    </option>
                                @endforeach
                            </select>
                        </div>

                        <div class="col-md-4 d-flex align-items-end">
                            <button type="button" id="view-button" class="btn btn-primary btn-lg w-100">
                                <i class="fas fa-search me-2"></i>檢視工時記錄
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

@push('module-scripts')
<script src="{{ Module::asset('task:js/time-sheet/index.js') }}"></script>
@endpush
@endsection