@extends('layouts.main')

@push('styles')
<!-- International Telephone Input-->
<link rel="stylesheet" type="text/css" href="{{asset('css/intlTelInput.css')}}">
<!-- International Telephone Input -->
@endpush

@section('content')
<div class="row">
    <div class="col-md-2">
        <div class="list-group">
            <a href="{{route('quiq_accounts_manager_edit_view',['user' => $user])}}" class="list-group-item active">{{__('strings.user_profile')}}</a>
            <a href="{{route('quiq_manager_accounts_index',['user' => $user])}}" class="list-group-item">Empresas</a>
        </div>
    </div>

    <div class="col-md-10">
        <div class="card">  
            <div class="card-header">
                <h4 class="card-title">Editar manejador de cuentas QuiQ</h4>
            </div>
            <div class="card-body">
                <div class="card-block">
                    <span class="avatar img-fluid d-block mx-auto width-35-per"><img class="img-circle" src="{{$user->photo_url . '?'.now()}}"  width="150px" alt="avatar">                        		
                    </span>
                    <br>
                   <form class="form" action="{{route('quiq_accounts_manager_update',['user'=>$user->id])}}" method="post">
                        {{ csrf_field() }}
                        {{ method_field('put') }}
                        <div class="form-body">    
                            <div class="form-group  col-md-4">
                                <label for="email">{{ __('strings.profile.email') }}</label>
                                <input type="email" id="email" class="form-control" placeholder="{{ __('strings.profile.email') }}" name="email" value="{{ $user->email }}" autocomplete="off" disabled>
                            </div>  
                             
                            <div class="form-group  col-md-4">
                                <label for="password">{{ __('strings.profile.password') }}</label>
                                <input type="password" id="password" class="form-control" placeholder="{{ __('strings.profile.password') }}" name="password" value="{{ $user->password }}" autocomplete="off">
                            </div>  
                            <div class="form-group col-md-4">
                                <label for="name">{{ __('strings.profile.name') }}</label>
                                <input type="text" id="name" class="form-control" placeholder="{{ __('strings.profile.name') }}" name="name" value="{{ $user->name }}">
                            </div>
                            <div class="form-group col-md-4">
                                <label for="last_name">{{ __('strings.profile.last_name') }}</label>
                                <input type="text" id="last_name" class="form-control" placeholder="{{ __('strings.profile.last_name') }}" name="last_name" value="{{ $user->last_name }}">
                            </div>
                            <div class="form-group col-md-4">
                                <label for="user_phone">{{ __('strings.phone') }}</label><br>
                                <input type="text" id="user_phone" class="form-control" placeholder="{{ __('strings.phone') }}" name="user_phone" value="{{ $user->phone }}">
                            </div>
                        </div>
                        <div class="form-actions center col-md-12">
                            <a href="#" onclick="window.history.back();" class="btn btn-secondary">  {{__('strings.submit_cancel')}} </a>    
                            <button type="submit" class="btn btn-primary">{{ __('strings.profile.update') }}</button>
                        </div>
                   </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<!-- International Telephone Input -->
<script src="{{asset('js/intlTelInput.min.js')}}" type="text/javascript"></script>
<!-- International Telephone Input -->
<script src="{{asset('js/red_google.js')}}" type="text/javascript"></script>

<script>
    $("#user_phone").intlTelInput({
      utilsScript: "{{asset('js/phone_input_utils.js')}}",
      preferredCountries: ["mx"],
      hiddenInput: "full_phone"
    });
    
    var pin_start_marker = L.icon({
        iconUrl: '{{asset('images/start_pin.png')}}',
        iconSize:     [26, 43], // size of the icon
        iconAnchor:   [13, 43], // point of the icon which will correspond to marker's location
        popupAnchor:  [0, -24] // point from which the popup should open relative to the iconAnchor
    });
    

</script>
@endpush