@extends('adminLayouts.app')
@section('title') {{'Change Email'}} @endsection

@section('js')
<!-- bs-custom-file-input -->
<script src="{{asset('auth/plugins/jquery-validation/jquery.validate.min.js')}}"></script>
<script>
$(function () {
  $('#changePassword_form').validate({
    rules: {
	    email: {
	        required: true,
	        email : true,
      }
    },
    messages: {
     email: {
  			 required : 'Email is required',
  			  equalTo : 'Please enter valid email address',
  		}
    },
    errorElement: 'span',
    highlight: function (element, errorClass, validClass) {
      $(element).addClass('is-invalid');
    },
    unhighlight: function (element, errorClass, validClass) {
      $(element).removeClass('is-invalid');
    }
  });

});
</script>

@append


@section('content')
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h1>Change Email</h1>
          </div>
        </div>
      </div><!-- /.container-fluid -->
    </section>

    <!-- Main content -->
    <section class="content">
      <div class="container-fluid">
        <div class="row">
          <!-- left column -->
          <div class="col-md-12">
            <!-- jquery validation -->
            <div class="card card-primary">
              <div class="card-header">
                <h3 class="card-title"></h3>
              </div>
              <!-- /.card-header -->
              @if (session('message'))
                    <h5 class="alert alert-success mb-2">{{ session('message') }}</h5>
              @endif
              @if (session('error'))
                    <h5 class="alert alert-danger mb-2">{{ session('error') }}</h5>
              @endif
              @if ($errors->any())
                <ul class="alert alert-danger">
                    @foreach ($errors->all() as $error)
                    <li class="text-danger">{{ $error }}</li>
                    @endforeach
                </ul>
                @endif

              <!-- form start -->
              <form id="changePassword_form" action="{{ route('change_email') }}" method="POST">
                @csrf
                <div class="card-body">
                    <div class="form-group">
                      <label for="Email">Email</label>
                      <input type="email" name="email" class="form-control" id="email" >
                    </div>
                </div>
                <!-- /.card-body -->
                <div class="card-footer">
                      <button type="submit" class="btn btn-primary">Update Email</button>
                </div>
              </form>

            </div>
            <!-- /.card -->
            </div>
          <!--/.col (left) -->

        </div>
        <!-- /.row -->
      </div><!-- /.container-fluid -->
    </section>
    <!-- /.content -->


@endsection