@extends('layouts.'.$namespaceName.'.master')
@section('title')
{{$title}}
@endsection
@section('content')
<div class="page-wrapper">
    <div class="page-content m-2">
        @include('message')
        @include('breadcrumb')
        <div class="row">
            <div class="col-xl-8 mx-auto">
                <h6 class="mb-3 text-uppercase main_title_page">{{$title}}</h6>
                <div class="card main_card">
                    <div class="card-body">
                        <div class="border p-3 rounded">
                            <form action="{{route($modelName.'.store')}}" method="post" autocomplete="off"
                                  enctype="multipart/form-data">
                                @csrf
                                <div class="mb-3">
                                    <label class="mb-2">{{trans($namespaceName.'/'.$modelName.'.'.'group_name')}}</label>
                                    <input type="text" name="group_name" class="form-control  @error('group_name') is-invalid @enderror" required value="{{old('group_name')}}">
                                    @error('group_name')
                                    <div class="alert alert-danger">{{$message}}</div>
                                    @enderror
                                </div>
                                <div class="mb-3">
                                    <div class="row">
                                        <div class="col-9 mb">
                                            <label class="mb-2">{{trans($namespaceName.'/'.$modelName.'.'.'group_owner_email')}}</label>
                                            <input type="email" name="group_owner" class="form-control  @error('group_owner') is-invalid @enderror" required value="{{old('group_owner')}}">
                                            @error('group_owner')
                                            <div class="alert alert-danger">{{$message}}</div>
                                            @enderror</div>
                                        <div class="col-3">
                                            <label class="form-check-label mb-2" for="flexSwitchCheckChecked"> {{trans($namespaceName.'/'.$modelName.'.'.'send_notification')}}</label>
                                            <div class="form-check form-switch">
                                                    <input class="form-check-input" name="send_notification"  type="checkbox" id="flexSwitchCheckChecked" checked>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                 <div class="mb-3">
                                    <label class="form-label">{{trans($namespaceName.'/'.$modelName.'.visitor_group_types')}}</label>
                                    <select class="form-select js-example-basic-single" onchange="groupTypeMenu(this)" name="visitor_group_type_key" data-placeholder="Choose anything">
                                        <option disabled selected >{{trans($namespaceName.'/'.$modelName.'.select_visitor_group_type')}}</option>
                                        @foreach(getLookupData('visitorGroupType') as $type)
                                            <option value="{{ $type->key }}" {{ old('visitor_group_type_key') == $type->key? "selected":"" }}>{{$type->display_value}}</option>
                                        @endforeach
                                    </select>
                                </div>

                                <div class="mb-3" id="domain_div" style="display: none">
                                    <label class="mb-2">{{trans($namespaceName.'/'.$modelName.'.'.'domain_name')}}</label>
                                    <input type="text" name="domain" class="form-control @error('domain') is-invalid @enderror" required value="{{old('domain')}}">
                                    @error('domain')
                                    <div class="alert alert-danger">{{$message}}</div>
                                    @enderror
                                </div>

                                <div class="mb-3">
                                    <label class="mb-2">{{trans($namespaceName.'/'.$modelName.'.'.'reserved_number')}}</label>
                                    <div class="input-group">
                                        <input type="number"  name="reserved_number" min="1" class="form-control @error('reserved_number') is-invalid @enderror" value="{{old('reserved_number')}}" required>
                                    </div>
                                    @error('password')
                                    <div class="alert alert-danger">{{$message}}</div>
                                    @enderror
                                </div>

                                <div class="mb-3">
                                    <label class="form-label">{{trans($namespaceName.'/'.$modelName.'.event_name')}} <small style="font-size: x-small">({{trans('labels.optional')}})</small></label>
                                    <select class="form-select js-example-basic-single" name="event_code" data-placeholder="Choose anything">
                                        <option disabled selected >{{trans($namespaceName.'/'.$modelName.'.select_event_name')}}</option>
                                        @foreach($events as $event)
                                            <option value="{{ $event->event_code }}" {{ old('$event->event_code') == $event->event_code? "selected":"" }}>{{$event->name}}</option>
                                        @endforeach
                                    </select>
                                    @error('event_name')
                                    <div class="alert alert-danger">{{$message}}</div>
                                    @enderror
                                </div>

                                <div class="row">
                                    <div class="col">
                                        <button class="btn primary"> {{trans('labels.save')}}</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


@endsection

@push('js')

    <script>
        $(document).ready(function () {
            $("#show_hide_password a").on('click', function (event) {
                event.preventDefault();
                if ($('#show_hide_password input').attr("type") == "text") {
                    $('#show_hide_password input').attr('type', 'password');
                    $('#show_hide_password i').addClass("bx-hide");
                    $('#show_hide_password i').removeClass("bx-show");
                } else if ($('#show_hide_password input').attr("type") == "password") {
                    $('#show_hide_password input').attr('type', 'text');
                    $('#show_hide_password i').removeClass("bx-hide");
                    $('#show_hide_password i').addClass("bx-show");
                }
            });
            $("#show_hide_password1 a").on('click', function (event) {
                event.preventDefault();
                if ($('#show_hide_password1 input').attr("type") == "text") {
                    $('#show_hide_password1 input').attr('type', 'password');
                    $('#show_hide_password1 i').addClass("bx-hide");
                    $('#show_hide_password1 i').removeClass("bx-show");
                } else if ($('#show_hide_password1 input').attr("type") == "password") {
                    $('#show_hide_password1 input').attr('type', 'text');
                    $('#show_hide_password1 i').removeClass("bx-hide");
                    $('#show_hide_password1 i').addClass("bx-show");
                }
            });
        });


        function groupTypeMenu(menu){
            domainDiv = $('#domain_div')
            if(menu.value == 'domain'){
                domainDiv.html('<label class="mb-2">{{trans($namespaceName.'/'.$modelName.'.'.'domain_name')}}</label>'+
                    '<input type="text" name="domain" class="form-control  @error('domain') is-invalid @enderror" required value="{{old('domain')}}">' +
                    '@error('domain')' +
                    '<div class="alert alert-danger">{{$message}}</div>' +
                    '<div class="alert alert-danger">{{$message}}</div>'+
                    '@enderror');
                domainDiv.css('display','block')
            }else {
                domainDiv.css('display','block')
                domainDiv.html('')

            }


        }
    </script>
@endpush