@extends('layouts.admin.master')
@php
    $is_edit = isset($edit);
    $min = $is_edit ? 2 : 1;
    $id = $is_edit ? $kegiatan->id : '';
    $route = $is_edit ? route(h_prefix('update', $min)) : route(h_prefix('insert', $min));
    $judul = $is_edit ? $kegiatan->judul : '';
    $deskripsi = $is_edit ? $kegiatan->deskripsi : '';
    $tanggal_mulai = $is_edit ? $kegiatan->tanggal_mulai->format('Y-m-d\TH:i') : '';
    $tanggal_selesai = $is_edit ? $kegiatan->tanggal_selesai->format('Y-m-d\TH:i') : '';
    $lokasi = $is_edit ? $kegiatan->lokasi : '';
    $status = $is_edit ? $kegiatan->status : 'terencana';
    $kategori = $is_edit ? $kegiatan->kategori : 'resmi';
    $prioritas = $is_edit ? $kegiatan->prioritas : 'sedang';
    $catatan_khusus = $is_edit ? $kegiatan->catatan_khusus : '';
    $penanggung_jawab_id = $is_edit ? $kegiatan->penanggung_jawab_id : '';
    $penanggung_jawab_options = $penanggung_jawab_options ?? $penduduks;
    $dokumen = $is_edit ? $kegiatan->dokumen : null;
@endphp

@section('content')
    <div class="card">
        <div class="card-body">
            <div class="card-title d-md-flex flex-row justify-content-between">
                <div>
                    <h6 class="mt-2 text-uppercase">Form {{ $page_attr['title'] }}</h6>
                </div>
                <div>
                    <a href="{{ route('admin.kegiatan.data') }}" class="btn btn-secondary btn-sm">
                        <i class="fas fa-arrow-left me-1"></i> Kembali ke Daftar Kegiatan
                    </a>
                </div>
            </div>
            <hr class="mt-0" />
            <form method="post" action="{{ $route }}" enctype="multipart/form-data" id="MainForm">
                @csrf
                @if($is_edit)
                    @method('PUT')
                @endif

                <div class="row">
                    <div class="col-lg-8">
                        <div class="form-group">
                            <label for="judul">Judul Kegiatan <span class="text-danger">*</span></label>
                            <input type="text" name="judul" id="judul" class="form-control" required
                                placeholder="Judul Kegiatan" value="{{ old('judul', $judul) }}" />
                        </div>

                        <div class="form-group">
                            <label for="deskripsi">Deskripsi Kegiatan</label>
                            <textarea name="deskripsi" id="deskripsi" class="form-control" rows="5"
                                placeholder="Deskripsi lengkap kegiatan">{{ old('deskripsi', $deskripsi) }}</textarea>
                        </div>

                        <div class="form-group">
                            <label for="catatan_khusus">Catatan Khusus</label>
                            <textarea name="catatan_khusus" id="catatan_khusus" class="form-control" rows="3"
                                placeholder="Catatan khusus untuk kegiatan ini">{{ old('catatan_khusus', $catatan_khusus) }}</textarea>
                        </div>

                        <!-- Dokumen Upload Section -->
                        <div class="form-group">
                            <label for="dokumen">Dokumen Undangan/Lampiran</label>
                            <div class="input-group">
                                <input type="file" name="dokumen" id="dokumen" class="form-control"
                                    accept=".pdf,.doc,.docx,.jpg,.jpeg,.png">
                                @if($is_edit && $dokumen)
                                    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#dokumenModal">
                                        <i class="fas fa-eye me-1"></i> Lihat Dokumen
                                    </button>
                                @endif
                            </div>
                            <small class="text-muted">Format: PDF, DOC/DOCX, JPG/PNG (Maks. 5MB)</small>
                        </div>
                    </div>

                    <div class="col-lg-4">
                        <div class="row">
                            <div class="col-12">
                                <input type="hidden" name="id" id="id" value="{{ $id }}" />

                                <div class="form-group">
                                    <label for="penanggung_jawab_id">Penanggung Jawab <span class="text-danger">*</span></label>
                                    <select class="form-control select2" id="penanggung_jawab_id" name="penanggung_jawab_id" required>
                                        <option value="">Pilih Penanggung Jawab</option>
                                        @foreach ($penanggung_jawab_options as $p)
                                            <option value="{{ $p->id }}" {{ old('penanggung_jawab_id', $penanggung_jawab_id) == $p->id ? 'selected' : '' }}>
                                                {{ $p->nama }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="tanggal_mulai">Tanggal Mulai <span class="text-danger">*</span></label>
                                    <input type="datetime-local" name="tanggal_mulai" id="tanggal_mulai"
                                        class="form-control" required value="{{ old('tanggal_mulai', $tanggal_mulai) }}" />
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="tanggal_selesai">Tanggal Selesai <span class="text-danger">*</span></label>
                                    <input type="datetime-local" name="tanggal_selesai" id="tanggal_selesai"
                                        class="form-control" required value="{{ old('tanggal_selesai', $tanggal_selesai) }}" />
                                </div>
                            </div>

                            <div class="col-12">
                                <div class="form-group">
                                    <label for="lokasi">Lokasi <span class="text-danger">*</span></label>
                                    <input type="text" name="lokasi" id="lokasi" class="form-control" required
                                        placeholder="Lokasi Kegiatan" value="{{ old('lokasi', $lokasi) }}" />
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="status">Status <span class="text-danger">*</span></label>
                                    <select class="form-control" id="status" name="status" required>
                                        @foreach (App\Models\Kegiatan\Kegiatan::$statuses as $key => $value)
                                            <option value="{{ $key }}" {{ old('status', $status) == $key ? 'selected' : '' }}>
                                                {{ $value }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <div class="col-md-6">
                                <div class="form-group">
                                    <label for="kategori">Kategori <span class="text-danger">*</span></label>
                                    <select class="form-control" id="kategori" name="kategori" required>
                                        <option value="resmi" {{ old('kategori', $kategori) == 'resmi' ? 'selected' : '' }}>Resmi</option>
                                        <option value="non-resmi" {{ old('kategori', $kategori) == 'non-resmi' ? 'selected' : '' }}>Non-Resmi</option>
                                        <option value="lainnya" {{ old('kategori', $kategori) == 'lainnya' ? 'selected' : '' }}>Lainnya</option>
                                    </select>
                                </div>
                            </div>

                            <div class="col-12">
                                <div class="form-group">
                                    <label for="prioritas">Prioritas <span class="text-danger">*</span></label>
                                    <select class="form-control" id="prioritas" name="prioritas" required>
                                        <option value="tinggi" {{ old('prioritas', $prioritas) == 'tinggi' ? 'selected' : '' }}>Tinggi</option>
                                        <option value="sedang" {{ old('prioritas', $prioritas) == 'sedang' ? 'selected' : '' }}>Sedang</option>
                                        <option value="rendah" {{ old('prioritas', $prioritas) == 'rendah' ? 'selected' : '' }}>Rendah</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
            <div class="text-end">
                <button type="submit" class="btn btn-success" form="MainForm">
                    <i class="fas fa-save me-1"></i> Simpan
                </button>
            </div>
        </div>
    </div>

    <!-- Dokumen Preview Modal -->
    @if($is_edit && $dokumen)
    <div class="modal fade" id="dokumenModal" tabindex="-1" aria-labelledby="dokumenModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="dokumenModalLabel">Preview Dokumen</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    @if(pathinfo($dokumen, PATHINFO_EXTENSION) === 'pdf')
                        <iframe src="{{ asset('storage/' . $dokumen) }}" width="100%" height="500px" style="border: none;"></iframe>
                    @elseif(in_array(pathinfo($dokumen, PATHINFO_EXTENSION), ['jpg', 'jpeg', 'png']))
                        <img src="{{ asset('storage/' . $dokumen) }}" class="img-fluid" alt="Dokumen Kegiatan">
                    @else
                        <div class="alert alert-info">
                            Dokumen tidak dapat dipreview. Silahkan download untuk melihat.
                        </div>
                        <a href="{{ asset('storage/' . $dokumen) }}" class="btn btn-primary" download>
                            <i class="fas fa-download me-1"></i> Download Dokumen
                        </a>
                    @endif
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button>
                    <a href="{{ asset('storage/' . $dokumen) }}" class="btn btn-primary" download>
                        <i class="fas fa-download me-1"></i> Download
                    </a>
                </div>
            </div>
        </div>
    </div>
    @endif
@endsection

@section('stylesheet')
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0-rc.0/css/select2.min.css"/>
    <link rel="stylesheet" href="{{ asset('assets/templates/admin/plugins/select2/css/select2-bootstrap-5-theme.min.css') }}" />
    <style>
        .select2-selection__rendered {
            line-height: 36px !important;
        }
        .select2-container .select2-selection--single {
            height: 38px !important;
        }
        .select2-selection__arrow {
            height: 36px !important;
        }
        #dokumenModal iframe {
            min-height: 500px;
        }
    </style>
@endsection

@section('javascript')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert2/11.10.3/sweetalert2.all.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0-rc.0/js/select2.full.min.js"></script>
    <script src="{{ asset('assets/templates/admin/plugins/select2/js/select2-custom.js') }}"></script>
    @php
        $resource = resource_loader(
            blade_path: $view,
            params: [
                'min' => $min,
                'route' => $route,
                'is_edit' => $is_edit,
                'page_title' => $page_attr['title'],
            ],
        );
    @endphp
    <script src="{{ $resource }}"></script>
@endsection