@extends('layouts.app')

@section('title', 'Edit Event Kalender - SIAKAD')
@section('page-title', 'Edit Event Kalender Akademik')

@section('content')
<div class="row">
    <div class="col-lg-8">
        <div class="card">
            <div class="card-header">
                <h5 class="mb-0"><i class="bi bi-pencil me-2"></i>Form Edit Event</h5>
            </div>
            <div class="card-body">
                <form action="{{ route('admin.academic-calendar.update', $academicCalendar) }}" method="POST">
                    @csrf
                    @method('PUT')

                    <div class="mb-3">
                        <label class="form-label">Judul Event <span class="text-danger">*</span></label>
                        <input type="text" name="title" class="form-control @error('title') is-invalid @enderror" value="{{ old('title', $academicCalendar->title) }}" placeholder="Contoh: Ujian Tengah Semester Ganjil 2025/2026" required>
                        @error('title')
                        <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Tanggal Mulai <span class="text-danger">*</span></label>
                                <input type="date" name="start_date" class="form-control @error('start_date') is-invalid @enderror" value="{{ old('start_date', $academicCalendar->start_date->format('Y-m-d')) }}" required>
                                @error('start_date')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Tanggal Selesai <span class="text-danger">*</span></label>
                                <input type="date" name="end_date" class="form-control @error('end_date') is-invalid @enderror" value="{{ old('end_date', $academicCalendar->end_date->format('Y-m-d')) }}" required>
                                @error('end_date')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Tipe Event <span class="text-danger">*</span></label>
                                <select name="event_type" class="form-select @error('event_type') is-invalid @enderror" required>
                                    @foreach($eventTypes as $key => $type)
                                    <option value="{{ $key }}" {{ old('event_type', $academicCalendar->event_type) == $key ? 'selected' : '' }}>{{ $type }}</option>
                                    @endforeach
                                </select>
                                @error('event_type')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Warna <span class="text-danger">*</span></label>
                                <select name="color" class="form-select @error('color') is-invalid @enderror" required>
                                    @foreach($colors as $key => $color)
                                    <option value="{{ $key }}" {{ old('color', $academicCalendar->color) == $key ? 'selected' : '' }}>{{ $color }}</option>
                                    @endforeach
                                </select>
                                @error('color')
                                <div class="invalid-feedback">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                    </div>

                    <div class="mb-3">
                        <label class="form-label">Deskripsi</label>
                        <textarea name="description" class="form-control" rows="3" placeholder="Deskripsi tambahan (opsional)">{{ old('description', $academicCalendar->description) }}</textarea>
                    </div>

                    <div class="row">
                        <div class="col-md-4">
                            <div class="mb-3 form-check">
                                <input type="checkbox" name="is_active" class="form-check-input" id="isActive" {{ old('is_active', $academicCalendar->is_active) ? 'checked' : '' }}>
                                <label class="form-check-label" for="isActive">Event Aktif</label>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="mb-3 form-check">
                                <input type="checkbox" name="is_annual" class="form-check-input" id="isAnnual" {{ old('is_annual', $academicCalendar->is_annual) ? 'checked' : '' }}>
                                <label class="form-check-label" for="isAnnual">Event Tahunan</label>
                            </div>
                        </div>
                    </div>

                    <hr class="my-4">
                    <h6 class="mb-3"><i class="bi bi-eye me-2"></i>Pengaturan Tampilan</h6>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3 form-check">
                                <input type="checkbox" name="show_to_dosen" class="form-check-input" id="showDosen" {{ old('show_to_dosen', $academicCalendar->show_to_dosen) ? 'checked' : '' }}>
                                <label class="form-check-label" for="showDosen">
                                    <span class="badge bg-primary"><i class="bi bi-mortarboard"></i></span> Tampilkan ke Dosen
                                </label>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3 form-check">
                                <input type="checkbox" name="show_to_mahasiswa" class="form-check-input" id="showMhs" {{ old('show_to_mahasiswa', $academicCalendar->show_to_mahasiswa) ? 'checked' : '' }}>
                                <label class="form-check-label" for="showMhs">
                                    <span class="badge bg-success"><i class="bi bi-person"></i></span> Tampilkan ke Mahasiswa
                                </label>
                            </div>
                        </div>
                    </div>

                    <div class="d-flex gap-2 mt-4">
                        <button type="submit" class="btn btn-primary">
                            <i class="bi bi-check-lg me-2"></i>Update Event
                        </button>
                        <a href="{{ route('admin.academic-calendar.index') }}" class="btn btn-secondary">
                            <i class="bi bi-x-lg me-2"></i>Batal
                        </a>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="col-lg-4">
        <div class="card">
            <div class="card-header">
                <h6 class="mb-0"><i class="bi bi-info-circle me-2"></i>Preview Warna</h6>
            </div>
            <div class="card-body">
                <div class="d-flex flex-wrap gap-2">
                    @foreach($colors as $key => $color)
                    <div class="text-center">
                        <span class="badge bg-{{ $key }} {{ $academicCalendar->color == $key ? 'opacity-100' : 'opacity-50' }}" style="padding: 12px 16px; font-size: 14px;">
                            <i class="bi bi-circle-fill"></i>
                        </span>
                        <small class="d-block mt-1 text-muted">{{ $color }}</small>
                    </div>
                    @endforeach
                </div>
            </div>
        </div>

        <div class="card mt-3">
            <div class="card-header">
                <h6 class="mb-0"><i class="bi bi-list-check me-2"></i>Tipe Event</h6>
            </div>
            <div class="card-body p-0">
                <ul class="list-group list-group-flush">
                    @foreach($eventTypes as $key => $type)
                    <li class="list-group-item d-flex justify-content-between align-items-center {{ $academicCalendar->event_type == $key ? 'bg-light' : '' }}">
                        <span>{{ $type }}</span>
                        <code class="small">{{ $key }}</code>
                    </li>
                    @endforeach
                </ul>
            </div>
        </div>
    </div>
</div>

<style>
    .badge.bg-primary { background-color: #696cff !important; }
    .badge.bg-success { background-color: #02c39a !important; }
    .badge.bg-danger { background-color: #ff4b4b !important; }
    .badge.bg-warning { background-color: #fcb02c !important; }
    .badge.bg-info { background-color: #03c3ff !important; }
    .badge.bg-purple { background-color: #9c27b0 !important; }
    .badge.bg-pink { background-color: #e91e63 !important; }
    .badge.bg-orange { background-color: #ff9800 !important; }
</style>
@endsection