@extends('hr_main')
@section('title', '| ' . $data['pageTitle'])
@section('content')
    @include('successMsg')

    <div class="row add-data-form">
        <div class="col-md-12">
            <div class="col-md-1"></div>
            <div class="col-md-10 fullbody">
                <div class="viewTitle" style="border-bottom: 1px solid white;">
                    <a href="{!! $data['listBtnUrl'] !!}" class="btn btn-info pull-right addViewBtn"><i
                            class="glyphicon glyphicon-th-list viewIcon">
                        </i>{!! $data['listBtnLabel'] !!}</a>
                </div>
                <div class="panel panel-default panel-border">
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="panel-heading">
                                    <div class="panel-title">{!! $data['pageTitle'] !!}</div>
                                </div>

                                <div class="panel-body">

                                    <div class="row">
                                        <div class="col-md-12">

                                            {!! Form::open([
                                                'files' => 'false',
                                                'id' => 'formId',
                                                'role' => 'form',
                                                'class' => 'form-horizontal form-groups',
                                            ]) !!}

                                            <div class="form-group col-sm-12">
                                                {!! Form::label('Name', 'Name:', ['class' => 'col-sm-2 control-label']) !!}
                                                <div class="col-sm-4">
                                                    {!! Form::text('name', '', [
                                                        'class' => 'form-control',
                                                        'id' => 'name',
                                                        'type' => 'text',
                                                        'placeholder' => 'Name',
                                                    ]) !!}
                                                    <p id='nameMsg' style="color: red !important;"></p>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-12">
                                                {!! Form::label('Short Name', 'Short Name:', ['class' => 'col-sm-2 control-label']) !!}
                                                <div class="col-sm-4">
                                                    {!! Form::text('short_name', '', [
                                                        'class' => 'form-control',
                                                        'id' => 'short_name',
                                                        'type' => 'text',
                                                        'placeholder' => 'Short Name',
                                                    ]) !!}
                                                    <p id='shortNameMsg' style="color: red !important;"></p>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-12">
                                                <label class="col-sm-2 control-label">Benefits:</label>
                                                <div class="col-sm-4">
                                                    <select name='benefit_ids[]' class='form-control benefit_ids' multiple id='benefit_ids'>
                                                        @foreach($data['benefits'] as $benefit)
                                                            <option value='{{ $benefit['id'] }}'>{{ $benefit['name'] }}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-12">
                                                <label class="col-sm-2 control-label">Facilities:</label>
                                                <div class="col-sm-4">
                                                    <select name='facility_ids[]' class='form-control facility_ids' multiple id='facility_ids'>
                                                        @foreach($data['facilities'] as $facility)
                                                            <option value='{{ $facility['id'] }}'>{{ $facility['name'] }}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-12">
                                                <div class="col-sm-4 col-sm-offset-2">
                                                    <p id='benefit_or_facility_msg' style="color: red !important;"></p>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-12">
                                                <label class="col-sm-2 control-label">Salary Type:</label>
                                                <div class="col-sm-4">
                                                    <select name='salary_type' class='form-control salary_type' id='salary_type'>
                                                        @foreach($data['salaryTypes'] as $key => $salaryType)
                                                            <option value='{{ $key }}'>{{ $salaryType }}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-12">
                                                <label class="col-sm-2 control-label">Status:</label>
                                                <div class="col-sm-4">
                                                    {!! Form::select('status', $data['allStatus'], null, ['class' => 'form-control status', 'id' => 'status']) !!}
                                                </div>
                                            </div>

                                            <div class="form-group col-sm-12">
                                                {!! Form::label('Order In Reports(Optional)', 'Order In Reports(Optional):', ['class' => 'col-sm-2 control-label']) !!}
                                                <div class="col-sm-4">
                                                    {!! Form::text('sort_order', '', [
                                                        'class' => 'form-control',
                                                        'id' => 'sort_order',
                                                        'type' => 'text',
                                                        'placeholder' => 'Order In Reports',
                                                    ]) !!}
                                                    <p id='sortOrderMsg' style="color: red !important;"></p>
                                                </div>
                                            </div>
                                            
                                            <div class="form-group">
                                                <div class="col-md-2"></div>
                                                <div class="col-sm-4">
                                                    {!! Form::submit('Submit', ['id' => 'add', 'class' => 'btn btn-info']) !!}
                                                    <a href="{!! $data['closeBtnUrl'] !!}"
                                                        class="btn btn-danger closeBtn">Close</a>
                                                </div>
                                            </div>

                                            {!! Form::close() !!}

                                        </div>
                                    </div>

                                </div>

                            </div>
                        </div>
                    </div>
                </div>
                <div class="footerTitle" style="border-top:1px solid white"></div>
            </div>
            <div class="col-md-1"></div>
        </div>
    </div>
@endsection

@section('footerAssets')
    <script>
        $(document).ready(function() {

            $('#name, #short_name').keyup(function() {
                $('#nameMsg').text(''); 
                $('#shortNameMsg').text('');
            });

            $('#benefit_ids, #facility_ids').change(function() {
                $('#benefit_or_facility_msg').text('');
            });

            $('#sort_order').on('input',  function () {
                this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');
                $('#sortOrderMsg').text('');
            });

            $("#benefit_ids").select2({
                placeholder: '  Choose Benefits',
                allowClear: true
            }).on('select2-open', function()
            {   // Adding Custom Scrollbar
                $(this).data('select2').results.addClass('overflow-hidden').perfectScrollbar();
            });

            $("#facility_ids").select2({
                placeholder: '  Choose Facilities',
                allowClear: true
            }).on('select2-open', function()
            {   // Adding Custom Scrollbar
                $(this).data('select2').results.addClass('overflow-hidden').perfectScrollbar();
            });

            // Form Submit Function
            $(document).on('submit', '#formId', function(event) {
                event.preventDefault();
                $("#add").prop('disabled', true);

                var formData = $('#formId').serialize();
                $.ajax({
                    url: '../income-tax-particular-item/store',
                    type: 'POST',
                    dataType: 'json',
                    data: formData,
                })
                .done(function(__response) {
                    if(__response.status == true) {
                        toastr.success(__response.message);
                        setTimeout(function() {
                            location.reload();
                        }, 1000);
                    } 
                    else if(__response.status == false) {
                        if(__response.field == 'name') $('#nameMsg').text(__response.message);
                        else if(__response.field == 'short_name') $('#shortNameMsg').text(__response.message);
                        else if(__response.field == 'benefit_or_facility') $('#benefit_or_facility_msg').text(__response.message);
                        else if(__response.field == 'sort_order') $('#sortOrderMsg').text(__response.message);
                        else toastr.error(__response.message);

                        $("#add").prop('disabled', false);
                    }
                    else {
                        $("#add").prop('disabled', false);
                        alert("something went wrong");
                    }
                })
                .fail(function() {
                    $("#add").prop('disabled', false);
                    alert("Response error");
                });

            });

        });
    </script>
@endsection