@extends('layouts.main')

@section('title', 'Okis 3.0 | Add new user')

@section('content')

	<div class="container">
		<div class="container-header container-title pb-2 pt-4">
			<h2><strong>neuen Mitarbeiter anlegen</strong></h2>			
		</div> 

		<form action="{{ route('users.store') }}" method="POST">
			@csrf

			<div class="row vh-80">
				@include('flash_message')

				<div class="col-xl-9">

					<div class="row">

						<div class="col-xl-12">
							<div class="">
												 
								<div class="">

									<div class="row">

										<div class="col-xl-5">
											@include('users._avatar')

											<div class="card card-light">
												<div class="card-body">
													@include('users._form')
												</div>
											</div>
										</div>

										<div class="col-xl-1"></div>

										<div class="col-xl-6">
											<div class="card card-light">
												<div class="card-body">
														
													<div class="form-group row">
														<div class="col-md-12">
															<label for="company" class="col-form-label">
																<strong>Unternehmen</strong>
															</label>
															<select name="company" id="company" class="form-control @error('company') is-invalid @enderror">
											
																<option value="">nicht zugeordnet</option>
																@foreach ($customer_types as $type)
																	<option {{ $type == old('company', $user->company) ? 'selected' : '' }} value="{{ $type }}">{{ $type }}</option>
																@endforeach
											
															</select>
														</div>
													</div>

												</div>
											</div>

											<div class="card card-light mt-3">
												<div class="card-body">
													@include('users._rights_form')
												</div>
											</div>

											<div class="card card-light mt-3">
												<div class="card-body">
													<div class="form-group row">
														
														<label for="android_types" class="col-md-3 col-form-label">
															<img src="{{ asset('./img/svg/brand/android.svg') }}" alt="" width="30">
															<strong>Android</strong>
														</label>
														<div class="col-md-9">
                                                            
															<input disabled type="hidden" name="android_typ" class="form-control" value="0">
															<select name="android_typ[]" id="android_types-select" class="form-select android_types-select dselect" data-dselect-search="true" data-dselect-clearable="true" data-dselect-size="sm" multiple>
                                                                <option value="">Rechte zuordnen</option>
                                                                @foreach ($android_types as $db_name => $android_type)
                                                                    <option
                                                                        @if(in_array($db_name, old('android_typ', $user_android_types ?? [])))
                                                                            selected
                                                                        @endif
                                                                        value="{{ $db_name }}">
                                                                        {{ $android_type }}
                                                                    </option>
                                                                @endforeach
                                                            </select>

														</div>

													</div>
												</div>
											</div>
										</div>
										
									</div>

									<hr>

									<div class="button-footer-dark text-center my-1">
										<button type="submit" class="btn btn-success">							Speichern	</button>
										<a href="{{ route('users.index') }}" class="btn btn-outline-light">		Abbrechen	</a>
									</div>
								</div>
							</div>
					 	</div>

						
					</div>

					<div class="row mt-5">

						<div class="col-xl-12">

							<div class="card card-light">
								<div class="card-header card-title">
									<h3>Unterweisungen</h3>
								</div>

								<div class="card-body">

								</div>
							</div>

						</div>

					</div>


				</div>	{{-- END COL 9 --}}
			</div>
			
		</form>

	</div>

	<script> 	
		$('select.dselect').each(function(e){ dselect(document.querySelector('#'+$(this).attr('id'))); })
	</script>
	
@endsection