@extends('Layouts.erp_master')
@section('content')


    <!-- Search Option Start -->
    <div class="row align-items-center d-flex justify-content-center pb-5">

        <!-- Html View Load For Branch Search -->
        <div class="col-lg-3">
            <label class="input-title">Module Name</label>
            <div class="input-group">
                <select class="form-control clsSelect2" name="module_id" id="module_id" 
                onchange="fnAjaxSelectBox('menu_id',this.value,
                '{{ base64_encode('gnl_sys_menus')}}',
                '{{base64_encode('module_id')}}',
                '{{base64_encode('id,menu_name,route_link')}}',
                '{{url('/ajaxSelectBox')}}');">

                    <option value="">Select All</option>
                    @php
                        $ModuleList = Common::ViewTableOrder('gnl_sys_modules', 
                        [['is_delete', 0],['is_active', 1]],
                        ['id', 'module_name'], 
                        ['module_name', 'ASC'])
                    @endphp
        
                    @foreach ($ModuleList as $Row)
                    <option value="{{ $Row->id }}">{{ $Row->module_name }}</option>
                    @endforeach
                </select>
            </div>
        </div>

        <div class="col-lg-4">
            <label class="input-title">Parent Menu</label>
            <div class="input-group">
                <select class="form-control clsSelect2" name="menu_id" id="menu_id">
                    <option value="">Select One</option>
                    @php
                        // $parentMenu = Common::ViewTableOrder('gnl_sys_menus', 
                        // [['is_delete', 0],['is_active', 1]], 
                        // ['id', 'menu_name','route_link'], 
                        // ['menu_name', 'ASC'])
                    @endphp
        
                    {{-- @foreach ($parentMenu as $Row)
                    <option value="{{ $Row->id }}">{{ $Row->menu_name }}<br><small>({{$Row->route_link}})</small></option>
                    @endforeach --}}
                </select>
            </div>
        </div>
       
        @include('elements.button.common_button', [
                        'search' => [
                            'action' => true,
                            'title' => 'search',
                            'id' => 'searchFieldBtn',
                            'exClass' => 'float-right'
                        ]
                    ]) 
      
    </div>
    <!-- Search Option End -->





<div class="row">
    <div class="col-lg-12">
    <!-- data-plugin="dataTable" -->
        <div class="table-responsive">
            <table class="table w-full table-hover table-bordered table-striped clsDataTable">
                <thead>
                    <tr>
                        <th width="5%">SL</th>
                        <th width="20%">Menu Name</th>
                        <th width="15%">Parent Menu</th>
                        <th width="15%">Route Link</th>
                        <!--<th width="15%">Controller</th>
                        <th width="8%">Method</th>-->
                        <th width="5%">Icon</th>
                        <th width="10%">Order By</th>
                        <th width="15%">Module</th>
                        <th width="15%">Action</th>
                    </tr>
                </thead>

            </table>
        </div>
    </div>
</div>

<script>
    function fnDelete(RowID) {
        fnAjaxDeleteReloadTable("{{ url()->current() }}/delete", RowID, "clsDataTable");
    }

    $(document).ready(function () {
        ajaxDataLoad();
        $('#searchFieldBtn').click(function(){
            var module_id = $('#module_id').val();
            var menu_id = $('#menu_id').val();
            ajaxDataLoad(module_id,menu_id);
        });
    });
 
    function ajaxDataLoad(module_id= null , menu_id = null) {

        $('.clsDataTable').DataTable({
            destroy: true,
            // retrieve: true,
            processing: true,
            serverSide: true,
            order: [
                [1, "DESC"]
            ],
            stateSave: true,
            stateDuration: 1800,
            ordering: false,
            // lengthMenu: [[10, 20, 30, 50], [10, 20, 30, 50]],
            "ajax": {
                "url": "{{route('sysUserMenusDatatable')}}",
                "dataType": "json",
                "type": "post",
                "data":{ _token: "{{csrf_token()}}",
                        module_id:module_id,
                        menu_id:menu_id,
                    }
            },
            columns: [
                {
                    data: 'id',
                    className: 'text-center'
                },
                {
                    data: 'menu_name',
                },
                {
                    data: 'parent_menu',
                },
                {
                    data: 'route_link',
                },
                {
                    data: 'menu_icon',
                },
                {
                    data: 'order_by',
                },
                {
                    data: 'module_name',
                },
                {
                    data: 'action',
                    className: 'text-center'
                },

            ],
            'fnRowCallback': function (nRow, aData, Index) {
                var actionHTML = jsRoleWisePermission(aData.action.set_status, aData.action.action_name,
                    aData.action.action_link);
                $('td:last', nRow).html(actionHTML);
            }

        });

    }
</script>


@endsection