@extends('include.app')
@section('content')
 <div id="page-container" class="sidebar-o sidebar-dark enable-page-overlay side-scroll page-header-fixed main-content-narrow">
  @include('include.sidebar')
  @include('include.headnavbar')
    <main id="main-container">
        <div class="bg-body-light">
            <div class="content content-full">
                <div class="d-flex flex-column flex-sm-row justify-content-sm-between align-items-sm-center">
                    <h1 class="flex-sm-fill h3 my-2 text-primary">Admins</h1>
                    <nav class="flex-sm-00-auto ml-sm-3" aria-label="breadcrumb">
                        <ol class="breadcrumb breadcrumb-alt">
                            <li class="breadcrumb-item text-dark">
                                <a class="link-fx text-dark" href="{{ route('admin.list') }}">Admins</a>
                            </li>
                            <li class="breadcrumb-item" aria-current="page">
                                <a class="link-fx" href="">Add</a>
                            </li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
        <div class="content">
            <div class="block block-rounded">
                <div class="block-content block-content-full">
                    <form action="{{ route('admin.create') }}" method="post" enctype="multipart/form-data">
                        @csrf
                            @if ($errors->any())
                                <div class="alert alert-danger alert-dismissible fade show">
                                    <button type="button" class="close" data-dismiss="alert">&times;</button>
                                    <ul>
                                        @foreach ($errors->all() as $error)
                                            <li>{{ $error }}</li>
                                        @endforeach
                                    </ul>
                                </div>
                            @endif
                            <div class="row push">
                                <div class="col-lg-8">
                                    <div class="form-group">
                                        <label for="example-text-input" class="text-primary">Name</label>
                                        <input type="text" class="form-control" id="example-text-input" name="name" placeholder="Name" value="{{ old('name') }}" required>
                                    </div>
                                    <div class="form-group">
                                        <label for="example-email-input" class="text-primary">User Name</label>
                                        <input type="text" class="form-control" name="user_name" placeholder="User Name" value="{{ old('user_name') }}" required>
                                    </div>
                                    <div class="form-group">
                                        <label for="example-email-input" class="text-primary">Email</label>
                                        <input type="text" class="form-control" name="email" placeholder="Email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" value="{{ old('email') }}">
                                    </div>
                                   
                                    <div class="form-group">
                                        <label for="example-email-input" class="text-primary">Mobile Number</label>
                                        <input type="text" class="form-control" name="mobile" pattern="[6-9]{1}[0-9]{9}" placeholder="Mobile Number" value="{{ old('mobile') }}">
                                    </div>
                                    <div class="form-group" style="position: relative;">
                                        <label for="example-password-input" class="text-primary">Password</label>
                                        <span toggle="#password-field" class="fa fa-fw fa-eye field_icon toggle-password float-right" style="position: absolute;right: 14px; top:12px; display: flex; align-items: center; height: 100%;"></span>
                                        <input type="password" onpaste="return false;" ondrop="return false;" autocomplete="off" class="form-control" id="pass_log_id" name="password" placeholder="Password" required>
                                    </div>
                                    <div class="form-group" style="position: relative;">
                                        <label for="example-password-input" class="text-primary">Conform Password</label>
                                        <span toggle="#password-field" class="fa fa-fw fa-eye field_icon toggle-password1 float-right" style="position: absolute; right: 14px; top:12px;display: flex; align-items: center;height: 100%;"></span>
                                        <input type="password"  onpaste="return false;" ondrop="return false;" autocomplete="off" class="form-control" id="re_pass_log_id" name="password_confirmation" placeholder="Password" required>
                                    </div>
                                    <div class="text-left">
                                        <button type="submit"  class="btn btn-alt-primary px-5 mr-3">Submit</button>
                                        <a class="btn btn-alt-info" href="{{route('admin.list')}}"> Back</a>
                                    </div>
                                   </div>
                             </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </main>
 </div>
@endsection

@section('script')
<script>
    $(document).on('click', '.toggle-password', function()
    {
    $(this).toggleClass("fa-eye fa-eye-slash");
    var input = $("#pass_log_id");
    input.attr('type') === 'password' ? input.attr('type','text') : input.attr('type','password')
    nput.attr('type') === 'password' ? Reinput.attr('type','text') : Reinput.attr('type','password')
    });

    $(document).on('click', '.toggle-password1', function()
    {
    $(this).toggleClass("fa-eye fa-eye-slash");
    var Reinput = $("#re_pass_log_id");
    Reinput.attr('type') === 'password' ? Reinput.attr('type','text') : Reinput.attr('type','password')
    });
</script>
@endsection