@extends('layouts.main')

@push('styles')
<link href="{{ asset('elite/bower_components/bootstrap-datepicker/bootstrap-datepicker.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('elite/bower_components/icheck/skins/all.css') }}" rel="stylesheet">
@endpush

@section('content')

<div class="row bg-title">
    <div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
        <h4 class="page-title">{{ __('drugs.new_drug') }}</h4>
    </div>
    <div class="col-lg-9 col-sm-8 col-md-8 col-xs-12">
        <ol class="breadcrumb">
            <li><a href="{{ route('home') }}">{{ __('drugs.dashboard') }}</a></li>
            <li><a href="{{ route('drugs.index') }}">{{ __('drugs.drugs') }}</a></li>
            <li class="active">{{ __('drugs.register') }}</li>
        </ol>
    </div>
</div>

@include('clinical_data::drugs.menu')

<div class="row">
    <div class="col-sm-12">
        <!--Flash messages at the top -->
        @include('flash::message')
        <div class="white-box">
            @if (session()->has('streamline_setup'))
                <h3><font color="blue">{{ __('drugs.streamline_setup_eigth_of_ten') }}</font></h3>
                {{ Form::open(['route' => 'drugs.store','data-toggle'=>'validator']) }}

                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            {{ Form::label('name', __('drugs.drug_name')) }}
                            {{ Form::text('name', '', ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('category_id', __('drugs.drug_category')) }}
                            {{ Form::select('category_id', $drug_categories, null, ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('form_id', __('drugs.drug_form')) }}
                            {{ Form::select('form_id', $drug_forms, null, ['class'=>'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('available', __('drugs.is_drug_available'), ["class"=>'col-md-12']) }}
                            &nbsp;{{ __('drugs.yes') }} {{ Form::radio('available', 1, false,  ["required", 'class' => 'check form-control', 'data-radio'=>'iradio_flat-green']) }}
                            &nbsp;{{ __('drugs.no') }} {{ Form::radio('available', 0, false, ["required", 'class' => 'check form-control', 'data-radio'=>'iradio_flat-green']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('unit_id', __('drugs.drug_unit')) }}
                            {{ Form::select('unit_id', $drug_units, null, ['class'=>'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('pack', __('drugs.pack')) }}
                            {{ Form::number('pack', '', ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('strength', __('drugs.strength')) }}
                            {{ Form::number('strength', '', ['class' => 'form-control', 'step' => '0.01']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('supplier_id', __('drugs.supplier')) }}
                            {{ Form::select('supplier_id', $suppliers, null, ['class'=>'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('package_unit_id', __('drugs.package_unit')) }}
                            {{ Form::select('package_unit_id', $package_units, null, ['class'=>'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('',__('drugs.does_package_unit_have_sub_packages'), ["class"=>'col-md-12']) }}
                            &nbsp;{{ __('drugs.yes') }} {{ Form::radio('does_package_unit_have_sub_packages', 1, false, ['class' => 'check form-control have_sub_package', 'data-radio'=>'iradio_flat-green', 'id' => 'does_have_sub_package1', 'onclick'=>'displaySubPackagesDivs()']) }}
                            &nbsp;{{ __('drugs.no') }} {{ Form::radio('does_package_unit_have_sub_packages', 0, false, ['class' => 'check form-control have_sub_package', 'data-radio'=>'iradio_flat-green', 'id' => 'does_not_have_sub_package1', 'onclick'=>'displaySubPackagesDivs()']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group quantity_in_each_package_unit_div">
                            {{ Form::label('quantity_in_each_package_unit', __('drugs.quantity_in_each_package_unit')) }}
                            {{ Form::number('quantity_in_each_package_unit', '', ['class' => 'form-control', 'step' => '0.01']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group quantity_in_each_sub_package_div">
                            {{ Form::label('quantity_in_each_sub_package', __('drugs.quantity_in_each_sub_package')) }}
                            {{ Form::number('quantity_in_each_sub_package', '', ['class' => 'form-control', 'step' => '0.01']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group quantity_in_each_sub_package_div">
                            {{ Form::label('number_of_sub_packages_in_main_package', __('drugs.number_of_sub_packages_in_main_package')) }}
                            {{ Form::number('number_of_sub_packages_in_main_package', '', ['class' => 'form-control', 'step' => '0.01']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('description', __('drugs.drug_description')) }}
                            {{ Form::textArea('description', '', ['class'=>'form-control', 'rows' => 4]) }}
                        </div>

                        <div class="form-group">
                            {{ Form::label('prompt', __('drugs.drug_prompt')) }}
                            {{ Form::textArea('prompt', '', ['class'=>'form-control', 'rows' => 4]) }}
                        </div>
                    </div>
                    <div class="col-md-4">
<!--                        <div class="form-group">
                            {{ Form::label('store_stock', __('drugs.current_store_stock')) }}
                            {{ Form::number('store_stock', 0, ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('pharmacy_stock', __('drugs.current_pharmacy_stock')) }}
                            {{ Form::number('pharmacy_stock', 0, ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>-->

                        <div class="form-group">
                            {{ Form::label('reorder_level', __('drugs.re_order_level')) }}
                            {{ Form::number('reorder_level', '', ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>
                        
                        <div class="form-group">
                            {{ Form::label('cost_price', __('drugs.cost_price')) }}
                            {{ Form::number('cost_price', '', ['class'=>'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('account_id', __('drugs.income_account')) }}
                            {{ Form::select('account_id', $income_accounts, null, ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('cog_account', __('drugs.cost_of_goods_account')) }}
                            {{ Form::select('cog_account', $cost_of_goods_accounts, null, ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('inventory_account', __('drugs.inventory_asset_account')) }}
                            {{ Form::select('inventory_account', $inventory_asset_accounts, null, ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('expiry_date', __('drugs.inventory_asset_account')) }}
                            <div class="input-group">
                                {{ Form::text('expiry_date', '', ['class'=>'form-control', 'readonly', 'id'=>'datepicker-autoclose']) }}
                                <span class="input-group-addon"><i class="icon-calender"></i></span>
                            </div>
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('non_insured_price', __('drugs.non_insured_price')) }}
                            {{ Form::number('non_insured_price', '', ['class'=>'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('info_english', __('drugs.patient_info_in_english')) }}
                            {{ Form::textArea('info_english', '', ['class'=>'form-control', 'rows' => 4]) }}
                        </div>

                        <div class="form-group">
                            {{ Form::label('info_vernacular', __('drugs.patient_info_in_vernacular')) }}
                            {{ Form::textArea('info_vernacular', '', ['class'=>'form-control', 'rows' => 4]) }}
                        </div>
                    </div>
                    <div class="col-md-4" style="background: #eceeef;">
                        <h4>{{ __('drugs.select_from_list') }}</h4>
                        <input id="select_all" type="checkbox"> <b>Select All</b><br><br>
                        @foreach ($default_drugs as $defaultDrug)
                            <div class="form-group">
                                {{ Form::checkbox('selected_drugs[]', $defaultDrug['name'], false, ['class' => 'item_checkbox']) }} {{ $defaultDrug['name'] }} &nbsp;&nbsp;
                            </div>
                        @endforeach
                    </div>
                </div>
                {{ Form::button(__('drugs.next'),['type'=>'submit','class'=>'btn btn-success waves-effect waves-light m-r-10 next']) }}
                {{ Form::button(__('drugs.skip'),['type'=>'submit','name' => 'skip', 'value' => 'skip','class'=>'btn btn-default waves-effect waves-light m-r-10']) }}
            @else

                {{ Form::open(['route' => 'drugs.store','data-toggle'=>'validator']) }}

                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            {{ Form::label('name', __('drugs.drug_name')) }}
                            {{ Form::text('name', '', ['class' => 'form-control compulsory']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('category_id', __('drugs.drug_category')) }}
                            {{ Form::select('category_id', $drug_categories, null, ['class' => 'form-control compulsory']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('form_id', __('drugs.drug_form')) }}
                            {{ Form::select('form_id', $drug_forms, null, ['class'=>'form-control compulsory']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('available', __('drugs.is_drug_available'), ["class"=>'col-md-12']) }}
                            &nbsp;{{ __('drugs.yes') }} {{ Form::radio('available', 1, false,  ["required", 'class' => 'check form-control', 'data-radio'=>'iradio_flat-green']) }}
                            &nbsp;{{ __('drugs.no') }} {{ Form::radio('available', 0, false, ["required", 'class' => 'check form-control', 'data-radio'=>'iradio_flat-green']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('unit_id', __('drugs.drug_unit')) }}
                            {{ Form::select('unit_id', $drug_units, null, ['class'=>'form-control compulsory']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('pack', __('drugs.pack')) }}
                            {{ Form::number('pack', '', ['class' => 'form-control compulsory']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('strength', __('drugs.strength')) }}
                            {{ Form::number('strength', '', ['class' => 'form-control compulsory', 'step' => '0.01']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('supplier_id', __('drugs.supplier')) }}
                            {{ Form::select('supplier_id', $suppliers, null, ['class'=>'form-control compulsory']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('package_unit_id', __('drugs.purchasing_package_unit')) }}
                            {{ Form::select('package_unit_id', $package_units, null, ['class'=>'form-control compulsory']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('',__('drugs.does_package_unit_have_sub_packages'), ["class"=>'col-md-12']) }}
                            &nbsp;{{ __('drugs.yes') }} {{ Form::radio('does_package_unit_have_sub_packages', 1, false, ['class' => 'check form-control', 'data-radio'=>'iradio_flat-green', 'required', 'id' => 'does_have_sub_package2', 'onclick'=>'displaySubPackagesDivs()']) }}
                            &nbsp;{{ __('drugs.no') }} {{ Form::radio('does_package_unit_have_sub_packages', 0, false, ['class' => 'check form-control have_sub_package', 'data-radio'=>'iradio_flat-green', 'required', 'id' => 'does_not_have_sub_package2', 'onclick'=>'displaySubPackagesDivs()']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group quantity_in_each_package_unit_div">
                            {{ Form::label('quantity_in_each_package_unit', __('drugs.quantity_in_each_package_unit')) }}
                            {{ Form::number('quantity_in_each_package_unit', '', ['class' => 'form-control', 'step' => '0.01']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group quantity_in_each_sub_package_div">
                            {{ Form::label('quantity_in_each_sub_package', __('drugs.quantity_in_each_sub_package')) }}
                            {{ Form::number('quantity_in_each_sub_package', '', ['class' => 'form-control', 'step' => '0.01']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group quantity_in_each_sub_package_div">
                            {{ Form::label('number_of_sub_packages_in_main_package', __('drugs.number_of_sub_packages_in_main_package')) }}
                            {{ Form::number('number_of_sub_packages_in_main_package', '', ['class' => 'form-control', 'step' => '0.01']) }}
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="col-md-4">
<!--                        <div class="form-group">
                            {{ Form::label('store_stock', __('drugs.current_store_stock')) }}
                            {{ Form::number('store_stock', 0, ['class' => 'form-control compulsory', 'id' => 'store_stock']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('pharmacy_stock', __('drugs.current_pharmacy_stock')) }}
                            {{ Form::number('pharmacy_stock', 0, ['class' => 'form-control', 'id' => 'pharmacy_stock']) }}
                            <div class="help-block with-errors"></div>
                        </div>-->

                        <div class="form-group" id="initial_div" style="display: none;">
                            <div class="alert alert-info">
                                <button type="button" class="close" data-dismiss="alert">×</button>
                                <span>
                                    {!! __('drugs.initial_stock_count_explanation') !!}
                                </span>
                            </div>
                            {{ Form::label('is_initial_stock_count', __('drugs.is_initial_stock_count')) }}
                            {{ Form::select('is_initial_stock_count', [0 => 'No', 1 => 'Yes'], null, ['class' => 'form-control compulsory','required']) }}
                            <br>
                        </div>

                        <div class="form-group">
                            {{ Form::label('reorder_level', __('drugs.re_order_level')) }}
                            {{ Form::number('reorder_level', '', ['class' => 'form-control compulsory']) }}
                            <div class="help-block with-errors"></div>
                        </div>
                        
                        <div class="form-group">
                            {{ Form::label('cost_price', __('drugs.cost_price')) }}
                            {{ Form::number('cost_price', '', ['class'=>'form-control compulsory']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('account_id', __('drugs.income_account')) }}
                            {{ Form::select('account_id', $income_accounts, null, ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('cog_account', __('drugs.cost_of_goods_account')) }}
                            {{ Form::select('cog_account', $cost_of_goods_accounts, null, ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('inventory_account', __('drugs.inventory_asset_account')) }}
                            {{ Form::select('inventory_account', $inventory_asset_accounts, null, ['class' => 'form-control']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('expiry_date', __('drugs.drug_expiry_date')) }}
                            <div class="input-group">
                                {{ Form::text('expiry_date', '', ['class'=>'form-control compulsory', 'readonly', 'id'=>'datepicker-autoclose']) }}
                                <span class="input-group-addon"><i class="icon-calender"></i></span>
                            </div>
                            <div class="help-block with-errors"></div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            {{ Form::label('', __('drugs.long_term'), ["class"=>'col-md-12']) }}
                            &nbsp;{{ __('drugs.yes') }} {{ Form::radio('long_term', 1, false, ["required", 'class' => 'check form-control', 'data-radio'=>'iradio_flat-green']) }}
                            &nbsp;{{ __('drugs.no') }} {{ Form::radio('long_term', 0, false, ["required", 'class' => 'check form-control', 'data-radio'=>'iradio_flat-green']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('non_insured_price', 'Cash Price') }}
                            {{ Form::number('non_insured_price', '', ['class'=>'form-control compulsory', 'id' => 'non_insured_price']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        @php
                            $price_list_categories = \Streamline\Models\PriceListCategories::select('patient_category_id', 'id')->get();
                        @endphp

                        @foreach($price_list_categories as $record)
                            <div class="form-group">
                                {{ Form::label('non_insured_price', get_name($record->patient_category_id, 'id', 'name', 'patient_categories').' Price') }}
                                {{ Form::hidden('price_list_category_id[]', $record->id) }}
                                {{ Form::number('price_list_price[]', '', ['class'=>'form-control price_list_price']) }}
                            </div>
                        @endforeach

                        <div class="form-group">
                            {{ Form::label('description', __('drugs.drug_description')) }}
                            {{ Form::textArea('description', '', ['class'=>'form-control', 'rows' => 4]) }}
                        </div>

                        <div class="form-group">
                            {{ Form::label('prompt', __('drugs.drug_prompt')) }}
                            {{ Form::textArea('prompt', '', ['class'=>'form-control', 'rows' => 4]) }}
                        </div>

                        <div class="form-group">
                            {{ Form::label('info_english', __('drugs.patient_info_in_english')) }}
                            {{ Form::textArea('info_english', '', ['class'=>'form-control', 'rows' => 4]) }}
                        </div>

                        <div class="form-group">
                            {{ Form::label('info_vernacular', __('drugs.patient_info_in_vernacular')) }}
                            {{ Form::textArea('info_vernacular', '', ['class'=>'form-control', 'rows' => 4]) }}
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    {{ Form::label('reference_text', __('symptoms.reference_area')) }}
                    <div class="row">
                        <div class="col-sm-4">
                            {{ Form::text('reference_name[]', '', ['class'=>'form-control', 'placeholder' => 'Reference Name']) }}
                        </div>
                        <div class="col-sm-8">
                            {{ Form::url('reference_areas[]', '', ['class'=>'form-control', 'placeholder' => 'eg http://www.google.com']) }}
                        </div>  
                    </div>
                    <div class="col-sm-12 input_fields_wrap"></div>
                    <div class="col-sm-12"><a class="add_field_button" style="color: blue;">{{ __('symptoms.add_more') }}</a></div>
                </div>
                {{ Form::button(__('drugs.submit'),['type'=>'submit','class'=>'btn btn-rounded btn-success waves-effect waves-light m-r-10 submit-btn']) }}
                {{ Form::button(__('drugs.cancel'),['type'=>'reset','class'=>'btn btn-rounded btn-default waves-effect waves-light']) }}
            @endif

            {{ Form::close() }}
        </div>
    </div>
</div>
@endsection


@push('scripts')
<!-- <script src="{{ asset('elite/js/validator.js') }}"></script> -->
<!-- Date Picker Plugin JavaScript -->
<script src="{{ asset('elite/bower_components/bootstrap-datepicker/bootstrap-datepicker.min.js') }}"></script>

<!-- icheck -->
<script src="{{ asset('elite/bower_components/icheck/icheck.min.js') }}"></script>
<script src="{{ asset('elite/bower_components/icheck/icheck.init.js') }}"></script>


<script type="text/javascript">
    $('#datepicker-autoclose').datepicker({
        autoclose: true,
        todayHighlight: true,
        format: 'dd-mm-yyyy'
    });

    $(".next,.submit-btn").click(function (e) { // make sure that all compulsory fields have been filled out
        var empty_compulsory_fields = [];
        $(".compulsory").each(function () {
            if ($(this).val() == "") {
                var textname = $(this).attr('name');
                $(this).focus();
                empty_compulsory_fields.push(textname);
                $(this).css('border','1px solid #F08080');
            }
        });
        /* check if the array containing empty compulsory fields is not empty then return false */
        if (empty_compulsory_fields.length != 0) {
            alert("Please fill in all compulsory fields");
            console.log(empty_compulsory_fields);
            e.preventDefault();
            return false;
        }
    });

    $('#select_all').change(function() {
        if (this.checked === true) {
            $(".item_checkbox").each(function() {
                this.checked = true;
            });
        } else {
            $(".item_checkbox").each(function() {
                this.checked = false;
            });
        }
    });

    $('#pharmacy_stock,#store_stock').change(function(e) {
        if ($('#pharmacy_stock').val() > 0 || $('#store_stock').val()) {
            $('#initial_div').show();
        }
    });

    $('#non_insured_price').change(function(e) {
        var non_insured_price = $(this).val();
        if (non_insured_price > 0) {
            $(".price_list_price").each(function () {
                $(this).val(non_insured_price);
            });
        }
    });

    function displaySubPackagesDivs() {
        if (document.getElementById("does_have_sub_package1").checked) {
            document.querySelector(".quantity_in_each_package_unit_div").style.display = "block";
            document.querySelector(".quantity_in_each_sub_package_div").style.display = "none";
        }
        if (document.getElementById("does_not_have_sub_package1").checked) {
            document.querySelector(".quantity_in_each_package_unit_div").style.display = "block";
            document.querySelector(".quantity_in_each_sub_package_div").style.display = "none";
        }

        if (document.getElementById("does_have_sub_package2").checked) {
            document.querySelector(".quantity_in_each_package_unit_div").style.display = "block";
            document.querySelector(".quantity_in_each_sub_package_div").style.display = "none";
        }
        if (document.getElementById("does_not_have_sub_package2").checked) {
            document.querySelector(".quantity_in_each_package_unit_div").style.display = "block";
            document.querySelector(".quantity_in_each_sub_package_div").style.display = "none";
        }
    }
    $(document).ready(function () {
        var max_fields = 4; //maximum input boxes allowed
        var wrapper = $(".input_fields_wrap"); //Fields wrapper

        var x = 1; //initlal text box count
        $(".add_field_button").click(function (e) { //on add input button click
            e.preventDefault();
            if (x < max_fields) { //max input box allowed
                x++; //text box increment
                $(wrapper).append('<br><div class="row"><div class="col-sm-4"><input type="text" class="form-control compulsory" placeholder="Reference name" name="reference_name[]" required/></div>' +
                        '<div class="col-sm-7"><input type="url" placeholder="eg http://www.google.com" class="form-control compulsory" name="reference_areas[]" required/></div>'
                        + '<a href="#" class="remove_field" style="color: maroon"><sup>X</sup></a></div>'); //add input box
            }else  {
                $(".add_field_button").hide();
                alert('Only four references can be added.');
            }
        });

        $(wrapper).on("click", ".remove_field", function (e) { //user click on remove text
            e.preventDefault();
            $(this).parent('div').remove();
            x--;
        })
    });
</script>
@endpush