@extends('layouts.main')

@section('content')

<main class="flex-1 overflow-y-auto p-4 md:p-8 bg-gray-50">

    <div class="mb-6">

        <a href="{{ route('admin.desa.index') }}"
            class="inline-flex items-center text-blue-700 font-medium hover:text-blue-900 mb-4">
            <i class="fas fa-chevron-left mr-2"></i>
            Kembali
        </a>

        <h2 class="text-2xl font-bold text-gray-900 uppercase">
            Tambah Data Desa
        </h2>

    </div>


    <form action="{{ route('admin.desa.store') }}" method="POST">

        @csrf


        {{-- ================= INFORMASI DESA ================= --}}

        <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">

            <h3 class="text-blue-700 font-bold uppercase text-sm mb-5">
                Informasi Desa
            </h3>


            <div class="grid md:grid-cols-2 gap-5">

                <div>

                    <label class="block text-sm font-semibold text-gray-700 mb-2">
                        Nama Desa
                    </label>

                    <input 
                        type="text"
                        name="nama_desa"
                        value="{{ old('nama_desa') }}"
                        placeholder="Masukkan nama desa"
                        class="w-full px-4 py-3 bg-white border border-gray-300 rounded-lg text-gray-800 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">


                </div>

            </div>


        </div>




        {{-- ================= KEPENDUDUKAN ================= --}}


        <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">


            <h3 class="text-blue-700 font-bold uppercase text-sm mb-5">
                Data Kependudukan
            </h3>


            <div class="grid grid-cols-1 md:grid-cols-3 xl:grid-cols-5 gap-5">


                @php

                $penduduk = [

                    'jumlah_penduduk'=>'Jumlah Penduduk',
                    'jumlah_kk'=>'Jumlah KK',
                    'laki_laki'=>'Laki-laki',
                    'perempuan'=>'Perempuan',
                    'balita'=>'Balita',
                    'lansia'=>'Lansia',
                    'desil_1'=>'Desil 1',
                    'desil_2'=>'Desil 2',
                    'desil_3'=>'Desil 3',
                    'desil_4'=>'Desil 4'

                ];

                @endphp



                @foreach($penduduk as $field=>$label)


                <div>


                    <label class="block text-sm font-semibold text-gray-700 mb-2">
                        {{ $label }}
                    </label>


                    <input
                        type="number"
                        name="{{ $field }}"
                        value="{{ old($field) }}"
                        class="w-full px-4 py-3 bg-white border border-gray-300 rounded-lg text-gray-800 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">


                </div>


                @endforeach



            </div>


        </div>






        {{-- ================= SARANA PRASARANA ================= --}}


        <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">


            <h3 class="text-blue-700 font-bold uppercase text-sm mb-5">
                Sarana dan Prasarana
            </h3>


            <div class="grid grid-cols-1 md:grid-cols-3 xl:grid-cols-5 gap-5">


                @php

                $sarana = [

                    'mesjid'=>'Mesjid',
                    'sekolah'=>'Sekolah',
                    'posyandu'=>'Posyandu',
                    'postu_puskesmas'=>'Postu / Puskesmas',
                    'kantor_desa'=>'Kantor Desa'

                ];

                @endphp



                @foreach($sarana as $field=>$label)


                <div>


                    <label class="block text-sm font-semibold text-gray-700 mb-2">
                        {{ $label }}
                    </label>


                    <input
                        type="number"
                        name="{{ $field }}"
                        value="{{ old($field) }}"
                        class="w-full px-4 py-3 bg-white border border-gray-300 rounded-lg text-gray-800 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">


                </div>


                @endforeach


            </div>


        </div>







        {{-- ================= KESIAPSIAGAAN ================= --}}



        <div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">


            <h3 class="text-blue-700 font-bold uppercase text-sm mb-5">
                Kesiapsiagaan Bencana
            </h3>



            <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-5">



                @php

                $kesiapsiagaan = [

                    'pengetahuan_longsor'=>'Pengetahuan Longsor',
                    'jalur_evakuasi'=>'Jalur Evakuasi',
                    'tempat_evakuasi'=>'Tempat Evakuasi',
                    'tim_penanggulangan'=>'Tim Penanggulangan Bencana',
                    'sosialisasi_bencana'=>'Sosialisasi Bencana',
                    'dana_bencana'=>'Dana Bencana'

                ];


                @endphp




                @foreach($kesiapsiagaan as $field=>$label)


                <div>


                    <label class="block text-sm font-semibold text-gray-700 mb-2">
                        {{ $label }}
                    </label>



                    <select
                        name="{{ $field }}"
                        class="w-full px-4 py-3 bg-white border border-gray-300 rounded-lg text-gray-800 focus:outline-none focus:ring-2 focus:ring-blue-500">


                        <option value="1">
                            Ada
                        </option>


                        <option value="0">
                            Tidak Ada
                        </option>


                    </select>


                </div>


                @endforeach



            </div>


        </div>






        {{-- ================= BUTTON ================= --}}


        <div class="flex justify-end gap-3">


            <a href="{{ route('admin.desa.index') }}"
                class="px-6 py-3 rounded-lg bg-white border border-gray-300 text-gray-700 hover:bg-gray-100">

                Batal

            </a>



            <button type="submit"
                class="px-6 py-3 rounded-lg bg-blue-600 text-white hover:bg-blue-700">

                <i class="fas fa-save mr-2"></i>

                Simpan Data

            </button>


        </div>



    </form>


</main>


@endsection