@extends('layouts.backend')

@section('content')
    <link rel="stylesheet" href="{{ asset('css/modules/questionnaires/style.css') }}">
    <!-- Hero -->
    <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 font-size-h2 font-w400 mt-2 mb-0 mb-sm-2">
                    @if(empty($user)){{ __('Create user') }}@else{{ __('Edit user') }}@endif
                </h1>
                <nav class="flex-sm-00-auto ml-sm-3" aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item" aria-current="page">{{ __('Users') }}</li>
                        <li class="breadcrumb-item active" aria-current="page">@if(empty($user)){{ __('Create item') }}@else{{ __('Edit item') }}@endif</li>
                    </ol>
                </nav>
            </div>
       </div>
    </div>
    <!-- END Hero -->

    <!-- Page Content -->
    <div class="content">

        <form action="@if(empty($user)){{ route('UsersStore') }}@else{{ route('UsersUpdate', ['users' => $user->id]) }}@endif" method="POST" enctype="multipart/form-data">
            @csrf
            <!-- Default INPUTS -->

            <!-- Dynamic Table with Export Buttons -->
            <div class="block block-rounded block-bordered">
                <div class="block-header block-header-default">
                    <h3 class="block-title"></h3>
                    <a href="{{ Route('UsersIndex') }}" class="btn btn-info mr-1 mb-3">{{ __('Back to listing') }}</a>
                    <button type="submit" class="btn btn-success mr-1 mb-3">{{ __('Save item') }}</button>
                </div>
                <div class="row">
                    <div class="col-12">
                        <div class="block-content block-content-full">
                            @if(auth()->user()->groupId == 1)
                                <div class="form-group">
                                    <label for="groupId">{{ __('Group') }}</label>
                                    <select class="js-select2 form-control" id="groupId" name="groupId" style="width: 100%;" data-placeholder="{{ __('Choose one..') }}" aria-describedby="clientId-error" aria-invalid="true">
                                        <option></option>
                                        @foreach ($groups as $g)
                                            <option value="{{ $g->id }}" @if(!empty($user)) @if($g->id == $user->groupId) selected="selected" @endif @endif>{{ $g->name }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            @endif
                            <div class="form-group">
                                <label for="clientId">{{ __('Client') }}</label>
                                <select class="js-select2 form-control" id="clientId" name="clientId" style="width: 100%;" data-placeholder="{{ __('Choose one..') }}" aria-describedby="clientId-error" aria-invalid="true">
                                    <option></option>
                                    <option value="0">{{ __('N/A') }}</option>
                                    @foreach ($clients as $key => $value)
                                        <option value="{{ $key }}" @if(!empty($user)) @if($key == $user->clientId) selected="selected" @endif @endif>{{ $value }}</option>
                                    @endforeach
                                </select>
                                <div id="clientId-error" class="invalid-feedback animated fadeIn">{{ __('Needed field') }} </div>
                            </div>
                            <div class="form-group">
                                <label for="name">{{ __('Name') }}</label>
                                <input type="text" class="form-control" id="name" name="name" placeholder="{{ __('Name') }}" aria-describedby="name-error" aria-invalid="true" value="@if(!empty($user->name)){{ $user->name }}@endif">
                                <div id="name-error" class="invalid-feedback animated fadeIn">{{ __('Needed field') }} </div>
                            </div>
                            <div class="form-group">
                                <label for="email">{{ __('Email') }} <small>({{ __('Example') }}: example@example.com)</small></label>
                                <input type="email" class="form-control" id="email" name="email" placeholder="{{ __('Email') }}" aria-describedby="email-error" aria-invalid="true" value="@if(!empty($user->email)){{ $user->email }}@endif">
                                <div id="email-error" class="invalid-feedback animated fadeIn">{{ __('Please enter a valid email address') }} </div>
                            </div>
                            <div class="form-group">
                                <label for="phone">{{ __('Phone') }} <small>({{ __('Example') }}: 06301234567)</small></label>
                                <input type="text" class="js-masked-phone form-control js-masked-enabled" id="phone" name="phone" placeholder="{{ __('Phone') }}" value="@if(!empty($user->phone)){{ $user->phone }}@endif">
                                <div id="phone-error" class="invalid-feedback animated fadeIn">{{ __('Please enter a valid email address') }} </div>
                            </div>
                            <script>
                                $(function($){
                                    $("#phone").mask("06999999999");
                                });
                            </script>
                            @if(auth()->user()->groupId == 1)
                                <div class="form-group">
                                    <div class="custom-control custom-switch mb-1">
                                        <input type="checkbox" class="custom-control-input" id="apiKeyEnabled" name="apiKeyEnabled" checked>
                                        <label class="custom-control-label" for="apiKeyEnabled">{{ __('Api key enabled') }}</label>
                                    </div>
                                </div>
                            @endif

                            @if(!empty($user->groupId) && !empty($device))
                                @if($user->groupId == 3)
                                    <h2 class="content-heading">{{ __('Devices') }}</h2>
                                    <div class="equipments form-input-group mb-3">
                                        <div class="form-group">
                                            <select class="js-select2 form-control" id="devices" name="devices[]" style="width: 100%;" data-placeholder={{ __("Choose many..") }} multiple>
                                                <option></option><!-- Required for data-placeholder attribute to work with Select2 plugin -->
                                                @foreach ($device as $key => $value)
                                                    <option value="{{$key}}" @if(!empty($activeDevice) && array_search($key, $activeDevice)) selected @endif>{{$value}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div id="equipment-error" class="invalid-feedback animated fadeIn">{{ __('Needed field') }} </div>
                                @endif
                            @endif
                        </div>
                    </div>
                </div>
            </div>
            <!-- END Dynamic Table with Export Buttons -->
        </form>
    </div>
    <!-- END Page Content -->
@endsection