@extends('layout/base')

@section('content')
<section class="contact-page py-4">
    <div class="container">
        <h1 class="main-heading">
            Form Pendaftaran Umrah
            <div class="accent"></div>
        </h1>

        @if(session()->has('message'))
            <div class="alert alert-success mt-5">
                {{ session()->get('message') }}
            </div>
        @endif

        @if ($errors->any())
            <div class="alert alert-danger mt-5">
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif

        <div class="row mb-5">
            <div class="col-lg-8">
                <form method="post" action="{{ route('register-submit', ['package' => $package]) }}" class="bg-white p-4">
                    @csrf
                    <div class="row">
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Title <code>*</code></label><br>
                            <div class="form-check form-check-inline">
                                <label class="form-check-label">
                                    <input class="form-check-input" type="radio" name="title" value="mr" required> Tuan
                                </label>
                            </div>
                            <div class="form-check form-check-inline" style="margin-right: 0;">
                                <label class="form-check-label">
                                    <input class="form-check-input" type="radio" name="title" value="mrs"> Nyonya
                                </label>
                            </div>
                        </div>
                        <div class="mb-3 col-lg-5">
                            <label class="form-label">Nama Lengkap <code>*</code></label>
                            <input type="text" name="name" class="form-control" required>
                            <small class="text-muted">nama di Vaksin Covid-19</small>
                        </div>
                        <div class="mb-3 col-lg-4">
                            <label class="form-label">Nama Ayah <code>*</code></label>
                            <input type="text" name="father_name" class="form-control" required>
                        </div>
                    </div>

                    <div class="row">
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Jenis Identitas <code>*</code></label><br>
                            <div class="form-check form-check-inline">
                                <label class="form-check-label">
                                    <input class="form-check-input" type="radio" name="identity_type" value="ktp" required> KTP
                                </label>
                            </div>
                            <div class="form-check form-check-inline">
                                <label class="form-check-label">
                                    <input class="form-check-input" type="radio" name="identity_type" value="sim"> SIM
                                </label>
                            </div>
                        </div>
                        <div class="mb-3 col-lg-5">
                            <label class="form-label">No. Identitas <code>*</code></label>
                            <input type="text" name="identity_number" class="form-control" required>
                        </div>
                        <div class="mb-3 col-lg-4">
                            <label class="form-label">Nama Paspor <code>*</code></label>
                            <input type="text" name="passport_name" class="form-control" required>
                            <small class="text-muted">check juga hal. 4</small>
                        </div>
                    </div>

                    <div class="row">
                        <div class="mb-3 col-lg-4">
                            <label class="form-label">Nomor Paspor <code>*</code></label>
                            <input type="text" name="passport_number" class="form-control" required>
                        </div>
                        <div class="mb-3 col-lg-4">
                            <label class="form-label">Tanggal Dikeluarkan Paspor <code>*</code></label>
                            <input type="date" name="passport_date" class="form-control" required>
                        </div>
                        <div class="mb-3 col-lg-4">
                            <label class="form-label">Kota Paspor <code>*</code></label>
                            <input type="text" name="passport_city" class="form-control" required>
                            <small class="text-muted">Imigrasi yang mengeluarkan</small>
                        </div>
                    </div>

                    <div class="row">
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Tempat Lahir <code>*</code></label>
                            <input type="text" name="birthplace" class="form-control" required>
                        </div>
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Tanggal Lahir <code>*</code></label>
                            <input type="date" name="birthdate" class="form-control" required>
                        </div>
                        <div class="mb-3 col-lg-6">
                            <label class="form-label">Alamat <code>*</code></label>
                            <textarea name="address" class="form-control" rows="2" required></textarea>
                        </div>
                    </div>

                    <div class="row">
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Provinsi <code>*</code></label>
                            <select class="form-control" name="province_id" id="province_id" required>
                                <option value="">- Pilih -</option>
                                @foreach ($provinces as $province)
                                <option value="{{ $province->id }}">{{ $province->name }}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Kota/Kabupaten <code>*</code></label>
                            <select class="form-control" name="local_city_id" id="local_city_id" required disabled>
                                <option value="">- Pilih -</option>
                            </select>
                        </div>
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Kecamatan <code>*</code></label>
                            <select class="form-control" name="district_id" id="district_id" required disabled>
                                <option value="">- Pilih -</option>
                            </select>
                        </div>
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Desa/Kelurahan <code>*</code></label>
                            <select class="form-control" name="sub_district_id" id="sub_district_id" required disabled>
                                <option value="">- Pilih -</option>
                            </select>
                        </div>
                    </div>

                    <div class="row">
                        <div class="mb-3 col-lg-6">
                            <label class="form-label">No. Telepon <code>*</code></label>
                            <input type="text" name="phone" class="form-control" required>
                        </div>
                        <div class="mb-3 col-lg-6">
                            <label class="form-label">No. HP/Whatsapp (aktif) <code>*</code></label>
                            <input type="text" name="whatsapp" class="form-control" required>
                        </div>
                    </div>

                    <div class="row">

                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Kewarganegaraan <code>*</code></label><br>
                            <div class="form-check form-check-inline">
                                <label class="form-check-label">
                                    <input class="form-check-input" type="radio" name="citizenship" value="wni" required> WNI
                                </label>
                            </div>
                            <div class="form-check form-check-inline">
                                <label class="form-check-label">
                                    <input class="form-check-input" type="radio" name="citizenship" value="wna"> WNA
                                </label>
                            </div>
                        </div>
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Status Pernikahan <code>*</code></label>
                            <select class="form-control" name="marital_status" required>
                                <option value="">- Pilih -</option>
                                <option value="1">Kawin</option>
                                <option value="2">Duda</option>
                                <option value="3">Janda</option>
                                <option value="4">Belum Kawin</option>
                            </select>
                        </div>
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Pendidikan terakhir <code>*</code></label>
                            <select class="form-control" name="education" required>
                                <option value="">- Pilih -</option>
                                <option value="sd">SD</option>
                                <option value="smp">SMP</option>
                                <option value="sma">SMA</option>
                                <option value="d1">D1</option>
                                <option value="d2">D2</option>
                                <option value="d3">D3</option>
                                <option value="s1">D4/S1</option>
                                <option value="s2">S2</option>
                                <option value="s3">S3</option>
                            </select>
                        </div>
                        <div class="mb-3 col-lg-3">
                            <label class="form-label">Pekerjaan <code>*</code></label>
                            <select class="form-control" name="occupation" required>
                                <option value="">- Pilih -</option>
                                <option value="1">PNS</option>
                                <option value="2">TNI/POLRI</option>
                                <option value="3">Pedagang</option>
                                <option value="4">Petani/Nelayan</option>
                                <option value="5">Wiraswasta</option>
                                <option value="6">Karyawan Swasta</option>
                                <option value="7">Ibu Rumah Tangga</option>
                                <option value="8">Pelajar/Mahasiswa</option>
                                <option value="9">BUMN/BUMD</option>
                                <option value="10">Tidak Bekerja</option>
                                <option value="11">Lain-lain</option>
                            </select>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-lg-6">
                            <button type="submit" class="btn btn-primary">Submit</button>
                        </div>
                    </div>

                </form>
            </div>
            <div class="col-lg-4">
                <div class="package-image"><img class="img-fluid" src="{{ asset('images/package/'.$package->cover_media) }}" alt=""></div>
                <div class="bg-warning p-4 text-white">

                    <h4 class="mb-3">{{ $package->name }}</h4>

                    <p>
                        <i class="fas fa-plane-departure"></i> Berangkat<br>
                        <time datetime="@date($package->start_at, "Y-m-d")" itemprop="datePublished">@date($package->start_at, "d M Y")</time>
                        &bull; {{ $package->departure->name .' ' . $package->departure->flight_number }}
                    </p>
                    <p>
                        <i class="fas fa-plane-arrival"></i> Pulang<br>
                        <time datetime="@date($package->end_at, "Y-m-d")" itemprop="datePublished">@date($package->end_at, "d M Y")</time>
                        &bull; {{ $package->arrival->name .' ' . $package->arrival->flight_number }}
                    </p>
                    <div class="tour_leader"><i class="fa fa-user-circle"></i> Pembimbing<br> <strong>{{ $package->tour_leader->name }}</strong></div>
                    <div class="price mt-3">
                        <div><i class="fas fa-dollar-sign"></i> Biaya Umrah</div>
                        QUAD = USD {{ $package->price_quad }}<br>
                        TRIPLE = USD {{ $package->price_triple }}<br>
                        DOUBLE = USD {{ $package->price_double }}<br>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection