@include('admin.layouts.header')
@include('admin.layouts.sidebar')
<style>
    .condition-first-c {
        padding: 18px;border-color: #e4e4e4;border-width: 1px;border-style: solid;margin-bottom: 12px;margin-left: 0px;margin-right: 0px;position: relative;
    }
    button.dropdown-toggle > span.filter-option{
        width: 350px !important;
    }
</style>
<div class="m-grid__item m-grid__item--fluid m-wrapper">
    <!-- BEGIN: Subheader -->
    <div class="m-subheader ">
        <div class="d-flex align-items-center">
            <div class="mr-auto">
                <h3 class="m-subheader__title m-subheader__title--separator">
                    Rule
                </h3>
            </div>

        </div>
    </div>
    <!-- END: Subheader -->
    <div class="m-content">
        @if(Session::has('success'))
            <div class="alert alert-success alert-dismissible fade show" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"></button>
                {{ Session::get('success') }}
            </div>
        @endif
        @if(Session::has('error'))
            <div class="alert alert-danger alert-dismissible fade show" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"></button>
                {{ Session::get('error') }}
            </div>
        @endif
        <div class="m-portlet m-portlet--mobile">
            <div class="m-portlet__head">
                <div class="m-portlet__head-caption">
                    <div class="m-portlet__head-title">
                        <span class="m-portlet__head-icon">
                            <i class="fa fa-object-ungroup"></i>
                        </span>
                        <h3 class="m-portlet__head-text">
                            <?php echo isset($_GET['clone']) ? 'Duplicate ' : ''; ?>Rule
                        </h3>
                    </div>
                </div>
            </div>
            <div class="m-portlet__body">
                <div class="m-section">
                    <div class="m-section__content">
                        <form action="@if(isset($grade->id) && !isset($_GET['grade'])) {!! asset('admin/grade/update/'.$grade->id.'/v1') !!} @else {!! asset('admin/grade/add/v1') !!} @endif" class="m-form m-form--fit m-form--label-align-right" method="POST" enctype="multipart/form-data">
                            <input type="hidden" name="_token" value="{!! csrf_token() !!}" />
                            <div style="background-color: whitesmoke;padding: 6px;margin-bottom: 12px;font-weight: 600;">New Rule</div>
                            <div class="row">
                                <div class="col-md-6">
                                    <input type="text" class="form-control m-input" name="rule" value="{!! Request::old('rule',isset($grade->rule) ? $grade->rule : '') !!}" placeholder="Rule Name" required="">
                                </div>

                                <div class="col-md-6">
                                    <textarea type="text" class="form-control m-input" name="description" placeholder="Rule Description" required="">{!! $grade->description or '' !!}</textarea>
                                </div>
                            </div>
                            <hr>
                            <div style="background-color: whitesmoke;padding: 6px;margin-bottom: 12px;font-weight: 600;">Conditions</div>
                            <div class="row col-md-6" style="margin-bottom: 11px;">
                                <select class="selectpicker form-control table-select-bx" name="tables[]" id="table-select-bx-id" multiple data-max-options="100">
                                    @if($tablesNames)
                                    @foreach($tablesNames as $table)
                                    <option @if(isset($grade->tables) && in_array($table, explode(',', $grade->tables))) selected @endif value="{!! $table !!}"><br/>{!! $table !!}</option>
                                    @endforeach
                                    @endif
                                </select>
                            </div>
                            <?php $gradeData = isset($grade->grade) && count($grade->grade) ? $grade->grade : [null]; ?>
                            @foreach($gradeData as $_grade)
                            <div class="row condition-first-c condition-first-row">
                                <div class="col-md-4">
                                    <select type="text" class="condition-select-bx form-control m-input" name="condition[]" required="" data-table="{!! $_grade->condition or '' !!}">
                                        <option>Select Condition</option>
                                    </select>
                                </div>

                                <div class="col-md-4">
                                    <select class="form-control m-input" name="operator[]" required="">
                                        <option>Select Operator</option>
                                        <option @if(isset($_grade->operator) && $_grade->operator == '=') selected="selected" @endif value="&#61;">&#61;</option>
                                        <option @if(isset($_grade->operator) && $_grade->operator == '>') selected="selected" @endif value="&#62;">&#62;</option>
                                        <option @if(isset($_grade->operator) && $_grade->operator == '<') selected="selected" @endif value="&#60;">&#60;</option>
                                        <option @if(isset($_grade->operator) && $_grade->operator == '>=') selected="selected" @endif value="&#62;&#61;">&#62;&#61;</option>
                                        <option @if(isset($_grade->operator) && $_grade->operator == '<=') selected="selected" @endif value="&#60;&#61;">&#60;&#61;</option>
                                        <option @if(isset($_grade->operator) && $_grade->operator == '!=') selected="selected" @endif value="&#33;&#61;">&#33;&#61;</option>
                                        <option @if(isset($_grade->operator) && $_grade->operator == '&&') selected="selected" @endif value="&#38;&#38;">&#38;&#38;</option>
                                        <option @if(isset($_grade->operator) && $_grade->operator == '||') selected="selected" @endif value="&#124;&#124;">&#124;&#124;</option>
                                    </select>
                                </div>

                                <div class="col-md-4">
                                    <input type="text" class="form-control m-input" name="value[]" value="{!! Request::old('value',isset($_grade->value) ? $_grade->value : '') !!}" placeholder="Value" required="">
                                </div>
                            </div>
                            @endforeach
                            <div style="cursor:pointer;background-color: whitesmoke;float: right;padding: 7px;border-radius: 4px;font-weight: 600;box-shadow: 1px 1px 0px 0px #ccc7c7;" class="add-new-condition">Add New Condition</div>
                            @if((\Illuminate\Support\Facades\Session::has('Customized_Grades_Update|13-1-2') && (isset($grade->id) || !isset($_GET['grade']))) || (!isset($grade->id) && \Illuminate\Support\Facades\Session::has('Customized_Grades_Create|13-1-1')))
                            <div class="m-portlet__foot m-portlet__foot--fit">
                                <div class="m-form__actions m-form__actions" style="padding-left: 0px;">
                                    <button type="submit" class="btn btn-primary">
                                        @if(isset($grade->id) && !isset($_GET['grade']))
                                            Update
                                            @else
                                            Save
                                        @endif
                                    </button>
                                    <button type="reset" onclick="window.history.back()" class="btn btn-secondary">
                                        Cancel
                                    </button>
                                </div>
                            </div>
                            @endif
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@include("admin.layouts.footer")

<script>

    let tablesData = <?php echo json_encode($tablesData);?>

    $(document).on('click','.remove-condition-div', function(){
        $(this).closest('.condition-first-c').remove();
    });

    $(document).ready(function () {
        let event = $('.table-select-bx');
        event.selectpicker('refresh');
        generateOptions(event);
    });

    $(document).on('change',".table-select-bx", function(){
        generateOptions($(this));
    });

    function generateOptions(event){
        let tables = event.val();
        if (event.val().length === 0) return;
        let options = '';
        $.each(tables, function (index, itemC) {
            let tablesItem = tablesData[itemC];
            $.each(tablesItem, function (index1, item) {
                options += '<option>' + item + '</option>';
            });
        });

        $(".condition-select-bx").html(options);

        $(".condition-select-bx").each(function(){
            if(typeof $(this).attr('data-table') !== 'undefined') {
                $(this).val($(this).attr('data-table'));
            }
        });
    }

    $(document).on('change','.condition-select-bx', function(){
       $(this).attr('data-table',$(this).val());
    });

    $(".add-new-condition").click(function () {
       $(".condition-first-c:last").after('<div class="row condition-first-c"><span class="fa fa-times-circle-o remove-condition-div" style="position: absolute;right: 8px;top: 8px;cursor:pointer;"></span>'+$(".condition-first-row").html()+'</div>');
    });

    $("select[name='employment_type']").change(function(){
        var type = $(this).find('option:selected').val();
        var id = $(this).attr('data-id');
        var _token = '<?php echo csrf_token(); ?>';
        if (type && id) {
            $(".init-loader").css({'display': 'block'});
            $.ajax({
                type: 'POST',
                url: "/admin/consumer-application/get-document-by-emp-type",
                data: {type: type, _token: _token},
                dataType: "JSON",
                success: function (response) {
                    $(".init-loader").css({'display': 'none'});
                    $("select.document_set_view_" + id).html(response.data);
                }
            });
        }
    });
</script>