@extends('front.layouts.app')
@section('content')

<!-- START CONTENT BODY  -->
<div class="my-account-body">
    <section class="title-header">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-sm-6">
                    <h2>{!! @$title !!}</h2>
                </div>
            </div>
        </div>
    </section>
    <section class="user-info-sec">
        <div class="container">
            <form id="frmAddProfile" name="frmAddProfile" action="{!! ($profile->id) ? route('myprofiles.update') : route('myprofiles.store') !!}" method="POST" class="myaccount-form" enctype="multipart/form-data">
                @csrf
                <input type="hidden" name="id" value="{!! $profile->id !!}">
                <input type="hidden" name="phone_code" id="phone_code" value="{!! old('phone_code',$profile->phone_code) !!}">
                <input type="hidden" name="elexio_uid" id="elexio_uid" value="{!! $profile->elexio_uid !!}">
                <input type="hidden" name="image_alt" id="image_alt" value="{!! $profile->image_alt !!}">
                <div class="user-info-view">
                    <div class="user-info-col">
                        <div class="user-view pp-view">
                            <img src="{!! $profile->avatar_url !!}" class="user" alt="{!! $profile->name !!}" id='image_preview'>
                            <a href="javascript:void(0)" class="pp-ovrlay" onclick="javascript:$('#image').trigger('click')"><img src="{!! asset('assets/frontend/images/camera-icon-white.png') !!}" class="img-fluid" alt="camera-icon-white"></a>
                            <input id="image" name="image" type="file" class="upload" accept="image/*">
                        </div>
                        <div class="btn-row">
                            <button type="submit" class="btn btn-theme-blue">Save Changes</button>
                            <button type="button" class="btn btn-theme-blue" onclick="javascript:window.location.href='{!! route('myprofiles') !!}'">Cancel</button>
                        </div>
                    </div>
                    <div class="user-details-col">
                        <div class="row">
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>First Name</label>
                                    <input type="text" name="first_name" id="first_name" value="{!! old('first_name',$profile->first_name) !!}" class="form-control">
                                    @error('first_name')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>Last Name</label>
                                    <input type="text" name="last_name" id="last_name" value="{!! old('last_name',$profile->last_name) !!}" class="form-control">
                                    @error('last_name')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>Email</label>
                                    <input type="text" name="email" id="email" value="{!! old('email',$profile->email) !!}" class="form-control">
                                    @error('email')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>Birthday</label>
                                    <input type="text" class="form-control" id="dob" name="dob" value="{!! old('dob') ?? ($profile->dob ? $profile->dob->format(config('constants.INPUT_DATE_FORMAT')) : NULL) !!}">
                                    @error('dob')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-12 col-md-12 col-sm-12">
                                <div class="ui-view">
                                    <label>Phone</label>
                                    <div class="country-input-row" id="divPhoneCode">
                                        <select name="country_id" id="country_id" class="form-control">
                                            @if($countries->count() > 0)
                                            @foreach($countries as $country)
                                            <option value="{!! $country->id !!}" data-phone_code="{!! $country->phone_code !!}" @if(old('country_id') == $country->id || $profile->country_id == $country->id) selected @elseif(old('country_id') == "" && $country->id == "233" && $profile->country_id == "") selected @endif >{!! $country->emoji !!} {!! $country->name !!} ({!! $country->phone_code !!})</option>
                                            @endforeach
                                            @endif
                                        </select>
                                        <input type="text" class="form-control" id="phone" name="phone" placeholder="000-000-0000" value="{!! old('phone',$profile->phone) !!}" autocomplete="off">
                                    </div>
                                    @error('phone')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>Gender</label>
                                    <select name="gender" id="gender" class="form-select">
                                        <!-- <option value="">Select</option> -->
                                        @foreach(gender() as $gender)
                                        <option value="{!! $gender !!}" @if(old('gender') == $gender || $profile->gender == $gender) selected @endif>{!! $gender !!}</option>
                                        @endforeach
                                    </select>
                                    @error('gender')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>Marital Status</label>
                                    <select name="marital_status" id="marital_status" class="form-select">
                                        <option value="">Select</option>
                                        @foreach(maritalstatus() as $marital_status)
                                        <option value="{!! $marital_status !!}" @if(old('marital_status') == $marital_status || $profile->marital_status == $marital_status) selected @endif>{!! $marital_status !!}</option>
                                        @endforeach
                                    </select>
                                    @error('marital_status')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>Profile Type</label>
                                    <select name="profile_type" id="profile_type" class="form-select">
                                        @foreach(['Adult','Child'] as $profile_type)
                                        <option value="{!! $profile_type !!}" @if(old('profile_type') == $profile_type || $profile->profile_type == $profile_type) selected @endif>{!! $profile_type !!}</option>
                                        @endforeach
                                    </select>
                                    @error('profile_type')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>Relationship</label>
                                    <select name="relationship" id="relationship" class="form-select" style="display: none;">
                                        <option value="">Select</option>
                                        @foreach(relationships() as $relationship)
                                        <option value="{!! $relationship->name !!}" @if(old('relationship') == $relationship->name || $profile->relationship == $relationship->name) selected @endif>{!! $relationship->name !!}</option>
                                        @endforeach
                                    </select>
                                    @error('relationship')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-12 col-md-12 col-sm-12">
                                <div class="ui-view">
                                    <label>Address</label>
                                    <input type="text" name="address" id="address" value="{!! old('address',$profile->address) !!}" class="form-control">
                                    @error('address')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>City</label>
                                    <input type="text" name="city" id="city" value="{!! old('city',$profile->city) !!}" class="form-control">
                                    @error('city')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>State</label>
                                    <input type="text" name="state" id="state" value="{!! old('state',$profile->state) !!}" class="form-control">
                                    @error('state')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>Country</label>
                                    <select name="country" id="country" class="form-control">
                                        <option value="">Select</option>
                                        @if($countries->count() > 0)
                                        @foreach($countries as $country)
                                        <option value="{!! $country->name !!}" @if($profile->country == $country->name) selected @endif>{!! $country->name !!}</option>
                                        @endforeach
                                        @endif
                                    </select>
                                    @error('city')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-12 col-sm-6">
                                <div class="ui-view">
                                    <label>Zipcode</label>
                                    <input type="text" name="zipcode" id="zipcode" value="{!! old('zipcode',$profile->zipcode) !!}" class="form-control">
                                    @error('zipcode')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div>
                            <!-- <div class="col-lg-12 col-md-12 col-sm-12">
                                <div class="ui-view">
                                    <label>Allergies</label>
                                    <input type="text" name="allergies" id="allergies" value="{!! old('allergies',$profile->allergies) !!}" class="form-control">
                                    @error('allergies')
                                    <span class="error" role="alert">{!! $message !!}</span>
                                    @enderror
                                </div>
                            </div> -->
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </section>
</div>
<!-- END CONTENT BODY  -->
@endsection

@section('js')
@stack('js')
<script src="{!! asset('assets/frontend/js/pages/myprofiles.js') !!}?v=20240612"></script>
@endsection