@foreach($scripts as $script)
    <script type="text/javascript" src="{{ $script }}"></script>
@endforeach
@foreach($styles as $style)
    <link href="{{ $style }}" rel="stylesheet" type="text/css"/>
@endforeach
<div class="moduleSettingsWrapper">
    <h3><img src="{{ $imagePath }}/level.png">
        {{ _mt($moduleId,'LevelCommission.Level_Commission_Config') }}</h3>
    <form action="" method="post" autocomplete="off">
        <input type="hidden" value="{{ $moduleId }}" name="module_id">
        <div class="formField row">
            <div class="col-md-4">{{ _mt($moduleId,'LevelCommission.Distribution_Type') }} <span
                        class="required"> * </span></div>
            <div class="col-md-8">
                <div class="twoWaySwitch">
                    <label>{{ _mt($moduleId, 'LevelCommission.Flat') }}</label>
                    <input type="hidden"
                           {{ $config->get('distribution_type') == 'percent' ? 'checked' : '' }} name="module_data[distribution_type]"
                           class="prettySwitch" value="{{ $config->get('distribution_type') }}">
                    <label>{{ _mt($moduleId, 'LevelCommission.Percent') }}</label>
                </div>
            </div>
        </div>
        <div class="formField row">
            <div class="col-md-4">{{ _mt($moduleId,'LevelCommission.To_Wallet') }} <span class="required"> * </span>
            </div>
            <div class="col-md-8">
                <select class="walletSelect form-control input-medium" name="module_data[wallet]">
                    @foreach($wallets as $wallet)
                        <option value="{{ $wallet->moduleId }}"
                                @if($wallet->moduleId == $config->get('wallet')) selected @endif>{{ $wallet->registry['name'] }}</option>
                    @endforeach
                </select>
            </div>
        </div>
        <div class="row form-group" id="level-value">
            <div class="col-md-7">
                @foreach($config->get('commission') as $level => $value)
                    <div class="row" id="field_{{ $level }}" style="margin: 0px;">
                        <div class="col-md-7" style="padding: 0px;">
                            <label> {{ ucfirst(str_replace('_',' ',$level)) }} <span class="required"> * </span>
                            </label>
                        </div>
                        <div class="col-md-5">
                            <label>
                                <input type="number" class="form-control input-small"
                                       name="module_data[commission][{{ $level }}]" value="{{ $value }}"
                                       min="0" onkeypress="return event.charCode &gt;= 48 &amp;&amp; event.charCode &lt;= 57">
                            </label>
                        </div>
                    </div>
                @endforeach
            </div>
            <div class="col-md-5">
                <div class="col-md-5 col-xs-5">
                    <input type="button" id="addLevel" class="btn btn-sm green"
                           value="{{ _mt($moduleId,'LevelCommission.Add_Level') }}"/>
                </div>
                <div class="col-md-7 col-xs-7" style="padding: 0px;">
                    <input type="button" id="removeLevel" class="btn btn-sm red pull-right"
                           value="{{ _mt($moduleId,'LevelCommission.Remove_Level') }}"/>
                </div>
            </div>
        </div>
        <div class="errorWrapper" style="display: none"></div>
    </form>
</div>

<script>

    $(function () {
        $('.prettySwitch').prettySwitch({
            checkedValue: 'percent',
            unCheckedValue: 'flat',
        });
    });

    var iCnt = {{ count($config['commission']) }}
        //to add more levels
        $('#addLevel').click(function () {
            iCnt = iCnt + 1;
            $('#level-value').append('<div class="form-group row" id="field_level_' + iCnt + '" style="width: 100%;overflow: hidden; margin: 0px;"> <div class="col-md-4"> <label>Level ' + iCnt + ' <span class="required"> * </span> </label> </div> <div class="col-md-5"> <label> <input type="number"  class="form-control input-small" name="module_data[commission][level_' + iCnt + ']" id="level_' + iCnt + '" value="0" min="0" onkeypress="return event.charCode &gt;= 48 &amp;&amp; event.charCode &lt;= 57"/></label> </div> </div>');
        });

    //to remove levels
    $('#removeLevel').click(function () {
        if (iCnt > 1) {
            $('#field_level_' + iCnt).remove();
            iCnt = iCnt - 1;
        }
    });

    //select2
    $('select').select2({
        width: '100%'
    });
</script>