@extends('layout.layout')

@php
$title='Jadwal Sidang';
$subTitle = 'Jadwal Sidang';
$script = '
<script src="' . asset('assets/js/backend/jadwal/full-calendar.js') . '"></script>
<script src="' . asset('assets/js/backend/jadwal/flatpickr.js') . '"></script>
<script src="' . asset('assets/js/backend/jadwal/pagination.js') . '"></script>
<script src="' . asset('assets/js/backend/jadwal/datepickr.js') . '"></script>';
@endphp

@section('content')

<div class="row gy-4">
    <div class="col-xxl-3 col-lg-4">
        <div class="card h-100 p-0">
            <div class="card-body p-24">
                <div class="d-flex justify-content-center">
                    <button type="button" class="btn btn-primary text-sm btn-sm px-12 py-12 w-100 radius-8 d-flex align-items-center justify-items-center gap-2 mb-32" data-bs-toggle="modal" data-bs-target="#exampleModal">
                        <iconify-icon icon="fa6-regular:square-plus" class="icon text-lg line-height-1"></iconify-icon>
                        Buat Jadwal
                    </button>
                </div>

                <div class="mb-24 document-type-filter">
                    <h6 class="text-primary-light fw-semibold mb-12">Filter Jenis Dokumen</h6>
                    <div class="position-relative">
                        <select id="document_type_filter" class="form-select radius-8">
                            <option value="all" {{ request('document_type') == '' ? 'selected' : '' }}>Semua Jenis Dokumen</option>
                            <option value="amdal" {{ request('document_type') == 'amdal' ? 'selected' : '' }}>AMDAL</option>
                            <option value="pertek" {{ request('document_type') == 'pertek' ? 'selected' : '' }}>PERTEK</option>
                            <option value="andal_rkl_rpl" {{ request('document_type') == 'andal_rkl_rpl' ? 'selected' : '' }}>ANDAL RKL-RPL</option>
                            <option value="addendum" {{ request('document_type') == 'addendum' ? 'selected' : '' }}>ADDENDUM</option>
                            <option value="dplh" {{ request('document_type') == 'dplh' ? 'selected' : '' }}>DPLH</option>
                            <option value="delh" {{ request('document_type') == 'delh' ? 'selected' : '' }}>DELH</option>
                            <option value="ukl_upl" {{ request('document_type') == 'ukl_upl' ? 'selected' : '' }}>UKL-UPL</option>
                        </select>
                    </div>
                </div>

                <div class="mt-32">
                    <div class="event-item d-flex align-items-center justify-content-between gap-4 pb-16 mb-16 border border-start-0 border-end-0 border-top-0">
                        <div class="d-flex flex-column">
                            <div class="d-flex flex-column gap-10">
                                <div class="mt-2">
                                    <span class="badge bg-info-100 text-info-600 fw-medium radius-4 text-xs px-8 py-4">AMDAL</span>
                                </div>
                                <span class="text-secondary-light text-sm">Today, 10:30 PM - 02:30 AM</span>
                            </div>
                            <span class="text-primary-light fw-bold text-md mt-4 text-uppercase">PT. Mitra Usaha Sejahtera</span>

                        </div>
                        <div class="dropdown">
                            <button type="button" data-bs-toggle="dropdown" aria-expanded="false">
                                <iconify-icon icon="entypo:dots-three-vertical" class="icon text-secondary-light"></iconify-icon>
                            </button>
                            <ul class="dropdown-menu p-12 border bg-base shadow">
                                <li>
                                    <button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalView">
                                        <iconify-icon icon="hugeicons:view" class="icon text-lg line-height-1"></iconify-icon>
                                        View
                                    </button>
                                </li>
                                <li>
                                    <button type="button" class="dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-neutral-200 text-hover-neutral-900 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalEdit">
                                        <iconify-icon icon="lucide:edit" class="icon text-lg line-height-1"></iconify-icon>
                                        Edit
                                    </button>
                                </li>
                                <li>
                                    <button type="button" class="delete-item dropdown-item px-16 py-8 rounded text-secondary-light bg-hover-danger-100 text-hover-danger-600 d-flex align-items-center gap-10" data-bs-toggle="modal" data-bs-target="#exampleModalDelete">
                                        <iconify-icon icon="fluent:delete-24-regular" class="icon text-lg line-height-1"></iconify-icon>
                                        Delete
                                    </button>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <div class="col-xxl-9 col-lg-8">
        <div class="card h-100 p-0">
            <div class="card-body p-24">
                <div id='wrap'>
                    <div id='calendar'></div>
                    <div style='clear:both'></div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Modal Add Jadwal -->
@include('components.backend.jadwal.modal_add')

<!-- Modal View Jadwal -->
@include('components.backend.jadwal.modal_view')

<!-- Modal Edit Jadwal -->
@include('components.backend.jadwal.modal_edit')

<!-- Modal Delete Jadwal -->
@include('components.backend.jadwal.modal_delete')

<!-- JS Filter -->
@include('components.backend.jadwal.filter')

@endsection