@extends('app')
<style type="text/css">

  #mrc_searchbar4,#mrc_searchbar5, #mrc_searchbar6, #mrc_searchbar7,#mrc_searchbar8{ width: 85px; }
     #mrc_searchbar3{ width: 69px; }
     #mrc_searchbar10 {
        width: 90px;
     }

    #branchDropdown,#requestTypeDropdown,#statusDropdown{ width:60px; }
    th < input#mrc_searchbar11.searchbars{
      width: 100px;
    }
    #mrc_searchbar0{
        display: none;
    }
    #mrc_searchbar9, #mrc_searchbar17{
        display: none;
    }

    #mrc_searchbar13{ width: 116px; }

    #mrc_searchbar12 { width: 116px; }
    #mrc_searchbar11 { width: 90px; }
    #mrc_searchbar16{ width: 101px; }
    #mrc_searchbar17{ width: 93px; }
</style>
@section('content')

@if(Session::has('flash_message'))
<div class="alert {{ (Session::has('flash_message_status'))?'alert-error':'alert-success'}}">
    <button class="close" data-dismiss="alert"></button>
    {!! Session::get('flash_message') !!}
</div>
@endif

<div class="row">
    <div class="col-sm-12">
        <div class="grid simple vertical">



            <div class="grid-body no-border overflow-auto">
                <div class='row control markaction' style="margin-bottom: 10px; margin-top: 10px;  background-color: #fff;">
                    <div class="col-sm-3 col-xs-12">
                        @if(Auth::user()->hasPermission("memberrequestclone-destroy"))
                         <a id="del" href="javascript:void(0)" class="btn btn-wider btn-danger pull-right" data-msg="هل أنت متأكد من الحذف؟" data-url="{{ URL::to('admin/memberrequestclone/bulkdelete') }}">حذف</a>
                        @endif
                    </div>

                    <div class="col-sm-6 col-xs-12" style="text-align: center;">
                       <span class="bold" style="font-size: 20px;">طلبات النسخ</span>

                    </div>

                    <div class="col-sm-3 col-xs-12">


                    </div>

                </div>

                <table class="table table-hover table-condensed display nowrap" id="datatable-example" cellspacing="0" width="100%">
                     <thead class="datatable-filter-row">
                     <tr>
                         <th width="2%"></th>
                         <th></th>

                         <th width="2%"></th>
                         <th width="2%"></th>
                         <th width="2%"></th>
                         <th width="2%"></th>
                         <th width="2%"></th>
                         <th width="2%"></th>
                         <th width="2%"></th>
                         <th width="1%"></th>
                         <th width="2%"></th>

                         <th width="2%"></th>

                         <th width="2%"></th>
                         <th width="3%"></th>
                         <th width="2%"></th>
                         <th width="2%"></th>
                         <th width="5%"></th>
                         <th width="1%"></th>
                         <th width="2%"><div style="width: 10px;"></div></th>
                     </tr>
                    </thead>

                      <tfoot>
                      <tr style="color: white;">
                          <th width="2%"><input type="checkbox" class="group-checkable" data-set="#datatable-example .checkboxes" /></th>
                          <th>Id</th>

                          <th width="2%">رقم</th>
                          <th width="2%">الجنس</th>
                          <th width="2%">الإسم الأول</th>
                          <th width="2%">الأب</th>
                          <th width="2%">الجد ١</th>
                          <th width="2%">الجد ٢</th>
                          <th width="2%">الجد ٣</th>
                          <th width="2%">*</th>

                          <th width="2%"></th>

                          <th width="2%"></th>
                          <!-- <th width="2%">المدينة</th>

                          <th width="2%">البلد</th> -->

                          <!-- <th width="2%">الفرع</th> -->
                          <th width="2%"></th>
                          <th width="3%">الهالتف المتحرك</th>
                          <!-- <th width="2%">نوع</th> -->
                          <th width="2%"></th>
                          <th width="2%">حالة</th>
                          <th width="5%">التاريخ</th>
                          <th width="1%"></th>
                          {{--<th width="1%">آخر تحديث</th>--}}
                          <th width="2%"><div style="width: 10px;"></div></th>
                      </tfoot>





                </table>
            </div>
        </div>
    </div>
</div>
{!! Form::open([
'method' => 'POST',
'class' => 'inline',
'id'=> 'bulkaction'
]) !!}
<input type="hidden" value="" name="ids" id="ids" />
{!! Form::close() !!}


@endsection

@section('page_script')

<script type="text/javascript" language="javascript" class="init">
    jQuery(document).ready(function ($) {




        // ---------------------------------------------


        var  x = 0;
         $('#datatable-example thead th').each( function () {

           var title = $('#datatable-example thead th').eq( $(this).index() ).text();
           if(x==3){
           $(this).html('<select id="genderDropdown_mb" name="Gender" class="form-control"><option value="">الكل</option><option value="0">ذكر</option><option value="1">انثى</option></select>');
           }
          else if(x==14){
            $(this).html('<select id="requestTypeDropdown" name="RequestType" class="form-control"><option value="">الكل</option><option value="admin">Admin - A</option><option value="public">Public - P</option></select>');
           }else if(x==15){
            $(this).html('<select id="statusDropdown" name="Status" class="form-control"><option value="">الكل</option><option value="pending">Pending - P</option><option value="ready_for_review">Ready For Review - R</option><option value="completed">Completed - C</option><option value="on_hold">On Hold - H</option></select>');
           }else if(x==12){
            // $(this).html('<select id="branchDropdown" name="branch" class="form-control pull-left"><option value="">1-غير محدد</option><option value="فرع ابراهيم حمد آل عبداللطيف">2-فرع ابراهيم حمد آل عبداللطيف</option><option value="فرع سليمان حمد آل عبداللطيف">3-فرع سليمان حمد آل عبداللطيف</option><option value="فرع عبدالقادر حمد آل عبداللطيف">4-فرع عبدالقادر حمد آل عبداللطيف</option><option value="فرع محمد حمد آل عبداللطيف">5-فرع محمد حمد آل عبداللطيف</option><option value="فرع عبدالرحمن حمد آل عبداللطيف">6-فرع عبدالرحمن حمد آل عبداللطيف</option><option value="فرع عبدالعزيز حمد آل عبداللطيف">7-فرع عبدالعزيز حمد آل عبداللطيف</option></select>');

            $(this).html('<select id="branchDropdown" name="branch" class="form-control pull-left"><option value="">الكل</option><option value="غير محدد">U-غير محدد</option><option value="فرع ابراهيم حمد آل عبداللطيف">1-فرع ابراهيم حمد آل عبداللطيف</option><option value="فرع سليمان حمد آل عبداللطيف">2-فرع سليمان حمد آل عبداللطيف</option><option value="فرع عبدالقادر حمد آل عبداللطيف">3-فرع عبدالقادر حمد آل عبداللطيف</option><option value="فرع محمد حمد آل عبداللطيف">4-فرع محمد حمد آل عبداللطيف</option><option value="فرع عبدالرحمن حمد آل عبداللطيف">5-فرع عبدالرحمن حمد آل عبداللطيف</option><option value="فرع عبدالعزيز حمد آل عبداللطيف">6-فرع عبدالعزيز حمد آل عبداللطيف</option></select>');

           }
           else if(x==18){
               // $(this).html('<select id="branchDropdown" name="branch" class="form-control pull-left"><option value="">1-غير محدد</option><option value="فرع ابراهيم حمد آل عبداللطيف">2-فرع ابراهيم حمد آل عبداللطيف</option><option value="فرع سليمان حمد آل عبداللطيف">3-فرع سليمان حمد آل عبداللطيف</option><option value="فرع عبدالقادر حمد آل عبداللطيف">4-فرع عبدالقادر حمد آل عبداللطيف</option><option value="فرع محمد حمد آل عبداللطيف">5-فرع محمد حمد آل عبداللطيف</option><option value="فرع عبدالرحمن حمد آل عبداللطيف">6-فرع عبدالرحمن حمد آل عبداللطيف</option><option value="فرع عبدالعزيز حمد آل عبداللطيف">7-فرع عبدالعزيز حمد آل عبداللطيف</option></select>');

               // $(this).html('<select id="branchDropdown" name="branch" class="form-control pull-left"><option value="">الكل</option><option value="غير محدد">U-غير محدد</option><option value="فرع ابراهيم حمد آل عبداللطيف">1-فرع ابراهيم حمد آل عبداللطيف</option><option value="فرع سليمان حمد آل عبداللطيف">2-فرع سليمان حمد آل عبداللطيف</option><option value="فرع عبدالقادر حمد آل عبداللطيف">3-فرع عبدالقادر حمد آل عبداللطيف</option><option value="فرع محمد حمد آل عبداللطيف">4-فرع محمد حمد آل عبداللطيف</option><option value="فرع عبدالرحمن حمد آل عبداللطيف">5-فرع عبدالرحمن حمد آل عبداللطيف</option><option value="فرع عبدالعزيز حمد آل عبداللطيف">6-فرع عبدالعزيز حمد آل عبداللطيف</option></select>');

           }
           else
            {
            $(this).html( '<input class="searchbars" id="mrc_searchbar'+x+'" type="text" placeholder="" />' );
            }
            x++;
        });
         //memberrequest datatable
        var table = $('#datatable-example').DataTable({
            processing: true,
            serverSide: true,
            scrollX: true,


            "dom": '<"top"fpil<"clear">>rt<"bottom"pi<"clear">>',
             fixedColumns: {
               leftColumns: 2
             },
             language: { search: "",
                         searchPlaceholder: "بحث",
                         "emptyTable": "لا يوجد محتوى",
                         "zeroRecords": "لم يصل البحث إلى أي نتيجة",
                         processing: "<img src='{{url('/')}}/assets/img/Webp.net-resizeimage.gif' />" },
            resizableColumns: true,
            scrollCollapse: true,

            "order": [[0, "desc"]],

            ajax: {
                "url": "{{ URL::to('admin/memberrequestclone/datatable') }}",
                "type": "POST"
            },
            columns: [
               {data: 'check', name: 'check'},
                {data: 'id', name: 'member_request_clones.id'},

                {data: 'uni_id', name: 'uni_id'},
                {data: 'gender', name: 'member_request_clones.gender'},
                {data: 'name', name: 'member_request_clones.name'},
                {data: 'father_name', name: 'member_request_clones.father_name'},
                {data: 'grand_father_name', name: 'member_request_clones.grand_father_name'},
                {data: 'grand_father_name_1', name: 'grand_father_name_1'},
                {data: 'grand_father_name_2', name: 'grand_father_name_2'},
                {data: 'children_sibling_count', name: 'children_sibling_count'},
                {data: 'city', name: 'city'},

                {data: 'country', name: 'country'},

                {data: 'family_tree_name', name: 'family_trees.name'},
                {data: 'mobile_number', name: 'mobile_number'},
                {data: 'request_type', name: 'request_type'},
                {data: 'status', name: 'status'},
                {data: 'created_at', name: 'member_request_clones.created_at'},
                {data: 'updated_at', name: 'member_request_clones.updated_at'},
                {data: 'actions', name: 'actions'}


            ],


            "iDisplayLength": 50,
            "columnDefs": [
                {
                    "targets": [1,10,11,14,12,17],
                    "visible": false,
                    "searchable": false
                },
                { "searchable": false, "targets": [9] },

                {
                    "targets": [0, 1, 2, 3, 4, 5,6,7,8,9,10,11,12,13,14,15,16,17],
                    "orderable": false
                },
                {
                    "width": "2%", "targets": [3,4,5,6,7,8,9,10,11,12,13]
                },
                {
                    "width": "0", "targets": [15]
                }

            ],

            fixedColumns:   {
            rightColumns: 4
             }


        });



        $('#datatable-example tfoot tr').prependTo('#datatable-example thead');

            // Apply the search
         table.columns().eq( 0 ).each( function ( colIdx ) {
            $( 'input', table.column( colIdx ).header() ).on('keyup change', function () {
              table
                .column( colIdx )
                .search( this.value )
                .draw();
                } );
            });

          table.columns().eq( 0 ).each( function ( colIdx ) {
            $( 'select', table.column( colIdx ).header()).on('keyup change', function () {
              table
                .column( colIdx )
                .search( this.value )
                .draw();
                } );
            });

        $('.dataTables_scrollFoot').prependTo('.dataTables_scrollHeadInner');







        $('#datatable-example_wrapper .dataTables_filter input').addClass("input-medium "); // modify table search input
        $('#datatable-example_wrapper .dataTables_length select').addClass("select2-wrapper span12"); // modify table per page dropdown
        $('#datatable-example_wrapper .dataTables_length select').removeClass("form-control");



        $('#datatable-example input').click(function () {
            $(this).parent().parent().parent().toggleClass('row_selected');
        });

        $('div.dataTables_length select').select2();
        $(".select2-wrapper").select2({minimumResultsForSearch: -1});



    });
</script>

@endsection