@extends('layouts.app', ['class' => '', 'elementActive' => 'listUser'])



@section('content')

<div class="content">
    @if (count($errors) > 0)
    @if($errors->any())
    <div class="alert alert-success alert-dismissible fade show" role="alert">
        {{$errors->first()}}
        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
          </div>
 @endif
@endif
</br>


    <div class="container-fluid">
    <div class="card">
            <div class=" card-header text-center">
            <!-- <div class="card-header d-flex align-items-center justify-content-between "> -->
                     <h2 class="card-title mb-0 text-success" style="font-weight: bold;">KONTO HINZUFÜGEN</h2>
                     <img src="{{ asset('paper') }}/img/underlineTitle.png" alt="Decorative underline" style="margin-top: 5px; width: 200px;">

            <!-- </div> -->
            </div>

            <div class="card-body">                
            <div class="col-md-12">
                <form method="post" action="{{ route('user.addNewUser') }}" autocomplete="off"  enctype="multipart/form-data">
                    @csrf
                    <div class="pl-lg-6">

              

       
 <!-- Hidden input that will actually be submitted -->
<input type="hidden" name="isAdmin" id="isAdmin" value="">

<!-- Car Type -->
         <label class="form-control-label text-dark">Das Konto ist</label><br>
    <div class="form-group radio-button-group">
        <label class="text-dark"><input type="radio" name="user_type" required value="1" onclick="document.getElementById('isAdmin').value = '1';" > <span>Admin</span></label>
        <label class="text-dark"><input type="radio" name="user_type" value="0" onclick="document.getElementById('isAdmin').value = '0';" > <span>Editor</span></label>
    </div>



    <div class="form-group">
        <label for="name" class="text-dark">Name</label>
        <input type="text" id="name" name="name" class="form-control" required>
    </div>


    

    <div class="row">    
            
     <div class="col-md-6">
        <div class="form-group">
        <label for="email" class="text-dark">E-mail</label>
        <input type="email" id="email" name="email" class="form-control" required>
    </div>

 </div>  

  <div class="col-md-6">
    <div class="form-group">
        <label for="password" class="text-dark">Password</label>
        <input type="text" id="password" name="password" class="form-control" required>
    </div>

 </div>  

</div>



<div class="form-group">
            <img id="output" width="100px"/>

                        </div>

                        <div class="form-group">

<label for="exampleInputFile" class="bmd-label-floating">
                                <p  class="btn btn-success mt-4">
   Datei hinzufügen</p>
</label>
<input type="file" class="form-control-file" name="account_file" id="exampleInputFile" onchange="loadFile(event)" />
</div> 

                    
                              <div class="form-group">
<input id="routing" name="routing" value="0" hidden>
</div> 

                        <div class="text-center">
                            <a href="{{ route('user.listUser') }}"  class="btn btn-primary mt-4">{{ __('ZURÜCK') }}</a>

                            <button onmouseover="myFunction(0)" type="submit" id="myBtn" class="btn btn-success mt-4"  >{{ __('Speichern & Neu') }}</button>
                            <button onmouseover="myFunction(1)" type="submit" id="myBtn1" class="btn btn-success mt-4"  >{{ __('Speichern') }}</button>
                            </div>
                    </div>
                </form>
            </div>
            </div>
        </div>
    </div>
    </br>
</div>

@endsection


@stack('js') 
<!-- push -->
    <script>




     function myFunction(route){
        console.log(route);
                $('#routing').val(route);

    }

    var loadFile = function(event) {
    var output = document.getElementById('output');
    output.src = URL.createObjectURL(event.target.files[0]);
    output.onload = function() {
      URL.revokeObjectURL(output.src) // free memory
    }
  };



 function setToday(inputId) {
        document.getElementById(inputId).valueAsDate = new Date();

}


    </script>
    <!-- @endstack -->