@extends('site.master')
@section('main-content')
    <section class="af-hdr ">
        <div class="header-decoration position-absolute">
            <img src="{{ asset('site/img/shape_nate.svg') }}" alt="">
        </div>
        <div class="container position-relative" style="z-index: 9">
            <div class="row">
                <div class="col-sm-12">
                    <h1 class=" text-uppercase text-white fnt-fam-ser fs-2 fwc-700">




                        Claims</h1>
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="list-inline-item"><a class="text-white" href="{{ URL::to('/') }}"
                                    class="text-decoration-none">@lang('language.home')</a>
                            </li>
                            <li class="list-inline-item"><a class="text-white" href="{{ URL::to('/') }}"
                                    class="text-decoration-none"> Claims</a>
                            </li>

                        </ol>
                    </nav>
                </div>
            </div>
        </div>

        <div class="decoration-pattern pattern-one position-absolute">
            <img src="{{ asset('site/img/breadcrumb_shape_pattern_1.svg') }}" alt="">
        </div>
        <div class="decoration-pattern pattern-two position-absolute">
            <img src="{{ asset('site/img/breadcrumb_shape_pattern_2.svg') }}" alt="">
        </div>
    </section>
    <section class="py-5">
        <div class="container">
            <div class="row">
                <div class="d-flex align-items-end">
                    <div>
                        <h5 class="text-uppercase text-danger fw-bold fs-7"> @lang('language.contactus')</h5>
                        <h2 class="w-75 fw-bold fs-2 text-custom-blue-dark2">Secure Your Future with Confidence</h2>
                    </div>


                    <p class="text-gray fs-7 w-50">
                        We are here to help protect your future with comprehensive insurance solutions" emphasizes the
                        insurance
                        company's commitment to safeguarding clients' long-term well-being by offering a range of coverage
                        options tailored to their needs.

                    </p>
                </div>
                <div class="col-lg-4 d-flex flex-column">

                    <div class="mt-3">
                        <div class="row g-3">
                            @foreach ($offices as $key => $item)
                                <div class="col-lg-12">
                                    <div class="shadow p-5 px-4 position-relative rounded-2 bg-hover-danger">
                                        <h3 class="text-custom-blue-dark2 fw-bold fs-5 mb-4">{{ $item->title }} <span
                                                class="d-block fs-6 fw-normal">
                                                {{ session('localeSession') == 'en' ? $item->getprovince->title : $item->getprovince->title_np }}
                                            </span></h3>
                                        <div class="reser-conent">
                                            <ul class="list-unstyled">

                                                <li>
                                                    <div class="d-flex justify-content-start">
                                                        <span class="me-2"><i class="bi-map text-danger"></i></span>
                                                        <span class="w-75">{{ $item->getmunicipality->title }},
                                                            {{ $item->getdistrict->title }}, {{ $item->getprovince->title }}
                                                        </span>
                                                    </div>
                                                </li>
                                                <li>
                                                    <div class="d-flex justify-content-start">
                                                        <span class="me-2"><i class="bi-printer text-danger"></i></span>
                                                        <span class="w-75">{{ numEnToNp($item->fax_no) }}</span>
                                                    </div>
                                                </li>
                                                <li>
                                                    <div class="d-flex justify-content-start">
                                                        <span class="me-2"><i class="bi-phone text-danger"></i></span>
                                                        <span class="w-75">
                                                            @php
                                                                $phoneNumbers = explode(',', $item->phonenumberbranch);
                                                            @endphp
                                                            @foreach ($phoneNumbers as $phoneNumber)
                                                                <a
                                                                    href="tel:{{ trim($phoneNumber) }}">{{ numEnToNp(trim($phoneNumber)) }}</a>
                                                                @if (!$loop->last)
                                                                    ,
                                                                @endif
                                                            @endforeach
                                                        </span>
                                                    </div>
                                                </li>
                                                <li>
                                                    <div class="d-flex justify-content-start">
                                                        <span class="me-2"><i class="bi-envelope text-danger"></i></span>
                                                        <span class="w-75">
                                                            <a href="mailto:{{ $item->branchemail }}"
                                                                title="{{ $item->branchemail }}"
                                                                class="text-decoration-none">
                                                                {{ $item->branchemail }}
                                                            </a>
                                                        </span>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
                <div class="col-lg-7 offset-lg-1">
                    <!-- Success Message -->
                    @if (session('success_message'))
                        <div class="alert alert-success alert-dismissible fade show">
                            {{ session('success_message') }}
                            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                        </div>
                    @endif

                    <!-- Error Messages -->
                    @if ($errors->any())
                        <div class="alert alert-danger alert-dismissible fade show">
                            <ul class="mb-0">
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                        </div>
                    @endif

                    <form action="{{ url(session('localeSession') . '/claim-submit') }}" method="POST"
                        enctype="multipart/form-data">
                        @csrf
                        <input type="hidden" name="modalcliamformvalue" value="">

                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label>Policy Number <span class="text-danger">*</span></label>
                                <input type="text" name="policynumber" value="{{ old('policynumber') }}"
                                    class="form-control" required>
                            </div>

                            <div class="col-lg-6 mb-3">
                                <label>Insured Name <span class="text-danger">*</span></label>
                                <input type="text" name="insuredname" value="{{ old('insuredname') }}"
                                    class="form-control" required>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label>Email <span class="text-danger">*</span></label>
                                <input type="email" name="email" value="{{ old('email') }}" class="form-control"
                                    required>
                            </div>

                            <div class="col-lg-6 mb-3">
                                <label>Phone <span class="text-danger">*</span></label>
                                <input type="tel" name="phone" value="{{ old('phone') }}" class="form-control"
                                    required>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label>Contact Person <span class="text-danger">*</span></label>
                                <input type="text" name="contactperson" value="{{ old('contactperson') }}"
                                    class="form-control" required>
                            </div>

                            <div class="col-lg-6 mb-3">
                                <label>Date of Loss <span class="text-danger">*</span></label>
                                 <input type="text" class="form-control" name="dateofloss" id="nepali-datepicker" value="{{ old('dateofloss') }}" placeholder="Select Nepali Date"/>

                            </div>
                        </div>

                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label>Cause of Loss <span class="text-danger">*</span></label>
                                <input type="text" name="causeofloss" value="{{ old('causeofloss') }}"
                                    class="form-control" required>
                            </div>

                            <div class="col-lg-6 mb-3">
                                <label>Place of Loss <span class="text-danger">*</span></label>
                                <input type="text" name="placeofloss" value="{{ old('placeofloss') }}"
                                    class="form-control" required>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label>Branch <span class="text-danger">*</span></label>
                                <select name="branch_id" class="form-control" required>
                                    <option value="">-- Select Branch --</option>
                                    @foreach ($offices as $branch)
                                        <option value="{{ $branch->id }}"
                                            {{ old('branch_id') == $branch->id ? 'selected' : '' }}>
                                            {{ $branch->title }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="col-lg-6 mb-3">
                                <label>Product <span class="text-danger">*</span></label>
                                <select name="product_id" class="form-control" required>
                                    <option value="">-- Select Product --</option>
                                    @foreach ($products as $product)
                                        <option value="{{ $product->id }}"
                                            {{ old('product_id') == $product->id ? 'selected' : '' }}>
                                            {{ $product->title_en }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="mb-3">
                            <label>Upload Documents (Max 5, 2MB each) <span class="text-danger">*</span></label>
                            <input type="file" name="lossdocument[]" multiple accept=".pdf,.jpg,.jpeg,.png"
                                class="form-control" required>
                        </div>

                        <div class="mb-3">
                            <label>Additional Information</label>
                            <textarea name="additionalInfo" class="form-control">{{ old('additionalInfo') }}</textarea>
                        </div>

                        @php
                            $settings = \App\Models\Admin\AdminSetting::first();
                        @endphp
                        @if ($settings && $settings->google_recaptcha_site_key)
                            <div class="g-recaptcha mb-3" data-sitekey="{{ $settings->google_recaptcha_site_key }}">
                            </div>
                        @endif

                        <div class="mb-3 form-check">
                            <input type="checkbox" name="agreeTerms" class="form-check-input" required>
                            <label class="form-check-label">I agree to the terms and conditions</label>
                        </div>

                        <button type="submit" class="btn btn-primary">Submit Claim</button>
                    </form>
                </div>
            </div>
        </div>
    </section>
  
@endsection
@push('scripts')
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>

    <script>
        $(document).ready(function() {
            $('#submitClaimButton').click(function(e) {
                e.preventDefault(); // Prevent the default form submission

                // Create a FormData object to capture the form data
                var formData = new FormData($('#claimQuoteForm')[0]);

                $.ajax({
                    url: '{{ route('claim.submit') }}', // Your Laravel route for submission
                    type: 'POST',
                    data: formData,
                    contentType: false, // Set contentType to false for FormData
                    processData: false, // Set processData to false for FormData
                    success: function(response) {
                        // Handle success response
                        alert('Claim submitted successfully!');
                        $('#claimQuoteModal').modal('hide'); // Close the modal
                        $('#claimQuoteForm')[0].reset(); // Reset the form
                    },
                    error: function(xhr) {
                        // Handle error response
                        var errors = xhr.responseJSON.errors;
                        var errorMessage = '';
                        for (var key in errors) {
                            errorMessage += errors[key].join('<br>');
                        }
                        alert('Error submitting claim:\n' + errorMessage);
                    }
                });
            });
        });
    </script>
     <link href="https://nepalidatepicker.sajanmaharjan.com.np/v5/nepali.datepicker/css/nepali.datepicker.v5.0.6.min.css" rel="stylesheet" type="text/css"/>
    <script src="https://nepalidatepicker.sajanmaharjan.com.np/v5/nepali.datepicker/js/nepali.datepicker.v5.0.6.min.js" type="text/javascript"></script>
 <script type="text/javascript">
 window.onload = function() {
 var mainInput = document.getElementById("nepali-datepicker");
 mainInput.NepaliDatePicker();
 };
 </script>
@endpush