@extends('layouts.admin')
@section('css')
@endsection
@section('content')
<div class="page-header text-uppercase">
    <ul class="list-unstyled space-list m-0">
        <li>
            <p>{{ $data->id ?  __('discount_offer_rules.edit') :  __('discount_offer_rules.add') }}</p>
        </li>
        <li>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{route('admin.dashboard')}}">{{__('common.home') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page"><a href="{{route('discount-offer-rules.index')}}">{{ __('discount_offer_rules.title') }}</a></li>
                    <li class="breadcrumb-item active" aria-current="page"> {{ $data->id ?  __('discount_offer_rules.edit') :  __('discount_offer_rules.add') }}</li>
                </ol>
            </nav>
        </li>
    </ul>
</div>
<div class="admin-area-col">
    <div class="row">
        <div class="col-xs-12 col-md-12">
            <div class="round-white-bg box-shadow">
                <div class="error-msg font-14"></div>
                <div>
                    {{ Form::open(array('route' => $routes, 'method' => 'POST' ,'id' => 'ajaxSave','files' => true))}}
                    <div class="row">
                        <div class="col-md-4">
                            @php
                                $selectedStore = isset($data->store_ids) ? explode(',', $data->store_ids) : [];
                            @endphp
                            <div class="custom-input-group colored-field-group">
                                {!! Form::label('stores', __('global_items.stores'), ['class' => 'control-label mb-2']) !!}
                                {!! Form::select('stores[]', $stores, $selectedStore, [
                                    'class' => 'form-control select2',
                                    'multiple' => 'true',
                                    'data-actions-box' => 'true',
                                    'data-width' => '100%',
                                ]) !!}
                            </div>

                            <div class="custom-input-group colored-field-group custom-input-group-small">
                                {{Form::label('name', __('discount_offer_rules.title_field'), array('class' => 'control-label'))}}
                                {{ Form::text('title', $data->title, array('placeholder' => __('discount_offer_rules.title_field'),'class' => 'form-control'))}}
                            </div>

                            <div class="custom-input-group colored-field-group row">
                                <div class="col-6">
                                    {!! Form::label('user_type', __('discount_offer_rules.user_type'), ['class' => 'control-label mb-2']) !!}
                                    {!! Form::select('user_type', ['0' => 'All']+($userTypes ?? []) , $data->user_type ?? 0, [
                                        'class' => 'form-control select2',
                                        'data-actions-box' => 'true',
                                        'data-width' => '100%',
                                    ]) !!}
                                </div>
                                <div class="custom-input-group colored-field-group custom-input-group-small col-6">
                                    {{Form::label('per_day_limit', __('discount_offer_rules.per_day'), array('class' => 'control-label'))}}
                                    {{ Form::text('per_day_limit', $data->per_day_limit, array('class' => 'form-control'))}}
                                </div>
                            </div>
                             

                            <div class="row custom-input-group colored-field-group custom-input-group-small d-flex">
                                <div class="col-md-6">
                                    {{Form::label('start_date', __('discount_offer_rules.start_date'), array('class' => 'control-label'))}}
                                    {!! Form::text('start_date',(isset($data)?dateFormat($data->start_date, DISPLAY_DATETIME2):''),['class'=>'form-control datepicker-input-sch check_date']) !!}
                                </div>
                                <div class="col-md-6">
                                    {{Form::label('end_date', __('discount_offer_rules.end_date'), array('class' => 'control-label'))}}
                                    {!! Form::text('end_date',(isset($data)?dateFormat($data->end_date, DISPLAY_DATETIME2):''),['class'=>'form-control datepicker-input-sch check_date']) !!}
                                </div>
                            </div>

                            <div class="custom-input-group colored-field-group">
                                @php
                                    $selectedExtraConditions = isset($data->extra_conditions) && !empty($data->extra_conditions) ?
                                                                explode(',',$data->extra_conditions) : [] ;
                                @endphp
                                {!! Form::label('extra_conditions', __('discount_offer_rules.extra_conditions'), ['class' => 'control-label mb-2']) !!}
                                {!! Form::select('extra_conditions[]', discountOfferConditions(), $selectedExtraConditions , [
                                    'class' => 'form-control select2',
                                    'data-actions-box' => 'true',
                                    'data-width' => '100%',
                                    'multiple' => true
                                ]) !!}
                            </div>

                            <div class="custom-input-group colored-field-group custom-input-group-small">
                                @php  $selectedStatus = isset($data->status) ? $data->status : 1; @endphp
                                {{Form::label('status', __('discount_offer_rules.status'), array('class' => 'control-label'))}}
                                <div class="global-item-top-box">
                                    <label class="yummy-switch-label">
                                        {!! Form::checkbox('status', 1, $selectedStatus) !!}
                                        <span class="yummy-switch-box"></span>
                                    </label>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-8">
                            <div class="row">
                            <div class="custom-input-group colored-field-group custom-input-group-small col-md-6">
                                {{Form::label('id', __('discount_offer_rules.rule_for'), array('class' => 'control-label'))}}
                                {{ Form::select('rule_for', ['' => '-Select-'] + offerType(), $data->rule_for, array('class' => 'form-control', 'id' => 'rule_for')) }}
                            </div>
                            <div class="custom-input-group colored-field-group custom-input-group-small col-md-4">
                                <label class="control-label mb-2">{!! __('discount_offer_rules.allowed_half_pizza') !!}</label>
                                <div class="custom-input-group colored-field-group ml-4">
                                    <label class="custom-control custom-small-control custom-white-control">
                                        {!! Form::checkbox('allowed_half_pizza', 1, $data->allowed_half_pizza == 1  ? true : false, [
                                         'class' => 'is_offer_item',
                                     ]) !!}
                                        <span class="custom-control-box"><i class="fas fa-check"></i></span>
                                    </label>
                                </div>
                            </div>
                            </div>

                            <div class=" __rules_for_div row col-md-12">
                                @if($data->rule_for == 1)
                                    <div class="category_temp main_cat_temp _templates_div">
                                        <div class="row __offer_div_heading_container">
                                            <div class="colored-field-group col-xs-12 col-sm-4">
                                                <label class="control-label">{!! __('discount_offer_rules.rule_category') !!}</label>
                                            </div>
                                            <div class="colored-field-group col-xs-12 col-sm-3 __offer_item_label">
                                                <label class="control-label">{!! __('discount_offer_rules.platform') !!}</label>
                                            </div>
                                            <div class="colored-field-group col-xs-12 col-sm-3">
                                                <label class="control-label">{!! __('discount_offer_rules.discount') !!}</label>
                                            </div>
                                            <div class="colored-field-group px-3 col-xs-12 col-sm-1">
                                                <label class="control-label">&nbsp;</label>
                                            </div>
                                        </div>
                                        <div class="input_box">
                                            @if(!empty($data->rules_data))
                                                @foreach ($data->rules_data as $key => $rule)
                                                    <div class="row _cat_child __offer_div_container" data-counter="">
                                                        <input type="hidden" name="edit_ids[]" value="">
                                                        <div class="col-xs-12 col-sm-4 __offer_item_label ">
                                                            <div class="custom-input-group colored-field-group">
                                                                {{ Form::select('category[]', $category, $rule['category_id'], array('class' => 'form-control category select2')) }}
                                                            </div>
                                                        </div>
                                                        @php
                                                            $arrPlatforms = itemFor();
                                                            $selectedPlatforms = !empty($rule['platform'])? explode(',', $rule['platform']): [];
                                                        @endphp
                                                        <div class="col-xs-12 col-sm-3 __offer_item_label ">
                                                            <div class="custom-input-group colored-field-group">
                                                                {!! Form::select("platform[$key][]", $arrPlatforms, $selectedPlatforms, ['class' => 'form-control platform select2', 'multiple'=>'true', 'width' => '100%']) !!}
                                                            </div>
                                                        </div>
                                                        <div class="col-xs-12 col-sm-3 __offer_item_label ">
                                                            <div class="custom-input-group colored-field-group">
                                                                {{ Form::text('discount[]', $rule['discount'],array('placeholder' => __('discount_offer_rules.discount'),'class' => 'form-control discount'))}}
                                                            </div>
                                                        </div>
                                                        <div class="col-xs-12 col-sm-1">
                                                            <ul class="list-inline m-0 text-right">
                                                                <li class="list-inline-item">
                                                                    <a class="btn btn-danger font11 image-circle-30 px-0 remove-offer-item __offer_remove_btn" href="javascript:void(0);" data-id="">
                                                                        <svg class="svg-inline--fa fa-minus fa-w-14" aria-hidden="true" focusable="false" data-prefix="fa" data-icon="minus" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg>
                                                                    </a>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                @endforeach
                                            @endif
                                        </div>
                                        <div class="mt-2">
                                            <a  href="javascript:void(0);" class="btn btn-primary width80 font12 add-offer-items __category_btn"><i class="fa fa-plus"></i></a>
                                        </div>
                                    </div>
                                @elseif($data->rule_for == 2)
                                    <div class="item_temp main_item_temp _templates_div">
                                        <div class="row __offer_div_heading_container">
                                            <div class="colored-field-group col-xs-12 col-sm-4">
                                                <label class="control-label">{!! __('discount_offer_rules.rule_item') !!}</label>
                                            </div>
                                            <div class="colored-field-group col-xs-12 col-sm-3 __offer_item_label">
                                                <label class="control-label">{!! __('discount_offer_rules.platform') !!}</label>
                                            </div>
                                            <div class="colored-field-group col-xs-12 col-sm-3">
                                                <label class="control-label">{!! __('discount_offer_rules.discount') !!}</label>
                                            </div>
                                            <div class="colored-field-group px-3 col-xs-12 col-sm-1">
                                                <label class="control-label">&nbsp;</label>
                                            </div>
                                        </div>
                                        <div class="input_box">
                                            @if(!empty($data->rules_data))
                                                @foreach ($data->rules_data as $key => $rule)
                                                    <div class="row _item_child __offer_div_container" data-counter="">
                                                        <input type="hidden" name="edit_ids[]" value="">
                                                        <div class="col-xs-12 col-sm-4 __offer_item_label ">
                                                            <div class="custom-input-group colored-field-group">
                                                                {{ Form::select('items[]', $items, $rule['item_id'], array('class' => 'form-control items select2')) }}
                                                            </div>
                                                        </div>
                                                        @php
                                                            $arrPlatforms = itemFor();
                                                            $selectedPlatforms = !empty($rule['platform'])? explode(',', $rule['platform']): [];
                                                        @endphp
                                                        <div class="col-xs-12 col-sm-3 __offer_item_label ">
                                                            <div class="custom-input-group colored-field-group">
                                                                {!! Form::select("platform[$key][]", $arrPlatforms, $selectedPlatforms, ['class' => 'form-control platform select2', 'multiple'=>'true', 'width' => '100%']) !!}
                                                            </div>
                                                        </div>
                                                        <div class="col-xs-12 col-sm-3 __offer_item_label ">
                                                            <div class="custom-input-group colored-field-group">
                                                                {{ Form::text('discount[]', $rule['discount'],array('placeholder' => __('discount_offer_rules.discount'),'class' => 'form-control discount'))}}
                                                            </div>
                                                        </div>
                                                        <div class="col-xs-12 col-sm-1">
                                                            <ul class="list-inline m-0 text-right">
                                                                <li class="list-inline-item">
                                                                    <a class="btn btn-danger font11 image-circle-30 px-0 remove-offer-item __offer_remove_btn" href="javascript:void(0);" data-id="">
                                                                        <svg class="svg-inline--fa fa-minus fa-w-14" aria-hidden="true" focusable="false" data-prefix="fa" data-icon="minus" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg>
                                                                    </a>
                                                                </li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                @endforeach
                                            @endif
                                        </div>
                                        <div class="mt-5">
                                            <a  href="javascript:void(0);" class="btn btn-primary width80 font12 add-offer-items __item_btn"><i class="fa fa-plus"></i></a>
                                        </div>
                                    </div>
                                @endif
                            </div>
                        </div>
                    </div>
                    <div class="row  col-md-2 form-group mt-2 text-left">
                        <ul class="list-inline">
                            <li class="list-inline-item">
                                {{ Form::submit( __('common.save'), array('class' => 'btn btn-primary width80'));}}
                            </li>
                        </ul>
                    </div>
                    {{ Form::token()}}
                    {{ Form::close()}}
                </div>
                <div class="__rule_for_item_template d-none">
                    <div class="item_temp _templates_div">
                        <div class="row __offer_div_heading_container">
                            <div class="colored-field-group col-xs-12 col-sm-4">
                                <label class="control-label">{!! __('discount_offer_rules.rule_item') !!}</label>
                            </div>
                            <div class="colored-field-group col-xs-12 col-sm-3 __offer_item_label">
                                <label class="control-label">{!! __('discount_offer_rules.platform') !!}</label>
                            </div>
                            <div class="colored-field-group col-xs-12 col-sm-3">
                                <label class="control-label">{!! __('discount_offer_rules.discount') !!}</label>
                            </div>
                            <div class="colored-field-group px-3 col-xs-12 col-sm-1">
                                <label class="control-label">&nbsp;</label>
                            </div>
                        </div>
                        <div class="input_box">
                            <div class="row _item_child __offer_div_container" data-counter="">
                                <input type="hidden" name="edit_ids[]" value="">
                                <div class="col-xs-12 col-sm-4 __offer_item_label ">
                                    <div class="custom-input-group colored-field-group">
                                        {{ Form::select('items[]', $items, [], array('class' => 'form-control items')) }}
                                    </div>
                                </div>
                                @php $arrPlatforms = itemFor(); @endphp
                                <div class="col-xs-12 col-sm-3 __offer_item_label ">
                                    <div class="custom-input-group colored-field-group">
                                        {!! Form::select('platform[]', $arrPlatforms, [], ['class' => 'form-control platform', 'multiple'=>'true', 'width' => '100%']) !!}
                                    </div>
                                </div>
                                <div class="col-xs-12 col-sm-3 __offer_item_label ">
                                    <div class="custom-input-group colored-field-group">
                                        {{ Form::text('discount[]', '',array('placeholder' => __('discount_offer_rules.discount'),'class' => 'form-control discount'))}}
                                    </div>
                                </div>
                                <div class="col-xs-12 col-sm-1">
                                    <ul class="list-inline m-0 text-right">
                                        <li class="list-inline-item">
                                            <a class="btn btn-danger font11 image-circle-30 px-0 remove-offer-item __offer_remove_btn" href="javascript:void(0);" data-id="">
                                                <svg class="svg-inline--fa fa-minus fa-w-14" aria-hidden="true" focusable="false" data-prefix="fa" data-icon="minus" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="mt-2">
                            <a  href="javascript:void(0);" class="btn btn-primary width80 font12 add-offer-items __item_btn"><i class="fa fa-plus"></i></a>
                        </div>
                    </div>
                </div>
                <div class="__rule_for_category_template d-none">
                    <div class="category_temp _templates_div">
                        <div class="row __offer_div_heading_container">
                            <div class="colored-field-group col-xs-12 col-sm-4">
                                <label class="control-label">{!! __('discount_offer_rules.rule_category') !!}</label>
                            </div>
                            <div class="colored-field-group col-xs-12 col-sm-3 __offer_item_label">
                                <label class="control-label">{!! __('discount_offer_rules.platform') !!}</label>
                            </div>
                            <div class="colored-field-group col-xs-12 col-sm-3">
                                <label class="control-label">{!! __('discount_offer_rules.discount') !!}</label>
                            </div>
                            <div class="colored-field-group px-3 col-xs-12 col-sm-1">
                                <label class="control-label">&nbsp;</label>
                            </div>
                        </div>
                        <div class="input_box">
                            <div class="row _cat_child __offer_div_container" data-counter="">
                                <input type="hidden" name="edit_ids[]" value="">
                                <div class="col-xs-12 col-sm-4 __offer_item_label ">
                                    <div class="custom-input-group colored-field-group">
                                        {{ Form::select('category[]',$category, [], array('class' => 'form-control category')) }}
                                    </div>
                                </div>
                                {{--@php
                                    $selectedPlatform = isset($result->platform) ? explode(',', $result->platform) : [];
                                @endphp--}}
                                <div class="col-xs-12 col-sm-3 __offer_item_label ">
                                    <div class="custom-input-group colored-field-group">

                                        {!! Form::select('platform[]', $arrPlatforms, [], ['class' => 'form-control platform', 'multiple'=>'true', 'width' => '100%']) !!}
                                    </div>
                                </div>
                                <div class="col-xs-12 col-sm-3 __offer_item_label ">
                                    <div class="custom-input-group colored-field-group">
                                        {{ Form::text('discount[]', '',array('placeholder' => __('discount_offer_rules.discount'),'class' => 'form-control discount'))}}
                                    </div>
                                </div>
                                <div class="col-xs-12 col-sm-1">
                                    <ul class="list-inline m-0 text-right">
                                        <li class="list-inline-item">
                                            <a class="btn btn-danger font11 image-circle-30 px-0 remove-offer-item __offer_remove_btn" href="javascript:void(0);" data-id="">
                                                <svg class="svg-inline--fa fa-minus fa-w-14" aria-hidden="true" focusable="false" data-prefix="fa" data-icon="minus" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="mt-5">
                            <a  href="javascript:void(0);" class="btn btn-primary width80 font12 add-offer-items __category_btn"><i class="fa fa-plus"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection
@section('script')
        <script src="{{ asset('assets/js/crop-image.js')}}"></script>
        <script type="text/javascript">
            $(document).ready(function (){
                valiadteAddBtn();
            });

            function valiadteAddBtn()
            {
                // handle if all is after 1st
                $('.__category_btn').show();
                $('.__item_btn').show();

                //hide the delete button if length is 1
                let catChildElems = $('.main_item_temp').find('._cat_child');
                handleRemoveOfferBtn(catChildElems);

                //hide the delete button if length is 1
                let itemChildElems = $('.main_item_temp').find('._item_child');
                handleRemoveOfferBtn(itemChildElems);

                $('select.category').find(":selected").each(function (ed){

                    if($('.__offer_div_container').length > 3 && ($(this).val() == 0) && ($(this).val() !='')){
                        $('.main_cat_temp').find('._cat_child:not(:last)').remove();
                    }

                    if($(this).is(':selected') && ($(this).val() == 0) && ($(this).val() !='') ){ $('.__category_btn').hide(); }
                });

                $('select.items').find(":selected").each(function (ed){

                    if($('.__offer_div_container').length > 3 && ($(this).val() == 0) && ($(this).val() !='')){
                        $('.main_item_temp').find('._item_child:not(:last)').remove();
                    }

                    if($(this).is(':selected') && $(this).val() == 0 && ($(this).val() !='')){ $('.__item_btn').hide(); }
                });
            }


            $(document).on('change', '.category', function(e) {
                let elem = $(this);
                if ($(this).val() === '')  return;

                let selectedVar = $(this).val();
                $('.category').not(this).each(function(ev) {
                    if ($(this).val() == selectedVar && selectedVar != 0 ) {
                        alert('This Category is already selected');
                        elem.val('').trigger('change');
                    }
                });

                // if selected all and first hide add btn
                valiadteAddBtn();
            });



            // To allow only numbers

               $(document).on("keydown", ".discount", function(e) {
                if (e.shiftKey || e.ctrlKey || e.altKey) {
                    e.preventDefault();
                } else {
                    var key = e.keyCode;
                    if (!((key == 8) || (key == 46) || (key >= 35 && key <= 40) || (key >= 48 && key <= 57)      || (key >= 96 && key <= 105))) {
                        e.preventDefault();
                    }
                }
            });


            $(document).on("keyup", ".discount", function() {
                let element = $(this);
                if(parseFloat(element.val()) > 100){
                    alert('Discount value must be less then 100');
                    element.val('');
                }if(parseFloat(element.val()) < 0){
                    alert('Discount value grater then 0');
                    element.val('');
                }

            });



            $(document).on('change', '.items', function(e) {
                let elem = $(this);
                if ($(this).val() == '')  return;

                let selectedVar = $(this).val();
                $('.items').not(this).each(function(ev) {
                    if ($(this).val() == selectedVar && selectedVar != 0) {
                        alert('This item is already selected');
                        elem.val('').trigger('change');
                    }
                });

                // if selected all and first hide add btn
                valiadteAddBtn();
            });

            $(document).on('change', '#rule_for', function (e) {

                let selected_rule_for =  $(this).val();
                let template = '';
                let html = '';

                var rLen = 0; //$('.__rules_for_div ._templates_div').length;

                if(selected_rule_for == 1){
                    html = $('.__rule_for_category_template').html();
                    html = $(html);
                    html.find('.category').attr('name', 'category[' + rLen + ']').select2();
                    html.find('.platform').attr('name', 'platform[' + rLen + '][]').selectpicker({multiple: 'true', placeholder: 'Select Options'});
                    html.find('.discount').attr('name', 'discount[' + rLen + ']');

                    /*$('.__stock_container').append(html);*/
                    //rLen++;

                    /*$('.__rule_for_category_template').find('select').prop('name','category['+rLen+']');
                    $('.__rule_for_category_template').find('.platform').attr('name','platform['+rLen+']').select2();;
                    $('.__rule_for_category_template').find('input').prop('name','discount['+rLen+']');
                    template = $('.__rule_for_category_template').html();*/

                }else if(selected_rule_for == 2){
                    /*$('.__rule_for_item_template').find('select').prop('name','item['+rLen+']');
                    $('.__rule_for_item_template').find('.platform').attr('name','platform['+rLen+']').select2();;
                    $('.__rule_for_item_template').find('input').prop('name','discount['+rLen+']');
                    template = $('.__rule_for_item_template').html();*/
                    html = $('.__rule_for_item_template').html();
                    html = $(html);
                    html.find('.items').attr('name', 'items[' + rLen + ']').select2({placeholder: 'Select Item',});
                    html.find('.platform').attr('name', 'platform[' + rLen + '][]').selectpicker({multiple: 'true', placeholder: 'Select Options' });
                    html.find('.discount').attr('name', 'discount[' + rLen + ']');

                }

                if($('.__rules_for_div ._templates_div').length > 0){
                    $('.__rules_for_div ._templates_div').remove();

                }

                $('.__rules_for_div').append(html);

            })

            $(document).on('click', '.__category_btn', function (e) {
                //let template = '';

                var rLen = $('.__rules_for_div .__offer_div_container').length;

                html = $('.__rule_for_category_template .input_box').html();
                html = $(html);

                html.find('.category').attr('name','category['+rLen+']').select2();
                html.find('.platform').attr('name','platform['+rLen+'][]').selectpicker({multiple: "true", placeholder: "Select Option" });
                html.find('.discount').attr('name','discount['+rLen+']');

                // template = $('.__rule_for_category_template .input_box').html();
                if(rLen>0){

                    $('.__rules_for_div .__offer_div_container:last').after(html);
                }else{
                    $('.__rules_for_div .input_box').html(html);
                }

                //hide the delete button if length is 1
                let catChildElems = $('.main_cat_temp').find('._cat_child');
                handleRemoveOfferBtn(catChildElems);

            });

            $(document).on('click', '.__item_btn', function (e) {
                let template = '';

                var rLen = $('.__rules_for_div .__offer_div_container').length;
                console.log(rLen);
                html = $('.__rule_for_item_template .input_box').html();
                html = $(html);

                html.find('.items').attr('name','items['+rLen+']').select2({placeholder: "Select Item"});
                html.find('.platform').attr('name','platform['+rLen+'][]').selectpicker({multiple: "true", placeholder: "Select Option"});
                html.find('.discount').attr('name','discount['+rLen+']');

                //template = $('.__rule_for_item_template .input_box').html();

                if(rLen>0){
                    $('.__rules_for_div .__offer_div_container:last').after(html);

                }else{
                    $('.__rules_for_div .input_box').html(html);
                }

                //hide the delete button if length is 1
                let itemChildElems = $('.main_item_temp').find('._item_child');
                handleRemoveOfferBtn(itemChildElems);
            });

            $("body").on('click', '.__offer_remove_btn', function() {

                let element = $(this).closest('.__offer_div_container');

                element.remove();
                changeArrayIndex();

                // validate the fields and perform alterations
                valiadteAddBtn();

             });

            function changeArrayIndex(){
                let i= 0;
                $('.input_box .row').each(function(){
                    elment = $(this);
                    if(elment.find('select').hasClass("category")){
                        elment.find('.category').prop('name','category['+i+']');
                    }else{

                        elment.find('.items').prop('item','items['+i+']');
                    }

                    elment.find('.platform').prop('name','platform['+i+'][]');
                    elment.find('.discount').prop('name','discount['+i+']');
                    ++i;
                });
            }

            function handleRemoveOfferBtn(selector)
            {
                console.log(selector.length)
                if(selector.length < 2){
                    selector.find('.__offer_remove_btn').hide();
                }else{
                    selector.find('.__offer_remove_btn').show();
                }
            }

        </script>
@endsection