@extends('frontend.layouts.user_panel')
@section('styles')
<style>
.map_canvas {
height: 500px;
margin-top: 20px;
margin-bottom: 20px;
}
@media all and (max-width: 991px) {
.map_canvas {
height: 354px !important;
width: 291px !important;
margin-top: 0.8em !important;
position: relative !important;
overflow: hidden !important;
margin-left: 0px !important;
}
}
</style>
@endsection
@section('panel_content')
<div class="aiz-titlebar mb-4">
<div class="row align-items-center">
<div class="col-md-6">
<h1 class="fs-20 fw-700 text-dark">{{ translate('Manage Profile') }}</h1>
</div>
</div>
</div>
<!-- Basic Info-->
<div class="card rounded-15p shadow-none border">
<div class="card-header pt-4 border-bottom-0">
<h5 class="mb-0 fs-18 fw-700 text-dark">{{ translate('Basic Info') }}</h5>
</div>
<div class="card-body">
<form action="{{ route('user.profile.update') }}" method="POST" enctype="multipart/form-data">
@csrf
<!-- Name-->
<div class="form-group row">
<label class="col-md-2 col-form-label fs-14 fs-14">{{ translate('Your Name') }}</label>
<div class="col-md-10">
<input type="text" class="form-control rounded-15p" placeholder="{{ translate('Your Name') }}"
name="name" id="name_user" value="{{ Auth::user()->name }}">
<span id="nameError" style="color: #dc3545; font-size: 80%;"></span>
</div>
</div>
<!-- Phone-->
<div class="form-group row">
<label class="col-md-2 col-form-label fs-14">{{ translate('Your Phone') }}</label>
<div class="col-md-10">
<input type="text" class="form-control rounded-15p" placeholder="{{ translate('Your Phone') }}"
name="phone" id="phoneedit" value="{{ Auth::user()->phone }}">
<div id="phoneError" style="color: #dc3545; font-size: 80%;"></div>
</div>
</div>
<!-- Photo-->
<div class="form-group row">
<label class="col-md-2 col-form-label fs-14">{{ translate('Photo') }}</label>
<div class="col-md-10">
<div class="input-group" data-toggle="aizuploader" data-type="image">
<div class="input-group-prepend">
<div class="input-group-text bg-soft-secondary font-weight-medium"
style="border-radius: 15px 0 0 15px">
{{ translate('Browse') }}</div>
</div>
<div class="form-control file-amount" style="border-radius:0 15px 15px 0">
{{ translate('Choose File') }}</div>
<input type="hidden" name="photo" value="{{ Auth::user()->avatar_original }}"
class="selected-files">
</div>
<div class="file-preview box sm">
</div>
</div>
</div>
<!-- Password-->
<div class="form-group row">
<label class="col-md-2 col-form-label fs-14">{{ translate('Your Password') }}</label>
<div class="col-md-10">
<input type="password" id="password" class="form-control rounded-15p"
placeholder="{{ translate('New Password') }}" name="new_password">
<div id="password1Error" style="color: #dc3545; font-size: 80%;"></div>
</div>
</div>
<!-- Confirm Password-->
<div class="form-group row">
<label class="col-md-2 col-form-label fs-14">{{ translate('Confirm Password') }}</label>
<div class="col-md-10">
<input type="password" id="password_confirmation" class="form-control rounded-15p"
placeholder="{{ translate('Confirm Password') }}" name="confirm_password">
<div id="passwordError" style="color: #dc3545; font-size: 80%;"></div>
</div>
</div>
<!-- Submit Button-->
<div class="form-group mb-0 text-right">
<button type="submit"
class="btn btn-primary rounded-25px w-200px mt-3">{{ translate('Update Profile') }}</button>
</div>
</form>
</div>
</div>
<!-- Address -->
<div class="card rounded-15p shadow-none border">
<div class="card-header pt-4 border-bottom-0">
<h5 class="mb-0 fs-18 fw-700 text-dark">{{ translate('Address') }}</h5>
</div>
<div class="card-body">
@foreach (Auth::user()->addresses as $key => $address)
<div class="">
<div class="border p-4 mb-4 position-relative rounded-15p">
<div class="row fs-14 mb-2 mb-md-0">
<span class="col-md-2 text-secondary">{{ translate('Address') }}:</span>
<span class="col-md-8 text-dark">{{ $address->address }}</span>
</div>
<div class="row fs-14 mb-2 mb-md-0">
<span class="col-md-2 text-secondary">{{ translate('Postal Code') }}:</span>
<span class="col-md-10 text-dark">{{ $address->postalCode }}</span>
</div>
<div class="row fs-14 mb-2 mb-md-0">
<span class="col-md-2 text-secondary">{{ translate('City') }}:</span>
<span class="col-md-10 text-dark">{{ $address->city }}</span>
</div>
<div class="row fs-14 mb-2 mb-md-0">
<span class="col-md-2 text-secondary">{{ translate('State') }}:</span>
<span class="col-md-10 text-dark">{{ $address->state }}</span>
</div>
<div class="row fs-14 mb-2 mb-md-0">
<span class="col-md-2 text-secondary">{{ translate('Country') }}:</span>
<span class="col-md-10 text-dark">{{ $address->country }}</span>
</div>
<div class="row fs-14 mb-2 mb-md-0">
<span class="col-md-2 text-secondary text-secondary">{{ translate('Phone') }}:</span>
<span class="col-md-10 text-dark">{{ $address->phone }}</span>
</div>
@if ($address->set_default)
<div class="absolute-md-top-right pt-2 pt-md-4 pr-md-5">
<span class="badge badge-inline badge-warning text-white p-3 fs-12"
style="border-radius: 25px; min-width: 80px !important;">{{ translate('Default') }}</span>
</div>
@endif
<div class="dropdown position-absolute right-0 top-0 pt-4 mr-3">
<button class="btn btn-primary text-white px-1 py-1" type="button" data-toggle="dropdown">
<i class="la la-ellipsis-v"></i>
</button>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
{{-- <a class="dropdown-item" onclick="edit_address('{{ $address->id }}')">
{{ translate('Edit') }}
</a> --}}
<a class="dropdown-item" onclick="edit_address({{ $address->id }}, '{{ $address->longitude }}', '{{ $address->latitude }}')">
{{ translate('Edit') }}
</a>
@if (!$address->set_default)
<a class="dropdown-item"
href="{{ route('addresses.set_default', $address->id) }}">{{ translate('Make This Default') }}</a>
@endif
<a class="dropdown-item"
href="{{ route('addresses.destroy', $address->id) }}">{{ translate('Delete') }}</a>
</div>
</div>
</div>
</div>
<!-- Edit Address Modal -->
<div class="modal fade" id="edit-address-modal_{{ $address->id }}" tabindex="-1"
role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-md" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">
{{--{{ translate('Edit Address') }} --}}
Editar Dirección
</h5>
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form class="form-default" role="form" id="edit-address-form"
action="{{ route('addresses.update', $address->id ?? '') }}"
method="POST">
@csrf
@method('PUT')
<div class="modal-body c-scrollbar-light">
<div class="p-3">
<!-- Address -->
<div class="row">
<div class="col-md-2">
<label>{{ translate('Address') }}</label>
</div>
<div class="col-md-10">
<input class="form-control mb-3 rounded-15px"
placeholder="Introduce la Ubicación"
id="searchTextField_{{$address->id ?? '1'}}"
type="text"
name="address"
value="{{ old('address', $address->address ?? '') }}"
required readonly>
@if ($errors->has('address'))
<p style="font-size: 80%;" class="text-danger">
{{ $errors->first('address') }}
</p>
@endif
<div id="edit-addressError"
style="color: #dc3545; font-size: 80%;"></div>
<label for="address" id="edit-addressLabel"
class="fs-14 text-dark fw-500">
Solo puedes editar dirección seleccionando en el
mapa.
</label>
<div id="map_canvas_{{ $address->id ?? '1' }}"
class="map_canvas map_canvas"></div>
</div>
</div>
<br>
<div class="row">
<div class="col" style="display: none;">
<label for="latitude">Latitude</label>
<input name="latitude" class="form-control MapLat"
value="{{ old('latitude', $address->latitude ?? '') }}"
type="text" placeholder="Latitude">
</div>
<div class="col" style="display: none;">
<label for="longitude">Longitude</label>
<input name="longitude" class="form-control MapLon"
value="{{ old('longitude', $address->longitude ?? '') }}"
type="text" placeholder="Longitude">
</div>
</div>
<div class="row">
<div class="col" style="display: none;">
<label for="country">country</label>
<input name="country" class="form-control"
value="{{ old('country', $address->country ?? '') }}"
type="text" placeholder="country">
@error('country')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
<div id="countryError"
style="color: #dc3545; font-size: 80%;"></div>
</div>
<div class="col" style="display: none;">
<label for="state">state</label>
<input name="state" class="form-control"
value="{{ old('state', $address->state ?? '') }}"
type="text" placeholder="state">
@error('state')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
<div id="stateError"
style="color: #dc3545; font-size: 80%;"></div>
</div>
</div>
<div class="row">
<div class="col" style="display: none;">
<label for="city">city</label>
<input name="city" class="form-control"
value="{{ old('city', $address->city ?? '') }}"
type="text" placeholder="city">
@error('city')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
<div id="cityError"
style="color: #dc3545; font-size: 80%;"></div>
</div>
<div class="col" style="display: none;">
<label for="postalCode">postalCode</label>
<input name="postalCode" class="form-control"
value="{{ old('postalCode', $address->postalCode ?? '') }}"
type="text" placeholder="postalCode">
@error('postalCode')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
<div id="postalCodeError"
style="color: #dc3545; font-size: 80%;"></div>
</div>
</div>
<div class="row">
<div class="col-md-2">
<label>{{ translate('Phone') }}</label>
</div>
<div class="col-md-10">
<input type="tel" name="phone"
id="phonedos_{{ $address->id ?? '1' }}"
placeholder="Ejemplo: +18091234567"
class="form-control mb-3 phone-input rounded-15px phone @error('phone') is-invalid @enderror"
value="{{ old('phone', $address->phone ?? '') }}">
<div id="phoneErrordos"
style="color: #dc3545; font-size: 80%;"></div>
<div id="phoneStatus"></div>
@error('phone')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
</div>
<div class="form-group text-right">
<button id="submit-edit-address-{{ $address->id }}"
class="btn btn-primary rounded-25px w-150px">
{{ translate('Save') }}
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
{{--<div class="modal fade" id="edit-address-modal_{{ $address->id }}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-md" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">{{ translate('Edit Address') }}</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<form class="form-default" role="form" action="{{ route('addresses.update', $address->id ?? '') }}" method="POST">
@csrf
@method('PUT')
<div class="modal-body c-scrollbar-light">
<div class="p-3">
<!-- Address -->
<div class="row">
<div class="col-md-2">
<label>{{ translate('Address')}}</label>
</div>
<div class="col-md-10">
<input class="form-control mb-3 rounded-0"
placeholder="Introduce la Ubicación" id="edit-searchTextField"
type="text" name="address"
value="{{ old('address', $address->address ?? '') }}" required readonly>
@if ($errors->has('address'))
<p style="font-size: 80%;" class="text-danger">
{{ $errors->first('address') }}</p>
@endif
<div id="edit-addressError" style="color: #dc3545; font-size: 80%;"></div>
<label for="address" id="edit-addressLabel"
class="fs-14 text-dark fw-500">Solo puedes editar dirección seleccionando en el mapa.</label>
<div id="edit-map_canvas_{{ $address->id ?? '1' }}" class="map_canvas edit-map_canvas"></div>
<style>
.edit-map_canvas {
height: 500px;
margin-top: 20px;
margin-bottom: 20px;
}
@media all and (max-width: 991px) {
.edit-map_canvas {
height: 354px !important;
width: 261px !important;
margin-top: 0.8em !important;
position: relative !important;
overflow: hidden !important;
margin-left: 0px !important;
}
}
.edit-searchTextField {
width: 100%;
height: 9%;
}
</style>
</div>
</div>
<br>
<div class="row">
<div class="col" style="display: none;">
<label for="latitude">Latitude</label>
<input name="latitude" class="form-control MapLat"
value="{{ old('latitude', $address->latitude ?? '') }}" type="text"
placeholder="Latitude">
</div>
<div class="col" style="display: none;">
<label for="longitude">Longitude</label>
<input name="longitude" class="form-control MapLon"
value="{{ old('longitude', $address->longitude ?? '') }}" type="text"
placeholder="Longitude">
</div>
</div>
<div class="row">
<div class="col" style="display: none;">
<label for="country">country</label>
<input name="country" class="form-control"
value="{{ old('country', $address->country ?? '') }}" type="text"
placeholder="country">
@error('country')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
<div id="countryError" style="color: #dc3545; font-size: 80%;">
</div>
</div>
<div class="col" style="display: none;">
<label for="state">state</label>
<input name="state" class="form-control"
value="{{ old('state', $address->state ?? '') }}" type="text"
placeholder="state">
@error('state')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
<div id="stateError" style="color: #dc3545; font-size: 80%;">
</div>
</div>
</div>
<div class="row">
<div class="col" style="display: none;">
<label for="city">city</label>
<input name="city" class="form-control"
value="{{ old('city', $address->city ?? '') }}" type="text"
placeholder="city">
@error('city')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
<div id="cityError" style="color: #dc3545; font-size: 80%;">
</div>
</div>
<div class="col" style="display: none;">
<label for="postalCode">postalCode</label>
<input name="postalCode" class="form-control"
value="{{ old('postalCode', $address->postalCode ?? '') }}" type="text"
placeholder="postalCode">
@error('postalCode')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
<div id="postalCodeError" style="color: #dc3545; font-size: 80%;">
</div>
</div>
</div>
<div class="row">
<div class="col-md-2">
<label>{{ translate('Phone')}}</label>
</div>
<div class="col-md-10">
<input type="tel" name="phone" id="phonedos_{{ $address->id ?? '1' }}" placeholder="Ejemplo: +10123456789" class="phone-input form-control mb-3 rounded-0 phone @error('phone') is-invalid @enderror" value="{{ old('phone', $address->phone ?? '') }}">
<div id="phoneErrordos" style="color: #dc3545; font-size: 80%;"></div>
<div id="phoneStatus"></div>
@error('phone')
<div class="invalid-feedback">{{ $message }}</div>
@enderror
</div>
</div>
<div class="form-group text-right">
<button type="submit" class="btn btn-primary rounded-0 w-150px">{{translate('Save')}}</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>--}}
@endforeach
<!-- Add New Address -->
<div class="" onclick="add_new_address()">
<div class="border p-3 mb-3 c-pointer text-center bg-light has-transition hov-bg-soft-light rounded-15p">
<i class="la la-plus la-2x"></i>
<div class="alpha-7 fs-14 fw-700">{{ translate('Add New Address') }}</div>
</div>
</div>
</div>
</div>
<!-- Change Email -->
<form action="{{ route('user.change.email') }}" method="POST">
@csrf
<div class="card shadow-none border rounded-15px">
<div class="card-header pt-4 border-bottom-0">
<h5 class="mb-0 fs-18 fw-700 text-dark">{{ translate('Change your email') }}</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-2">
<label class="fs-14">{{ translate('Your Email') }}</label>
</div>
<div class="col-md-10">
<div class="input-group mb-3">
<input type="email" class="form-control" style=""
placeholder="{{ translate('Your Email') }}" name="email"
value="{{ Auth::user()->email }}" />
<div class="input-group-append">
<button type="button" class="btn new-email-verification"
style="">
<span class="d-none loading">
<span class="spinner-border spinner-border-sm" role="status"
aria-hidden="true"></span>{{ translate('Sending Email...') }}
</span>
{{-- <span class="default">{{ translate('Verify') }}</span> --}}
</button>
</div>
</div>
<div class="form-group mb-0 text-right">
<button type="submit"
class="btn btn-primary rounded-25px w-250px mt-3">{{ translate('Update Email') }}</button>
</div>
</div>
</div>
</div>
</div>
</form>
@endsection
@section('modal')
<!-- Address modal -->
@include('frontend.partials.address_modal')
@endsection
@section('script')
<script async
src='https://maps.google.com/maps/api/js?libraries=places®ion=uk&language=en&key={{ env('GOOGLE_MAPS_API_KEY') }}'></script>
<script src="{{ asset('public/assets/js/client/checkout/addressSelection.js') }}" type="text/javascript"></script>
<script src="{{ asset('public/assets/js/utilities/Maps/main.js') }}" type="text/javascript" defer></script>
<script type="text/javascript">
function edit_address(id, longitude, latitude) {
$('#edit-address-modal_' + id).modal('show');
showMapedit('map_canvas_' + id, longitude, latitude);
$('#submit-edit-address-' + id).attr('data-id', id);
}
$('[id^=submit-edit-address-]').on('click', function (event) {
event.preventDefault();
let id = $(this).data('id');
let url = "{{ route('addresses.update', '__id__') }}".replace('__id__', id);
let formData = $('#edit-address-form').serialize();
$.ajax({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
method: "PUT",
url: url,
data: formData,
success: function (data, textStatus, jqXHR) {
if (data.state === 'success') {
Swal({
type: 'success',
title: 'Bien',
text: data.msg,
timer: 6000
}).then(() => {
location.reload();
})
} else {
Swal({
type: 'error',
title: 'Oops...',
text: data.msg,
timer: 6000
})
}
},
error: function (xhr, status, error) {
console.error(xhr.responseText);
}
})
});
$('.new-email-verification').on('click', function() {
$(this).find('.loading').removeClass('d-none');
$(this).find('.default').addClass('d-none');
var email = $("input[name=email]").val();
$.post('{{ route('user.new.verify') }}', {
_token: '{{ csrf_token() }}',
email: email
}, function(data) {
data = JSON.parse(data);
$('.default').removeClass('d-none');
$('.loading').addClass('d-none');
if (data.status == 2)
AIZ.plugins.notify('warning', data.message);
else if (data.status == 1)
AIZ.plugins.notify('success', data.message);
else
AIZ.plugins.notify('danger', data.message);
});
});
</script>
@if (get_setting('google_map') == 1)
@include('frontend.partials.google_map')
@endif
@endsection
|