@extends('app')
<style type="text/css">
   #mr_searchbar18,#mr_searchbar0,#mr_searchbar9{display: none;}
    #mr_searchbar4, #mr_searchbar5, #mr_searchbar6,#mr_searchbar7{ width: 85px; }
     #mr_searchbar2{ width: 67px; }

    #mr_searchbar8{ width: 85px; }


    #branchDropdown,#requestTypeDropdown,#statusDropdown{ width:45px; }
    th < input#mr_searchbar10.searchbars{
      width: 100px;
    }

    #mr_searchbar12{ width: 116px; }
    #mr_searchbar13{ width: 145px; }
    #mr_searchbar11 { width: 80px; }
    #mr_searchbar10 { width: 80px; }
    #mr_searchbar15{ width: 89px; }
    #mr_searchbar16{ width: 101px; }
    #mr_searchbar17{ width: 101px; }
    .change_action_popup{
        left: 5px !important;
        top: 15px !important;
    }
</style>
@section('content')

@if(Session::has('flash_message'))
<div class="alert {{ (Session::has('flash_message_status'))?'alert-error':'alert-success'}}" style="text-align: center;">
    <button class="close" data-dismiss="alert"></button>
    {!! Session::get('flash_message') !!}
</div>
@endif
<div class="row">
        <div class="col-sm-6 col-sm-offset-3 text-center">

                <div class="alert alert-danger custom-error-msg" style="display: none;">
                    <span>مطلوب اسم</span>
                </div>

    </div>
</div>
{{-- <div class="page-title"> <a href="#"><i class="icon-custom-right"></i></a>
    <h3>إستمارات التسجيل<span class="semi-bold"></span></h3>
</div> --}}

<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' style="margin-bottom: 10px; margin-top: 10px;  background-color: #fff;">
                    <div class="col-sm-5 col-xs-12">
                       <div class="pull-right markaction">
                          @if(Auth::user()->hasPermission('memberrequests-edit'))
                          <a href="javascript:void(0)" class="btn btn-default btn-wider source" id="name" >الإسم الأول</a>

                          <a href="javascript:void(0)" class="btn btn-default btn-wider city-country" id="city-country" >المدينة/البلد</a>
                          <a href="javascript:void(0)" class="btn btn-default btn-wider status" id="status" >حالة الإستمارة</a>
                          @endif

                          @if(Auth::user()->hasPermission('memberrequests-destroy'))
                          <a id="del" href="javascript:void(0)" class="btn btn-wider btn-danger" data-msg="هل أنت متأكد من الحذف؟" data-url="{{ URL::to('admin/memberrequests/bulkdelete') }}">حذف</a>
                          @endif
                        </div>
                        {{-- <span class="pull-right" style="padding-top: 10px"> *الذرية / الأخوة والأخوات  &nbsp;</span> --}}


                    </div>

                    <div class="col-sm-2 col-xs-12" style="text-align: center;">
                       <span class="bold" style="font-size: 20px;">الإستمارات المستلمة</span>
                    </div>

<!--                     <div class="col-sm-5 col-xs-12">
                      @if(Auth::user()->hasPermission('memberrequests-create'))
                      <a href="{{ URL::to('admin/register') }}" class="btn btn-primary">إضافة إستمارة</a>
                      @endif
                    </div> -->

                </div>
                <table class="table table-hover table-condensed display nowrap" id="datatable-example" cellspacing="0" width="100%" style="position: relative;">
                     <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="2%"><div style="width: 10px;"></div></th>
                        </tr>
                      </tfoot>





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

<!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
      <div class="modal-content" style="margin-top: 70px ">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title"></h4>
        </div>
        {!! Form::open(['class'=>'labels-align-verticle','id'=>'form_edit','method' => 'POST', 'route' => 'memberrequests.bulkedit']) !!}

        {!! Form::hidden('parent_id',null,['id'=>'new_node_parent_id']) !!}

      <div class="modal-body">
         <div class="row margin-bottom">
            <div class="col-md-12 col-xs-12">
                <div class="form-group row">


                    <div class="col-md-5 col-md-offset-3 col-xs-12">
                        {!! Form::hidden('source_name', null, ['class' => 'form-control', 'id' => 'source_name']) !!}

                        {!! Form::hidden('ids_array', null, ['class' => 'form-control', 'id' => 'ids_array']) !!}
                        {!! Form::text('data_field', null, ['class' => 'form-control','required','maxlength'=>'15','id'=>'data_field_id']) !!}

                    </div>
                    <div class = "col-md-2 col-xs-12">
                      {!! Form::label('name', 'الإسم الأول', ['class' => 'form-label text-right']) !!}
                    </div>

                </div>
            </div>
        </div>
      </div>
      <div class="modal-footer">

      <button type="button" class="btn  btn-default" data-dismiss="modal">إلغاء</button>
      {!! Form::submit('تحديث',['class'=>'btn btn-primary btn-cons', 'id'=>'submit_edit_form','style'=>'font: 18px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:bold;'])!!}
       <!--  <button type="button" class="btn  btn-default" data-dismiss="modal">إلغاء</button>
        <button type="button" class="btn  btn-primary" data-dismiss="modal" id="submit_edit_form">تحديث</button> -->




        </div>
        {!! Form::close() !!}
      </div>
    </div>
  </div>


  <!-- Edit Row Modal -->
  <!-- <div class="modal fade" id="RowEditModal" role="dialog">
    <div class="modal-dialog">
      <div class="modal-content" style="margin-top: 70px ">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">تحديث المعلومات</h4>
        </div>

        {!! Form::open(['class'=>'labels-align-verticle','id'=>'form_row_edit','method' => 'POST', 'route' => 'memberrequests.editrow']) !!}

        <div class="modal-body">
            <input type="hidden" id="id_field" name="row_id" class="form-control" placeholder="Enter Message">
              <div class="col-md-6 col-xs-12">

                 <div class="form-group row">

                    <div class="right col-md-9 col-sm-12">
                        {!! Form::select('country',$countries->toArray(),null,['class'=>'form-control select_country','style'=>'width:100%','id'=>'country_select']) !!}
                    </div>

                    <div class="col-md-3 col-sm-12">
                        {!! Form::label('country', 'البلد', ['class' => 'form-label text-right']) !!}
                    </div>
                </div>
                <div class="form-group row">
                    <input type="hidden" value="{{$city}}">
                    <div class="right col-md-9 col-sm-12">
                        {!! Form::select('city',$city->toArray(),null, ['class'=>'form-control select_city','style'=>'width:100%','id'=>'city_select']) !!}
                    </div>
                    <div class="col-md-3 col-sm-12">
                        {!! Form::label('city', 'المدينة', ['class' => 'form-label text-right']) !!}
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                <input type="tel" id="number_field" name="" readonly class="form-control" placeholder="">
                            </div>
                             <div class="col-md-3 col-sm-12">
                                {!! Form::label('mobile_number', 'الهاتف المتحرك الحالي', ['class' => 'form-label text-right']) !!}
                            </div>

                        </div>
                    </div>

                </div>
                <div class="row" style="">
                  <div class="col-md-12 col-xs-12">
                      <div class="form-group row" style="margin-top: -15px;">
                          <div class="col-md-9 col-xs-12">
                              <input type="tel" id="number_field1" name="mobile_number" required class="form-control mobile_number" placeholder="" maxlength="15" minlength="10">

                          </div>
                           <div class="col-md-3 col-sm-12">
                              {!! Form::label('mobile_number', 'الهاتف المتحرك الجديد', ['class' => 'form-label text-right']) !!}
                          </div>

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

              </div>
               <div class="col-md-6 col-xs-12">
                  <div class="row margin-bottom">
                      <div class="col-md-12 col-xs-12">
                          <div class="form-group row">
                              <div class="col-md-9 col-xs-12">
                                  {!! Form::select('gender',['0'=>'ذكر','1'=>'انثى'],null,['class'=>'form-control per-row-genderdropdown','style'=>'width:100%','id'=>'genderdropdownrow','required']) !!}
                              </div>
                               <div class="col-md-3 col-sm-12">
                                  {!! Form::label('gender', 'جنس', ['class' => 'form-label text-right']) !!}
                              </div>

                          </div>
                      </div>
                  </div>
                  <div class="row margin-bottom">
                      <div class="col-md-12 col-xs-12">
                          <div class="form-group row">
                              <div class="col-md-9 col-xs-12">
                                  <input type="text" id="name_field" name="name" class="form-control" required placeholder="" maxlength="15">
                              </div>
                               <div class="col-md-3 col-sm-12">
                                  {!! Form::label('name', 'الإسم الأول', ['class' => 'form-label text-right']) !!}
                              </div>

                          </div>
                      </div>
                  </div>
                     <div class="row margin-bottom">
                      <div class="col-md-12 col-xs-12">
                          <div class="form-group row">
                              <div class="col-md-9 col-xs-12">
                                  <input type="text" id="father_name_field" name="father_name" class="form-control" placeholder="" required maxlength="15">
                              </div>
                               <div class="col-md-3 col-sm-12">
                                  {!! Form::label('father_name', 'الأب', ['class' => 'form-label text-right']) !!}
                              </div>

                          </div>
                      </div>
                  </div>
                     <div class="row margin-bottom">
                      <div class="col-md-12 col-xs-12">
                          <div class="form-group row">
                              <div class="col-md-9 col-xs-12">
                                  <input type="text" id="grand_father_name_field" name="grand_father_name" class="form-control" required placeholder="" maxlength="15">
                              </div>
                               <div class="col-md-3 col-sm-12">
                                  {!! Form::label('grand_father_name', 'الجد ١', ['class' => 'form-label', 'style'=>'margin-right:auto']) !!}
                              </div>

                          </div>
                      </div>
                  </div>
                     <div class="row margin-bottom">
                      <div class="col-md-12 col-xs-12">
                          <div class="form-group row">
                              <div class="col-md-9 col-xs-12">
                                  <input type="text" id="grand_father_name_1_field" name="grand_father_name_1" class="form-control" required placeholder="" maxlength="15">
                              </div>
                               <div class="col-md-3 col-sm-12">
                                  {!! Form::label('grand_father_name_1', 'الجد ٢', ['class' => 'form-label text-right', 'style'=>'margin-right:auto']) !!}
                              </div>

                          </div>
                      </div>
                  </div>
                  <div class="row margin-bottom">
                      <div class="col-md-12 col-xs-12">
                          <div class="form-group row">
                              <div class="col-md-9 col-xs-12">
                                  <input type="text" id="grand_father_name_2_field" name="grand_father_name_2" class="form-control" placeholder="" required maxlength="15">
                              </div>
                               <div class="col-md-3 col-sm-12">
                                  {!! Form::label('grand_father_name_2', 'الجد ٣', ['class' => 'form-label text-right', 'style'=>'margin-right:auto']) !!}
                              </div>

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

              </div>

        </div>
        <div class="modal-footer">

            <button type="button" class="btn  btn-default" data-dismiss="modal">إلغاء</button>
            {!! Form::submit('تحديث',['class'=>'btn btn-primary btn-cons', 'id'=>'submit_row_edit_form','style'=>'font: 18px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:bold;'])!!}



        </div>

        {!! Form::close() !!}
      </div>
    </div>
  </div>
 -->
<div class="modal fade" id="RowEditModal" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content" style="margin-top: 70px ">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">تحديث المعلومات</h4>
        </div>
       {!! Form::open(['class'=>'labels-align-verticle','id'=>'form_row_edit','method' => 'POST', 'route' => 'memberrequests.editrow']) !!}
      <div class="modal-body">

        <input type="hidden" id="id_field" name="row_id" class="form-control" placeholder="Enter Message">
            <div class="row">

              <div class="col-md-6 col-xs-12">

                 <div class="form-group row">

                    <div class="input-with-icon  right col-md-9 col-sm-12">
                        {!! Form::select('country',[''=>'اضغط']+$countries->toArray(),null,['class'=>'form-control select_country','style'=>'width:100%','id'=>'country_select']) !!}
                    </div>

                    <div class="col-md-3 col-sm-12">
                        {!! Form::label('country', 'البلد', ['class' => 'form-label text-right']) !!}
                    </div>
                </div>


                <div class="form-group row">
                    <input type="hidden" value="{{$city}}">
                    <div class="input-with-icon  right col-md-9 col-sm-12">
                        {!! Form::select('city',[''=>'اضغط']+$city->toArray(),null, ['class'=>'form-control select_city','style'=>'width:100%','id'=>'city_select']) !!}
                    </div>
                    <div class="col-md-3 col-sm-12">
                        {!! Form::label('city', 'المدينة', ['class' => 'form-label text-right']) !!}
                    </div>
                </div>


                <div class="row">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                {!! Form::select('gender',[''=>'','0'=>'ذكر','1'=>'انثى'],null,['class'=>'form-control per-row-genderdropdown','style'=>'width:100%','id'=>'genderdropdownrow','required']) !!}
                            </div>
                            <div class="col-md-3 col-sm-12">
                                {!! Form::label('gender', 'الجنس', ['class' => 'form-label text-right']) !!}
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                <input type="tel" id="number_field" name="" readonly class="form-control" placeholder="">
                            </div>
                            <div class="col-md-3 col-sm-12">
                                {!! Form::label('mobile_number', 'الهاتف المتحرك الحالي', ['class' => 'form-label text-right']) !!}
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row" style="">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row" style="margin-top: -15px;">
                            <div class="col-md-9 col-xs-12">
                                <input type="tel" id="number_field1" name="mobile_number" class="form-control mobile_number" placeholder="" maxlength="15" minlength="10">
                            </div>
                            <div class="col-md-3 col-sm-12">
                                {!! Form::label('mobile_number', 'الهاتف المتحرك الجديد', ['class' => 'form-label text-right']) !!}
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row" style="">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row" style="margin-top: -15px;">
                            <div class="col-md-9 col-xs-12">
                                {!! Form::email('email', null, array('class'=>'form-control','id'=>'email','placeholder'=>'abc@gmail.com')) !!}
                            </div>
                            <div class="col-md-3 col-sm-12">
                                {!! Form::label('email', 'البريد الإلكتروني', ['class' => 'form-label text-right']) !!}
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row" style="">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row" style="margin-top: -15px;">
                            <div class="col-md-9 col-xs-12">
                                {!! Form::text('username', null, array('class'=>'form-control','id'=>'username','placeholder'=>'أدخل اسم المستخدم الخاص بك')) !!}
                            </div>
                            <div class="col-md-3 col-sm-12">
                                {!! Form::label('username', 'اسم االمستخدم', ['class' => 'form-label text-right']) !!}
                            </div>
                        </div>
                    </div>
                </div>

            </div>
              <div class="col-md-6 col-xs-12">
                <div class="row margin-bottom">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                <input type="text" id="name_field" name="name" class="form-control" required placeholder="" maxlength="15">
                            </div>
                             <div class="col-md-3 col-sm-12">
                                {!! Form::label('name', 'الإسم الأول', ['class' => 'form-label text-right']) !!}
                            </div>

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

                <div class="row margin-bottom">
                  <div class="col-md-12 col-xs-12">
                      <div class="form-group row">
                          <div class="col-md-9 col-xs-12">
                              <input type="text" id="father_name_field" name="father_name" class="form-control" placeholder="" required maxlength="15">
                          </div>
                           <div class="col-md-3 col-sm-12">
                              {!! Form::label('father_name', 'الأب', ['class' => 'form-label text-right']) !!}
                          </div>

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

                <div class="row margin-bottom">
                  <div class="col-md-12 col-xs-12">
                      <div class="form-group row">
                          <div class="col-md-9 col-xs-12">
                              <input type="text" id="grand_father_name_field" name="grand_father_name" class="form-control" required placeholder="" maxlength="15">
                          </div>
                           <div class="col-md-3 col-sm-12">
                              {!! Form::label('grand_father_name', 'الجد ١', ['class' => 'form-label', 'style'=>'margin-right:auto']) !!}
                          </div>

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

                <div class="row margin-bottom">
                  <div class="col-md-12 col-xs-12">
                      <div class="form-group row">
                          <div class="col-md-9 col-xs-12">
                              <input type="text" id="grand_father_name_1_field" name="grand_father_name_1" class="form-control" required placeholder="" maxlength="15">
                          </div>
                           <div class="col-md-3 col-sm-12">
                              {!! Form::label('grand_father_name_1', 'الجد ٢', ['class' => 'form-label text-right', 'style'=>'margin-right:auto']) !!}
                          </div>

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

                <div class="row margin-bottom">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                <input type="text" id="grand_father_name_2_field" name="grand_father_name_2" class="form-control" placeholder="" maxlength="15">
                            </div>
                             <div class="col-md-3 col-sm-12">
                                {!! Form::label('grand_father_name_2', 'الجد ٣', ['class' => 'form-label text-right', 'style'=>'margin-right:auto','maxlength'=>'12']) !!}
                            </div>

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

                <div class="row margin-bottom">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                <input type="text" id="grand_father_name_3_field" name="grand_father_name_3" class="form-control" placeholder="" maxlength="15">
                            </div>
                             <div class="col-md-3 col-sm-12">
                                {!! Form::label('grand_father_name_3', 'الجد ٤', ['class' => 'form-label text-right', 'style'=>'margin-right:auto','maxlength'=>'12']) !!}
                            </div>

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

                <div class="row margin-bottom">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                <input type="text" id="grand_father_name_4_field" name="grand_father_name_4" class="form-control" placeholder="" maxlength="15">
                            </div>
                             <div class="col-md-3 col-sm-12">
                                {!! Form::label('grand_father_name_4', 'الجد ۵', ['class' => 'form-label text-right', 'style'=>'margin-right:auto','maxlength'=>'12']) !!}
                            </div>

                        </div>
                    </div>
                </div>
                <div class="row margin-bottom">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                <input type="text" id="grand_father_name_5_field" name="grand_father_name_5" class="form-control" placeholder=""  maxlength="15">
                            </div>
                             <div class="col-md-3 col-sm-12">
                                {!! Form::label('grand_father_name_5', 'الجد ٦', ['class' => 'form-label text-right', 'style'=>'margin-right:auto','maxlength'=>'12']) !!}
                            </div>

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

                <div class="row margin-bottom">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                <input type="text" id="grand_father_name_6_field" name="grand_father_name_6" class="form-control" placeholder="" maxlength="15">
                            </div>
                             <div class="col-md-3 col-sm-12">
                                {!! Form::label('grand_father_name_6', 'الجد ۷', ['class' => 'form-label text-right', 'style'=>'margin-right:auto','maxlength'=>'12']) !!}
                            </div>

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

                {{-- <div class="row margin-bottom">
                    <div class="col-md-12 col-xs-12">
                        <div class="form-group row">
                            <div class="col-md-9 col-xs-12">
                                <input type="text" id="grand_father_name_7_field" name="grand_father_name_7" class="form-control" placeholder="" maxlength="15">
                            </div>
                             <div class="col-md-3 col-sm-12">
                                {!! Form::label('grand_father_name_7', 'الجد ۸', ['class' => 'form-label text-right', 'style'=>'margin-right:auto','maxlength'=>'12']) !!}
                            </div>

                        </div>
                    </div>
                </div> --}}

              </div>
            </div>

      </div>
      <div class="modal-footer">
          <button type="button" class="btn  btn-default" data-dismiss="modal">إلغاء</button>
            {!! Form::submit('تحديث',['class'=>'btn btn-primary btn-cons', 'id'=>'submit_row_edit_form','style'=>'font: 18px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:bold;'])!!}
      </div>
      {!! Form::close() !!}

      </div>
    </div>
  </div>
  <!-- Status Modal -->


   <div class="modal fade" id="myStatusModal" role="dialog">
    <div class="modal-dialog">
      <div class="modal-content" style="margin-top: 70px ">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>

          <h4 class="modal-title">تحديث حالة الإستمارة</h4>
        </div>
        {!! Form::open(['class'=>'labels-align-verticle','id'=>'form_status','method' => 'POST', 'route' => 'memberrequests.bulkstatus']) !!}
      <div class="modal-body">
         <div class="row margin-bottom">
            <div class="col-md-12 col-xs-12">
                <div class="form-group row">

                    <div class="col-md-4 col-md-offset-4 col-xs-12">

                        {!! Form::hidden('ids_array', null, ['class' => 'form-control', 'id' => 'ids_status']) !!}

                        {!! Form::select('gender',[''=>'','pending'=>'Pending - p','ready_for_review'=>'Ready for review - R','on_hold'=>'On Hold - O'],null, ['class' => 'form-control','required','style'=>'width: 100%;', 'id' =>'genderdropdown']) !!}
                    </div>
                    <label class="col-md-1 col-xs-12 control-label text-right source_label">الحالة</label>
                </div>
            </div>
        </div>
      </div>
      <div class="modal-footer">

        <button type="button" class="btn  btn-default" data-dismiss="modal">إلغاء</button>
         {!! Form::submit('تحديث',['class'=>'btn btn-primary btn-cons', 'id'=>'submit_edit_form','style'=>'font: 18px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:bold;'])!!}



        </div>
        {!! Form::close() !!}
      </div>
    </div>
  </div>



   <div class="modal fade" id="myEditStatusModal" role="dialog">
    <div class="modal-dialog">
      <div class="modal-content" style="margin-top: 70px ">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">تحديث الحالة</h4>
        </div>
        {!! Form::open(['class'=>'labels-align-verticle','id'=>'form_edit_status','method' => 'POST', 'route' => 'memberrequests.editrequeststatus']) !!}
      <div class="modal-body">
      <input type="hidden" name="request_id" id="id_fields" name="id" class="form-control" placeholder="Enter Message">
         <div class="row margin-bottom">
            <div class="col-md-12 col-xs-12">
                <div class="form-group row">

                    <div class="col-md-4 col-md-offset-4 col-xs-12">



                         {!! Form::select('status',[''=>'']+['pending'=>'Pending - P','ready_for_review'=>'Ready for review - R','on_hold'=>'On Hold - H'],null, ['class' => 'form-control','required','style'=>'width: 100%;', 'id' =>'statusdropdown']) !!}

                    </div>
                    <label class="col-md-1 col-xs-12 control-label text-right source_label">الحالة</label>
                </div>
            </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn  btn-default" data-dismiss="modal">إلغاء</button>
        {!! Form::submit('تحديث',['class'=>'btn btn-primary btn-cons', 'id'=>'submit_edit_status_form','style'=>'font: 18px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:bold;'])!!}



        </div>
        {!! Form::close() !!}
      </div>
    </div>
  </div>


    <div class="modal fade" id="myCityCountryModal" role="dialog">
    <div class="modal-dialog">
      <div class="modal-content" style="margin-top: 70px ">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>

          <h4 class="modal-title">تحديث البلد/المدينة</h4>
        </div>
        {!! Form::open(['class'=>'labels-align-verticle','id'=>'form_city_country','method' => 'POST', 'route' => 'memberrequests.bulkcitycountry']) !!}
      <div class="modal-body">
         <div class="row margin-bottom">
            <div class="col-md-12 col-xs-12">

                <div class="form-group row">
                        {!! Form::hidden('ids_array', null, ['class' => 'form-control', 'id' => 'ids_city_country']) !!}
                        <div class="right col-md-4 col-md-offset-4 col-sm-12">
                            {!! Form::select('country',[''=>'']+$countries->toArray(),null,['class'=>'form-control','style'=>'width:100%','required','id'=>'bulkcountry_select']) !!}

                        </div>
                        <div class="col-md-1 col-sm-12">
                            {!! Form::label('country', 'البلد', ['class' => 'form-label ']) !!}
                        </div>
                </div>
                <div class="form-group row">

                        <div class="right col-md-4 col-md-offset-4 col-sm-12">
                            {!! Form::select('city',[''=>'']+$city->toArray(),null, ['class'=>'form-control','style'=>'width:100%','required','id'=>'bulkcity_select']) !!}
                        </div>
                        <div class="col-md-1 col-sm-12">
                            {!! Form::label('city', 'المدينة', ['class' => 'form-label ']) !!}
                        </div>
                </div>
            </div>
        </div>
      </div>
      <div class="modal-footer">

        <button type="button" class="btn btn-default" data-dismiss="modal">إلغاء</button>
        {!! Form::submit('تحديث',['class'=>'btn btn-primary btn-cons', 'id'=>'submit_city_country_form','style'=>'font: 18px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:bold;'])!!}




        </div>
        {!! Form::close() !!}
      </div>
    </div>
  </div>

  <!-- NoOriginalDataMessage modal  -->
  <div id="NoOriginalDataMessage" class="modal fade">
      <div class="modal-dialog">
          <div class="modal-content">
              <div class="modal-body info-modal">
                  <p class="message-content">Original data not available ...!</p>
              </div>
              <div class="modal-footer">
                  <button type="submit" class="btn btn-default" data-dismiss="modal">إلغاء</button>
             </div>
          </div>
      </div>
  </div>
@endsection

@section('page_script')

<script type="text/javascript" language="javascript" class="init">

    jQuery(document).ready(function ($) {


        var request_city = "";
        $('#genderdropdown').select2({dir: "rtl",placeholder:"اضغط"});


         $(document).on("click","#requests",function(e){
            var id = $(this).data('id');
            var status = $(this).data('status');


            $("#statusdropdown").select2({dir: "rtl",placeholder:"اضغط"}).val(status).trigger('change');
            $('#id_fields').val(id);


        });


    // $("#submit_edit_status_form").on("click",function(){

    //         var status = $("#statusdropdown").val();
    //         var request_id = $('#id_fields').val();



    //     $.ajax({beforeSend: function(){
    //         $('#progressbar').show();
    //             },
    //             method: "GET",
    //             url: "{{ URL::to('admin/memberrequests/editrequeststatus') }}",
    //             data: {
    //                 status:status,
    //                 request_id:request_id

    //             }
    //         })
    //       .done(function( result ) {
    //         location.reload();
    //         $( window ).load(function() {
    //           $('#progressbar').hide();
    //         });
    //       });
    // });

       $(document).on("click","#request",function(e){
            var request = $(this).data('request');
             $('#city_select').empty();

            var country = request.country;
            var city = request.city;
            var name = request.name;
            var gender = request.gender;
            var father1 = request.father_name;
            var father2 = request.grand_father_name;
            var father3 = request.grand_father_name_1;
            var father4 = request.grand_father_name_2;
            var father5 = request.grand_father_name_3;
            var father6 = request.grand_father_name_4;
            var father7 = request.grand_father_name_5;
            var father8 = request.grand_father_name_6;
            var father9 = request.grand_father_name_7;
            var mobile_number = request.mobile_number;
            var username = request.username;
            var email = request.email;
            var request_id = request.id;

            $('#genderdropdownrow').select2({dir:'rtl',placeholder:'اضغط'}).val(gender).trigger('change');
            $("#name_field").val(name);
            $('#country_select').select2({dir: "rtl",placeholder:'اضغط'}).val(country).trigger('change');
            $('#city_select').select2({dir: "rtl",placeholder:'اضغط'}).val(city).trigger('change');
            $("#father_name_field").val(father1);
            $("#grand_father_name_field").val(father2);
            $("#grand_father_name_1_field").val(father3);
            $("#grand_father_name_2_field").val(father4);
            $("#grand_father_name_3_field").val(father5);
            $("#grand_father_name_4_field").val(father6);
            $("#grand_father_name_5_field").val(father7);
            $("#grand_father_name_6_field").val(father8);
            $("#grand_father_name_7_field").val(father9);
            request_city = request.city;
            $('#number_field').val(mobile_number);
            $('#username').val(username);
            $('#email').val(email);

            $('#id_field').val(request_id);


        });



    //    $("#submit_row_edit_form").on("click",function(){

    //         var gender = $('#genderdropdownrow').val();
    //         var name = $("#name_field").val();
    //         var father1 = $("#father_name_field").val();
    //         var father2 = $("#grand_father_name_field").val();
    //         var father3 = $("#grand_father_name_1_field").val();
    //         var father4 = $("#grand_father_name_2_field").val();
    //         var city = $('#city_select').val();
    //         var country = $('#country_select').val();
    //         var mobile_number = $('#number_field1').val();
    //         var number_length = $('#number_field1').val().length;
    //         console.log(number_length);
    //         var request_id = $('#id_field').val();

    //     $.ajax({beforeSend: function(){
    //         $('#progressbar').show();
    //             },
    //             method: "GET",
    //             url: "{{ URL::to('admin/memberrequests/editrow') }}",
    //             data: {
    //                 gender:gender,
    //                 name:name,
    //                 city:city,
    //                 father_name:father1,
    //                 grand_father_name:father2,
    //                 grand_father_name_1:father3,
    //                 grand_father_name_2:father4,
    //                 country:country,
    //                 mobile_number:mobile_number,
    //                 request_id:request_id
    //             },
    //             success: function(resp) {
    //                 if (resp === true) {
    //                       //successful validation
    //                         $('#form_row_edit').submit();
    //                       return false;
    //                 } else {
    //                     $.each(resp, function(i, v) {
    //             console.log(i + " => " + v); // view in console for error messages
    //                         var msg = '<label class="error" for="'+i+'">'+v+'</label>';
    //                         $('input[name="' + i + '"], select[name="' + i + '"]').addClass('inputTxtError').after(msg);
    //                     });
    //                     var keys = Object.keys(resp);
    //                     $('input[name="'+keys[0]+'"]').focus();
    //                 }
    //                 return false;
    //             },
    //             error: function(jqXHR, textStatus, errorThrown){

    //             }
    //         })
    //         .done(function( result ) {


    //           location.reload();
    //           $( window ).load(function() {
    //             $('#progressbar').hide();
    //           });
    //         });


    // });





        // ------------ bulk source editinig ----------------

        // $( "#submit_edit_form" ).click(function() {

        //     $('#progressbar').show()
        //     $.post($('#form_edit').attr('action'), $('#form_edit').serialize() )
        //     .fail(function(response) {
        //          $('.custom-error-msg').show();
        //          $('#progressbar').hide();
        //       })
        //     .done(function( result ) {

        //     location.reload();
        //     $( window ).load(function() {
        //       $('#progressbar').hide();
        //     });
        //   });;

        // });



        // $( "#submit_status_form" ).click(function() {
        //     $('#progressbar').show()
        //     $.post($('#form_status').attr('action'), $('#form_status').serialize() )
        //     .fail(function(response) {
        //          $('.custom-error-msg').show();
        //          $('#progressbar').hide();
        //       })
        //     .done(function( result ) {
        //     location.reload();
        //     $( window ).load(function() {
        //       $('#progressbar').hide();
        //     });
        //   });;
        // });

        //  $( "#submit_city_country_form" ).click(function() {
        //     $('#progressbar').show()
        //     $.post($('#form_city_country').attr('action'), $('#form_city_country').serialize() )
        //     .fail(function(response) {
        //          $('.custom-error-msg').show();
        //          $('#progressbar').hide();
        //       })
        //     .done(function( result ) {
        //     location.reload();
        //     $( window ).load(function() {
        //       $('#progressbar').hide();
        //     });
        //   });;
        // });

        $('body').append($('.modal'));
        var errorMessageStr = 'يجب إختيار إستمارة أو أكثر';
        $( ".source" ).click(function() {

            var ids = $('#datatable-example tbody :checkbox:checked').map(function () {
                    return this.value;
            }).get();

            if (ids.length > 0) {

                $('#data_field_id').val('');

                $('#myModal').modal('show');
                var source_name = this.id;
                $("#myModal .modal-title").text('تحديث '+$(this).text());
                $(".source_label").text($(this).text());

                $("#ids_array").val(ids);
                $("#source_name").val(source_name);
            } else {
                showErrorMessage(errorMessageStr);
            }

        });

        $( ".status" ).click(function() {
            var ids = $('#datatable-example tbody :checkbox:checked').map(function () {
                    return this.value;
            }).get();

            if (ids.length > 0) {
                $('#genderdropdown').select2('val','');
                $('#myStatusModal').modal('show');
                $("#ids_status").val(ids);
            } else {
                showErrorMessage(errorMessageStr);
            }

        });

        $( ".city-country" ).click(function() {
            var ids = $('#datatable-example tbody :checkbox:checked').map(function () {
                    return this.value;
            }).get();

            if (ids.length > 0) {

                $('#bulkcountry_select').select2({dir: "rtl",placeholder:"اضغط"}).val('').trigger('change');

                $('#myCityCountryModal').modal('show');

                $("#ids_city_country").val(ids);
            } else {
                showErrorMessage(errorMessageStr);
            }

        });


        $(".mobile_number").keypress(function (e) {
         //if the letter is not digit then display error and don't type anything
         if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
            //display error message
                   return false;
        }
       });




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

        // $(document).on('submit', '.deleteaction ', function () {
        //     // e.preventDefault();
        //     var ret = confirm("Are you sure you want to delete?");

        //     if (ret) {
        //         $("#progressbar").show();
        //         return true;
        //     }
        //     return false;
        // });
        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="">الكل</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==2){
              $(this).html( '<input class="searchbars" id="mr_searchbar'+x+'" type="text" maxlength="6" placeholder="" />' );

           }
           else
            {
            $(this).html( '<input class="searchbars" id="mr_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": [[1, "desc"]],

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

                {data: 'uni_id', name: 'uni_id'},
                {data: 'gender', name: 'member_requests.gender'},
                {data: 'name', name: 'member_requests.name'},
                {data: 'father_name', name: 'member_requests.father_name'},
                {data: 'grand_father_name', name: 'member_requests.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: 'member_requests.status'},
                {data: 'created_at', name: 'member_requests.created_at'},
                {data: 'updated_by', name: 'users.username'},
                {data: 'actions', name: 'actions'}

            ],


            "iDisplayLength": 50,
            "columnDefs": [
                {
                    "targets": [1,9,10,11,14,12],
                    "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,18],
                    "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});


        function bulkgetCities() {
        var country = $("#bulkcountry_select").val();

        console.log(country);
        console.log(request_city);
          if(country != ''){
            $.ajax({
                type: "GET",
                cache:false,
                url: "/admin/memberrequests/getlocalcities/"+encodeURIComponent(country),
                success: function(response)
                {
                    var options = '';
                    var city_id = request_city;

                    $.each(response, function(city,id){
                        options += "<option value='" + id + "'>" + city + "</option>";

                    });

                    $('#bulkcity_select').html(options);
                    var is_present = "";
                    if (is_present=='') {
                     is_present = city_id;
                    };
                   // console.log(is_present);
                  $('#bulkcity_select').val(is_present).trigger('change');
                  $('#bulkcity_select').prop('disabled',false);

                }
            });
          }else{
            var options = '';
            $('#bulkcity_select').html(options);
          };
        }


         // Location Information, country and city
        var country_present = "";
        if(country_present ==''){
            $('#bulkcountry_select').select2({dir: "rtl",placeholder:"اضغط"}).val('').trigger('change');
            $('#bulkcity_select').select2({dir: "rtl",placeholder:"اضغط"}).val('').trigger('change');
        };
        // alert($("#country_select").html());

        $('#bulkcountry_select').on("change", function(e) {
          // mostly used event, fired to the original element when the value changes
          // console.log($("#country_select").val());

          bulkgetCities();
          $('#bulkcity_select').prop('disabled', true);
          $('#bulkcity_select').val('').trigger('change');
        });
        // On page reload fetch previously selected city
        bulkgetCities();


         function getCities() {
        var country = $("#country_select").val();
        console.log(request_city);
          if(country != ''){
            $.ajax({
                type: "GET",
                cache:false,
                url: "/admin/memberrequests/getlocalcities/"+encodeURIComponent(country),
                success: function(response)
                {
                  console.log("this is the response",response);
                    var options = '';
                    var city_id = request_city;


                    $.each(response, function(city,id){
                        options += "<option value='" + id + "'>" + city + "</option>";


                    });
                    $('#city_select').html(options);
                    var is_present = "";
                    if (is_present=='') {
                     is_present = city_id;
                    };
                   // console.log(is_present);
                  $('#city_select').select2({dir: "rtl",placeholder:"اضغط"}).val(is_present).trigger('change');
                  $('#city_select').prop('disabled', false);

                }
            });
          };
        }

        $('.selectbox').select2({dir: "rtl"});

         // Location Information, country and city
        var country_present = "";
        if(country_present ==''){
            $('#country_select').select2({dir: "rtl",placeholder:"اضغط"}).val('').trigger('change');
            $('#city_select').select2({dir: "rtl",placeholder:"اضغط"}).val('').trigger('change');
        };
        // alert($("#country_select").html());
        $('#city_select').select2();
        $('#country_select').select2().on("change", function(e) {
          // mostly used event, fired to the original element when the value changes
          // console.log($("#country_select").val());

          getCities();
          $('#city_select').prop('disabled', true);
          $('#city_select').select2({dir: "rtl",placeholder:"اضغط"}).val('').trigger('change');

        });
        // On page reload fetch previously selected city
        getCities();

    });
</script>

@endsection