@extends('layouts.main')
@section('content')

<div class="container-fluid">
    @if(Session::has('success'))
        <div class="alert alert-success">
            {{ Session::get('success') }}
        </div>
    @endif

    @if(Session::has('error'))
        <div class="alert alert-danger">
            {{ Session::get('error') }}
        </div>
    @endif

    <div class="row justify-content-center">
        <div class="col-xl-10 col-lg-6 col-md-10">
            <div class="card-body p-0">
                <!-- Nested Row within Card Body -->
                <div class="row justify-content-center">
                    <div class="p-5">
                        <div class="text-center">
                            <form action="/public/users/store" method="post" enctype="multipart/form-data">
                                {{ csrf_field() }}
                                <div class="card-header py-3 d-flex flex-row align-items-center justify-content-center">
                                    <h3 class="m-0 font-weight-bold text-info">TAMBAH DATA BARU</h3>
                                </div>
                        </div>

                        <br><br>

                        <div class="form-group row">
                           
                            <div class="col-sm-3">
                                <label for="name" class="form-label">Nama Lengkap</label>
                                <input type="text" class="form-control form-control-user" id="exampleFirstName" name="name">
                                @error('name')
                                    <div class="text-danger">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-sm-3">
                                <label for="NIK" class="form-label">NIK</label>
                                <input type="text" class="form-control form-control-user" id="exampleLastName" name="NIK">
                                @error('NIK')
                                    <div class="text-danger">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-sm-3">
                                <label for="email" class="form-label">Email</label>
                                <input type="text" class="form-control form-control-user" id="exampleFirstName" name="email">
                                @error('email')
                                    <div class="text-danger">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>
                        <br>
                        <div class="form-group row">
                            <div class="col-sm-4 mb-3 mb-sm-0">
                                <label for="jenis_kelamin" class="form-label">Jenis Kelamin</label>
                                <select name="jenis_kelamin" class="form-control form-select">
                                    <option value="" disabled selected>Pilih Jenis Kelamin</option>
                                    <option value="L">Laki-Laki</option>
                                    <option value="P">Perempuan</option>
                                </select>
                                @error('jenis_kelamin')
                                    <div class="text-danger">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-sm-3">
                                <label for="HP" class="form-label">Telpon/HP</label>
                                <input type="text" class="form-control form-control-user" id="exampleLastName" name="HP">
                                @error('HP')
                                    <div class="text-danger">{{ $message }}</div>
                                @enderror
                            </div>
                            <div class="col-sm-3">
                                <label for="role" class="form-label">Role</label>
                                <select name="role" class="form-control form-select">
                                    <option value="" disabled selected>Pilih Role</option>
                                    <option value="peserta">Peserta</option>
                                    <option value="admin">Admin</option>
                                    <option value="umi">Umi</option>
                                </select>
                                @error('role')
                                    <div class="text-danger">{{ $message }}</div>
                                @enderror
                            </div>
                        </div>

                        <div class="input-group">
                            <div class="col-sm-4">
                                <label for="photo" class="form-label">Upload Photo</label>
                                <input type="file" class="form-control" id="photo" name="photo">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-info">Submit</button>
                </div>
            </form>
            </div>
        </div>
    </div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
    integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous">
</script>
@endsection