@extends('ATCore::atcore_layout')


@section('content')
<!-- general form elements -->
<!-- form start -->
<form id="edit_form" role="form" action="{{ route($routeName.'.update',$result->id) }}" method="POST" autocomplete="off">
  @csrf
  {{method_field('PUT')}}
  <input type="hidden" name="account_id" value="{{$parentObject->id}}">
  <div class="card card-info">
    <div class="card-header">
      <h3 class="card-title">Editar Usuario</h3>
    </div>
    <!-- /.card-header -->
    
    <div class="card-body" id="app">
      <div class="row">
        <div class="col-sm-6">
          <div class="form-group">
            <label for="exampleInputEmail1">Nombre</label>
            <input type="text" class="form-control" id="_name" name="name"  placeholder="Ingresar nombre" value="{{ $result->name }}" required>
          </div>
          <div class="form-group">
            <label for="exampleInputEmail1">Email</label>
            <input type="email" class="form-control" id="_email" name="email"  placeholder="Ingresar email" value="{{ $result->email }}" required>
          </div>

          <div class="form-group">
            <label for="exampleInputEmail1">Contraseña</label>
            <input v-if="password_option == 'manual'" type="password" class="form-control" id="_password" name="password"  placeholder="Ingresa manualmente una contraseña" value="{{ old('password') }}" autocomplete="off">
          </div>
          <div class="form-group">
            <div class="icheck-info">
              <input  type="radio" id="customRadio1" name="password_option" v-model="password_option" value="keep">
              <label for="customRadio1">No cambiar contraseña</label>
            </div>
            <div class="icheck-info">
              <input  type="radio" id="customRadio2" name="password_option" v-model="password_option" value="auto">
              <label for="customRadio2">Generar contraseña automáticamente</label>
            </div>
            <div class="icheck-info">
              <input type="radio" id="customRadio3" name="password_option" v-model="password_option"  value="manual">
              <label for="customRadio3">Generar contraseña manualmente</label>
            </div>
          </div>
          <hr>
          <div class="form-check form-check-inline">
            <input id="inlineCheckbox1" class="form-check-input" type="checkbox" name="send_credentials" data-toggle="toggle" data-size="sm" data-style="mr-2" data-on="Sí" data-off="No" data-onstyle="info" data-offstyle="secondary">
            <label for="inlineCheckbox1" class="form-check-label"><strong>Enviar Credenciales</strong></label>
          </div>
        </div>
        <div class="col-sm-1">&nbsp;</div>
        <div class="col-sm-5">
          <div class="row">
            <div class="col-sm-12">
              <label>Roles</label>
            </div>
          </div>
          <div class="row">
            <div class="col-sm-12">
              @foreach ($roles as $role)
              <div class="icheck-info">
                <input v-model="rolesSelected" value="{{$role->id}}" type="checkbox" id="_permission_check_{{$role->id}}">
                <label for="_permission_check_{{$role->id}}">{{$role->display_name}} <em>({{$role->description}})</em></label>
              </div>
              @endforeach
            </div>
          </div>
          <input type="hidden" :value="rolesSelected" name="roles">
        </div>
        
      </div>
      
    </div>
    
    <div class="card-footer">
        <button type="submit" class="btn btn-info">Actualizar Datos</button>
        @if ($parentObject)
        <a href="{{ route($routeName.'.index') }}?{{$parentForeignKey}}={{$parentObject->id}}" class="btn btn-secondary">Cancelar </a>
        @elseif (!isset($parentForeignKey))
        <a href="{{ route($routeName.'.index') }}" class="btn btn-secondary">Cancelar </a>
        @endif
    </div>
  </div>
  
</form>



@stop

@section('css')

@stop

@section('plugins.ValidationJS',true)
@section('js')
<script>
  var app = new Vue({
    el: '#app',
    data: {
      password_option: 'keep',
      rolesSelected:  {!!$result->roles->pluck('id')!!},
    }
  });
  
  @if (session()->has('message'))
  
  toastr['{!! session('message_type') !!}']('{!! session('message') !!}')
  
  @endif
  
  @if (session()->has('message_alert'))
  
  toastr['error']('{!! session('message_alert') !!}')
  @endif
  
  $(document).ready(function () {
    bsCustomFileInput.init();
    
    
    $('#edit_form').validate({
      submitHandler: function(form) {
        forcePace();
        form.submit();
      },
      errorElement: 'span',
      errorPlacement: function (error, element) {
        error.addClass('invalid-feedback');
        element.closest('.form-group').append(error);
      },
      highlight: function (element, errorClass, validClass) {
        $(element).addClass('is-invalid');
      },
      unhighlight: function (element, errorClass, validClass) {
        $(element).removeClass('is-invalid');
      }
    });
    
    jQuery.extend(jQuery.validator.messages, {
      required: "Este campo es obligatorio.",
      remote: "Por favor, rellena este campo.",
      email: "Por favor, escribe una dirección de correo válida",
      url: "Por favor, escribe una URL válida.",
      date: "Por favor, escribe una fecha válida.",
      dateISO: "Por favor, escribe una fecha (ISO) válida.",
      number: "Por favor, escribe un número entero válido.",
      digits: "Por favor, escribe sólo dígitos.",
      creditcard: "Por favor, escribe un número de tarjeta válido.",
      equalTo: "Por favor, escribe el mismo valor de nuevo.",
      accept: "Por favor, escribe un valor con una extensión aceptada.",
      maxlength: jQuery.validator.format("Por favor, no escribas más de {0} caracteres."),
      minlength: jQuery.validator.format("Por favor, no escribas menos de {0} caracteres."),
      rangelength: jQuery.validator.format("Por favor, escribe un valor entre {0} y {1} caracteres."),
      range: jQuery.validator.format("Por favor, escribe un valor entre {0} y {1}."),
      max: jQuery.validator.format("Por favor, escribe un valor menor o igual a {0}."),
      min: jQuery.validator.format("Por favor, escribe un valor mayor o igual a {0}.")
    });
  });
</script>

@stop

@section('plugins.Vue',true)