@extends('layout.default')

@section('content')
<div class="container-fluid">
    {{-- <div class="page-titles">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('people.index') }}">People</a></li>
    <li class="breadcrumb-item active"><a href="javascript:void(0)">Edit Person</a></li>
    </ol>
</div> --}}

<div class="row">
    <div class="col-lg-12">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title">Edit Person</h4>
                <form id="editPeopleForm" action="{{ route('people.update', $people->id) }}" method="POST">
                    @csrf
                    @method('PUT')
                    <div class="row">
                        <div class="col-lg-6 mb-3">
                            <label class="col-form-label" for="first_name">First Name <span
                                    class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="first_name" name="first_name"
                                value="{{ old('first_name', $people->first_name) }}" placeholder="First Name" required>
                            <div class="invalid-feedback" id="firstNameError">Please enter a first name.</div>
                        </div>
                        <div class="col-lg-6 mb-3">
                            <label class="col-form-label" for="last_name">Last Name <span
                                    class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="last_name" name="last_name"
                                value="{{ old('last_name', $people->last_name) }}" placeholder="Last Name" required>
                            <div class="invalid-feedback" id="lastNameError">Please enter a last name.</div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6 mb-3">
                            <label class="col-form-label" for="qualification">Qualification <span
                                    class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="qualification" name="qualification"
                                value="{{ old('qualification', $people->qualification) }}" placeholder="Qualification"
                                required>
                            <div class="invalid-feedback" id="qualificationError">Please enter a qualification.</div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6 mb-3">
                            <label class="col-form-label" for="designation">Designation <span
                                    class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="designation" name="designation"
                                value="{{ old('designation', $people->designation) }}" placeholder="Designation"
                                required>
                            <div class="invalid-feedback" id="designationError">Please enter a designation.</div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="job_sector">Job Sector <span
                                        class="text-danger">*</span></label>
                                <select class="form-select" id="job_sector" name="job_sector" required>
                                    <option value="">Select Job Sector</option>
                                    <option value="Government"
                                        {{ old('job_sector', $people->job_sector) == 'Government' ? 'selected' : '' }}>
                                        Government</option>
                                    <option value="Private"
                                        {{ old('job_sector', $people->job_sector) == 'Private' ? 'selected' : '' }}>
                                        Private</option>
                                    <option value="NRI"
                                        {{ old('job_sector', $people->job_sector) == 'NRI' ? 'selected' : '' }}>NRI
                                    </option>
                                    <option value="Unemployed"
                                        {{ old('job_sector', $people->job_sector) == 'Unemployed' ? 'selected' : '' }}>
                                        Unemployed</option>
                                </select>
                                <div class="invalid-feedback" id="jobSectorError">Please select a job sector.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="gender">Gender <span
                                        class="text-danger">*</span></label>
                                <select class="form-select" id="gender" name="gender" required>
                                    <option value="">Select Gender</option>
                                    <option value="Male"
                                        {{ old('gender', $people->gender) == 'Male' ? 'selected' : '' }}>
                                        Male</option>
                                    <option value="Female"
                                        {{ old('gender', $people->gender) == 'Female' ? 'selected' : '' }}>Female
                                    </option>
                                    <option value="Other"
                                        {{ old('gender', $people->gender) == 'Other' ? 'selected' : '' }}>
                                        Other</option>
                                </select>
                                <div class="invalid-feedback" id="genderError">Please select a gender.</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="date_of_birth">Date of Birth <span
                                        class="text-danger">*</span></label>
                                <input type="date" class="form-control" id="date_of_birth" name="date_of_birth"
                                    value="{{ old('date_of_birth', $people->date_of_birth) }}" required>
                                <div class="invalid-feedback" id="dateOfBirthError">Please enter a date of birth.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="age">Age <span class="text-danger">*</span></label>
                                <input type="number" class="form-control" id="age" name="age"
                                    value="{{ old('age', $people->age) }}" placeholder="Age" required>
                                <div class="invalid-feedback" id="ageError">Please enter an age.</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="aadhar_no">Aadhar No <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="aadhar_no" name="aadhar_no"
                                    value="{{ old('aadhar_no', $people->aadhar_no) }}" placeholder="Aadhar No" required>
                                <div class="invalid-feedback" id="aadharNoError">Please enter an Aadhar number.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="email">Email <span
                                        class="text-danger">*</span></label>
                                <input type="email" class="form-control" id="email" name="email"
                                    value="{{ old('email', $people->email) }}" placeholder="Email" required>
                                <div class="invalid-feedback" id="emailError">Please enter an email.</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="phone">Phone <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="phone" name="phone"
                                    value="{{ old('phone', $people->phone) }}" placeholder="Phone" required>
                                <div class="invalid-feedback" id="phoneError">Please enter a phone number.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="contact_number">Whatsapp Number<span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="contact_number" name="contact_number"
                                    value="{{ old('contact_number', $people->contact_number) }}"
                                    placeholder="Contact Number" required>
                                <div class="invalid-feedback" id="contactNumberError">Please enter a valid contact
                                    number.
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="religion_id">Religion<span
                                        class="text-danger">*</span></label>
                                <select class="form-control" id="religion_id" name="religion_id" required>
                                    <option value="">Select Religion</option>
                                    @foreach($religions as $id => $religion)
                                    <option value="{{ $id }}"
                                        {{ old('religion_id', $people->religion_id) == $id ? 'selected' : '' }}>
                                        {{ $religion }}</option>
                                    @endforeach
                                </select>
                                <div class="invalid-feedback" id="religionIdError">Please select a religion.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="caste_id">Caste<span
                                        class="text-danger">*</span></label>
                                <select class="form-control" id="caste_id" name="caste_id" required>
                                    <option value="">Select Caste</option>
                                    @foreach($castes as $id => $caste)
                                    <option value="{{ $id }}"
                                        {{ old('caste_id', $people->caste_id) == $id ? 'selected' : '' }}>{{ $caste }}
                                    </option>
                                    @endforeach
                                </select>
                                <div class="invalid-feedback" id="casteIdError">Please select a caste.</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="address">Address <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="address" name="address"
                                    value="{{ old('address', $people->address) }}" placeholder="Address" required>
                                <div class="invalid-feedback" id="addressError">Please enter an address.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="city">City <span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="city" name="city"
                                    value="{{ old('city', $people->city) }}" placeholder="City" required>
                                <div class="invalid-feedback" id="cityError">Please enter a city.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="country">Country <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="country" name="country"
                                    value="{{ old('country', $people->country) }}" placeholder="Country" required>
                                <div class="invalid-feedback" id="countryError">Please enter a country.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="state_id">State</label>
                                <select class="form-control" id="state_id" name="state_id" required>
                                    <option value="">Select State</option>
                                    @foreach($states as $id => $state)
                                    <option value="{{ $id }}"
                                        {{ old('state_id', $people->state_id) == $id ? 'selected' : '' }}>{{ $state }}
                                    </option>
                                    @endforeach
                                </select>
                                <div class="invalid-feedback" id="stateIdError">Please select a state.</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="image">Profile Image</label>
                                <input type="file" class="form-control" id="image" name="image">
                                @if($people->image)
                                <img src="{{ asset('images/' . $people->image) }}" alt="Profile Image"
                                    class="img-thumbnail mt-2" style="max-width: 150px;">
                                @endif
                                <div class="invalid-feedback" id="imageError">Please upload an image.</div>
                            </div>
                        </div>
                        <div class="row" id="parent-details" style="display: none;">
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="parent_role">Parent Role <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="parent_role" name="parent_role"
                                    value="{{ old('parent_role', $people->parent_role) }}" placeholder="Parent Role"
                                    required>
                                <div class="invalid-feedback" id="parentRoleError">Please enter a parent role.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="parent_name">Parent Name <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="parent_name" name="parent_name"
                                    value="{{ old('parent_name', $people->parent_name) }}" placeholder="Parent Name"
                                    required>
                                <div class="invalid-feedback" id="parentNameError">Please enter a parent name.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="parent_age">Parent Age <span
                                        class="text-danger">*</span></label>
                                <input type="number" class="form-control" id="parent_age" name="parent_age"
                                    value="{{ old('parent_age', $people->parent_age) }}" placeholder="Parent Age"
                                    required>
                                <div class="invalid-feedback" id="parentAgeError">Please enter a parent age.</div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="parent_designation">Parent Designation <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="parent_designation"
                                    name="parent_designation"
                                    value="{{ old('parent_designation', $people->parent_designation) }}"
                                    placeholder="Parent Designation" required>
                                <div class="invalid-feedback" id="parentDesignationError">Please enter a parent
                                    designation.
                                </div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="parent_number">Parent Phone Number <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="parent_number" name="parent_number"
                                    value="{{ old('parent_number', $people->parent_number) }}"
                                    placeholder="Parent Phone Number" required>
                                <div class="invalid-feedback" id="parentNumberError">Please enter a parent phone number.
                                </div>
                            </div>
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="parent_aadhar_no">Parent Aadhar Number <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="parent_aadhar_no" name="parent_aadhar_no"
                                    value="{{ old('parent_aadhar_no', $people->parent_aadhar_no) }}"
                                    placeholder="Parent Aadhar Number" required>
                                <div class="invalid-feedback" id="parentAadharNumberError">Please enter a parent aadhar
                                    number.</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-6 mb-3">
                                <label class="col-form-label" for="district_id">District<span
                                        class="text-danger">*</span></label>
                                <select class="form-control" id="district_id" name="district_id" required>
                                    <option value="">Select District</option>
                                    @foreach($districts as $id => $district)
                                    <option value="{{ $id }}"
                                        {{ old('district_id', $people->district_id) == $id ? 'selected' : '' }}>
                                        {{ $district }}</option>
                                    @endforeach
                                </select>
                                <div class="invalid-feedback" id="districtIdError">Please select a district.</div>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label" for="sub_district_id">Sub-District <span
                                        class="text-danger">*</span></label>
                                <select class="form-control" id="sub_district_id" name="sub_district_id" required>
                                    <option value="">Select Sub-District</option>
                                    @foreach ($sub_districts as $sub_district)
                                    <option value="{{ $sub_district->id }}"
                                        {{ old('sub_district_id', $people->sub_district_id) == $sub_district->id ? 'selected' : '' }}>
                                        {{ $sub_district->name }}</option>
                                    @endforeach
                                </select>
                                <div class="invalid-feedback" id="subDistrictIdError">Please select a sub-district.
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-6 mb-3">
                            <label class="col-form-label" for="panchayath_type_id">Panchayath Type<span
                                    class="text-danger">*</span></label>
                            <select class="form-control" id="panchayath_type_id" name="panchayath_type_id" required>
                                <option value="">Select Panchayath Type</option>
                                @foreach($panchayathTypes as $id => $type)
                                <option value="{{ $id }}"
                                    {{ old('panchayath_type_id', $people->panchayath_type_id) == $id ? 'selected' : '' }}>
                                    {{ $type }}</option>
                                @endforeach
                            </select>
                            <div class="invalid-feedback" id="panchayathTypeIdError">Please select a panchayath
                                type.
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-6 mb-3">
                            <label class="col-form-label" for="panchayath_id">Panchayath<span
                                    class="text-danger">*</span></label>
                            <select class="form-control" id="panchayath_id" name="panchayath_id" required>
                                <option value="">Select Panchayath</option>
                                @foreach($panchayaths as $id => $name)
                                <option value="{{ $id }}"
                                    {{ old('panchayath_id', $people->panchayath_id) == $id ? 'selected' : '' }}>
                                    {{ $name }}</option>
                                @endforeach
                            </select>
                            <div class="invalid-feedback" id="panchayathIdError">Please select a panchayath.</div>
                        </div>
                        <div class="col-lg-6 mb-3">
                            <label class="col-form-label" for="ward_id">Ward<span class="text-danger">*</span></label>
                            <select class="form-control" id="ward_id" name="ward_id" required>
                                <option value="">Select Ward</option>
                                @foreach($wards as $id => $ward)
                                <option value="{{ $id }}"
                                    {{ old('ward_id', $people->ward_id) == $id ? 'selected' : '' }}>{{ $ward }}
                                </option>
                                @endforeach
                            </select>
                            <div class="invalid-feedback" id="wardIdError">Please select a ward.</div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-9 offset-lg-3">
                            <button type="submit" class="btn btn-primary">Update</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
</div>



<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
    $('#editPeopleForm').on('submit', function(e) {
        e.preventDefault();

        let isValid = true;

        $('input[required], select[required]').each(function() {
            if ($.trim($(this).val()) === '') {
                $(this).addClass('is-invalid');
                isValid = false;
            } else {
                $(this).removeClass('is-invalid');
            }
        });

        let email = $('#email').val();
        if (email && !/\S+@\S+\.\S+/.test(email)) {
            $('#email').addClass('is-invalid');
            isValid = false;
        } else {
            $('#email').removeClass('is-invalid');
        }

        if (isValid) {
            this.submit();
        }
    });
});
</script>
<script>
document.getElementById('date_of_birth').addEventListener('change', function() {
    var dob = new Date(this.value);
    var today = new Date();
    var age = today.getFullYear() - dob.getFullYear();
    var monthDifference = today.getMonth() - dob.getMonth();
    if (monthDifference < 0 || (monthDifference === 0 && today.getDate() < dob.getDate())) {
        age--;
    }
    document.getElementById('age').value = age;
});
</script>
<script>
$(document).ready(function() {
    var initialAge = {{$people->age}}

    toggleParentDetails(initialAge);

    $('#date_of_birth').on('change', function() {
        var dob = new Date(this.value);
        var today = new Date();
        var age = today.getFullYear() - dob.getFullYear();
        var monthDifference = today.getMonth() - dob.getMonth();
        if (monthDifference < 0 || (monthDifference === 0 && today.getDate() < dob.getDate())) {
            age--;
        }
        $('#age').val(age);
        toggleParentDetails(age);
    });
});

function toggleParentDetails(age) {
    if (age <= 17) {
        $('#parent-details').show();
        $('#parent_role').prop('required', true);
        $('#parent_name').prop('required', true);
        $('#parent_age').prop('required', true);
        $('#parent_designation').prop('required', true);
        $('#parent_number').prop('required', true);
        $('#parent_aadhar_no').prop('required', true);
    } else {
        $('#parent-details').hide();
        $('#parent_role').prop('required', false);
        $('#parent_name').prop('required', false);
        $('#parent_age').prop('required', false);
        $('#parent_designation').prop('required', false);
        $('#parent_number').prop('required', false);
        $('#parent_aadhar_no').prop('required', false);
    }
}
</script>

@endsection